3081 lines
90 KiB
CSS
3081 lines
90 KiB
CSS
|
|
.opportunities-extension-scroll-lock {
|
|
overflow: hidden !important;
|
|
}
|
|
|
|
.opportunities-extension-modal,
|
|
.opportunities-extension-modal * {
|
|
box-sizing: border-box;
|
|
font-family: "Oracle Sans", Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
.opportunities-extension-modal {
|
|
position: fixed;
|
|
inset: 0;
|
|
z-index: 2147483647;
|
|
background: #f5f4f2;
|
|
color: #000000;
|
|
}
|
|
|
|
.opportunities-extension-modal[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-shell {
|
|
height: 100vh;
|
|
min-height: 0;
|
|
display: grid;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
background: #f5f4f2;
|
|
}
|
|
|
|
.opportunities-extension-header {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: 24px;
|
|
padding: 28px 40px 22px;
|
|
border-bottom: 1px solid #dedbd7;
|
|
background:
|
|
linear-gradient(90deg, #8f624a 0 11%, #c74634 11% 23%, #6f5a7f 23% 36%, #00758f 36% 51%, #d4b06a 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,
|
|
#ffffff;
|
|
}
|
|
|
|
.opportunities-extension-header::before {
|
|
position: absolute;
|
|
left: 40px;
|
|
bottom: -1px;
|
|
width: 64px;
|
|
height: 3px;
|
|
background: #00758f;
|
|
content: "";
|
|
}
|
|
|
|
.opportunities-extension-header h1 {
|
|
margin: 0;
|
|
color: #000000;
|
|
font-size: 24px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
letter-spacing: 0;
|
|
}
|
|
|
|
.opportunities-extension-header p {
|
|
margin: 0;
|
|
color: #5f5a55;
|
|
font-size: 14px;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.opportunities-extension-subtitle-row {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: 8px;
|
|
margin-top: 6px;
|
|
}
|
|
|
|
.opportunities-extension-auth-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
min-height: 22px;
|
|
padding: 2px 8px;
|
|
border-radius: 999px;
|
|
color: #ffffff;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
.opportunities-extension-auth-badge-authenticated {
|
|
background: #3f6f17;
|
|
}
|
|
|
|
.opportunities-extension-auth-badge-unauthenticated {
|
|
background: #c5331f;
|
|
}
|
|
|
|
.opportunities-extension-auth-badge-pending {
|
|
background: #6f5a7f;
|
|
}
|
|
|
|
.opportunities-extension-products-progress {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
min-height: 22px;
|
|
padding: 2px 8px;
|
|
border-radius: 999px;
|
|
background: #e8f4f6;
|
|
color: #006d7a;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
.opportunities-extension-products-progress[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-products-cache-timestamp {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
min-height: 22px;
|
|
padding: 2px 8px;
|
|
border-radius: 999px;
|
|
background: #f0eeeb;
|
|
color: #5f5a55;
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
.opportunities-extension-products-cache-timestamp[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-products-progress[data-state="running"]::before {
|
|
width: 12px;
|
|
height: 12px;
|
|
margin-right: 6px;
|
|
border: 2px solid currentColor;
|
|
border-right-color: transparent;
|
|
border-radius: 50%;
|
|
content: "";
|
|
animation: opportunities-extension-spin .8s linear infinite;
|
|
}
|
|
|
|
.opportunities-extension-products-progress[data-state="complete"] {
|
|
background: #e2f2e5;
|
|
color: #356d19;
|
|
}
|
|
|
|
.opportunities-extension-products-progress[data-state="complete-with-errors"],
|
|
.opportunities-extension-products-progress[data-state="error"] {
|
|
background: #f9e3e1;
|
|
color: #a52b1c;
|
|
}
|
|
|
|
@keyframes opportunities-extension-spin {
|
|
to { transform: rotate(360deg); }
|
|
}
|
|
|
|
.opportunities-extension-icon-button {
|
|
width: 36px;
|
|
height: 36px;
|
|
flex: 0 0 36px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
background: transparent;
|
|
color: #312d2a;
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
line-height: 1;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-header-actions {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
|
|
.opportunities-extension-icon-button svg {
|
|
width: 18px;
|
|
height: 18px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.opportunities-extension-icon-button .opportunities-extension-settings-icon {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
|
|
.opportunities-extension-icon-button:hover,
|
|
.opportunities-extension-icon-button:focus {
|
|
border-color: #b8b2ad;
|
|
background: #f5f4f2;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-body {
|
|
display: grid;
|
|
min-height: 0;
|
|
grid-template-rows: auto auto minmax(0, 1fr);
|
|
gap: 16px;
|
|
padding: 22px 40px 36px;
|
|
background: #f5f4f2;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.opportunities-extension-form {
|
|
display: flex;
|
|
align-items: end;
|
|
flex-wrap: wrap;
|
|
gap: 24px;
|
|
min-height: 82px;
|
|
max-width: none;
|
|
margin: 0;
|
|
padding: 14px 16px;
|
|
border: 1px solid #dedbd7;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-field {
|
|
display: grid;
|
|
max-width: max-content;
|
|
min-width: 270px;
|
|
width: max-content;
|
|
gap: 6px;
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard {
|
|
display: grid;
|
|
grid-template-columns: repeat(6, minmax(0, 1fr));
|
|
gap: 12px;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-card {
|
|
display: grid;
|
|
gap: 6px;
|
|
min-width: 0;
|
|
padding: 12px 16px;
|
|
border: 1px solid #dedbd7;
|
|
border-top: 3px solid #5f5a55;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-card span {
|
|
color: #5f5a55;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-value {
|
|
overflow: hidden;
|
|
color: #312d2a;
|
|
font-size: 22px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-card[data-stage="SQL"] {
|
|
border-top-color: #008aa6;
|
|
}
|
|
|
|
.opportunities-extension-total-dashboard-card {
|
|
border-top-color: #312d2a;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-card[data-stage="PIPELINE"] {
|
|
border-top-color: #6f6863;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-card[data-stage="UPSIDE"] {
|
|
border-top-color: #c87b00;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-card[data-stage="FORECAST"] {
|
|
border-top-color: #755b8b;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-card[data-stage="WON"] {
|
|
border-top-color: #4b7f22;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter {
|
|
display: grid;
|
|
grid-template-rows: auto 44px;
|
|
gap: 6px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-label {
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-controls {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button {
|
|
min-height: 36px;
|
|
padding: 6px 12px;
|
|
border: 1px solid currentColor;
|
|
border-radius: 18px;
|
|
background: #ffffff;
|
|
color: #5f5a55;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
letter-spacing: 0;
|
|
line-height: 1.2;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[data-stage="SQL"] {
|
|
color: #006b84;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[data-stage="PIPELINE"] {
|
|
color: #5f5a55;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[data-stage="UPSIDE"] {
|
|
color: #945400;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[data-stage="FORECAST"] {
|
|
color: #624e74;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[data-stage="WON"] {
|
|
color: #3f6f17;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="SQL"] {
|
|
border-color: #006b84;
|
|
background: #006b84;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="PIPELINE"] {
|
|
border-color: #5f5a55;
|
|
background: #5f5a55;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="UPSIDE"] {
|
|
border-color: #945400;
|
|
background: #945400;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="FORECAST"] {
|
|
border-color: #624e74;
|
|
background: #624e74;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="WON"] {
|
|
border-color: #3f6f17;
|
|
background: #3f6f17;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-button:focus-visible {
|
|
outline: 2px solid #00758f;
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.opportunities-extension-status-filter {
|
|
display: grid;
|
|
grid-template-rows: auto 44px;
|
|
gap: 6px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-label {
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-controls {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: 8px;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button {
|
|
min-height: 36px;
|
|
padding: 6px 12px;
|
|
border: 1px solid currentColor;
|
|
border-radius: 18px;
|
|
background: #ffffff;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
letter-spacing: 0;
|
|
line-height: 1.2;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[data-status="OPEN"] {
|
|
color: #197a3d;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[data-status="CLOSED"] {
|
|
color: #4b5563;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[data-status="LOST"] {
|
|
color: #b13b34;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[data-status="WON"] {
|
|
color: #1f5f99;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[aria-pressed="true"][data-status="OPEN"] {
|
|
border-color: #197a3d;
|
|
background: #197a3d;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[aria-pressed="true"][data-status="CLOSED"] {
|
|
border-color: #4b5563;
|
|
background: #4b5563;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[aria-pressed="true"][data-status="LOST"] {
|
|
border-color: #b13b34;
|
|
background: #b13b34;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button[aria-pressed="true"][data-status="WON"] {
|
|
border-color: #1f5f99;
|
|
background: #1f5f99;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-button:focus-visible {
|
|
outline: 2px solid #00758f;
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter {
|
|
position: relative;
|
|
display: grid;
|
|
grid-template-rows: auto 44px;
|
|
gap: 6px;
|
|
min-width: 220px;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-label {
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-trigger {
|
|
position: relative;
|
|
min-width: 220px;
|
|
min-height: 44px;
|
|
padding: 10px 38px 10px 12px;
|
|
border: 1px solid #b8b2ad;
|
|
border-radius: 3px;
|
|
background: #ffffff;
|
|
color: #312d2a;
|
|
font-size: 14px;
|
|
line-height: 1.3;
|
|
text-align: left;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-trigger::after {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 16px;
|
|
width: 0;
|
|
height: 0;
|
|
border-top: 6px solid #312d2a;
|
|
border-right: 5px solid transparent;
|
|
border-left: 5px solid transparent;
|
|
content: "";
|
|
pointer-events: none;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-trigger:disabled {
|
|
cursor: not-allowed;
|
|
background: #f5f4f2;
|
|
color: #7d7772;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-trigger:focus-visible {
|
|
border-color: #312d2a;
|
|
box-shadow: 0 0 0 1px #312d2a;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-panel {
|
|
position: absolute;
|
|
top: calc(100% + 8px);
|
|
left: 0;
|
|
z-index: 4;
|
|
display: grid;
|
|
width: min(360px, calc(100vw - 80px));
|
|
gap: 10px;
|
|
padding: 12px;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-panel[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-search {
|
|
width: 100%;
|
|
min-height: 40px;
|
|
padding: 8px 10px;
|
|
border: 1px solid #b8b2ad;
|
|
border-radius: 3px;
|
|
background: #ffffff;
|
|
color: #312d2a;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-search:focus {
|
|
border-color: #312d2a;
|
|
box-shadow: 0 0 0 1px #312d2a;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-select-all,
|
|
.opportunities-extension-customer-filter-option {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
line-height: 1.35;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-select-all {
|
|
min-height: 32px;
|
|
padding-bottom: 8px;
|
|
border-bottom: 1px solid #dedbd7;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-panel input[type="checkbox"] {
|
|
width: 16px;
|
|
height: 16px;
|
|
flex: 0 0 16px;
|
|
accent-color: #00758f;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-list {
|
|
display: block;
|
|
max-height: 250px;
|
|
overflow: auto;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-option {
|
|
display: grid;
|
|
grid-template-columns: 16px minmax(0, 1fr);
|
|
align-items: start;
|
|
min-height: 0;
|
|
height: auto !important;
|
|
padding: 8px 4px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-option input[type="checkbox"] {
|
|
margin-top: 1px;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-option span {
|
|
display: block;
|
|
min-width: 0;
|
|
line-height: 18px;
|
|
overflow-wrap: anywhere;
|
|
white-space: normal;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-option:hover {
|
|
background: #f5f4f2;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-empty {
|
|
margin: 4px 0;
|
|
color: #5f5a55;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.opportunities-extension-table-search-field {
|
|
display: grid;
|
|
grid-template-rows: auto 44px;
|
|
gap: 6px;
|
|
width: 260px;
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.opportunities-extension-table-search-field input {
|
|
width: 100%;
|
|
min-height: 44px;
|
|
padding: 10px 12px;
|
|
border: 1px solid #b8b2ad;
|
|
border-radius: 3px;
|
|
background: #ffffff;
|
|
color: #312d2a;
|
|
font-size: 14px;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.opportunities-extension-table-search-field input:focus {
|
|
border-color: #312d2a;
|
|
box-shadow: 0 0 0 1px #312d2a;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-select-wrap {
|
|
position: relative;
|
|
display: block;
|
|
width: 270px;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.opportunities-extension-select-wrap::after {
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 16px;
|
|
width: 0;
|
|
height: 0;
|
|
border-left: 5px solid transparent;
|
|
border-right: 5px solid transparent;
|
|
border-top: 6px solid #000000;
|
|
content: "";
|
|
pointer-events: none;
|
|
transform: translateY(-50%);
|
|
}
|
|
|
|
.opportunities-extension-field select {
|
|
width: 100%;
|
|
min-width: 0;
|
|
max-width: 100%;
|
|
min-height: 44px;
|
|
box-sizing: border-box;
|
|
appearance: none;
|
|
border: 1px solid #b8b2ad;
|
|
border-radius: 3px;
|
|
background: #ffffff;
|
|
color: #000000;
|
|
font-size: 14px;
|
|
line-height: 1.3;
|
|
padding: 11px 44px 11px 12px;
|
|
}
|
|
|
|
.opportunities-extension-field select:focus {
|
|
border-color: #312d2a;
|
|
box-shadow: 0 0 0 1px #312d2a;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-table-surface {
|
|
min-height: 0;
|
|
height: 100%;
|
|
border: 1px solid #dedbd7;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
overflow-x: auto;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.opportunities-extension-table {
|
|
width: 100%;
|
|
min-width: 0;
|
|
border-collapse: collapse;
|
|
table-layout: fixed;
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
line-height: 1.35;
|
|
}
|
|
|
|
.opportunities-extension-table thead {
|
|
background: #faf9f8;
|
|
}
|
|
|
|
.opportunities-extension-table th {
|
|
position: sticky;
|
|
top: 0;
|
|
z-index: 1;
|
|
height: 44px;
|
|
border-bottom: 1px solid #b8b2ad;
|
|
background: #faf9f8;
|
|
color: #312d2a;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.opportunities-extension-table td {
|
|
min-height: 48px;
|
|
padding: 12px 16px;
|
|
border-bottom: 1px solid #ebe8e5;
|
|
vertical-align: middle;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(1) {
|
|
width: 16%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(2) {
|
|
width: 8%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(3) {
|
|
width: 18%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(4) {
|
|
width: 11%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(5) {
|
|
width: 8%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(6) {
|
|
width: 8%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(7) {
|
|
width: 7%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(8) {
|
|
width: 6%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(9) {
|
|
width: 7%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(10) {
|
|
width: 7%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(11) {
|
|
width: 4%;
|
|
}
|
|
|
|
.opportunities-extension-table td:nth-child(2),
|
|
.opportunities-extension-table td:nth-child(5),
|
|
.opportunities-extension-table td:nth-child(6),
|
|
.opportunities-extension-table td:nth-child(8) {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.opportunities-extension-table td:nth-child(9) {
|
|
padding-right: 6px;
|
|
padding-left: 6px;
|
|
white-space: nowrap;
|
|
overflow: visible;
|
|
}
|
|
|
|
.opportunities-extension-table td:nth-child(7) {
|
|
padding-right: 6px;
|
|
padding-left: 6px;
|
|
white-space: nowrap;
|
|
overflow: visible;
|
|
}
|
|
|
|
.opportunities-extension-table td:nth-child(10) {
|
|
padding-right: 6px;
|
|
padding-left: 6px;
|
|
font-size: 12px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.opportunities-extension-table td:nth-child(11) {
|
|
padding-right: 6px;
|
|
padding-left: 6px;
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.opportunities-extension-table tbody tr:hover {
|
|
background: #f7f6f4;
|
|
}
|
|
|
|
.opportunities-extension-table tbody tr:last-child td {
|
|
border-bottom: 0;
|
|
}
|
|
|
|
.opportunities-extension-table a {
|
|
color: #006b84;
|
|
text-decoration: underline;
|
|
text-decoration-thickness: 1px;
|
|
text-underline-offset: 2px;
|
|
}
|
|
|
|
.opportunities-extension-table a:hover {
|
|
color: #004f63;
|
|
}
|
|
|
|
.opportunities-extension-opty-number-content {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
max-width: 100%;
|
|
}
|
|
|
|
.opportunities-extension-name-content {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.opportunities-extension-name-content > a {
|
|
min-width: 0;
|
|
}
|
|
|
|
.opportunities-extension-actions-content {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 4px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.opportunities-extension-products-count {
|
|
display: inline-grid;
|
|
width: auto;
|
|
min-width: 20px;
|
|
height: 20px;
|
|
place-items: center;
|
|
flex: 0 0 auto;
|
|
box-sizing: border-box;
|
|
padding: 0 3px;
|
|
border: 1px solid #7ca7b2;
|
|
border-radius: 999px;
|
|
background: #e8f4f6;
|
|
color: #006d7a;
|
|
font-size: 10px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-products-count:hover,
|
|
.opportunities-extension-products-count:focus-visible,
|
|
.opportunities-extension-products-count[aria-expanded="true"] {
|
|
border-color: #00758f;
|
|
background: #00758f;
|
|
color: #ffffff;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-products-count-error {
|
|
border-color: #d8887e;
|
|
background: #f9e3e1;
|
|
color: #a52b1c;
|
|
}
|
|
|
|
.opportunities-extension-products-detail-row:hover {
|
|
background: transparent !important;
|
|
}
|
|
|
|
.opportunities-extension-products-detail-cell {
|
|
padding: 0 !important;
|
|
}
|
|
|
|
.opportunities-extension-products-detail {
|
|
padding: 14px 20px 18px;
|
|
border-bottom: 1px solid #c9c5c1;
|
|
background: #f0eeeb;
|
|
}
|
|
|
|
.opportunities-extension-products-detail-heading {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
margin-bottom: 10px;
|
|
color: #312d2a;
|
|
}
|
|
|
|
.opportunities-extension-products-detail-heading strong {
|
|
font-size: 13px;
|
|
}
|
|
|
|
.opportunities-extension-products-detail-heading span {
|
|
color: #5f5a55;
|
|
font-size: 11px;
|
|
font-weight: 600;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.opportunities-extension-products-table {
|
|
width: 100%;
|
|
table-layout: fixed;
|
|
border-collapse: collapse;
|
|
border: 1px solid #dedbd7;
|
|
background: #ffffff;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.opportunities-extension-products-table th,
|
|
.opportunities-extension-products-table td {
|
|
position: static;
|
|
height: auto;
|
|
padding: 8px 10px;
|
|
border-bottom: 1px solid #ebe8e5;
|
|
background: transparent;
|
|
overflow-wrap: anywhere;
|
|
vertical-align: middle;
|
|
white-space: normal;
|
|
}
|
|
|
|
.opportunities-extension-products-table th {
|
|
background: #faf9f8;
|
|
font-size: 11px;
|
|
}
|
|
|
|
.opportunities-extension-products-table th:nth-child(1) { width: 16%; }
|
|
.opportunities-extension-products-table th:nth-child(2) { width: 16%; }
|
|
.opportunities-extension-products-table th:nth-child(3) { width: 8%; }
|
|
.opportunities-extension-products-table th:nth-child(4) { width: 10%; }
|
|
.opportunities-extension-products-table th:nth-child(5) { width: 8%; }
|
|
.opportunities-extension-products-table th:nth-child(6) { width: 8%; }
|
|
.opportunities-extension-products-table th:nth-child(7) { width: 7%; }
|
|
.opportunities-extension-products-table th:nth-child(8) { width: 10%; }
|
|
.opportunities-extension-products-table th:nth-child(9) { width: 12%; }
|
|
.opportunities-extension-products-table th:nth-child(10) { width: 5%; }
|
|
|
|
.opportunities-extension-products-empty {
|
|
margin: 0;
|
|
padding: 10px 0;
|
|
color: #5f5a55;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.opportunities-extension-copy-button {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
flex: 0 0 auto;
|
|
width: 24px;
|
|
height: 24px;
|
|
padding: 3px;
|
|
border: 0;
|
|
border-radius: 3px;
|
|
background: transparent;
|
|
color: #00758f;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-copy-button svg {
|
|
width: 16px;
|
|
height: 16px;
|
|
fill: currentColor;
|
|
}
|
|
|
|
.opportunities-extension-copy-button:hover,
|
|
.opportunities-extension-copy-button:focus-visible {
|
|
background: #e8f4f6;
|
|
color: #004f63;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-action-button {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
width: 32px;
|
|
height: 32px;
|
|
padding: 5px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
background: transparent;
|
|
color: #00758f;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-action-button svg {
|
|
width: 21px;
|
|
height: 21px;
|
|
}
|
|
|
|
.opportunities-extension-action-button:hover,
|
|
.opportunities-extension-action-button:focus-visible {
|
|
border-color: #7ca7b2;
|
|
background: #e8f4f6;
|
|
color: #004f63;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-action-button:disabled {
|
|
cursor: wait;
|
|
opacity: .72;
|
|
}
|
|
|
|
.opportunities-extension-action-button-loading svg {
|
|
animation: opportunities-extension-pulse 1s ease-in-out infinite;
|
|
}
|
|
|
|
@keyframes opportunities-extension-pulse {
|
|
50% { opacity: .35; }
|
|
}
|
|
|
|
.opportunities-extension-copy-toast {
|
|
position: fixed;
|
|
right: 28px;
|
|
bottom: 28px;
|
|
z-index: 3;
|
|
max-width: min(360px, calc(100vw - 56px));
|
|
padding: 12px 16px;
|
|
border-radius: 4px;
|
|
background: #2f6f18;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, .18);
|
|
color: #ffffff;
|
|
font-size: 13px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.opportunities-extension-copy-toast-error {
|
|
background: #a52b1c;
|
|
}
|
|
|
|
.opportunities-extension-copy-toast[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-stage-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
min-height: 24px;
|
|
padding: 3px 8px;
|
|
border-radius: 12px;
|
|
background: #ebe8e5;
|
|
color: #312d2a;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.opportunities-extension-stage-badge[data-stage="SQL"] {
|
|
background: #d9f0f5;
|
|
color: #006b84;
|
|
}
|
|
|
|
.opportunities-extension-stage-badge[data-stage="PIPELINE"] {
|
|
background: #ebe8e5;
|
|
color: #5f5a55;
|
|
}
|
|
|
|
.opportunities-extension-stage-badge[data-stage="UPSIDE"] {
|
|
background: #fff0d8;
|
|
color: #945400;
|
|
}
|
|
|
|
.opportunities-extension-stage-badge[data-stage="FORECAST"] {
|
|
background: #eee8f5;
|
|
color: #624e74;
|
|
}
|
|
|
|
.opportunities-extension-stage-badge[data-stage="WON"] {
|
|
background: #e5f1d9;
|
|
color: #3f6f17;
|
|
}
|
|
|
|
.opportunities-extension-status-badge {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
min-height: 24px;
|
|
padding: 3px 8px;
|
|
border-radius: 12px;
|
|
background: #ebe8e5;
|
|
color: #312d2a;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.opportunities-extension-status-badge[data-status="OPEN"] {
|
|
background: #e2f2e5;
|
|
color: #197a3d;
|
|
}
|
|
|
|
.opportunities-extension-status-badge[data-status="CLOSED"] {
|
|
background: #e5e7eb;
|
|
color: #4b5563;
|
|
}
|
|
|
|
.opportunities-extension-status-badge[data-status="LOST"] {
|
|
background: #f9e3e1;
|
|
color: #b13b34;
|
|
}
|
|
|
|
.opportunities-extension-status-badge[data-status="WON"] {
|
|
background: #e3edf8;
|
|
color: #1f5f99;
|
|
}
|
|
|
|
.opportunities-extension-sort-button {
|
|
position: relative;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
width: 100%;
|
|
min-height: 44px;
|
|
padding: 8px 42px 8px 16px;
|
|
border: 0;
|
|
background: transparent;
|
|
color: inherit;
|
|
font: inherit;
|
|
font-weight: inherit;
|
|
letter-spacing: 0;
|
|
line-height: 1.2;
|
|
text-align: left;
|
|
white-space: normal;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-table-header-label {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
min-height: 44px;
|
|
padding: 8px 6px;
|
|
}
|
|
|
|
.opportunities-extension-sort-button::after {
|
|
position: absolute;
|
|
right: 15px;
|
|
color: #5f5a55;
|
|
content: "↕";
|
|
font-size: 16px;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.opportunities-extension-sort-button[data-sort-direction="ascending"]::after {
|
|
color: #00758f;
|
|
content: "↑";
|
|
}
|
|
|
|
.opportunities-extension-sort-button[data-sort-direction="descending"]::after {
|
|
color: #00758f;
|
|
content: "↓";
|
|
}
|
|
|
|
.opportunities-extension-sort-button:hover {
|
|
background: #f0eeeb;
|
|
}
|
|
|
|
.opportunities-extension-sort-button:focus-visible {
|
|
outline: 2px solid #00758f;
|
|
outline-offset: -2px;
|
|
}
|
|
|
|
.opportunities-extension-table-status {
|
|
height: 152px;
|
|
color: #5f5a55;
|
|
font-size: 14px;
|
|
text-align: center;
|
|
}
|
|
|
|
.opportunities-extension-visually-hidden {
|
|
position: absolute;
|
|
width: 1px;
|
|
height: 1px;
|
|
padding: 0;
|
|
margin: -1px;
|
|
overflow: hidden;
|
|
clip: rect(0, 0, 0, 0);
|
|
white-space: nowrap;
|
|
border: 0;
|
|
}
|
|
|
|
.opportunities-extension-preferences-modal {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 3;
|
|
display: grid;
|
|
place-items: center;
|
|
padding: 24px;
|
|
background: rgba(0, 0, 0, .42);
|
|
}
|
|
|
|
.opportunities-extension-preferences-modal[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-modal {
|
|
position: absolute;
|
|
inset: 0;
|
|
z-index: 4;
|
|
display: grid;
|
|
place-items: center;
|
|
padding: 12px;
|
|
background: rgba(0, 0, 0, .42);
|
|
}
|
|
|
|
.opportunities-extension-account-plans-modal[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-dialog {
|
|
display: grid;
|
|
width: min(1180px, 100%);
|
|
height: min(760px, calc(100vh - 24px));
|
|
min-width: 0;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
grid-template-columns: minmax(0, 1fr);
|
|
overflow: hidden;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
box-shadow: 0 8px 24px rgba(0, 0, 0, .24);
|
|
color: #312d2a;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-header {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
padding: 14px 20px;
|
|
border-bottom: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-header h2 {
|
|
margin: 0;
|
|
font-size: 20px;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-header p {
|
|
margin: 5px 0 0;
|
|
color: #5f5a55;
|
|
font-size: 13px;
|
|
line-height: 1.35;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-content {
|
|
display: grid;
|
|
min-width: 0;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
grid-template-columns: minmax(0, 1fr);
|
|
min-height: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-content > .opportunities-extension-account-plans-skeleton {
|
|
grid-row: 1 / -1;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tabs-navigation {
|
|
position: relative;
|
|
min-width: 0;
|
|
border-bottom: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tabs-navigation .opportunities-extension-account-plans-tab-navigation-button[hidden] {
|
|
display: none;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tabs {
|
|
display: flex;
|
|
min-width: 0;
|
|
gap: 4px;
|
|
overflow-x: auto;
|
|
padding: 8px 20px 0;
|
|
scrollbar-width: none;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tabs::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tab-navigation-button {
|
|
display: grid;
|
|
position: absolute;
|
|
z-index: 1;
|
|
top: 50%;
|
|
width: 32px;
|
|
height: 32px;
|
|
place-items: center;
|
|
padding: 0;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
color: #312d2a;
|
|
box-shadow: 0 2px 6px rgba(0, 0, 0, .16);
|
|
transform: translateY(-50%);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tab-navigation-button:first-child {
|
|
left: 8px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tab-navigation-button:last-child {
|
|
right: 8px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {
|
|
border-color: #00758f;
|
|
background: #f0eeeb;
|
|
color: #005e73;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tab-navigation-button:disabled {
|
|
border-color: #dedbd7;
|
|
color: #b8b2ad;
|
|
cursor: default;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tab-navigation-button:focus-visible {
|
|
outline: 2px solid #00758f;
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-tab-navigation-button svg {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-panels {
|
|
min-width: 0;
|
|
min-height: 0;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-tab {
|
|
min-height: 38px;
|
|
flex: 0 0 auto;
|
|
padding: 7px 12px;
|
|
border: 0;
|
|
border-bottom: 3px solid transparent;
|
|
background: transparent;
|
|
color: #5f5a55;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-tab:hover {
|
|
background: #f0eeeb;
|
|
color: #312d2a;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-tab[aria-selected="true"] {
|
|
border-bottom-color: #00758f;
|
|
color: #006d7a;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-tab:focus-visible {
|
|
outline: 2px solid #00758f;
|
|
outline-offset: -2px;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-panel {
|
|
display: grid;
|
|
height: 100%;
|
|
min-height: 0;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
box-sizing: border-box;
|
|
padding: 16px 20px;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-panel[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-details {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
gap: 0 24px;
|
|
margin: 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-details > div {
|
|
display: grid;
|
|
grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);
|
|
gap: 10px;
|
|
min-height: 42px;
|
|
align-items: center;
|
|
padding: 7px 0;
|
|
border-bottom: 1px solid #ebe8e5;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-details dt {
|
|
color: #5f5a55;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-details dd {
|
|
min-width: 0;
|
|
margin: 0;
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
overflow-wrap: anywhere;
|
|
}
|
|
|
|
.opportunities-extension-consumption-trend {
|
|
display: grid;
|
|
min-height: 0;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
margin-top: 14px;
|
|
padding-top: 12px;
|
|
border-top: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-consumption-trend-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
gap: 24px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-periods {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-periods button {
|
|
min-height: 38px;
|
|
padding: 7px 14px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
background: transparent;
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
font-weight: 600;
|
|
line-height: 1.2;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-consumption-periods button:hover {
|
|
background: #f0eeeb;
|
|
}
|
|
|
|
.opportunities-extension-consumption-periods button[aria-pressed="true"] {
|
|
border-color: #00758f;
|
|
background: #e7f6f8;
|
|
color: #005e73;
|
|
}
|
|
|
|
.opportunities-extension-consumption-periods button:focus-visible,
|
|
.opportunities-extension-consumption-navigation-button:focus-visible {
|
|
outline: 2px solid #00758f;
|
|
outline-offset: 2px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart {
|
|
display: grid;
|
|
min-height: 0;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
margin-top: 4px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-navigation {
|
|
display: grid;
|
|
grid-template-columns: 36px minmax(130px, auto) 36px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 8px;
|
|
min-height: 40px;
|
|
margin-bottom: 2px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-navigation strong {
|
|
color: #312d2a;
|
|
font-size: 13px;
|
|
text-align: center;
|
|
}
|
|
|
|
.opportunities-extension-consumption-navigation-button {
|
|
display: grid;
|
|
width: 36px;
|
|
height: 36px;
|
|
place-items: center;
|
|
padding: 0;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
color: #312d2a;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-consumption-navigation-button:hover:not(:disabled) {
|
|
border-color: #00758f;
|
|
background: #f0eeeb;
|
|
color: #005e73;
|
|
}
|
|
|
|
.opportunities-extension-consumption-navigation-button:disabled {
|
|
border-color: #dedbd7;
|
|
color: #b8b2ad;
|
|
cursor: default;
|
|
}
|
|
|
|
.opportunities-extension-consumption-navigation-button svg {
|
|
width: 18px;
|
|
height: 18px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-figure {
|
|
position: relative;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
margin: 0;
|
|
scrollbar-width: none;
|
|
}
|
|
|
|
.opportunities-extension-consumption-figure::-webkit-scrollbar {
|
|
display: none;
|
|
}
|
|
|
|
.opportunities-extension-consumption-visual {
|
|
display: grid;
|
|
height: 100%;
|
|
min-height: 0;
|
|
grid-template-columns: minmax(0, 1fr) 176px;
|
|
align-items: center;
|
|
gap: 16px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg {
|
|
display: block;
|
|
width: 100%;
|
|
height: 300px;
|
|
min-height: 0;
|
|
overflow: visible;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-grid-line {
|
|
stroke: #dedbd7;
|
|
stroke-width: 1;
|
|
shape-rendering: crispEdges;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-axis-label,
|
|
.opportunities-extension-consumption-svg .consumption-x-label {
|
|
fill: #5f5a55;
|
|
font-family: Arial, sans-serif;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-value-label {
|
|
fill: #312d2a;
|
|
font-family: Arial, sans-serif;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-bar-funded {
|
|
fill: #b77888;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-bar-overage {
|
|
fill: #de7907;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-average-line {
|
|
stroke: #de7907;
|
|
stroke-width: 1.5;
|
|
stroke-dasharray: 6 6;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-bar-group {
|
|
cursor: default;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-bar-group rect {
|
|
transition: filter .16s ease, opacity .16s ease, stroke .16s ease;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-bar-group:hover rect,
|
|
.opportunities-extension-consumption-svg .consumption-bar-group:focus rect {
|
|
filter: brightness(1.06);
|
|
stroke: #312d2a;
|
|
stroke-width: 1.5;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-animated-label {
|
|
opacity: 0;
|
|
animation: opportunities-extension-consumption-label-in .24s ease-out forwards;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg .consumption-animated-average {
|
|
opacity: 0;
|
|
animation: opportunities-extension-consumption-average-in .35s .32s ease-out forwards;
|
|
}
|
|
|
|
@keyframes opportunities-extension-consumption-label-in {
|
|
from { opacity: 0; transform: translateY(4px); }
|
|
to { opacity: 1; transform: translateY(0); }
|
|
}
|
|
|
|
@keyframes opportunities-extension-consumption-average-in {
|
|
from { opacity: 0; }
|
|
to { opacity: 1; }
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend {
|
|
display: grid;
|
|
align-content: center;
|
|
gap: 4px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend button {
|
|
display: grid;
|
|
min-width: 0;
|
|
grid-template-columns: 16px minmax(0, 1fr);
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 6px 4px;
|
|
border: 0;
|
|
border-radius: 4px;
|
|
background: transparent;
|
|
color: #312d2a;
|
|
font-size: 12px;
|
|
line-height: 1.25;
|
|
text-align: left;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend button:hover {
|
|
background: #f0eeeb;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend button:focus-visible {
|
|
outline: 2px solid #00758f;
|
|
outline-offset: 1px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend button[aria-pressed="false"] {
|
|
color: #77726d;
|
|
opacity: .55;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend-swatch {
|
|
display: block;
|
|
width: 12px;
|
|
height: 12px;
|
|
justify-self: center;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend-funded {
|
|
background: #b77888;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend-overage {
|
|
background: #de7907;
|
|
}
|
|
|
|
.opportunities-extension-consumption-legend-average {
|
|
height: 0;
|
|
border-top: 2px dashed #de7907;
|
|
}
|
|
|
|
.opportunities-extension-consumption-tooltip {
|
|
position: absolute;
|
|
z-index: 2;
|
|
display: grid;
|
|
min-width: 190px;
|
|
max-width: 260px;
|
|
gap: 4px;
|
|
padding: 10px 12px;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
box-shadow: 0 4px 12px rgba(0, 0, 0, .2);
|
|
color: #312d2a;
|
|
font-size: 12px;
|
|
line-height: 1.3;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.opportunities-extension-consumption-tooltip[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-consumption-tooltip strong {
|
|
margin-bottom: 2px;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart-skeleton {
|
|
height: 100%;
|
|
min-height: 0;
|
|
padding: 34px 62px 24px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart-skeleton-plot {
|
|
display: flex;
|
|
height: 100%;
|
|
min-height: 220px;
|
|
align-items: flex-end;
|
|
justify-content: space-around;
|
|
gap: 12px;
|
|
padding: 0 14px;
|
|
border-bottom: 1px solid #dedbd7;
|
|
border-left: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart-skeleton-plot span {
|
|
width: min(38px, 6%);
|
|
border-radius: 2px 2px 0 0;
|
|
background: #dedbd7;
|
|
animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart-empty,
|
|
.opportunities-extension-consumption-chart-error {
|
|
display: grid;
|
|
min-height: 220px;
|
|
place-items: center;
|
|
margin: 0;
|
|
color: #5f5a55;
|
|
font-size: 14px;
|
|
text-align: center;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart-error {
|
|
color: #9f2d20;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-status-indicator {
|
|
display: inline-block;
|
|
width: 10px;
|
|
height: 10px;
|
|
border-radius: 50%;
|
|
background: #9b9691;
|
|
box-shadow: 0 0 0 3px #efedeb;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-status-indicator[data-active="true"] {
|
|
background: #3f6f17;
|
|
box-shadow: 0 0 0 3px #e2f2e5;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-tab .opportunities-extension-account-plan-status-indicator {
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-tabs {
|
|
display: flex;
|
|
min-height: 46px;
|
|
align-items: center;
|
|
padding: 0 20px;
|
|
border-bottom: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton {
|
|
display: grid;
|
|
height: 100%;
|
|
min-height: 0;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-panel {
|
|
padding: 16px 20px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-tab {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 9px;
|
|
min-height: 38px;
|
|
padding: 0 12px;
|
|
border-bottom: 3px solid #00758f;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-status {
|
|
display: block;
|
|
width: 10px;
|
|
height: 10px;
|
|
flex: 0 0 auto;
|
|
border-radius: 50%;
|
|
background: #dedbd7;
|
|
box-shadow: 0 0 0 3px #efedeb;
|
|
animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-details {
|
|
display: grid;
|
|
grid-template-columns: repeat(3, minmax(0, 1fr));
|
|
gap: 0 24px;
|
|
padding: 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-details > div {
|
|
display: grid;
|
|
grid-template-columns: minmax(104px, 38%) minmax(0, 1fr);
|
|
align-items: center;
|
|
gap: 10px;
|
|
min-height: 42px;
|
|
padding: 7px 0;
|
|
border-bottom: 1px solid #ebe8e5;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-bar {
|
|
display: block;
|
|
height: 12px;
|
|
border-radius: 3px;
|
|
background: #dedbd7;
|
|
animation: opportunities-extension-skeleton-pulse 1.15s ease-in-out infinite alternate;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-tabs .opportunities-extension-account-plans-skeleton-bar {
|
|
height: 14px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-label {
|
|
width: 74%;
|
|
height: 10px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-trend {
|
|
display: grid;
|
|
min-height: 0;
|
|
grid-template-rows: auto auto minmax(0, 1fr);
|
|
margin: 14px 0 0;
|
|
padding-top: 12px;
|
|
border-top: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-trend-header {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
min-height: 38px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-periods {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 16px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {
|
|
height: 12px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-period-active {
|
|
height: 38px !important;
|
|
border: 1px solid #8cc8d3;
|
|
background: #e7f6f8;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-navigation {
|
|
display: grid;
|
|
grid-template-columns: 32px 124px 32px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 8px;
|
|
min-height: 54px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-navigation .opportunities-extension-account-plans-skeleton-bar {
|
|
justify-self: center;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-chart {
|
|
display: grid;
|
|
min-height: 0;
|
|
grid-template-columns: minmax(0, 1fr) 150px;
|
|
align-items: center;
|
|
gap: 28px;
|
|
padding: 12px 14px 0 62px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-plot {
|
|
display: flex;
|
|
position: relative;
|
|
height: 300px;
|
|
min-height: 0;
|
|
box-sizing: border-box;
|
|
align-items: flex-end;
|
|
justify-content: space-around;
|
|
gap: 12px;
|
|
padding: 0 14px 64px;
|
|
background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #ebe8e5 58px, #ebe8e5 59px) left top / 100% 236px no-repeat;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-plot::before,
|
|
.opportunities-extension-account-plans-skeleton-plot::after {
|
|
position: absolute;
|
|
display: block;
|
|
content: "";
|
|
background: #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-plot::before {
|
|
top: 0;
|
|
bottom: 64px;
|
|
left: 0;
|
|
width: 1px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-plot::after {
|
|
right: 0;
|
|
bottom: 64px;
|
|
left: 0;
|
|
height: 1px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-plot .opportunities-extension-account-plans-skeleton-bar {
|
|
width: min(38px, 7%);
|
|
flex: 0 1 38px;
|
|
border-radius: 2px 2px 0 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-legend {
|
|
display: grid;
|
|
align-content: center;
|
|
gap: 18px;
|
|
min-height: 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-legend .opportunities-extension-account-plans-skeleton-bar {
|
|
height: 11px;
|
|
}
|
|
|
|
@keyframes opportunities-extension-skeleton-pulse {
|
|
from { opacity: .48; }
|
|
to { opacity: 1; }
|
|
}
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
.opportunities-extension-account-plans-skeleton-bar,
|
|
.opportunities-extension-consumption-chart-skeleton-plot span,
|
|
.opportunities-extension-consumption-svg .consumption-animated-label,
|
|
.opportunities-extension-consumption-svg .consumption-animated-average {
|
|
animation: none;
|
|
opacity: 1;
|
|
}
|
|
}
|
|
|
|
.opportunities-extension-account-plans-empty,
|
|
.opportunities-extension-account-plans-error {
|
|
margin: 0;
|
|
padding: 28px 20px;
|
|
color: #5f5a55;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-error {
|
|
color: #9f2d20;
|
|
}
|
|
|
|
.opportunities-extension-preferences-dialog {
|
|
display: grid;
|
|
width: min(680px, 100%);
|
|
max-height: min(720px, calc(100vh - 48px));
|
|
grid-template-rows: auto minmax(0, 1fr) auto;
|
|
overflow: hidden;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
box-shadow: 0 8px 24px rgba(0, 0, 0, .24);
|
|
color: #312d2a;
|
|
}
|
|
|
|
.opportunities-extension-preferences-header {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 16px;
|
|
padding: 18px 20px;
|
|
border-bottom: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-preferences-header h2 {
|
|
margin: 0;
|
|
font-size: 20px;
|
|
font-weight: 700;
|
|
line-height: 1.2;
|
|
}
|
|
|
|
.opportunities-extension-preferences-content {
|
|
min-height: 0;
|
|
overflow: auto;
|
|
padding: 20px;
|
|
}
|
|
|
|
.opportunities-extension-preferences-fieldset {
|
|
min-width: 0;
|
|
margin: 0;
|
|
padding: 0;
|
|
border: 0;
|
|
}
|
|
|
|
.opportunities-extension-preferences-fieldset legend {
|
|
margin-bottom: 12px;
|
|
padding: 0;
|
|
color: #312d2a;
|
|
font-size: 15px;
|
|
font-weight: 700;
|
|
line-height: 1.3;
|
|
}
|
|
|
|
.opportunities-extension-preferences-options {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 4px 20px;
|
|
}
|
|
|
|
.opportunities-extension-preferences-option {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
gap: 10px;
|
|
min-width: 0;
|
|
padding: 9px 8px;
|
|
border-radius: 4px;
|
|
color: #312d2a;
|
|
font-size: 14px;
|
|
line-height: 1.35;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-preferences-option:hover {
|
|
background: #f0eeeb;
|
|
}
|
|
|
|
.opportunities-extension-preferences-option input {
|
|
width: 18px;
|
|
height: 18px;
|
|
flex: 0 0 18px;
|
|
margin: 0;
|
|
accent-color: #00758f;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-preferences-cache-field {
|
|
display: grid;
|
|
width: min(280px, 100%);
|
|
gap: 6px;
|
|
margin-top: 24px;
|
|
color: #312d2a;
|
|
font-size: 14px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.opportunities-extension-preferences-cache-field select {
|
|
width: 100%;
|
|
height: 40px;
|
|
padding: 0 36px 0 12px;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
color: #312d2a;
|
|
font-size: 14px;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.opportunities-extension-preferences-cache-field select:focus {
|
|
border-color: #00758f;
|
|
outline: 2px solid #bde7ee;
|
|
outline-offset: 0;
|
|
}
|
|
|
|
.opportunities-extension-preferences-footer {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
padding: 14px 20px;
|
|
border-top: 1px solid #dedbd7;
|
|
}
|
|
|
|
.opportunities-extension-button {
|
|
min-width: 88px;
|
|
min-height: 36px;
|
|
padding: 7px 16px;
|
|
border: 1px solid transparent;
|
|
border-radius: 4px;
|
|
font-size: 14px;
|
|
font-weight: 600;
|
|
line-height: 1.2;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.opportunities-extension-button-primary {
|
|
border-color: #00758f;
|
|
background: #00758f;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-button-primary:hover,
|
|
.opportunities-extension-button-primary:focus-visible {
|
|
border-color: #005e73;
|
|
background: #005e73;
|
|
outline: none;
|
|
}
|
|
|
|
.opportunities-extension-debug-panel {
|
|
position: fixed;
|
|
right: 24px;
|
|
bottom: 24px;
|
|
z-index: 1;
|
|
width: min(640px, calc(100vw - 48px));
|
|
max-height: min(560px, calc(100vh - 120px));
|
|
overflow: auto;
|
|
border: 1px solid #8f8a85;
|
|
border-radius: 4px;
|
|
background: #ffffff;
|
|
box-shadow: 0 2px 8px rgba(0, 0, 0, .16);
|
|
padding: 16px;
|
|
color: #000000;
|
|
}
|
|
|
|
.opportunities-extension-debug-panel[hidden] {
|
|
display: none !important;
|
|
}
|
|
|
|
.opportunities-extension-debug-panel h2 {
|
|
margin: 0;
|
|
font-size: 18px;
|
|
font-weight: 700;
|
|
line-height: 1.25;
|
|
}
|
|
|
|
.opportunities-extension-debug-panel p {
|
|
margin: 4px 0 0;
|
|
color: #5f5a55;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.opportunities-extension-debug-panel-header {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.opportunities-extension-debug-visibility-button {
|
|
width: 34px;
|
|
height: 34px;
|
|
flex: 0 0 34px;
|
|
color: #312d2a;
|
|
}
|
|
|
|
.opportunities-extension-debug-visibility-button svg {
|
|
width: 20px;
|
|
height: 20px;
|
|
}
|
|
|
|
.opportunities-extension-debug-list {
|
|
display: grid;
|
|
gap: 10px;
|
|
}
|
|
|
|
.opportunities-extension-debug-item {
|
|
border: 1px solid #dedbd7;
|
|
border-left-width: 4px;
|
|
border-radius: 4px;
|
|
background: #faf9f8;
|
|
}
|
|
|
|
.opportunities-extension-debug-item[open] {
|
|
background: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-debug-item-success {
|
|
border-left-color: #3f6f17;
|
|
}
|
|
|
|
.opportunities-extension-debug-item-success .opportunities-extension-debug-status {
|
|
background: #e2f2e5;
|
|
color: #356d19;
|
|
}
|
|
|
|
.opportunities-extension-debug-item-failed {
|
|
border-left-color: #c5331f;
|
|
}
|
|
|
|
.opportunities-extension-debug-item-failed .opportunities-extension-debug-status {
|
|
background: #f9e3e1;
|
|
color: #a52b1c;
|
|
}
|
|
|
|
.opportunities-extension-debug-item-pending {
|
|
border-left-color: #6f5a7f;
|
|
}
|
|
|
|
.opportunities-extension-debug-item-pending .opportunities-extension-debug-status {
|
|
background: #eee8f2;
|
|
color: #6f5a7f;
|
|
}
|
|
|
|
.opportunities-extension-debug-heading {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
min-height: 42px;
|
|
padding: 9px 12px 9px 10px;
|
|
cursor: pointer;
|
|
list-style: none;
|
|
}
|
|
|
|
.opportunities-extension-debug-heading::-webkit-details-marker {
|
|
display: none;
|
|
}
|
|
|
|
.opportunities-extension-debug-heading::before {
|
|
content: "⌄";
|
|
width: 14px;
|
|
color: #5f5a55;
|
|
font-size: 16px;
|
|
line-height: 1;
|
|
transform: rotate(-90deg);
|
|
transition: transform .15s ease;
|
|
}
|
|
|
|
.opportunities-extension-debug-item[open] .opportunities-extension-debug-heading::before {
|
|
transform: rotate(0deg);
|
|
}
|
|
|
|
.opportunities-extension-debug-summary-meta {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
margin-left: auto;
|
|
}
|
|
|
|
.opportunities-extension-debug-http-status,
|
|
.opportunities-extension-debug-status {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
min-height: 22px;
|
|
padding: 0 8px;
|
|
border-radius: 999px;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
line-height: 1;
|
|
text-transform: uppercase;
|
|
}
|
|
|
|
.opportunities-extension-debug-http-status {
|
|
background: #e8f4f6;
|
|
color: #006d7a;
|
|
}
|
|
|
|
.opportunities-extension-debug-status {
|
|
background: #ebe8e5;
|
|
color: #5f5a55;
|
|
}
|
|
|
|
.opportunities-extension-debug-heading strong {
|
|
font-size: 13px;
|
|
}
|
|
|
|
.opportunities-extension-debug-item pre {
|
|
margin: 0;
|
|
padding: 8px 12px 12px;
|
|
color: #312d2a;
|
|
font-family: Consolas, "Courier New", monospace;
|
|
font-size: 12px;
|
|
line-height: 1.45;
|
|
white-space: pre-wrap;
|
|
word-break: break-word;
|
|
}
|
|
|
|
.opportunities-extension-debug-empty {
|
|
padding: 14px;
|
|
border: 1px dashed #b8b2ad;
|
|
border-radius: 4px;
|
|
color: #5f5a55;
|
|
font-size: 13px;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] {
|
|
background: #1f1f1f;
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-shell,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-body {
|
|
background: #1f1f1f;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-header {
|
|
border-bottom-color: #4e4a46;
|
|
background:
|
|
linear-gradient(90deg, #a8795d 0 11%, #dd5a47 11% 23%, #876e9b 23% 36%, #00a6be 36% 51%, #dfbd76 51% 63%, transparent 63% 100%) top left / 100% 6px no-repeat,
|
|
#292827;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-header h1,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-value,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-field,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-label,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-label,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-label,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table-search-field {
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-header p,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-header p,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-card span,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-empty,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-detail-heading span,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-empty,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-empty,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-details dt,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-panel p,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-empty {
|
|
color: #c9c5c1;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-error {
|
|
color: #ffb4a8;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-chart-error {
|
|
color: #ffb4a8;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-bar {
|
|
background: #5b5753;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-status {
|
|
background: #5b5753;
|
|
box-shadow: 0 0 0 3px #3b3937;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-period-active {
|
|
border-color: #3f7580;
|
|
background: #23474e;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-chart-skeleton-plot span {
|
|
background: #5b5753;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-status-indicator {
|
|
background: #8f8a85;
|
|
box-shadow: 0 0 0 3px #3b3937;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-status-indicator[data-active="true"] {
|
|
background: #7fb05b;
|
|
box-shadow: 0 0 0 3px #314527;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-form,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-card,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table-surface,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-panel,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-dialog,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-dialog,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-table,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-panel,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-item[open] {
|
|
border-color: #4e4a46;
|
|
background: #292827;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-trigger,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-search,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table-search-field input,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-field select,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-cache-field select,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button {
|
|
border-color: #6a6560;
|
|
background: #333130;
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-trigger::after {
|
|
border-top-color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-select-wrap::after {
|
|
border-top-color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-trigger:disabled {
|
|
background: #292827;
|
|
color: #918b86;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-search::placeholder,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table-search-field input::placeholder {
|
|
color: #b5b0ab;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-select-all,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-option,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-header h2,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-header h2,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-fieldset legend,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-option,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-cache-field,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-detail-heading,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-details dd,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-heading,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-item pre,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-panel h2 {
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-navigation strong {
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-chart-empty {
|
|
color: #c9c5c1;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-select-all,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table th {
|
|
border-bottom-color: #4e4a46;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-header,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-footer,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-header,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-tabs-navigation,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-tabs,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-details > div,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-tabs,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-details > div {
|
|
border-color: #4e4a46;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-trend,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-chart-skeleton-plot,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-trend,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-plot {
|
|
border-color: #4e4a46;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-plot {
|
|
background: repeating-linear-gradient(to bottom, transparent 0, transparent 58px, #4e4a46 58px, #4e4a46 59px) left top / 100% 236px no-repeat;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-plot::before,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-skeleton-plot::after {
|
|
background: #4e4a46;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-tab {
|
|
color: #c9c5c1;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-tab:hover {
|
|
background: #3b3937;
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plan-tab[aria-selected="true"] {
|
|
border-bottom-color: #43c4d5;
|
|
color: #91e4ed;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-periods button {
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-periods button:hover {
|
|
background: #3b3937;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-periods button[aria-pressed="true"] {
|
|
border-color: #43c4d5;
|
|
background: #173e43;
|
|
color: #91e4ed;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-navigation-button,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-tab-navigation-button {
|
|
border-color: #6a6560;
|
|
background: #333130;
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-navigation-button:hover:not(:disabled),
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-tab-navigation-button:hover:not(:disabled) {
|
|
border-color: #43c4d5;
|
|
background: #3b3937;
|
|
color: #91e4ed;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-navigation-button:disabled,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-account-plans-tab-navigation-button:disabled {
|
|
border-color: #4e4a46;
|
|
color: #746f6a;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-grid-line {
|
|
stroke: #4e4a46;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-axis-label,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-x-label {
|
|
fill: #c9c5c1;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-value-label {
|
|
fill: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-bar-funded {
|
|
fill: #ca8798;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-bar-overage {
|
|
fill: #f09a32;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-average-line {
|
|
stroke: #f09a32;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-bar-group:hover rect,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-svg .consumption-bar-group:focus rect {
|
|
stroke: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-legend button {
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-legend button:hover {
|
|
background: #3b3937;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-legend button[aria-pressed="false"] {
|
|
color: #a8a39e;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-legend-funded {
|
|
background: #ca8798;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-legend-overage {
|
|
background: #f09a32;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-legend-average {
|
|
border-top-color: #f09a32;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-consumption-tooltip {
|
|
border-color: #6a6560;
|
|
background: #333130;
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-option:hover {
|
|
background: #3b3937;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-preferences-option input {
|
|
accent-color: #43c4d5;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-button-primary {
|
|
border-color: #00a6be;
|
|
background: #008aa6;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-button-primary:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-button-primary:focus-visible {
|
|
border-color: #43c4d5;
|
|
background: #006d7a;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-customer-filter-option:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table tbody tr:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-sort-button:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-icon-button:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-icon-button:focus {
|
|
background: #3b3937;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table thead,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table th,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-table th {
|
|
background: #333130;
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table td {
|
|
border-bottom-color: #3f3c39;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-detail {
|
|
border-bottom-color: #4e4a46;
|
|
background: #252423;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-table th,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-table td {
|
|
border-bottom-color: #3f3c39;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-count {
|
|
border-color: #2f9bae;
|
|
background: #1d4e55;
|
|
color: #91e4ed;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-count:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-count:focus-visible,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-count[aria-expanded="true"] {
|
|
border-color: #43c4d5;
|
|
background: #008aa6;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-progress[data-state="running"] {
|
|
background: #1d4e55;
|
|
color: #91e4ed;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-progress[data-state="complete"] {
|
|
background: #244f2e;
|
|
color: #a8dfb7;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-progress[data-state="complete-with-errors"],
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-progress[data-state="error"],
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-count-error {
|
|
border-color: #b13b34;
|
|
background: #5f2926;
|
|
color: #ffb4ad;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-products-cache-timestamp {
|
|
background: #3b3937;
|
|
color: #c9c5c1;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table a,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-copy-button,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-action-button {
|
|
color: #43c4d5;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-table a:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-copy-button:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-copy-button:focus-visible,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-action-button:hover,
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-action-button:focus-visible {
|
|
background: #1d4e55;
|
|
color: #91e4ed;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[data-stage="SQL"] {
|
|
color: #43c4d5;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[data-stage="PIPELINE"] {
|
|
color: #d1cbc6;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[data-stage="UPSIDE"] {
|
|
color: #ffbf62;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[data-stage="FORECAST"] {
|
|
color: #d2b7e9;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[data-stage="WON"] {
|
|
color: #9bd46a;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-card[data-stage="SQL"] {
|
|
border-top-color: #43c4d5;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-total-dashboard-card {
|
|
border-top-color: #f6f4f2;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-card[data-stage="PIPELINE"] {
|
|
border-top-color: #c0b9b3;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-card[data-stage="UPSIDE"] {
|
|
border-top-color: #ffb84d;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-card[data-stage="FORECAST"] {
|
|
border-top-color: #cba7e7;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-dashboard-card[data-stage="WON"] {
|
|
border-top-color: #92cf5b;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="SQL"] {
|
|
border-color: #008aa6;
|
|
background: #008aa6;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="PIPELINE"] {
|
|
border-color: #6f6863;
|
|
background: #6f6863;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="UPSIDE"] {
|
|
border-color: #b96e00;
|
|
background: #b96e00;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="FORECAST"] {
|
|
border-color: #755b8b;
|
|
background: #755b8b;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-stage-filter-button[aria-pressed="true"][data-stage="WON"] {
|
|
border-color: #4b7f22;
|
|
background: #4b7f22;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[data-status="OPEN"] {
|
|
color: #69c985;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[data-status="CLOSED"] {
|
|
color: #c3cad3;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[data-status="LOST"] {
|
|
color: #ff9d94;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[data-status="WON"] {
|
|
color: #83bfff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[aria-pressed="true"][data-status="OPEN"] {
|
|
border-color: #197a3d;
|
|
background: #197a3d;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[aria-pressed="true"][data-status="CLOSED"] {
|
|
border-color: #4b5563;
|
|
background: #4b5563;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[aria-pressed="true"][data-status="LOST"] {
|
|
border-color: #b13b34;
|
|
background: #b13b34;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-status-filter-button[aria-pressed="true"][data-status="WON"] {
|
|
border-color: #1f5f99;
|
|
background: #1f5f99;
|
|
color: #ffffff;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-debug-item {
|
|
border-color: #4e4a46;
|
|
background: #252423;
|
|
}
|
|
|
|
.opportunities-extension-modal[data-theme="dark"] .opportunities-extension-icon-button {
|
|
color: #f6f4f2;
|
|
}
|
|
|
|
@media (min-width: 1201px) and (max-width: 1450px) {
|
|
.opportunities-extension-table th:nth-child(1) {
|
|
width: 16%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(3) {
|
|
width: 18%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(4) {
|
|
width: 12%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(6) {
|
|
width: 7%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(7) {
|
|
width: 8%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(10) {
|
|
width: 10%;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 1200px) {
|
|
.opportunities-extension-table {
|
|
min-width: 1180px;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(1) {
|
|
width: 15%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(3) {
|
|
width: 17%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(4) {
|
|
width: 13%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(6) {
|
|
width: 6%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(7) {
|
|
width: 9%;
|
|
}
|
|
|
|
.opportunities-extension-table th:nth-child(10) {
|
|
width: 11%;
|
|
}
|
|
}
|
|
|
|
@media (max-width: 700px) {
|
|
.opportunities-extension-header {
|
|
padding: 24px 20px 18px;
|
|
}
|
|
|
|
.opportunities-extension-header::before {
|
|
left: 20px;
|
|
}
|
|
|
|
.opportunities-extension-header h1 {
|
|
font-size: 22px;
|
|
}
|
|
|
|
.opportunities-extension-header p {
|
|
font-size: 14px;
|
|
}
|
|
|
|
.opportunities-extension-body {
|
|
padding: 16px 20px 24px;
|
|
}
|
|
|
|
.opportunities-extension-form {
|
|
align-items: stretch;
|
|
flex-wrap: wrap;
|
|
gap: 14px;
|
|
min-height: auto;
|
|
padding: 12px;
|
|
}
|
|
|
|
.opportunities-extension-field {
|
|
max-width: none;
|
|
width: 100%;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter {
|
|
width: 100%;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-trigger {
|
|
width: 100%;
|
|
}
|
|
|
|
.opportunities-extension-customer-filter-panel {
|
|
width: min(360px, calc(100vw - 64px));
|
|
}
|
|
|
|
.opportunities-extension-table-search-field {
|
|
width: 100%;
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
}
|
|
|
|
.opportunities-extension-stage-dashboard-value {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.opportunities-extension-preferences-modal {
|
|
padding: 12px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-modal {
|
|
padding: 12px;
|
|
}
|
|
|
|
.opportunities-extension-preferences-dialog {
|
|
max-height: calc(100vh - 24px);
|
|
}
|
|
|
|
.opportunities-extension-account-plans-dialog {
|
|
height: calc(100vh - 24px);
|
|
}
|
|
|
|
.opportunities-extension-account-plan-panel {
|
|
padding: 12px 14px;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-details {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 0 14px;
|
|
}
|
|
|
|
.opportunities-extension-account-plan-details > div {
|
|
grid-template-columns: 1fr;
|
|
align-content: center;
|
|
gap: 3px;
|
|
min-height: 54px;
|
|
padding: 5px 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-details {
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 0 14px;
|
|
padding: 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-details > div {
|
|
grid-template-columns: 1fr;
|
|
align-content: center;
|
|
gap: 5px;
|
|
min-height: 54px;
|
|
padding: 5px 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-trend {
|
|
margin: 14px 0 0;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-periods {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
align-items: center;
|
|
gap: 6px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-periods .opportunities-extension-account-plans-skeleton-bar {
|
|
width: 100% !important;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-chart {
|
|
grid-template-columns: minmax(0, 1fr);
|
|
gap: 12px;
|
|
padding: 12px 8px 0 34px;
|
|
}
|
|
|
|
.opportunities-extension-account-plans-skeleton-legend {
|
|
display: flex;
|
|
min-height: 24px;
|
|
align-items: center;
|
|
justify-content: center;
|
|
gap: 12px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-trend-header {
|
|
align-items: stretch;
|
|
}
|
|
|
|
.opportunities-extension-consumption-periods {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, minmax(0, 1fr));
|
|
gap: 3px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-periods button {
|
|
min-width: 0;
|
|
padding: 7px 4px;
|
|
font-size: 12px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart {
|
|
min-height: 0;
|
|
}
|
|
|
|
.opportunities-extension-consumption-svg {
|
|
width: 760px;
|
|
height: 245px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-visual {
|
|
width: 920px;
|
|
grid-template-columns: 760px 144px;
|
|
gap: 12px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-figure {
|
|
overflow-x: auto;
|
|
overscroll-behavior-inline: contain;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart-skeleton {
|
|
min-height: 0;
|
|
padding: 24px 18px 18px;
|
|
}
|
|
|
|
.opportunities-extension-consumption-chart-skeleton-plot {
|
|
min-height: 180px;
|
|
gap: 4px;
|
|
padding: 0 6px;
|
|
}
|
|
|
|
.opportunities-extension-preferences-options {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.opportunities-extension-stage-filter-controls {
|
|
gap: 6px;
|
|
}
|
|
|
|
.opportunities-extension-status-filter-controls {
|
|
gap: 6px;
|
|
}
|
|
|
|
.opportunities-extension-table-surface {
|
|
min-width: 0;
|
|
min-height: calc(100vh - 230px);
|
|
}
|
|
|
|
.opportunities-extension-debug-panel {
|
|
right: 12px;
|
|
bottom: 12px;
|
|
width: calc(100vw - 24px);
|
|
max-height: calc(100vh - 96px);
|
|
}
|
|
}
|
|
|