/* Placeholder while lazy-regions.js loads a region: faint outline of what is coming + label, gently pulsing */
.lazy-is-loading {
    position: relative;
    min-height: 260px;
}

.lazy-is-loading > * {
    visibility: hidden;
}

/* APEX's own spinner is not needed where the placeholder shows */
.lazy-managed .u-Processing,
.lazy-is-loading .u-Processing {
    display: none !important;
}

.lazy-is-loading::before {                  /* label */
    content: attr(data-loading-text);
    position: absolute;
    top: 16px;
    left: 16px;
    z-index: 1;
    font-size: 12px;
    color: #888;
}

.lazy-is-loading::after {                   /* shape */
    content: "";
    position: absolute;
    inset: 44px 16px 24px;
    border-radius: 4px;
    background-repeat: no-repeat;
    animation: lazy-pulse 1.6s ease-in-out infinite;
}

/* chart-type placeholders (grey outline of the chart that is loading) */
.lazy-kind-bar::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='4' y='15' width='8' height='85' rx='1' fill='%23e6e6e6'/%3E%3Crect x='16' y='35' width='8' height='65' rx='1' fill='%23e6e6e6'/%3E%3Crect x='28' y='28' width='8' height='72' rx='1' fill='%23e6e6e6'/%3E%3Crect x='40' y='50' width='8' height='50' rx='1' fill='%23e6e6e6'/%3E%3Crect x='52' y='60' width='8' height='40' rx='1' fill='%23e6e6e6'/%3E%3Crect x='64' y='66' width='8' height='34' rx='1' fill='%23e6e6e6'/%3E%3Crect x='76' y='74' width='8' height='26' rx='1' fill='%23e6e6e6'/%3E%3Crect x='88' y='82' width='8' height='18' rx='1' fill='%23e6e6e6'/%3E%3Crect x='0' y='99' width='100' height='1' fill='%23cfcfcf'/%3E%3C/svg%3E");
    background-size: 100% 100%;
}

.lazy-kind-stacked::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='4' y='15' width='8' height='85' rx='1' fill='%23e6e6e6'/%3E%3Crect x='4' y='62' width='8' height='38' fill='%23d6d6d6'/%3E%3Crect x='16' y='35' width='8' height='65' rx='1' fill='%23e6e6e6'/%3E%3Crect x='16' y='71' width='8' height='29' fill='%23d6d6d6'/%3E%3Crect x='28' y='28' width='8' height='72' rx='1' fill='%23e6e6e6'/%3E%3Crect x='28' y='68' width='8' height='32' fill='%23d6d6d6'/%3E%3Crect x='40' y='50' width='8' height='50' rx='1' fill='%23e6e6e6'/%3E%3Crect x='40' y='78' width='8' height='22' fill='%23d6d6d6'/%3E%3Crect x='52' y='60' width='8' height='40' rx='1' fill='%23e6e6e6'/%3E%3Crect x='52' y='82' width='8' height='18' fill='%23d6d6d6'/%3E%3Crect x='64' y='66' width='8' height='34' rx='1' fill='%23e6e6e6'/%3E%3Crect x='64' y='85' width='8' height='15' fill='%23d6d6d6'/%3E%3Crect x='76' y='74' width='8' height='26' rx='1' fill='%23e6e6e6'/%3E%3Crect x='76' y='88' width='8' height='12' fill='%23d6d6d6'/%3E%3Crect x='88' y='82' width='8' height='18' rx='1' fill='%23e6e6e6'/%3E%3Crect x='88' y='92' width='8' height='8' fill='%23d6d6d6'/%3E%3Crect x='0' y='99' width='100' height='1' fill='%23cfcfcf'/%3E%3C/svg%3E");
    background-size: 100% 100%;
}

.lazy-kind-combo::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='4' y='15' width='8' height='85' rx='1' fill='%23e6e6e6'/%3E%3Crect x='16' y='35' width='8' height='65' rx='1' fill='%23e6e6e6'/%3E%3Crect x='28' y='28' width='8' height='72' rx='1' fill='%23e6e6e6'/%3E%3Crect x='40' y='50' width='8' height='50' rx='1' fill='%23e6e6e6'/%3E%3Crect x='52' y='60' width='8' height='40' rx='1' fill='%23e6e6e6'/%3E%3Crect x='64' y='66' width='8' height='34' rx='1' fill='%23e6e6e6'/%3E%3Crect x='76' y='74' width='8' height='26' rx='1' fill='%23e6e6e6'/%3E%3Crect x='88' y='82' width='8' height='18' rx='1' fill='%23e6e6e6'/%3E%3Crect x='0' y='99' width='100' height='1' fill='%23cfcfcf'/%3E%3Cpolyline points='8,40 20,30 32,45 44,25 56,38 68,30 80,50 92,42' fill='none' stroke='%23d6d6d6' stroke-width='2'/%3E%3C/svg%3E");
    background-size: 100% 100%;
}

.lazy-kind-scatter::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Crect x='0' y='99' width='100' height='1' fill='%23cfcfcf'/%3E%3Crect x='0' y='0' width='1' height='100' fill='%23cfcfcf'/%3E%3Ccircle cx='10' cy='85' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='18' cy='78' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='25' cy='80' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='32' cy='66' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='40' cy='70' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='46' cy='58' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='55' cy='52' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='60' cy='60' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='68' cy='40' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='75' cy='45' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='82' cy='30' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='90' cy='22' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='28' cy='90' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='50' cy='75' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='72' cy='55' r='2.5' fill='%23e6e6e6'/%3E%3Ccircle cx='85' cy='40' r='2.5' fill='%23e6e6e6'/%3E%3Cline x1='5' y1='92' x2='95' y2='20' stroke='%23d6d6d6' stroke-width='1.5'/%3E%3C/svg%3E");
    background-size: 100% 100%;
}

.lazy-kind-network::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid meet'%3E%3Cline x1='50' y1='50' x2='20' y2='25' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='50' y1='50' x2='80' y2='22' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='50' y1='50' x2='85' y2='70' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='50' y1='50' x2='18' y2='75' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='50' y1='50' x2='50' y2='90' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='20' y1='25' x2='80' y2='22' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='18' y1='75' x2='50' y2='90' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='85' y1='70' x2='80' y2='22' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Cline x1='20' y1='25' x2='18' y2='75' stroke='%23cfcfcf' stroke-width='0.8'/%3E%3Ccircle cx='50' cy='50' r='9' fill='%23e6e6e6'/%3E%3Ccircle cx='20' cy='25' r='6' fill='%23e6e6e6'/%3E%3Ccircle cx='80' cy='22' r='5' fill='%23e6e6e6'/%3E%3Ccircle cx='85' cy='70' r='7' fill='%23e6e6e6'/%3E%3Ccircle cx='18' cy='75' r='5' fill='%23e6e6e6'/%3E%3Ccircle cx='50' cy='90' r='4' fill='%23e6e6e6'/%3E%3C/svg%3E");
    background-size: 100% 100%;
}

.lazy-kind-pie::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='xMidYMid meet'%3E%3Ccircle cx='50' cy='50' r='25' fill='none' stroke='%23e6e6e6' stroke-width='50'/%3E%3Ccircle cx='50' cy='50' r='25' fill='none' stroke='%23d6d6d6' stroke-width='50' stroke-dasharray='40 200' transform='rotate%28-90 50 50%29'/%3E%3Ccircle cx='50' cy='50' r='25' fill='none' stroke='%23dedede' stroke-width='50' stroke-dasharray='25 200' stroke-dashoffset='-40' transform='rotate%28-90 50 50%29'/%3E%3Cline x1='50' y1='50' x2='50' y2='0' stroke='%23fff' stroke-width='1.5'/%3E%3C/svg%3E");
    background-size: contain;
    background-position: center;
}

.lazy-kind-network::after,
.lazy-kind-pie::after {
    background-size: contain;
    background-position: center;
}

/* table: header + rows */
.lazy-kind-table::after {
    background-image:
        linear-gradient(#e0e0e0, #e0e0e0),
        repeating-linear-gradient(#efefef 0 18px, transparent 18px 30px);
    background-size: 100% 22px, 100% calc(100% - 34px);
    background-position: 0 0, 0 34px;
}

/* map: soft blobs */
.lazy-kind-map::after {
    background-image:
        radial-gradient(ellipse 18% 22% at 22% 38%, #e7e7e7 98%, transparent),
        radial-gradient(ellipse 12% 25% at 30% 70%, #e7e7e7 98%, transparent),
        radial-gradient(ellipse 22% 20% at 58% 35%, #e7e7e7 98%, transparent),
        radial-gradient(ellipse 10% 20% at 55% 65%, #e7e7e7 98%, transparent),
        radial-gradient(ellipse 12% 10% at 82% 75%, #e7e7e7 98%, transparent),
        linear-gradient(#f6f6f6, #f6f6f6);
    background-size: 100% 100%;
    background-position: 0 0;
}

@keyframes lazy-pulse {
    0%, 100% { opacity: 1; }
    50%      { opacity: .5; }
}

@media (prefers-reduced-motion: reduce) {
    .lazy-is-loading::after { animation: none; }
}

/* Chart actions added by chart-export.js: green table button + download button */
.chart-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 8px 0;
}

.chart-actions .t-Button {
    margin: 0;
}

.chart-table-filters {
    margin: 0 0 12px;
    padding-left: 18px;
    font-size: 12px;
}

.chart-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.chart-table th,
.chart-table td {
    padding: 4px 8px;
    border-bottom: 1px solid #e0e0e0;
    text-align: left;
}

.chart-table td.u-textEnd {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.chart-table thead th {
    position: sticky;
    top: 0;
    background: #f5f5f5;
}

/* Side-by-side sections (e.g. 5.1 / 5.2) get the same height */
.col:has(> #p9-sec51),
.col:has(> #p9-sec52) {
    display: flex;
    flex-direction: column;
}

#p9-sec51,
#p9-sec52 {
    flex: 1 1 auto;
}

/* Static pages: images/videos never wider than their region (were cut off) */
.t-Region-body img,
.t-Region-body video {
    max-width: 100%;
    height: auto;
}

/* Active filters bar (filter-bar.js), under the page title */
#filter-bar:not(.has-filters) {
    display: none;
}

#filter-bar.has-filters {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin-bottom: 12px;
    padding: 8px 0;
    border-bottom: 1px solid #e3e3e3;
}

.fbar-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
}

.fbar-chip {
    display: inline-flex;
    align-items: center;
    border: 1px solid #d0d0d0;
    border-radius: 999px;
    background: #f7f7f7;
    font-size: 12px;
    line-height: 1;
}

.fbar-chip.is-active {
    border-color: #2b7cb3;
    background: #e8f2fa;
}

.fbar-chip.is-unused {
    opacity: .45;
}

.fbar-chip button {
    border: 0;
    background: none;
    cursor: pointer;
    font: inherit;
    color: inherit;
    padding: 6px 10px;
}

.fbar-chip .fbar-clear {
    padding-left: 0;
}

.fbar-label {
    color: #666;
}

.fbar-some {
    color: #b36b00;
    font-weight: bold;
}

.fbar-action {
    border: 0;
    background: none;
    cursor: pointer;
    font-size: 12px;
    color: #2b7cb3;
    padding: 6px 4px;
}

.fbar-action:hover,
.fbar-chip button:hover {
    text-decoration: underline;
}

.fbar-note {
    flex-basis: 100%;
    font-size: 11px;
    color: #777;
}

@media (max-width: 640px) {
    .fbar-label { display: none; }
}

/* Filter bar buttons: [Filters] [Reset all] [Copy link], chip height, theme button shape */
.fbar-buttons {
    display: inline-flex;
    gap: 6px;
    margin-left: 4px;
}

#filter-bar .fbar-buttons .t-Button {
    margin: 0;
    height: 30px;
    min-height: 0;
    padding: 0 10px;
    font-size: 12px;
    line-height: 30px;
}

#filter-bar .fbar-filters-btn {
    background: #2b7cb3;
    color: #fff;
}

#filter-bar .fbar-filters-btn .t-Icon {
    color: inherit;
}

#filter-bar .fbar-chip {
    height: 30px;
    box-sizing: border-box;
}

/* Filter drawer above everything on the page (chart loading spinners included) */
.ui-dialog:has(#filters-drawer),
:has(> #filters-drawer) {
    z-index: 1500 !important;
}

.ui-widget-overlay {
    z-index: 1490 !important;
}

/* Popups opened from inside the drawer (date picker calendar, menus) above the drawer.
   filter-bar.js also lifts the exact popup of the date items (getPopupSelector). */
.a-DatePicker-popup,
.a-DatePicker--popup,
.ui-dialog--popup,
.ui-datepicker,
.a-Menu {
    z-index: 1600 !important;
}

/* Compact filter drawer */
#filters-drawer .t-Region,
#filters-drawer .t-Region-body,
#filters-drawer .t-Form-fieldContainer {
    margin: 0;
    padding-top: 0;
    padding-bottom: 0;
}

#filters-drawer .fdr-heading {
    margin: 14px 0 6px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #666;
}

/* options: no label column, wrap as one flowing group with even spacing */
#filters-drawer .t-Form-fieldContainer--hiddenLabel .t-Form-labelContainer {
    display: none;
}

#filters-drawer .t-Form-fieldContainer--hiddenLabel .t-Form-inputContainer {
    width: 100%;
    padding-left: 0;
    margin-left: 0;
}

#filters-drawer .apex-item-grp {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
}

#filters-drawer .apex-item-grp > :not(.apex-item-option) {
    display: contents;              /* flatten the theme's row/column wrappers */
}

#filters-drawer .apex-item-grp .apex-item-option {
    width: auto !important;
    margin: 0;
    padding: 0;
}

/* checkboxes / radios as toggle pills */
#filters-drawer .apex-item-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

#filters-drawer .apex-item-option label {
    display: inline-block;
    min-width: 64px;                /* same size pills */
    box-sizing: border-box;
    text-align: center;
    margin: 0 6px 6px 0 !important; /* spacing on the pill itself: the theme's wrappers ignore gap */
    padding: 5px 10px;
    border: 1px solid #ccc;
    border-radius: 999px;
    background: #fff;
    font-size: 12px;
    cursor: pointer;
}

#filters-drawer .apex-item-option label::before,
#filters-drawer .apex-item-option label::after {
    display: none !important;           /* hide the theme's checkbox / radio box */
}

#filters-drawer .apex-item-option input:checked + label {
    border-color: #2b7cb3;
    background: #2b7cb3;
    color: #fff;
}

#filters-drawer .apex-item-option input:focus-visible + label {
    outline: 2px solid #2b7cb3;
    outline-offset: 2px;
}

#filters-drawer .fdr-tools {
    margin-left: 10px;
    text-transform: none;
    letter-spacing: 0;
}

#filters-drawer .fdr-tools .fbar-action {
    padding: 0 6px;
    font-size: 11px;
}

/* Apply / Reset always visible at the bottom of the drawer */
#fdr-buttons {
    position: sticky;
    bottom: 0;
    margin-top: 16px;
    padding: 10px 0;
    background: #fff;
    border-top: 1px solid #e3e3e3;
    z-index: 1;
}

/* Filter drawer: floating panel sized to its content, not the full window height */
.ui-dialog:has(#filters-drawer) {
    top: 16px !important;
    bottom: auto !important;
    height: auto !important;
    max-height: calc(100vh - 32px);
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, .25);
}

.ui-dialog:has(#filters-drawer) .ui-dialog-content {
    height: auto !important;
    max-height: calc(100vh - 110px);
    overflow-y: auto;
}

/* filter bar: chips and the Filters button on one line */
#filter-bar.has-filters {
    align-items: flex-start;
}