/* AYAN AIR staff panel, style D "Calm" (AYAN_ADMIN_STYLE=d), approved 2026-10-07.
   The language of Find reservation style B on every staff page: a slim navy top bar with a gold line under the open item,
   each page title in a navy card with a faint flight path, underlined tabs, white cards whose heads are tinted 7% with an
   icon square, small filled buttons in deep quiet colours, Inter 13.5px, no letter-spaced capitals.
   Design only: loaded last, scoped to the staff panel; menus, pages, buttons, access and roles are unchanged. */
.fi-panel-admin {
    --d-navy: #0B1A31;
    --d-navy2: #13284A;
    --d-navy3: #1C3762;
    --d-ink: #172338;
    --d-ink2: #3A4760;
    --d-muted: #64748B;
    --d-muted2: #8A97AA;
    --d-line: #E4E9F0;
    --d-line2: #EEF1F6;
    --d-bg: #F4F6F9;
    --d-gold: #C9A45C;
    --d-gold2: #B8924A;
    --d-blue: #1F4E8C;
    --d-teal: #1E5F63;
    --d-amber: #8A5A12;
    --d-green: #1F6F43;
    --d-violet: #4B3F8F;
    --d-red: #9B2C2C;
    --d-field: #D3DBE6;
    --d-hover: #F8FAFD;
    --d-hero: linear-gradient(118deg, #0B1A31 0%, #13284A 60%, #1C3762 100%);
    --d-hero-shadow: 0 14px 34px -22px rgba(11, 26, 49, .6), 0 0 0 1px rgba(11, 26, 49, .04);
    --d-width: 1536px;   /* 1240 → 1536 (2026-10-08): wide screens keep only a small margin */
    /* older names other sheets and custom pages read */
    --fz-navy: #0B1A31; --fz-blue: #1F4E8C; --fz-ink: #172338; --fz-muted: #64748B; --fz-line: #E4E9F0; --fz-bg: #F4F6F9; --fz-shadow: none; --fz-radius: 12px;
    --v2-bg: #F4F6F9; --v2-line: #E4E9F0; --v2-ink: #172338; --v2-muted: #64748B; --v2-navy: #0B1A31; --v2-gold: #C9A45C;
    --a3-navy: #0B1A31; --a3-ink: #172338; --a3-line: #E4E9F0; --a3-bg: #F4F6F9;
    --primary-500: #1F4E8C; --primary-600: #1A4479; --primary-700: #163A68;
}

/* ---------- type: Inter 13.5px, even numbers, no letter-spaced capitals ---------- */
.fi-panel-admin.fi-body,
.fi-panel-admin :is(button, input, select, textarea) { font-family: "Inter", "Vazirmatn", system-ui, -apple-system, "Segoe UI", sans-serif !important; }
[dir="rtl"] .fi-panel-admin.fi-body,
[dir="rtl"] .fi-panel-admin :is(button, input, select, textarea) { font-family: "Vazirmatn", "Inter", system-ui, sans-serif !important; }
/* geometric text: even letter spacing at every screen density (without it "TKT" can draw as "T KT" on 1x screens) */
.fi-panel-admin.fi-body { background: var(--d-bg) !important; color: var(--d-ink); font-size: 13.5px; line-height: 1.45; letter-spacing: 0; -webkit-font-smoothing: antialiased; text-rendering: geometricPrecision; }
/* even-width figures only where money lines up: Inter's tabular figures also widen the hyphen ("2026 - 10 - 20", "GSA - EBL") */
.fi-panel-admin :is(.fi-ta-text, .fi-ta-text-item, .fi-in-text, td, .fz-hero-stat .v) { font-variant-numeric: normal; }
.fi-panel-admin :is(.fz-value, .fz-num, .cd-kpi .val, .cd .price, td.num, td.n, .st-strip b, .fi-wi-stats-overview-stat-value),
.fi-panel-admin .fi-ta-cell:is([class*="total"], [class*="balance"], [class*="amount"], [class*="credit"], [class*="available"], [class*="price"]) :is(.fi-ta-text, .fi-ta-text-item) { font-variant-numeric: tabular-nums; }
.fi-panel-admin :is(.fi-ta-header-cell, .fi-ta-header-cell *, .fi-sidebar-group-label, .fz-label, .fz-card .fz-label, .fz-table thead th, .st-strip span, .st-inv-sums span, .cr-flag, .br-chip, .fi-in-entry-label, .fi-fo-field-label-content) { text-transform: none !important; letter-spacing: 0 !important; }
.fi-panel-admin svg[stroke-width="1.5"] { stroke-width: 1.6; }

/* ---------- top bar: slim navy, gold line under the open item ---------- */
.fi-panel-admin .fi-topbar-ctn { position: sticky; top: 0; z-index: 30; }
.fi-panel-admin .fi-topbar { background: var(--d-navy) !important; height: 60px; min-height: 60px !important; border: 0 !important; box-shadow: inset 0 -1px 0 rgba(201, 164, 92, .28) !important;
    padding-inline: max(16px, calc((100% - var(--d-width)) / 2)) !important; gap: 0; }
.fi-panel-admin .fi-topbar-start { background: transparent !important; border: 0 !important; padding: 0 !important; margin: 0 40px 0 0 !important; height: 60px; display: flex; align-items: center; }
.fi-panel-admin .fi-topbar-start::after, .fi-panel-admin .fi-topbar-start::before { display: none !important; content: none !important; }
.fi-panel-admin .fi-topbar-start a { display: block; padding: 0 !important; background: transparent !important; }
.fi-panel-admin .fi-topbar img.fi-logo { content: url('../images/brand/ayan-logo-staff-on-dark.svg'); height: 33px !important; width: auto; }
.fi-panel-admin .fi-topbar img.fi-logo.fi-logo-dark { display: none !important; }
.fi-panel-admin .fi-topbar-nav-groups { height: 60px; gap: 2px !important; margin: 0 !important; padding: 0 !important; align-items: stretch; }
.fi-panel-admin .fi-topbar-nav-groups > .fi-dropdown, .fi-panel-admin .fi-topbar-nav-groups .fi-dropdown-trigger { height: 60px; display: flex; }
.fi-panel-admin .fi-topbar-item { height: 60px; display: flex; position: relative; }
.fi-panel-admin .fi-topbar-item-btn { height: 60px !important; padding: 0 var(--d-nav-pad, 10px) !important; border-radius: 0 !important; background: transparent !important; gap: 5px !important; box-shadow: none !important; position: relative; }
/* Accounts menu (2026-10-07): 10 top items fit on one line on laptops too; tighter below 1440px */
@media (max-width: 1439px) { .fi-panel-admin { --d-nav-pad: 8px; } .fi-panel-admin .fi-topbar-item-label { font-size: 13px !important; } }
@media (max-width: 1279px) { .fi-panel-admin { --d-nav-pad: 5px; } .fi-panel-admin .fi-topbar-item-label { font-size: 12.5px !important; } }
.fi-panel-admin .fi-topbar-item-btn:hover, .fi-panel-admin .fi-topbar-item-btn:focus-visible { background: transparent !important; }
.fi-panel-admin .fi-topbar-item-icon { display: none !important; }
.fi-panel-admin .fi-topbar-item-label { color: #A9B5C8 !important; font-size: 13.5px !important; font-weight: 500 !important; letter-spacing: 0 !important; white-space: nowrap; }
.fi-panel-admin .fi-topbar-item-btn:hover .fi-topbar-item-label { color: #fff !important; }
.fi-panel-admin .fi-topbar-group-toggle-icon { color: #7F8DA3 !important; width: 15px !important; height: 15px !important; }
.fi-panel-admin .fi-topbar-item.fi-active .fi-topbar-item-label { color: #fff !important; font-weight: 500 !important; }
.fi-panel-admin .fi-topbar-item.fi-active .fi-topbar-item-btn::after { content: ""; position: absolute; left: var(--d-nav-pad, 10px); right: var(--d-nav-pad, 10px); bottom: 0; height: 2px; border-radius: 2px 2px 0 0; background: var(--d-gold); }
.fi-panel-admin .fi-topbar-item.fi-active .fi-topbar-group-toggle-icon { color: #C9D2E0 !important; }
.fi-panel-admin .fi-topbar-item .fi-badge { background: rgba(201, 164, 92, .18) !important; color: #E8D2A2 !important; box-shadow: none !important; font-size: 11px !important; min-width: 18px; padding: 0 5px !important; border-radius: 9px !important; }
.fi-panel-admin .fi-topbar-end { margin-inline-start: auto; gap: 10px !important; }
.fi-panel-admin .fi-topbar-open-sidebar-btn, .fi-panel-admin .fi-topbar-close-sidebar-btn, .fi-panel-admin .fi-topbar .fi-icon-btn { color: #A9B5C8 !important; }
.fi-panel-admin .fi-topbar .fi-icon-btn:hover { color: #fff !important; background: rgba(255, 255, 255, .06) !important; }
/* global search: a magnifier that opens into a field over the menu while typing (the search itself is unchanged) */
.fi-panel-admin .fi-topbar .fi-global-search-ctn { position: relative; width: 36px; height: 34px; flex: none; }
.fi-panel-admin .fi-topbar .fi-global-search { position: absolute; right: 0; top: 0; z-index: 5; }
[dir="rtl"] .fi-panel-admin .fi-topbar .fi-global-search { right: auto; left: 0; }
.fi-panel-admin .fi-topbar .fi-global-search-field { width: 36px; transition: width .15s; }
.fi-panel-admin .fi-topbar .fi-global-search-field:focus-within,
.fi-panel-admin .fi-topbar .fi-global-search:has(.fi-global-search-results-ctn) .fi-global-search-field { width: 300px; }
.fi-panel-admin .fi-topbar .fi-global-search-field:not(:focus-within) .fi-input-wrp { position: relative; cursor: pointer; }
.fi-panel-admin .fi-topbar .fi-global-search-field:not(:focus-within) .fi-input-wrp-content-ctn { position: absolute; inset: 0; }
.fi-panel-admin .fi-topbar .fi-global-search-field:not(:focus-within) input { width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.fi-panel-admin .fi-topbar .fi-global-search-field .fi-input-wrp-prefix { padding: 0 0 0 9px !important; }
.fi-panel-admin .fi-topbar .fi-input-wrp { background: rgba(255, 255, 255, .07) !important; border: 1px solid rgba(255, 255, 255, .12) !important; box-shadow: none !important; border-radius: 8px !important; height: 34px; min-height: 34px !important; }
.fi-panel-admin .fi-topbar .fi-input-wrp:focus-within { background: rgba(255, 255, 255, .12) !important; border-color: rgba(201, 164, 92, .55) !important; }
.fi-panel-admin .fi-topbar .fi-input-wrp input { color: #fff !important; font-size: 13px !important; background: transparent !important; }
.fi-panel-admin .fi-topbar .fi-input-wrp input::placeholder { color: #8796AD !important; }
.fi-panel-admin .fi-topbar .fi-input-wrp :is(svg, .fi-icon) { color: #8796AD !important; }
.fi-panel-admin .fi-topbar .fi-input-wrp-prefix { padding-inline: 10px 0 !important; border: 0 !important; background: transparent !important; }
.fi-panel-admin .fi-user-menu-trigger .fi-user-avatar, .fi-panel-admin .fi-topbar .fi-avatar { width: 32px !important; height: 32px !important; background: rgba(201, 164, 92, .16) !important; color: #E8D2A2 !important; box-shadow: inset 0 0 0 1px rgba(201, 164, 92, .55) !important; border-radius: 50% !important; }
.fi-panel-admin .fi-topbar .fi-topbar-database-notifications-btn .fi-badge, .fi-panel-admin .fi-topbar .fi-icon-btn-badge-ctn .fi-badge { background: var(--d-gold) !important; color: var(--d-navy) !important; }
/* the narrow-screen side menu (top menu folds into it) */
.fi-panel-admin .fi-sidebar { background: #fff !important; }
.fi-panel-admin .fi-sidebar-header { background: var(--d-navy) !important; border: 0 !important; }
.fi-panel-admin .fi-sidebar-header img.fi-logo { content: url('../images/brand/ayan-logo-staff-on-dark.svg'); height: 30px !important; }
.fi-panel-admin .fi-sidebar-item.fi-active > .fi-sidebar-item-btn { background: #F1F4F8 !important; box-shadow: inset 2px 0 0 var(--d-gold) !important; }
.fi-panel-admin .fi-sidebar-group-label { font-size: 12px !important; color: var(--d-muted2) !important; font-weight: 600 !important; }

/* ---------- page: one centred column like the pictures ---------- */
.fi-panel-admin .fi-main-ctn { background: transparent !important; }
.fi-panel-admin .fi-main { max-width: calc(var(--d-width) + 64px) !important; padding: 26px 32px 56px !important; }
.fi-panel-admin .fi-page-header-main-ctn { padding-block: 0 !important; row-gap: 22px !important; }
.fi-panel-admin .fi-page-main { row-gap: 22px !important; gap: 22px !important; }
.fi-panel-admin .fi-page-content { row-gap: 22px; }
.fi-panel-admin .fi-page-content > .fi-sc.fi-sc-has-gap, .fi-panel-admin .fi-page-content > .fi-grid.fi-sc-has-gap { gap: 22px !important; }

/* ---------- page title: the navy card with the faint flight path ---------- */
.fi-panel-admin .fi-header {
    position: relative; overflow: hidden; margin: 0 !important; padding: 22px 36px 24px !important; min-height: 103px;
    display: flex !important; flex-flow: row nowrap !important; align-items: center !important; justify-content: space-between; gap: 24px !important;
    border: 0 !important; border-radius: 16px !important; color: #fff;
    background: var(--d-hero) !important;
    box-shadow: var(--d-hero-shadow) !important;
}
.fi-panel-admin .fi-header::before { content: none !important; display: none !important; }
/* the flight path lives in the free space between the title and the buttons, so it never runs under either */
.fi-panel-admin .fi-header::after {
    content: "" !important; display: block !important; order: 1; flex: 1 1 0; min-width: 0; align-self: stretch; margin: -12px 0 -14px; pointer-events: none; position: static;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='420' height='70' viewBox='0 0 420 70' fill='none'%3E%3Cpath d='M 6 62 C 120 10, 300 -2, 412 36' stroke='rgba(255,255,255,.24)' stroke-width='1.3' stroke-dasharray='3 6'/%3E%3Ccircle cx='6' cy='62' r='3' fill='%23C9A45C' opacity='.8'/%3E%3Ccircle cx='412' cy='36' r='3.2' fill='%2313284A' stroke='%23C9A45C' stroke-width='1.3' opacity='.85'/%3E%3Cg transform='translate(231.7 14.2) rotate(88.2) translate(-9 -9) scale(.75)'%3E%3Cpath d='M21 16v-2l-8-5V3.5c0-.83-.67-1.5-1.5-1.5S10 2.67 10 3.5V9l-8 5v2l8-2.5V19l-2 1.5V22l3.5-1 3.5 1v-1.5L13 19v-5.5l8 2.5z' fill='%23C9A45C'/%3E%3C/g%3E%3C/svg%3E") no-repeat right center / 420px 70px;
}
/* three or more buttons leave no room for it */
.fi-panel-admin .fi-header:has(.fi-header-actions-ctn .fi-ac > :nth-child(3))::after { background: none; }
.fi-panel-admin .fi-header > div:first-child { order: 0; display: flex; flex-direction: column; gap: 5px; min-width: 0; position: relative; z-index: 1; }
.fi-panel-admin .fi-header-heading { order: 1; font-size: 27px !important; font-weight: 600 !important; letter-spacing: -.012em !important; line-height: 1.2 !important; color: #fff !important; font-family: inherit !important; margin: 0 !important; }
.fi-panel-admin .fi-header-subheading { order: 2; margin: 0 !important; color: #B4C0D3 !important; font-size: 13.5px !important; max-width: 62ch; }
.fi-panel-admin .fi-header .fi-breadcrumbs { order: 3; }
.fi-panel-admin .fi-header .fi-breadcrumbs, .fi-panel-admin .fi-header .fi-breadcrumbs * { font-size: 12.5px !important; color: #8FA0BA !important; font-weight: 500 !important; text-transform: none !important; letter-spacing: 0 !important; }
.fi-panel-admin .fi-header .fi-breadcrumbs a:hover, .fi-panel-admin .fi-header .fi-breadcrumbs a:hover * { color: #fff !important; }
.fi-panel-admin .fi-header .fi-breadcrumbs-item:last-child, .fi-panel-admin .fi-header .fi-breadcrumbs-item:last-child * { color: #B4C0D3 !important; }
/* a list page: "Branches › List" adds nothing under the title */
.fi-panel-admin .fi-resource-list-records-page .fi-header .fi-breadcrumbs { display: none; }
.fi-panel-admin .fi-header-actions-ctn { order: 2; margin-inline-start: 0; position: relative; z-index: 1; flex: none; }
.fi-panel-admin .fi-header-actions-ctn .fi-ac { gap: 10px !important; flex-wrap: wrap; justify-content: flex-end; }
/* header buttons: the main one gold, the others quiet on the navy, coloured ones in their deep colour */
.fi-panel-admin .fi-header .fi-btn { height: 38px; min-height: 38px; padding: 0 15px !important; border-radius: 8px !important; font-size: 13px !important; font-weight: 600 !important; gap: 8px !important; box-shadow: 0 6px 16px -8px rgba(0, 0, 0, .6) !important; border: 0 !important; transform: none; }
.fi-panel-admin .fi-header .fi-btn :is(svg, .fi-icon) { width: 16px !important; height: 16px !important; }
.fi-panel-admin .fi-header .fi-btn.fi-color-primary:not(.fi-outlined) { background: var(--d-gold) !important; color: var(--d-navy) !important; }
.fi-panel-admin .fi-header .fi-btn.fi-color-primary:not(.fi-outlined):hover { background: #D4B06A !important; }
.fi-panel-admin .fi-header .fi-btn.fi-color-primary:not(.fi-outlined) :is(svg, .fi-icon, span) { color: var(--d-navy) !important; }
/* the quiet ones (Statement, Print, More…): see-through on the navy, like Copy on Find (one class more than the white form button) */
.fi-panel-admin .fi-header .fi-header-actions-ctn .fi-btn:is(.fi-color-gray, .fi-outlined, :not(.fi-color)) { background: rgba(255, 255, 255, .08) !important; color: #fff !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .22) !important; }
.fi-panel-admin .fi-header .fi-header-actions-ctn .fi-btn:is(.fi-color-gray, .fi-outlined, :not(.fi-color)):hover { background: rgba(255, 255, 255, .15) !important; filter: none; }
.fi-panel-admin .fi-header .fi-header-actions-ctn .fi-btn:is(.fi-color-gray, .fi-outlined, :not(.fi-color)) :is(svg, .fi-icon, span) { color: #fff !important; }
.fi-panel-admin .fi-header .fi-btn.fi-color-success:not(.fi-outlined) { background: var(--d-green) !important; color: #fff !important; }
.fi-panel-admin .fi-header .fi-btn.fi-color-warning:not(.fi-outlined) { background: var(--d-amber) !important; color: #fff !important; }
.fi-panel-admin .fi-header .fi-btn.fi-color-danger:not(.fi-outlined) { background: var(--d-red) !important; color: #fff !important; }
.fi-panel-admin .fi-header .fi-btn.fi-color-info:not(.fi-outlined) { background: var(--d-blue) !important; color: #fff !important; }
.fi-panel-admin .fi-header .fi-btn:is(.fi-color-success, .fi-color-warning, .fi-color-danger, .fi-color-info):not(.fi-outlined) :is(svg, .fi-icon, span) { color: #fff !important; }
.fi-panel-admin .fi-header .fi-ac-link-action, .fi-panel-admin .fi-header .fi-link { color: #E8D2A2 !important; }
.fi-panel-admin .fi-header .fi-ac-link-action *, .fi-panel-admin .fi-header .fi-link * { color: inherit !important; }

/* ---------- list tabs: a white strip joined under the title card ---------- */
.fi-panel-admin .fi-page-header-main-ctn:has(.fi-page-content > .fi-sc > .fi-grid-col:first-child > .fi-sc-component > .fi-sc-tabs) > .fi-header { border-radius: 16px 16px 0 0 !important; box-shadow: none !important; }
.fi-panel-admin .fi-page-content > .fi-sc > .fi-grid-col:first-child > .fi-sc-component > .fi-sc-tabs { margin-top: -22px; }
.fi-panel-admin .fi-page-content > .fi-sc > .fi-grid-col:first-child > .fi-sc-component > .fi-sc-tabs > .fi-tabs {
    width: 100%; max-width: none !important; margin: 0 !important; justify-content: flex-start; align-items: stretch; height: 54px; gap: 4px !important;
    padding: 0 20px 0 22px !important; background: #fff !important; border: 0 !important; border-top: 1px solid var(--d-line) !important;
    border-radius: 0 0 16px 16px !important; box-shadow: var(--d-hero-shadow) !important; overflow: visible;
}
.fi-panel-admin .fi-tabs { box-shadow: none !important; background: transparent !important; border: 0 !important; border-bottom: 1px solid var(--d-line) !important; border-radius: 0 !important; padding: 0 !important; gap: 4px !important; }
.fi-panel-admin .fi-tabs-item { border-radius: 0 !important; background: transparent !important; box-shadow: none !important; padding: 10px 14px !important; gap: 8px !important; border: 0 !important; }
.fi-panel-admin .fi-page-content > .fi-sc > .fi-grid-col:first-child .fi-sc-tabs > .fi-tabs > .fi-tabs-item { padding: 0 14px !important; height: 54px; }
.fi-panel-admin .fi-tabs-item-label { color: #52607A !important; font-size: 14px !important; font-weight: 500 !important; letter-spacing: 0 !important; }
.fi-panel-admin .fi-tabs-item :is(svg, .fi-icon) { color: #8794A8 !important; width: 16px !important; height: 16px !important; }
.fi-panel-admin .fi-tabs-item:hover .fi-tabs-item-label { color: var(--d-navy) !important; }
.fi-panel-admin .fi-tabs-item.fi-active { box-shadow: inset 0 -2px 0 var(--d-blue) !important; }
.fi-panel-admin .fi-tabs-item.fi-active .fi-tabs-item-label { color: var(--d-navy) !important; font-weight: 600 !important; }
.fi-panel-admin .fi-tabs-item.fi-active :is(svg, .fi-icon) { color: var(--d-blue) !important; }
.fi-panel-admin .fi-tabs-item .fi-badge { background: #F1F4F8 !important; color: var(--d-muted2) !important; box-shadow: none !important; border: 0 !important; font-size: 12px !important; font-weight: 500 !important; border-radius: 10px !important; padding: 1px 7px !important; min-height: 0 !important; height: auto; letter-spacing: 0 !important; }
.fi-panel-admin .fi-tabs-item .fi-badge * { color: inherit !important; }
.fi-panel-admin .fi-tabs-item.fi-active .fi-badge { background: #E6EEF8 !important; color: var(--d-blue) !important; }
/* the list's search sits on the right of the tab strip (as in the picture); filters and columns stay next to it */
.fi-panel-admin .fi-resource-list-records-page:has(.fi-page-content > .fi-sc > .fi-grid-col:first-child .fi-sc-tabs) .fi-page-content > .fi-sc > .fi-grid-col:nth-child(2) .fi-ta-ctn > .fi-ta-main > .fi-ta-header-ctn > .fi-ta-header-toolbar:not(:has(.fi-ta-actions > *)) {
    position: absolute; top: -76px; right: 20px; height: 54px; padding: 0 !important; border: 0 !important; background: transparent !important; z-index: 2;
}
.fi-panel-admin .fi-resource-list-records-page:has(.fi-page-content > .fi-sc > .fi-grid-col:first-child .fi-sc-tabs) .fi-ta-header-toolbar:not(:has(.fi-ta-actions > *)) .fi-ta-search-field { width: 340px; }

/* ---------- tables: one white card, blue-tinted head row, comfortable rows ---------- */
.fi-panel-admin .fi-ta-ctn { background: #fff !important; border: 1px solid var(--d-line) !important; border-radius: 12px !important; box-shadow: none !important; --tw-ring-color: transparent !important; }
.fi-panel-admin .fi-ta-ctn .fi-ta-main { border-radius: 12px; overflow: hidden; }
.fi-panel-admin .fi-ta-header { padding: 0 20px !important; min-height: 50px; display: flex; align-items: center; background: color-mix(in srgb, var(--d-blue) 7%, white) !important; border-bottom: 1px solid color-mix(in srgb, var(--d-blue) 16%, white) !important; }
.fi-panel-admin .fi-ta-header-heading { font-size: 14px !important; font-weight: 600 !important; color: var(--d-blue) !important; font-family: inherit !important; }
.fi-panel-admin .fi-ta-header-description { font-size: 12.5px !important; color: color-mix(in srgb, var(--d-blue) 60%, #64748B) !important; }
.fi-panel-admin .fi-ta-header-toolbar { padding: 10px 20px !important; border-color: var(--d-line) !important; background: #fff; }
.fi-panel-admin :is(.fi-ta-header-cell, .fi-ta-actions-header-cell, .fi-ta-empty-header-cell) { background: color-mix(in srgb, var(--d-blue) 6%, white) !important; height: 42px; padding: 0 12px !important; border-bottom: 1px solid color-mix(in srgb, var(--d-blue) 14%, white) !important; white-space: nowrap; }
.fi-panel-admin :is(.fi-ta-header-cell, .fi-ta-header-cell-label, .fi-ta-header-cell-sort-btn, .fi-ta-header-cell *) { color: #3F5677 !important; font-size: 12.5px !important; font-weight: 600 !important; text-transform: none !important; letter-spacing: 0 !important; font-family: inherit !important; }
.fi-panel-admin .fi-ta-header-cell:first-child, .fi-panel-admin .fi-ta-cell:first-child { padding-inline-start: 22px !important; }
.fi-panel-admin .fi-ta-header-cell:first-child { padding-inline-start: 22px !important; }
.fi-panel-admin .fi-ta-cell:first-child > *, .fi-panel-admin .fi-ta-cell:first-child .fi-ta-text { padding-inline-start: 0 !important; }
.fi-panel-admin .fi-ta-header-cell:last-child { padding-inline-end: 22px !important; }
.fi-panel-admin .fi-ta-selection-cell, .fi-panel-admin .fi-ta-header-cell.fi-ta-selection-cell { padding-inline: 16px 6px !important; }
.fi-panel-admin .fi-ta-row > td { border-top: 1px solid var(--d-line2) !important; background: transparent; }
.fi-panel-admin .fi-ta-row:first-child > td { border-top: 0 !important; }
.fi-panel-admin .fi-ta-row:nth-child(even) > td { background: transparent !important; }
.fi-panel-admin .fi-ta-row:hover > td { background: var(--d-hover) !important; }
.fi-panel-admin .fi-ta-cell { padding-block: 0 !important; height: 52px; }
.fi-panel-admin .fi-ta-text, .fi-panel-admin .fi-ta-col > .fi-ta-text-item { padding: 9px 12px !important; line-height: 1.4 !important; }
.fi-panel-admin :is(.fi-ta-text, .fi-ta-text-item, .fi-ta-text-item-label, .fi-ta-placeholder) { font-size: 13.5px !important; color: var(--d-ink); }
.fi-panel-admin .fi-ta-text-item.fi-color-gray, .fi-panel-admin .fi-ta-text-item.fi-color-gray * { color: var(--d-muted2) !important; }
.fi-panel-admin .fi-ta-placeholder { color: var(--d-muted2) !important; }
.fi-panel-admin :is(.fi-ta-text-description, .fi-ta-text .fi-ta-text-description, .fi-ta-text-item-description) { font-size: 12.5px !important; color: var(--d-muted) !important; letter-spacing: 0 !important; }
/* the first bold column (the ref) in blue, like the picture */
.fi-panel-admin :is(.fi-ta-text.fi-font-bold, .fi-ta-text-item.fi-font-bold, .fi-ta-text .fi-font-bold) { font-weight: 600 !important; }
.fi-panel-admin .fi-ta-cell:first-child :is(.fi-ta-text-item.fi-font-bold, .fi-font-bold .fi-ta-text-item-label, .fi-ta-text-item-label.fi-font-bold),
.fi-panel-admin .fi-ta-selection-cell + .fi-ta-cell :is(.fi-ta-text-item.fi-font-bold, .fi-font-bold .fi-ta-text-item-label, .fi-ta-text-item-label.fi-font-bold) { color: var(--d-blue) !important; }
.fi-panel-admin .fi-ta-actions, .fi-panel-admin .fi-ta-cell .fi-ac { gap: 6px !important; }
.fi-panel-admin .fi-ta-row > td:has(> .fi-ta-actions) { padding-inline-end: 22px !important; }
.fi-panel-admin .fi-ta-row.fi-ta-row:is(.fi-ta-summary-row, .fi-ta-summary-header-row) > :is(td, th) { background: #FBFCFD !important; font-size: 12.5px; height: 44px; border-top: 1px solid var(--d-line2) !important; }
.fi-panel-admin .fi-ta-summary-header-row > th, .fi-panel-admin .fi-ta-summary-row > th { color: var(--d-ink2) !important; font-weight: 600 !important; }
.fi-panel-admin .fi-ta-text-summary-label, .fi-panel-admin .fi-ta-text-summary-label * { color: var(--d-muted) !important; font-weight: 500 !important; }
.fi-panel-admin .fi-ta-text-summary, .fi-panel-admin .fi-ta-text-summary * { font-size: 12.5px !important; }
.fi-panel-admin .fi-ta-empty-state { padding-block: 40px !important; }
.fi-panel-admin .fi-ta-empty-state-icon-bg { background: color-mix(in srgb, var(--d-blue) 8%, white) !important; }
.fi-panel-admin .fi-ta-empty-state-icon-bg :is(svg, .fi-icon) { color: var(--d-blue) !important; }
.fi-panel-admin .fi-ta-empty-state-heading { font-size: 14px !important; font-weight: 600 !important; color: var(--d-ink) !important; }
.fi-panel-admin .fi-ta-filter-indicators { padding: 8px 20px !important; background: #FBFCFD; border-color: var(--d-line) !important; }
.fi-panel-admin .fi-ta-search-field .fi-input-wrp { height: 38px; }
/* the small number on the filter button */
.fi-panel-admin .fi-ta-header-toolbar .fi-icon-btn-badge-ctn { top: 2px !important; inset-inline-end: 0 !important; }
.fi-panel-admin .fi-ta-header-toolbar .fi-icon-btn-badge-ctn .fi-badge { min-height: 16px; min-width: 16px; height: 16px; padding: 0 4px !important; font-size: 10px !important; border-radius: 8px !important; background: #E6EEF8 !important; color: var(--d-blue) !important; border: 0 !important; letter-spacing: 0 !important; }

/* ---------- status tags: TKT green, OHD amber, OHD CNX grey, CNX red-grey, RF violet ---------- */
.fi-panel-admin .fi-badge { border-radius: 6px !important; font-size: 11.5px !important; font-weight: 600 !important; line-height: 1 !important; min-height: 23px; padding: 0 8px !important; letter-spacing: 0 !important; text-transform: none !important;
    border: 1px solid transparent; box-shadow: none !important; --tw-ring-color: transparent !important; white-space: nowrap; }
.fi-panel-admin .fi-badge * { color: inherit !important; font-size: inherit !important; letter-spacing: inherit !important; }
/* the long role names of Users wrap instead of pushing Edit out of the card */
.fi-panel-admin .fi-ta-cell-role :is(.fi-ta-text, .fi-ta-text-item, .fi-ta-text-item-label) { white-space: normal !important; }
.fi-panel-admin .fi-ta-cell-role .fi-ta-text { min-width: 200px; max-width: 290px; }
.fi-panel-admin .fi-badge.fi-color-success { background: #E8F6EC !important; color: #1F6F43 !important; border-color: #C7E6D1 !important; }
.fi-panel-admin .fi-badge.fi-color-warning { background: #FDF3E3 !important; color: #8A5A12 !important; border-color: #F1D6A6 !important; }
.fi-panel-admin .fi-badge.fi-color-danger { background: #FDECEC !important; color: #9B2C2C !important; border-color: #F3C9C9 !important; }
.fi-panel-admin .fi-badge:is(.fi-color-info, .fi-color-primary) { background: #E9F1FB !important; color: #1F4E8C !important; border-color: #C9DAF0 !important; }
.fi-panel-admin .fi-badge.fi-color-gray { background: #F1F4F8 !important; color: #5B677C !important; border-color: #DCE3EC !important; }
.fi-panel-admin [data-tag] .fi-badge { letter-spacing: .02em !important; }
.fi-panel-admin [data-tag="tkt"] .fi-badge { background: #E8F6EC !important; color: #1F6F43 !important; border-color: #C7E6D1 !important; }
.fi-panel-admin [data-tag="ohd"] .fi-badge { background: #FDF3E3 !important; color: #8A5A12 !important; border-color: #F1D6A6 !important; }
.fi-panel-admin [data-tag="ohdcnx"] .fi-badge { background: #F1F4F8 !important; color: #5B677C !important; border-color: #DCE3EC !important; }
.fi-panel-admin [data-tag="cnx"] .fi-badge { background: #F8EFEF !important; color: #8E3F3F !important; border-color: #EDD5D5 !important; }
.fi-panel-admin [data-tag="rf"] .fi-badge { background: #EFEDF8 !important; color: #4B3F8F !important; border-color: #D9D4F0 !important; }
.fi-panel-admin [data-tag="alert"] .fi-badge { background: #FDECEC !important; color: #9B2C2C !important; border-color: #F3C9C9 !important; }
.fi-panel-admin [data-tag="wait"] .fi-badge { background: #E9F1FB !important; color: #1F4E8C !important; border-color: #C9DAF0 !important; }

/* ---------- pagination ---------- */
.fi-panel-admin .fi-pagination { padding: 12px 20px 12px 22px !important; min-height: 58px; background: #FBFCFD; border-top: 1px solid var(--d-line) !important; font-size: 13px; color: var(--d-muted); }
.fi-panel-admin .fi-pagination-overview { font-size: 13px !important; color: var(--d-muted) !important; }
.fi-panel-admin .fi-pagination-items { box-shadow: none !important; background: transparent !important; gap: 6px; --tw-ring-color: transparent !important; border: 0 !important; }
.fi-panel-admin .fi-pagination-item { border: 0 !important; }
.fi-panel-admin .fi-pagination-item-btn { min-width: 34px; height: 34px; padding: 0 6px !important; border-radius: 8px !important; border: 1px solid #DCE3EC !important; background: #fff !important; display: grid; place-items: center; }
.fi-panel-admin .fi-pagination-item-label { color: var(--d-ink2) !important; font-weight: 500 !important; font-size: 13px !important; }
.fi-panel-admin .fi-pagination-item-btn :is(svg, .fi-icon) { color: var(--d-ink2) !important; width: 15px; height: 15px; }
.fi-panel-admin .fi-pagination-item.fi-active .fi-pagination-item-btn { background: var(--d-navy) !important; border-color: var(--d-navy) !important; }
.fi-panel-admin .fi-pagination-item.fi-active .fi-pagination-item-label { color: #fff !important; font-weight: 600 !important; }
.fi-panel-admin .fi-pagination-item.fi-disabled .fi-pagination-item-btn :is(svg, .fi-icon) { color: #C2CBD8 !important; }
.fi-panel-admin .fi-pagination .fi-input-wrp { height: 34px; min-height: 34px !important; }
.fi-panel-admin .fi-pagination .fi-select-input { height: 31px !important; padding-block: 0 !important; line-height: 31px !important; }

/* ---------- sections: white cards, the head tinted 7% with an icon square ---------- */
.fi-panel-admin .fi-section:not(.fi-section-not-contained) { --c: var(--d-blue); background: #fff !important; border: 1px solid var(--d-line) !important; border-radius: 12px !important; box-shadow: none !important; --tw-ring-color: transparent !important; overflow: hidden; }
.fi-panel-admin .fi-section:not(.fi-section-not-contained) > .fi-section-header { background: color-mix(in srgb, var(--c) 7%, white) !important; border-bottom: 1px solid color-mix(in srgb, var(--c) 16%, white) !important; padding: 0 20px !important; min-height: 50px; display: flex; align-items: center; gap: 12px; }
.fi-panel-admin .fi-section:not(.fi-section-not-contained).fi-collapsed > .fi-section-header { border-bottom: 0 !important; }
.fi-panel-admin .fi-section:not(.fi-section-not-contained) > .fi-section-content-ctn { border: 0 !important; box-shadow: none !important; background: transparent !important; border-radius: 0 !important; }
.fi-panel-admin .fi-section-header-heading { font-size: 14px !important; font-weight: 600 !important; color: var(--c, var(--d-ink)) !important; letter-spacing: 0 !important; font-family: inherit !important; text-transform: none !important; }
.fi-panel-admin .fi-section-header-heading::before { content: none !important; }
.fi-panel-admin .fi-section-header-description { font-size: 12.5px !important; color: color-mix(in srgb, var(--c, var(--d-blue)) 55%, #64748B) !important; }
/* the icon square: the section's own icon, or a plain one when it has none */
.fi-panel-admin .fi-section:not(.fi-section-not-contained) > .fi-section-header > .fi-icon:first-child,
.fi-panel-admin .fi-section:not(.fi-section-not-contained) > .fi-section-header > svg:first-child { width: 26px !important; height: 26px !important; padding: 6px; border-radius: 7px; background: var(--c); color: #fff !important; flex: none; }
.fi-panel-admin .fi-section:not(.fi-section-not-contained) > .fi-section-header:not(:has(> .fi-icon:first-child, > svg:first-child))::before {
    content: ""; flex: none; width: 26px; height: 26px; border-radius: 7px; background-color: var(--c);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6h11M9 12h11M9 18h11'/%3E%3Ccircle cx='4.5' cy='6' r='.6'/%3E%3Ccircle cx='4.5' cy='12' r='.6'/%3E%3Ccircle cx='4.5' cy='18' r='.6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: 14px;
}
.fi-panel-admin .fi-section:not(.fi-section-not-contained):not(.fi-divided) > .fi-section-content-ctn > .fi-section-content { padding: 18px 20px !important; }
.fi-panel-admin .fi-section-footer { border-color: var(--d-line) !important; background: #FBFCFD; padding: 12px 20px !important; }
/* sections in turn: blue, teal, violet, amber, green (the Find style B head colours) */
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+2) > .fi-sc-component > .fi-section,
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+2) > .fi-section { --c: var(--d-teal); }
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+3) > .fi-sc-component > .fi-section,
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+3) > .fi-section { --c: var(--d-violet); }
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+4) > .fi-sc-component > .fi-section,
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+4) > .fi-section { --c: var(--d-amber); }
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+5) > .fi-sc-component > .fi-section,
.fi-panel-admin .fi-sc > .fi-grid-col:nth-child(5n+5) > .fi-section { --c: var(--d-green); }
.fi-panel-admin .fi-section .fi-section:not(.fi-section-not-contained) { --c: var(--d-blue); }
.fi-panel-admin .fi-in-entry-label, .fi-panel-admin .fi-in-entry-wrp-label, .fi-panel-admin .fi-in-entry-label * { font-size: 12.5px !important; color: var(--d-muted) !important; font-weight: 500 !important; }
.fi-panel-admin :is(.fi-in-text, .fi-in-text-item) { font-size: 13.5px !important; color: var(--d-ink); }
/* stats widgets (where a page has them): calm tiles */
.fi-panel-admin .fi-wi-stats-overview-stat { background: #fff !important; border: 1px solid var(--d-line) !important; border-radius: 12px !important; box-shadow: none !important; --tw-ring-color: transparent !important; }
.fi-panel-admin .fi-wi-stats-overview-stat-label { font-size: 13px !important; color: var(--d-ink2) !important; font-weight: 500 !important; }
.fi-panel-admin .fi-wi-stats-overview-stat-value { font-size: 24px !important; font-weight: 500 !important; color: var(--d-navy) !important; letter-spacing: -.015em; }

/* ---------- forms ---------- */
.fi-panel-admin :is(.fi-fo-field-label-content, .fi-fo-field-wrp-label span) { font-size: 13px !important; font-weight: 500 !important; color: var(--d-ink2) !important; }
.fi-panel-admin .fi-fo-field-label-required-mark, .fi-panel-admin .fi-fo-field-wrp-label sup { color: var(--d-red) !important; }
.fi-panel-admin .fi-main .fi-input-wrp, .fi-panel-admin .fi-modal .fi-input-wrp, .fi-panel-admin .fi-dropdown-panel .fi-input-wrp {
    background: #fff !important; border: 1.5px solid var(--d-field) !important; border-radius: 9px !important; box-shadow: none !important; min-height: 38px; --tw-ring-color: transparent !important; }
.fi-panel-admin :is(.fi-main, .fi-modal, .fi-dropdown-panel) .fi-input-wrp:focus-within { border-color: var(--d-blue) !important; box-shadow: 0 0 0 3px color-mix(in srgb, var(--d-blue) 14%, transparent) !important; }
.fi-panel-admin :is(.fi-main, .fi-modal) .fi-input-wrp.fi-disabled { background: #F6F8FB !important; }
.fi-panel-admin :is(.fi-main, .fi-modal, .fi-dropdown-panel) .fi-input-wrp :is(.fi-input, .fi-select-input, input, select, textarea) { font-size: 13.5px !important; color: var(--d-ink) !important; border: 0 !important; box-shadow: none !important; background: transparent !important; }
.fi-panel-admin :is(.fi-main, .fi-modal) .fi-input-wrp :is(input, textarea)::placeholder { color: var(--d-muted2) !important; }
.fi-panel-admin :is(.fi-main, .fi-modal, .fi-dropdown-panel) .fi-input-wrp-prefix, .fi-panel-admin :is(.fi-main, .fi-modal, .fi-dropdown-panel) .fi-input-wrp-suffix { border: 0 !important; background: transparent !important; }
.fi-panel-admin :is(.fi-main, .fi-modal, .fi-dropdown-panel) .fi-input-wrp :is(.fi-input-wrp-prefix, .fi-input-wrp-suffix) :is(svg, .fi-icon) { color: #7B889C !important; }
.fi-panel-admin :is(.fi-fo-field-wrp-helper-text, .fi-fo-field-wrp-hint, .fi-sc-text) { font-size: 12.5px !important; color: var(--d-muted) !important; }
.fi-panel-admin .fi-fo-field-wrp-error-message { font-size: 12.5px !important; color: var(--d-red) !important; }
.fi-panel-admin .fi-checkbox-input:checked, .fi-panel-admin .fi-radio-input:checked { background-color: var(--d-blue) !important; border-color: var(--d-blue) !important; }
.fi-panel-admin .fi-toggle.fi-toggle-on, .fi-panel-admin button.fi-toggle.fi-color-primary.fi-toggle-on { background-color: var(--d-green) !important; }
.fi-panel-admin .fi-fo-repeater-item { border-radius: 12px !important; border: 1px solid var(--d-line) !important; box-shadow: none !important; }
.fi-panel-admin .fi-fo-repeater-item-header { background: color-mix(in srgb, var(--d-blue) 6%, white); border-radius: 12px 12px 0 0; }

/* ---------- buttons: small, filled, deep quiet colours (Find style B) ---------- */
.fi-panel-admin .fi-btn { border-radius: 8px !important; font-size: 13px !important; font-weight: 600 !important; gap: 8px !important; box-shadow: 0 1px 2px rgba(11, 26, 49, .22) !important; border: 0 !important; letter-spacing: 0 !important; text-transform: none !important; font-family: inherit !important; min-height: 36px; padding: 0 14px !important; transform: none; }
.fi-panel-admin .fi-btn::after, .fi-panel-admin .fi-btn::before { content: none !important; }
.fi-panel-admin .fi-btn:hover { filter: brightness(1.1); }
.fi-panel-admin .fi-btn :is(svg, .fi-icon) { width: 16px !important; height: 16px !important; opacity: .9; }
.fi-panel-admin .fi-btn:is(.fi-size-sm, .fi-size-xs) { min-height: 30px; padding: 0 12px !important; font-size: 12.5px !important; border-radius: 7px !important; gap: 6px !important; }
.fi-panel-admin .fi-btn:is(.fi-size-sm, .fi-size-xs) :is(svg, .fi-icon) { width: 14px !important; height: 14px !important; }
.fi-panel-admin .fi-btn.fi-color-primary:not(.fi-outlined) { background: var(--d-navy) !important; color: #fff !important; }
.fi-panel-admin .fi-btn.fi-color-success:not(.fi-outlined) { background: var(--d-green) !important; color: #fff !important; }
.fi-panel-admin .fi-btn.fi-color-warning:not(.fi-outlined) { background: var(--d-amber) !important; color: #fff !important; }
.fi-panel-admin .fi-btn.fi-color-danger:not(.fi-outlined) { background: var(--d-red) !important; color: #fff !important; }
.fi-panel-admin .fi-btn.fi-color-info:not(.fi-outlined) { background: var(--d-blue) !important; color: #fff !important; }
.fi-panel-admin .fi-btn:is(.fi-color-primary, .fi-color-success, .fi-color-warning, .fi-color-danger, .fi-color-info):not(.fi-outlined) :is(svg, .fi-icon, span, .fi-btn-label) { color: #fff !important; }
.fi-panel-admin .fi-btn.fi-color-gray:not(.fi-outlined) { background: #fff !important; color: #44526A !important; box-shadow: inset 0 0 0 1.5px #CBD5E1 !important; }
.fi-panel-admin .fi-btn.fi-color-gray:not(.fi-outlined):hover { background: #F6F8FB !important; filter: none; }
.fi-panel-admin .fi-btn.fi-color-gray:not(.fi-outlined) :is(svg, .fi-icon, span) { color: #44526A !important; }
.fi-panel-admin .fi-btn.fi-outlined { background: #fff !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, currentColor 30%, white) !important; }
.fi-panel-admin .fi-btn.fi-outlined.fi-color-primary { color: var(--d-navy) !important; }
.fi-panel-admin .fi-btn.fi-outlined.fi-color-danger { color: var(--d-red) !important; }
.fi-panel-admin .fi-btn.fi-outlined.fi-color-success { color: var(--d-green) !important; }
.fi-panel-admin .fi-btn.fi-outlined :is(svg, .fi-icon, span) { color: inherit !important; }
.fi-panel-admin .fi-btn:disabled, .fi-panel-admin .fi-btn[disabled] { opacity: .55; filter: none; }
.fi-panel-admin .fi-fo-toggle-buttons-input:not(:checked) + .fi-btn { background: #fff !important; color: #24324A !important; box-shadow: inset 0 0 0 1px #CBD5E1 !important; }
.fi-panel-admin .fi-fo-toggle-buttons-input:not(:checked) + .fi-btn :is(svg, .fi-icon, span) { color: #44526A !important; }
.fi-panel-admin .fi-fo-toggle-buttons-input:checked + .fi-btn { background: var(--d-navy) !important; color: #fff !important; }
/* link actions in tables (View, Issue, Edit…): the deep colours, no capitals */
.fi-panel-admin :is(.fi-link, .fi-ac-link-action) { font-size: 13px !important; font-weight: 600 !important; color: var(--d-blue) !important; gap: 5px !important; text-transform: none !important; letter-spacing: 0 !important; }
.fi-panel-admin :is(.fi-link, .fi-ac-link-action) :is(svg, .fi-icon) { width: 15px !important; height: 15px !important; color: inherit !important; }
.fi-panel-admin :is(.fi-link, .fi-ac-link-action) span { color: inherit !important; }
.fi-panel-admin :is(.fi-link, .fi-ac-link-action).fi-color-success { color: var(--d-green) !important; }
.fi-panel-admin :is(.fi-link, .fi-ac-link-action).fi-color-warning { color: var(--d-amber) !important; }
.fi-panel-admin :is(.fi-link, .fi-ac-link-action).fi-color-danger { color: var(--d-red) !important; }
.fi-panel-admin :is(.fi-link, .fi-ac-link-action).fi-color-gray { color: #52607A !important; }
.fi-panel-admin .fi-icon-btn { border-radius: 8px !important; }
.fi-panel-admin .fi-main .fi-icon-btn:not(.fi-color-danger) { color: #7B889C !important; }
.fi-panel-admin .fi-main .fi-icon-btn:hover { background: #F1F4F8 !important; color: var(--d-navy) !important; }

/* ---------- drop-downs and windows ---------- */
.fi-panel-admin .fi-dropdown-panel { border-radius: 10px !important; border: 1px solid var(--d-line) !important; box-shadow: 0 14px 34px -14px rgba(11, 26, 49, .35) !important; --tw-ring-color: transparent !important; }
.fi-panel-admin .fi-dropdown-list { padding: 6px !important; }
.fi-panel-admin .fi-dropdown-list-item { border-radius: 7px !important; font-size: 13.5px !important; padding: 8px 10px !important; gap: 10px !important; }
.fi-panel-admin .fi-dropdown-list-item-label { font-size: 13.5px !important; color: var(--d-ink) !important; font-weight: 500 !important; }
.fi-panel-admin .fi-dropdown-list-item :is(svg, .fi-icon) { color: #7B889C !important; width: 17px !important; height: 17px !important; }
.fi-panel-admin .fi-dropdown-list-item:hover, .fi-panel-admin .fi-dropdown-list-item:focus-visible { background: #F1F4F8 !important; }
.fi-panel-admin .fi-dropdown-list-item.fi-active, .fi-panel-admin .fi-dropdown-list-item.fi-selected { background: color-mix(in srgb, var(--d-blue) 8%, white) !important; }
.fi-panel-admin .fi-dropdown-list-item.fi-active .fi-dropdown-list-item-label, .fi-panel-admin .fi-dropdown-list-item.fi-active :is(svg, .fi-icon) { color: var(--d-blue) !important; }
.fi-panel-admin .fi-dropdown-list-item.fi-color-danger .fi-dropdown-list-item-label, .fi-panel-admin .fi-dropdown-list-item.fi-color-danger :is(svg, .fi-icon) { color: var(--d-red) !important; }
.fi-panel-admin .fi-dropdown-list-item .fi-badge { min-height: 20px; font-size: 11px !important; }
.fi-panel-admin .fi-dropdown-header { font-size: 13px !important; }
.fi-panel-admin .fi-modal-window { border-radius: 14px !important; box-shadow: 0 30px 60px -24px rgba(11, 26, 49, .45) !important; --tw-ring-color: transparent !important; }
.fi-panel-admin .fi-modal-header { padding: 18px 22px 10px !important; }
.fi-panel-admin .fi-modal-heading { font-size: 17px !important; font-weight: 600 !important; color: var(--d-navy) !important; font-family: inherit !important; letter-spacing: -.005em !important; }
.fi-panel-admin .fi-modal-description { font-size: 13px !important; color: var(--d-muted) !important; }
.fi-panel-admin .fi-modal-icon-bg { background: color-mix(in srgb, var(--d-blue) 9%, white) !important; }
.fi-panel-admin .fi-modal-icon-bg.fi-color-danger { background: #FDECEC !important; }
.fi-panel-admin .fi-modal-footer { padding: 14px 22px 18px !important; }
.fi-panel-admin .fi-modal-close-overlay { background: rgba(11, 26, 49, .45) !important; }
.fi-panel-admin .fi-no-notification { border-radius: 12px !important; }

/* ---------- report pages (Statement, Transactions, Bookings report, Credit report, Commission, My sales) ---------- */
/* the row of report tabs: the same white strip joined under the title card as the list tabs */
.fi-panel-admin .fi-page-header-main-ctn:has(.fi-page-content > .fz-report-tabs) > .fi-header { border-radius: 16px 16px 0 0 !important; box-shadow: none !important; }
.fi-panel-admin .fi-page-content > .fz-report-tabs { margin: -22px 0 0 !important; }
.fi-panel-admin .fz-report-tabs .fi-tabs { background: #fff !important; border: 0 !important; border-top: 1px solid var(--d-line) !important; border-radius: 0 0 16px 16px !important; box-shadow: var(--d-hero-shadow) !important;
    padding: 0 20px 0 22px !important; height: 54px; align-items: stretch; width: 100%; max-width: none; }
.fi-panel-admin .fz-report-tabs .fi-tabs-item { padding: 0 14px !important; height: 54px; }
/* the period form: one white card */
.fi-panel-admin .fi-page-content .fz-noprint:has(> form) { background: #fff; border: 1px solid var(--d-line); border-radius: 12px; padding: 18px 20px; }
.fi-panel-admin .fi-page-content .fz-noprint:has(> form) .fz-row { border-top: 1px solid var(--d-line2); padding-top: 14px; margin-top: 14px !important; gap: 8px !important; }
/* tiles: calm, no coloured edges, no capitals */
.fi-panel-admin .fz-cards { gap: 0 !important; background: #fff; border: 1px solid var(--d-line); border-radius: 12px; overflow: hidden; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important; }
.fi-panel-admin .fz-card { background: #fff !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; padding: 16px 20px 18px !important; box-shadow: inset -1px 0 0 var(--d-line2), inset 0 -1px 0 var(--d-line2) !important; }
.fi-panel-admin .fz-card::before, .fi-panel-admin .fz-card::after { content: none !important; display: none !important; }
.fi-panel-admin .fz-card .fz-label, .fi-panel-admin .fz-label { font-size: 13px !important; font-weight: 500 !important; color: var(--d-ink2) !important; }
.fi-panel-admin .fz-card .fz-value, .fi-panel-admin .fz-value { font-size: 22px !important; font-weight: 500 !important; color: var(--d-navy) !important; letter-spacing: -.015em !important; margin-top: 8px !important; font-family: inherit !important; }
.fi-panel-admin .fz-card .br-note, .fi-panel-admin .fz-card .fz-muted { font-size: 12.5px !important; color: var(--d-muted) !important; }
.fi-panel-admin .br-cards .br-total, .fi-panel-admin .fz-card.br-total { background: color-mix(in srgb, var(--d-blue) 7%, white) !important; }
.fi-panel-admin .br-cards .br-total :is(.fz-label, .br-note) { color: color-mix(in srgb, var(--d-blue) 70%, #64748B) !important; }
.fi-panel-admin .br-cards .br-total .fz-value { color: var(--d-blue) !important; font-weight: 600 !important; }
.fi-panel-admin .fz-muted { color: var(--d-muted) !important; }
.fi-panel-admin .fz-neg { color: var(--d-red) !important; }
.fi-panel-admin .fz-pos { color: var(--d-green) !important; }
/* report tables */
.fi-panel-admin .fz-table { font-size: 13.5px !important; border-collapse: collapse; }
.fi-panel-admin .fz-table thead th { background: color-mix(in srgb, var(--d-blue) 6%, white) !important; color: #3F5677 !important; font-size: 12.5px !important; font-weight: 600 !important; border-bottom: 1px solid color-mix(in srgb, var(--d-blue) 14%, white) !important; padding: 11px 14px !important; }
.fi-panel-admin .fz-table td { border-color: var(--d-line2) !important; padding: 11px 14px; font-size: 13px; }
.fi-panel-admin .fz-table tbody tr:nth-child(even) td, .fi-panel-admin .st-rows .fz-table tbody tr:nth-child(even) { background: transparent !important; }
.fi-panel-admin .fz-table tbody tr:hover, .fi-panel-admin .fz-table tbody tr:hover td { background: var(--d-hover) !important; }
.fi-panel-admin .fz-table tfoot td { background: #FBFCFD !important; border-top: 1px solid var(--d-line) !important; font-weight: 600 !important; }
.fi-panel-admin :is(.fz-rep, .fz-st, .fz-tbl, .br-table) :is(td, th) { font-size: 13px; }
.fi-panel-admin .br-sub, .fi-panel-admin .cr-sub, .fi-panel-admin .st-by, .fi-panel-admin .cr-code { color: var(--d-muted) !important; font-size: 12px !important; }
.fi-panel-admin .br-h { font-size: 14px !important; font-weight: 600 !important; color: var(--d-navy) !important; }
.fi-panel-admin .br-chip, .fi-panel-admin .cr-flag { border-radius: 6px !important; font-size: 11.5px !important; font-weight: 600 !important; padding: 2px 8px !important; }
.fi-panel-admin .br-issued { background: #E9F1FB !important; color: var(--d-blue) !important; }
.fi-panel-admin .br-cancelled { background: #F8EFEF !important; color: #8E3F3F !important; }
.fi-panel-admin .br-changed { background: #FDF3E3 !important; color: var(--d-amber) !important; }
.fi-panel-admin .br-st-ok { background: #E8F6EC !important; color: var(--d-green) !important; }
.fi-panel-admin .br-st-part, .fi-panel-admin .cr-low { background: #FDF3E3 !important; color: var(--d-amber) !important; }
.fi-panel-admin .br-st-off { background: #F1F4F8 !important; color: #5B677C !important; }
.fi-panel-admin .br-st-wait { background: #E9F1FB !important; color: var(--d-blue) !important; }
.fi-panel-admin .cr-negative { background: #FDECEC !important; color: var(--d-red) !important; }
.fi-panel-admin .br-fx-notes { border-radius: 10px !important; font-size: 12.5px !important; padding: 10px 14px !important; background: color-mix(in srgb, var(--d-amber) 7%, white) !important; color: var(--d-amber) !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--d-amber) 18%, white); }
.fi-panel-admin .br-fx-notes.open { background: color-mix(in srgb, var(--d-red) 7%, white) !important; color: var(--d-red) !important; box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--d-red) 18%, white); }
.fi-panel-admin a.cr-link, .fi-panel-admin a.st-doc, .fi-panel-admin .fz-table a.cr-link { color: var(--d-blue) !important; }
/* statement: the head strip and the invoice line */
.fi-panel-admin .st-head .t { font-size: 16px !important; font-weight: 600 !important; color: var(--d-navy) !important; }
.fi-panel-admin .st-head .s { font-size: 12.5px !important; color: var(--d-muted) !important; }
.fi-panel-admin .st-strip { border-radius: 12px !important; border-color: var(--d-line) !important; background: #fff !important; }
.fi-panel-admin .st-strip > div { border-color: var(--d-line) !important; padding: 12px 16px !important; }
.fi-panel-admin .st-strip span, .fi-panel-admin .st-inv-sums span { font-size: 12.5px !important; font-weight: 500 !important; color: var(--d-muted) !important; text-transform: none !important; letter-spacing: 0 !important; }
.fi-panel-admin .st-strip b { font-size: 17px !important; font-weight: 600 !important; color: var(--d-navy) !important; }
.fi-panel-admin .st-strip > .close { background: color-mix(in srgb, var(--d-blue) 7%, white) !important; }
.fi-panel-admin .st-strip > .close b { color: var(--d-blue) !important; }
.fi-panel-admin .st-inv-sums b { font-weight: 600 !important; color: var(--d-navy); }
.fi-panel-admin .st-k { border-radius: 6px !important; font-weight: 600 !important; font-size: 11.5px !important; }
/* transactions page (tx-*) */
.fi-panel-admin .tx { font-size: 13px !important; --tx-link: var(--d-blue); --tx-head: var(--d-ink); --tx-line: var(--d-line); --tx-stripe: transparent; }
.fi-panel-admin .tx-card { border-radius: 12px !important; border-color: var(--d-line) !important; }
.fi-panel-admin .tx-f { font-size: 12.5px !important; font-weight: 500 !important; color: var(--d-ink2) !important; }
.fi-panel-admin .tx-f :is(input, select) { height: 38px !important; border: 1.5px solid var(--d-field) !important; border-radius: 9px !important; font-size: 13.5px !important; }
.fi-panel-admin .tx-btn { height: 38px !important; border-radius: 8px !important; border: 0 !important; font-size: 13px !important; box-shadow: 0 1px 2px rgba(11, 26, 49, .22); }
.fi-panel-admin :is(.tx-go, .tx-dl) { background: var(--d-blue) !important; }
.fi-panel-admin .tx-reset { background: var(--d-red) !important; }
.fi-panel-admin .tx-table th { background: color-mix(in srgb, var(--d-blue) 6%, white); color: #3F5677 !important; font-weight: 600 !important; font-size: 12.5px; }
.fi-panel-admin .tx-table td { padding: 9px 10px !important; border-top: 1px solid var(--d-line2); }
.fi-panel-admin .tx-table tbody tr:nth-child(odd) td { background: transparent !important; }
.fi-panel-admin .tx-table tbody tr:hover td { background: var(--d-hover) !important; }

/* ---------- Find reservation style B: already this language; a few joins ---------- */
.fi-panel-admin .fv { font-size: 13.5px; }
.fi-panel-admin .fv-find { background: #fff; border: 1px solid var(--d-line); border-radius: 12px; padding: 14px 16px; align-items: center !important; }
.fi-panel-admin .fv-find .fi-input-wrp { min-height: 42px !important; }
.fi-panel-admin .fv-find .fi-btn.fi-btn { min-height: 42px; padding: 0 20px !important; background: var(--d-blue) !important; }
.fi-panel-admin .fv-find .fi-input-wrp input.fi-input { outline: 0 !important; border: 0 !important; height: 40px; min-width: 0; border-radius: 0; font-weight: 500; }
.fi-panel-admin .fv-ht { font-size: 14px !important; letter-spacing: 0 !important; text-transform: none !important; }
.fi-panel-admin :is(.fv-facts dt, .fv-lbl, .fv-gl, .fv-pc .grid span, .fv-kpi span, .fv-anc-tile span) { text-transform: none !important; letter-spacing: 0 !important; font-size: 12.5px !important; font-weight: 500 !important; }
.fi-panel-admin .fv-tbl th { text-transform: none !important; letter-spacing: 0 !important; font-size: 12.5px !important; font-weight: 600 !important; }
.fi-panel-admin .fv-eyebrow { text-transform: none !important; letter-spacing: 0 !important; font-size: 12.5px !important; font-weight: 500 !important; }
.fi-panel-admin .fv-pill { text-transform: none !important; letter-spacing: .02em !important; font-size: 12px !important; }
.fi-panel-admin .fv .fv-a .fi-btn { min-height: 38px; }
.fi-panel-admin .fv { --fv-obal-y: -90px; }   /* the office balance chip sits inside the navy hero, on the right */
.fi-panel-admin .fv-obal { margin-inline-end: 36px; }
.fi-panel-admin .fi-page:has(.fv-obal-row) .fi-header::after { background-position: right 260px center; }   /* the balance chip sits on the right */

/* ---------- class board (Class control) ---------- */
.fi-panel-admin .fz-board { background: #fff !important; border: 1px solid var(--d-line) !important; border-radius: 12px !important; box-shadow: none !important; overflow: hidden; padding: 0 !important; }
.fi-panel-admin .fz-board-hd { background: color-mix(in srgb, var(--d-violet) 7%, white) !important; border-bottom: 1px solid color-mix(in srgb, var(--d-violet) 16%, white) !important; padding: 12px 20px !important; margin: 0 !important; }
.fi-panel-admin .fz-board-hd { display: flex; align-items: center; gap: 12px; }
.fi-panel-admin .fz-board-hd::before {
    content: ""; flex: none; width: 26px; height: 26px; border-radius: 7px; background-color: var(--d-violet);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='6' height='6' rx='1.2'/%3E%3Crect x='14' y='4' width='6' height='6' rx='1.2'/%3E%3Crect x='4' y='14' width='6' height='6' rx='1.2'/%3E%3Crect x='14' y='14' width='6' height='6' rx='1.2'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: center; background-size: 14px; }
.fi-panel-admin .fz-board-hd h3 { font-size: 14px !important; font-weight: 600 !important; color: var(--d-violet) !important; text-transform: none !important; letter-spacing: 0 !important; }
.fi-panel-admin .fz-board-hd p { font-size: 12.5px !important; color: var(--d-muted) !important; }
.fi-panel-admin .fz-board-row { padding: 10px 20px !important; border-color: var(--d-line2) !important; }
.fi-panel-admin .fz-board-row .lbl { font-size: 13px !important; font-weight: 600 !important; color: var(--d-ink2) !important; text-transform: none !important; letter-spacing: 0 !important; }
.fi-panel-admin .fz-board .k { border-radius: 7px !important; font-weight: 600 !important; box-shadow: none !important; }
.fi-panel-admin .fz-board .k.open { background: #E8F6EC !important; color: var(--d-green) !important; border: 1px solid #C7E6D1 !important; }
.fi-panel-admin .fz-board .k.closed { background: #FDECEC !important; color: var(--d-red) !important; border: 1px solid #F3C9C9 !important; }
.fi-panel-admin .fz-board-ft { font-size: 12.5px !important; color: var(--d-muted) !important; padding: 12px 20px !important; margin: 0 !important; border-top: 1px solid var(--d-line2); background: #FBFCFD; }

/* ---------- staff home (CalmHome widget, cd-*) ---------- */
.fi-panel-admin .cd { font-size: 13.5px; color: var(--d-ink); }
.fi-panel-admin .cd svg.cd-i { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; display: block; }
.cd-page { display: grid; gap: 22px; }
.cd-hero { border-radius: 16px; overflow: hidden; background: #fff; box-shadow: var(--d-hero-shadow); }
.cd-hero-top { position: relative; background: var(--d-hero); color: #fff; overflow: hidden; padding: 30px 36px 32px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 600px); gap: 48px; align-items: end; }
.cd-arc { position: absolute; right: 36px; top: 6px; pointer-events: none; }
.cd-greet { display: grid; gap: 6px; position: relative; z-index: 1; min-width: 0; }
.cd-eyebrow { font-size: 12.5px; font-weight: 500; color: var(--d-gold); }
.cd-greet h1 { margin: 2px 0 0; font-size: 27px; font-weight: 600; letter-spacing: -.012em; line-height: 1.2; color: #fff; }
.cd-lead { color: #B4C0D3; font-size: 13.5px; }
.cd-findbox { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr); gap: 9px; margin: 0; min-width: 0; }
.cd-greet { min-width: 0; }
.cd-findbox label { font-size: 13px; color: #B4C0D3; font-weight: 500; }
.cd-sbar { display: flex; align-items: center; height: 54px; background: #fff; border-radius: 12px; padding: 0 7px 0 18px; gap: 12px; box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .55); }
.fi-panel-admin .cd-sbar > svg.cd-i { width: 19px; height: 19px; color: #7B889C; }
.cd-sbar input { flex: 1; min-width: 0; width: 0; height: 100%; border: 0 !important; outline: 0; box-shadow: none !important; background: transparent; font: inherit; font-size: 14.5px !important; color: var(--d-ink); padding: 0; text-transform: none; }
.cd-sbar input::placeholder { color: #8A97AA; }
.cd-sbar input::-webkit-search-cancel-button { display: none; }
.cd-btn { --c: var(--d-navy); display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 38px; padding: 0 15px; border-radius: 8px; background: var(--c); color: #fff !important;
    font: inherit; font-size: 13px; font-weight: 600; line-height: 1; white-space: nowrap; border: 0; box-shadow: 0 1px 2px rgba(11, 26, 49, .22); cursor: pointer; text-decoration: none; }
.cd-btn:hover { filter: brightness(1.12); }
.fi-panel-admin .cd-btn svg.cd-i { width: 16px; height: 16px; opacity: .85; }
.cd-sbar .cd-btn { height: 40px; padding: 0 20px; border-radius: 9px; font-size: 13.5px; }
.cd-btn.sm { height: 30px; padding: 0 12px; font-size: 12.5px; gap: 6px; border-radius: 7px; }
.fi-panel-admin .cd-btn.sm svg.cd-i { width: 14px; height: 14px; }
.cd-btn.green { --c: var(--d-green); } .cd-btn.blue { --c: var(--d-blue); } .cd-btn.amber { --c: var(--d-amber); }
.cd-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.cd-kpi { padding: 20px 36px 22px; position: relative; display: grid; align-content: start; min-width: 0; }
.cd-kpi + .cd-kpi::before { content: ""; position: absolute; left: 0; top: 22px; bottom: 22px; width: 1px; background: var(--d-line); }
.cd-kpi .lab { display: flex; align-items: center; gap: 10px; font-size: 13px; font-weight: 500; color: var(--d-ink2); }
.cd-kpi .val { margin-top: 12px; font-size: 26px; font-weight: 500; color: var(--d-navy); letter-spacing: -.015em; line-height: 1.1; white-space: nowrap; }
.cd-kpi .val small { font-size: 12.5px; font-weight: 500; color: var(--d-muted); letter-spacing: 0; margin-right: 6px; }
.cd-kpi .val em { font-style: normal; font-size: 13.5px; font-weight: 500; color: var(--d-muted); letter-spacing: 0; margin-left: 6px; }
.cd-kpi .sub { margin-top: 5px; font-size: 12.5px; color: var(--d-muted); }
.cd-kpi .sub b { font-weight: 600; color: var(--d-amber); }
.cd-kpi .sub .late { color: var(--d-red); font-weight: 600; }
.cd-kpi .sub .low { color: var(--d-red); font-weight: 500; display: inline-flex; align-items: center; gap: 6px; }
.cd-kpi .sub .low::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.cd-hi { --c: var(--d-blue); width: 26px; height: 26px; border-radius: 7px; background: var(--c); color: #fff; display: grid; place-items: center; flex: none; }
.fi-panel-admin .cd-hi svg.cd-i { width: 14px; height: 14px; }
.cd .c-green { --c: var(--d-green); } .cd .c-blue { --c: var(--d-blue); } .cd .c-amber { --c: var(--d-amber); } .cd .c-teal { --c: var(--d-teal); } .cd .c-red { --c: var(--d-red); } .cd .c-violet { --c: var(--d-violet); }
.cd-two { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 24px; align-items: start; }
.cd-card { background: #fff; border: 1px solid var(--d-line); border-radius: 12px; overflow: hidden; min-width: 0; }
.cd-head { --c: var(--d-blue); display: flex; align-items: center; gap: 12px; height: 50px; padding: 0 20px; background: color-mix(in srgb, var(--c) 7%, white); border-bottom: 1px solid color-mix(in srgb, var(--c) 16%, white); }
.cd-head .t { font-weight: 600; font-size: 14px; color: var(--c); }
.cd-head .meta { margin-left: auto; font-size: 12.5px; font-weight: 500; color: color-mix(in srgb, var(--c) 60%, #64748B); white-space: nowrap; }
.cd-rows { display: grid; }
.cd-row { display: grid; align-items: center; padding: 0 20px; border-top: 1px solid var(--d-line2); color: inherit; text-decoration: none; min-width: 0; }
.cd-row:first-child { border-top: 0; }
.cd-row .cell { min-width: 0; }
.cd-wait .cd-row { grid-template-columns: minmax(0, 150px) minmax(0, 1fr) minmax(0, 128px) auto; height: 62px; gap: 16px; }
.cd-late .cd-row { grid-template-columns: minmax(0, 1fr) 108px 78px 82px; height: 51.67px; gap: 14px; }
a.cd-row:hover { background: var(--d-hover); }
.cd .p1 { font-weight: 600; color: var(--d-navy); font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd .p2 { font-size: 12.5px; color: var(--d-muted); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-rt { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; color: var(--d-navy); white-space: nowrap; }
.fi-panel-admin .cd-rt svg.cd-i { width: 13px; height: 13px; color: #9AA8BC; stroke-width: 1.9; }
.cd-web { white-space: nowrap; }
.fi-panel-admin .cd-web svg.cd-i { display: inline-block; width: 12px; height: 12px; color: #7B889C; vertical-align: -1.5px; margin-right: 5px; }
.cd .left { font-weight: 500; color: var(--d-ink); font-size: 13.5px; white-space: nowrap; }
.cd .left.urgent { color: var(--d-red); font-weight: 600; }
.cd-row .cd-btn { justify-self: end; }
.cd .price { text-align: right; font-weight: 500; color: var(--d-ink); white-space: nowrap; }
.cd .price .fz-sub { display: none; }
.cd .price.none { color: var(--d-muted2); }
.cd-tag { display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; font-weight: 600; font-size: 11.5px; line-height: 1; height: 23px; padding: 0 8px; letter-spacing: .03em; white-space: nowrap; border: 1px solid; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.cd-tag.tkt { background: #E8F6EC; color: #1F6F43; border-color: #C7E6D1; }
.cd-tag.ohd { background: #FDF3E3; color: #8A5A12; border-color: #F1D6A6; }
.cd-tag.ohdcnx { background: #F1F4F8; color: #5B677C; border-color: #DCE3EC; }
.cd-tag.cnx { background: #F8EFEF; color: #8E3F3F; border-color: #EDD5D5; }
.cd-tag.rf { background: #EFEDF8; color: #4B3F8F; border-color: #D9D4F0; }
.cd-tag.alert { background: #FDECEC; color: #9B2C2C; border-color: #F3C9C9; }
.cd-tag.wait { background: #E9F1FB; color: #1F4E8C; border-color: #C9DAF0; }
.cd-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; height: 48px; padding: 0 20px; border-top: 1px solid var(--d-line); background: #FBFCFD; font-size: 12.5px; color: var(--d-muted); }
.cd-empty { padding: 22px 20px; color: var(--d-muted); }
.cd-link { display: inline-flex; align-items: center; gap: 6px; color: var(--d-blue) !important; font-weight: 600; font-size: 13px; text-decoration: none; white-space: nowrap; }
.cd-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.fi-panel-admin .cd-link svg.cd-i { width: 15px; height: 15px; }
.cd-note, .cd-alert { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--d-ink2); padding: 0 0 0 20px; flex-wrap: wrap; }
.cd-note .dot, .cd-alert .dot { width: 22px; height: 22px; border-radius: 6px; background: #FDF3E3; color: var(--d-amber); display: grid; place-items: center; border: 1px solid #F1D6A6; flex: none; }
.fi-panel-admin :is(.cd-note, .cd-alert) .dot svg.cd-i { width: 13px; height: 13px; }
.cd-note b, .cd-alert b { font-weight: 600; color: var(--d-ink); }
.cd-note .cd-link, .cd-alert .cd-link { margin-left: 6px; }
.cd-alerts { display: grid; gap: 10px; background: #fff; border: 1px solid var(--d-line); border-radius: 12px; padding: 12px 0; }
.cd-alert.red .dot { background: #FDECEC; color: var(--d-red); border-color: #F3C9C9; }
.cd-alert.red b { color: var(--d-red); }
.cd-alert.amber b { color: var(--d-amber); }

/* ---------- second look: the same calm on every page ---------- */
/* tabs start at the left with one line under them (Filament centres them) */
.fi-panel-admin .fi-tabs { margin-inline: 0 !important; }
.fi-panel-admin .fi-sc-tabs > .fi-tabs { width: 100%; max-width: none !important; }
.fi-panel-admin .br-bar { gap: 20px; align-items: flex-end; }
.fi-panel-admin .br-bar .fi-tabs { flex: 1 1 auto; margin: 0 !important; }

/* tables: no empty rows, no "0" on the filter button (active filters still show as chips under the bar), no extra "Summary" row */
.fi-panel-admin .fi-ta-header-toolbar > .fi-ta-actions:not(:has(> *)) { display: none !important; }
.fi-panel-admin .fi-ta-filters-dropdown .fi-icon-btn-badge-ctn { display: none !important; }
.fi-panel-admin .fi-ta-summary-header-row { display: none !important; }
/* the staff Bookings price on the right, like the picture */
.fi-panel-admin .fi-ta-header-cell-sell-total { text-align: end !important; }
.fi-panel-admin .fi-ta-header-cell-sell-total :is(.fi-ta-header-cell-sort-btn, > span) { margin-inline-start: auto; justify-content: flex-end; }
.fi-panel-admin .fi-ta-cell-sell-total :is(.fi-ta-col, .fi-ta-text) { justify-content: flex-end; text-align: end; }
.fi-panel-admin .fi-ta-cell-sell-total .fi-ta-text-item { font-weight: 600; color: var(--d-navy); }
/* sums: "Total USD 1,845.30" on one line; under the Bookings price they sit on the right like the price */
.fi-panel-admin .fi-ta-text-summary { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.fi-panel-admin .fi-ta-text-summary > span:not(.fi-ta-text-summary-label) { font-weight: 600; color: var(--d-navy); font-variant-numeric: tabular-nums; }
.fi-panel-admin .fi-ta-ctn:has(.fi-ta-header-cell-sell-total) .fi-ta-summary-row td:has(.fi-ta-text-summary) .fi-ta-text-summary { justify-content: flex-end; }
.fi-panel-admin .fi-ta-ctn:has(.fi-ta-header-cell-sell-total) .fi-ta-summary-row td:has(.fi-ta-text-summary) { padding-inline-end: 0 !important; }
.fi-panel-admin .fi-ta-ctn:has(.fi-ta-header-cell-sell-total) .fi-ta-summary-row .fi-ta-text-summary { flex-wrap: nowrap; white-space: nowrap; width: 0; min-width: 100%; }

/* report tiles: as many columns as fit the count, so a row is never half empty */
.fi-panel-admin .fz-cards:where(:has(> :nth-child(3):last-child)) { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
.fi-panel-admin .fz-cards:where(:has(> :nth-child(4):last-child)) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.fi-panel-admin .fz-cards:where(:has(> :nth-child(5):last-child)) { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
.fi-panel-admin .fz-cards:where(:has(> :nth-child(7):last-child), :has(> :nth-child(8):last-child)) { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
.fi-panel-admin .fz-cards:where(:has(> :nth-child(9):last-child), :has(> :nth-child(10):last-child)) { grid-template-columns: repeat(5, minmax(0, 1fr)) !important; }
/* wide report tables (By office has 11 columns) fit the card */
.fi-panel-admin .fz-table.br-table :is(thead th, td) { padding-inline: 10px !important; }
.fi-panel-admin .fz-table.br-table :is(thead th, td):first-child { padding-inline-start: 14px !important; }
.fi-panel-admin .fz-table.br-table :is(thead th, td):last-child { padding-inline-end: 14px !important; }

/* a plain select is as tall as the others */
.fi-panel-admin :is(.fi-main, .fi-modal) .fi-fo-select-native .fi-select-input { height: 35px !important; min-height: 0 !important; padding-block: 0 !important; }
/* options of radios and tick lists in the body size */
.fi-panel-admin :is(.fi-fo-radio-label-text, .fi-fo-radio-label-text p, .fi-fo-checkbox-list-option-label, .fi-fo-checkbox-list-option) { font-size: 13.5px !important; font-weight: 400 !important; color: var(--d-ink) !important; line-height: 1.45; }
.fi-panel-admin .fi-fo-toggle + * , .fi-panel-admin .fi-fo-checkbox-label, .fi-panel-admin .fi-fo-toggle-label { font-size: 13.5px; }

/* Transactions: Reset is a quiet button, Apply the blue one */
.fi-panel-admin .tx-reset { background: #fff !important; color: #44526A !important; box-shadow: inset 0 0 0 1.5px #CBD5E1 !important; }

/* fields that sit outside any card (Notes on an office, the whole Profile form) get the white card too */
.fi-panel-admin .fi-page-content > .fi-sc > .fi-grid-col > .fi-sc-component > form.fi-sc-form:not(:has(.fi-section)) > .fi-sc:first-child {
    background: #fff; border: 1px solid var(--d-line); border-radius: 12px; padding: 18px 20px; }
.fi-panel-admin .fi-page-content > .fi-sc > .fi-grid-col > .fi-sc-component > form.fi-sc-form:has(.fi-section) .fi-sc-component:has(> .fi-fo-field):not(.fi-section *) {
    background: #fff; border: 1px solid var(--d-line); border-radius: 12px; padding: 16px 20px 18px; }
/* entries that sit outside any card (Balance, Credit limit… on an office): one white strip like the home numbers */
.fi-panel-admin .fi-page-content .fi-sc-component > div:not([class]) > .fi-grid.fi-sc:has(> .fi-grid-col .fi-in-entry):not(.fi-section *):not(.fi-modal *) {
    background: #fff; border: 1px solid var(--d-line); border-radius: 12px; padding: 16px 0 18px; gap: 0 !important; }
.fi-panel-admin .fi-page-content .fi-sc-component > div:not([class]) > .fi-grid.fi-sc:has(> .fi-grid-col .fi-in-entry):not(.fi-section *):not(.fi-modal *) > .fi-grid-col { padding-inline: 22px; }
.fi-panel-admin .fi-page-content .fi-sc-component > div:not([class]) > .fi-grid.fi-sc:has(> .fi-grid-col .fi-in-entry):not(.fi-section *):not(.fi-modal *) > .fi-grid-col + .fi-grid-col { box-shadow: inset 1px 0 0 var(--d-line); }
.fi-panel-admin .fi-page-content .fi-sc-component > div:not([class]) > .fi-grid.fi-sc:has(> .fi-grid-col .fi-in-entry):not(.fi-section *):not(.fi-modal *) .fi-in-text-item { font-size: 18px !important; font-weight: 500 !important; color: var(--d-navy) !important; }

/* Website control: the four numbers as one white strip, the waiting one in quiet amber */
.fi-panel-admin .fz-web-state { border-radius: 12px !important; border-color: var(--d-line) !important; padding: 14px 20px !important; }
.fi-panel-admin .fz-web-state b { font-size: 14px !important; font-weight: 600 !important; color: var(--d-navy); }
.fi-panel-admin .fz-web-state small { font-size: 12.5px; color: var(--d-muted); }
.fi-panel-admin .fz-web-state.on .dot { background: var(--d-green) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--d-green) 16%, white) !important; width: 10px; height: 10px; }
.fi-panel-admin .fz-web-state.off .dot { background: var(--d-red) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--d-red) 16%, white) !important; width: 10px; height: 10px; }
.fi-panel-admin .fz-web-open { color: var(--d-blue) !important; font-weight: 600 !important; font-size: 13px; }
.fi-panel-admin .fz-web-cards { gap: 0 !important; background: #fff; border: 1px solid var(--d-line); border-radius: 12px; overflow: hidden; }
.fi-panel-admin .fz-web-cards .c { border: 0 !important; border-radius: 0 !important; background: #fff !important; padding: 16px 20px 18px !important; box-shadow: inset -1px 0 0 var(--d-line2) !important; gap: 4px !important; min-width: 0; }
.fi-panel-admin .fz-web-cards .c:hover { background: var(--d-hover) !important; }
.fi-panel-admin .fz-web-cards .c.warn { background: color-mix(in srgb, var(--d-amber) 7%, white) !important; }
.fi-panel-admin .fz-web-cards .c small { font-size: 13px !important; font-weight: 500 !important; color: var(--d-ink2) !important; text-transform: none !important; letter-spacing: 0 !important; }
.fi-panel-admin .fz-web-cards .c.warn small { color: var(--d-amber) !important; }
.fi-panel-admin .fz-web-cards .c b { font-size: 22px !important; font-weight: 500 !important; color: var(--d-navy) !important; letter-spacing: -.015em; line-height: 1.25; margin-top: 4px; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
.fi-panel-admin .fz-web-cards .c em { font-size: 12.5px !important; color: var(--d-muted) !important; }

/* Live chat: the deep blue, not the old bright one */
.fi-panel-admin .lc-top button { border-color: #CBD5E1 !important; color: #44526A; font-weight: 600; }
.fi-panel-admin .lc-top button.on { background: var(--d-navy) !important; border-color: var(--d-navy) !important; color: #fff !important; }
.fi-panel-admin .lc-f button { background: var(--d-blue) !important; border-radius: 8px !important; }
.fi-panel-admin :is(.lc-l, .lc-r) { border-color: var(--d-line) !important; border-radius: 12px !important; }

/* New booking flow: the navy title card, deep blue Economy, no letter-spaced capitals */
.fi-panel-admin .fz-band { background: var(--d-hero) !important; border-radius: 16px !important; box-shadow: var(--d-hero-shadow); }
.fi-panel-admin .fz-steps2 { background: #fff !important; border-top: 1px solid var(--d-line); }
.fi-panel-admin .fz-steps2 > span:not(.dash):not(.on) { color: #52607A; }
.fi-panel-admin .fz-steps2 > span:not(.dash) { clip-path: none !important; background: transparent !important; font-size: 13px; }
.fi-panel-admin .fz-steps2 > span.on { color: var(--d-navy) !important; font-weight: 600 !important; box-shadow: inset 0 -2px 0 var(--d-blue); }
.fi-panel-admin .fz-steps2 > span.on i { background: var(--d-navy) !important; border-color: var(--d-navy) !important; color: #fff !important; }
.fi-panel-admin .fz-steps2 > span.done { color: var(--d-green) !important; }
.fi-panel-admin .fz-steps2 > span.done i { background: color-mix(in srgb, var(--d-green) 10%, white) !important; border-color: color-mix(in srgb, var(--d-green) 30%, white) !important; color: var(--d-green) !important; }
.fi-panel-admin .fz-jr-hd .nm { text-transform: none !important; letter-spacing: 0 !important; font-size: 12.5px !important; font-weight: 600 !important; color: var(--d-ink2) !important; }
.fi-panel-admin .fz-jr-hd { font-size: 12.5px !important; }
.fi-panel-admin .fz-cab small { background: var(--d-blue) !important; letter-spacing: 0 !important; font-size: 13px !important; }
.fi-panel-admin .fz-cab.business small { background: var(--d-navy) !important; color: var(--d-gold) !important; }
.fi-panel-admin .fz-cab.na small { background: #EEF1F6 !important; color: var(--d-muted) !important; }
.fi-panel-admin .fz-cab .from { text-transform: none !important; letter-spacing: 0 !important; font-size: 12px !important; color: var(--d-muted); }
.fi-panel-admin .fz-cab .seats { color: var(--d-red) !important; }
.fi-panel-admin .fz-cab b { font-variant-numeric: tabular-nums; }
.fi-panel-admin .fz-dates .v2-dp small { letter-spacing: 0 !important; font-size: 11px !important; }
.fi-panel-admin .fz-dates .v2-dp em { color: var(--d-green) !important; }
.fi-panel-admin .fz-card2 { border-color: var(--d-line) !important; border-radius: 12px !important; }
.fi-panel-admin .fz-fl-line .path .direct { color: var(--d-green) !important; letter-spacing: 0 !important; }
.fi-panel-admin .fz-fare .tag { text-transform: none !important; letter-spacing: 0 !important; font-size: 11.5px !important; border-radius: 6px !important; padding: 3px 8px !important; }
.fi-panel-admin .fz-fare:not(.best) { border-color: var(--d-line) !important; }
.fi-panel-admin .fzp-btn { background: var(--d-blue) !important; border-radius: 8px !important; font-size: 13px !important; font-weight: 600 !important; box-shadow: 0 1px 2px rgba(11, 26, 49, .22); }
.fi-panel-admin .fzp-btn:hover { filter: brightness(1.1); }
.fi-panel-admin .fz-link { color: var(--d-blue) !important; font-size: 13px !important; text-underline-offset: 3px; }

/* Find: the search card sits the usual 22px under the title card (the balance chip row has no height), the last action group fills the row */
.fi-panel-admin .fv-obal-row + .fv-find { margin-top: -18px; }
.fi-panel-admin .fv-acts.fv-groups > .fv-grp:last-child { flex-grow: 1; }
/* the flight cell: long airport names wrap instead of squeezing the flight number into two lines */
.fi-panel-admin .fv-leg { grid-template-columns: minmax(0, 1fr) minmax(104px, auto) minmax(0, 1fr); }
.fi-panel-admin .fv-leg .fv-path .fl, .fi-panel-admin .fv-leg .fv-path > span:last-child { white-space: nowrap; }

/* Office form: the tall Office card takes the left column, Balance and Commission stack on the right (no big hole) */
@media (min-width: 1024px) {
    .fi-panel-admin .fi-resource-offices:is(.fi-resource-edit-record-page, .fi-resource-create-record-page) form.fi-sc-form .fi-grid.fi-sc:has(> .fi-grid-col:nth-child(3) .fi-section):has(> .fi-grid-col:nth-child(2) .fi-section) { grid-template-rows: auto 1fr; align-items: start; }
    .fi-panel-admin .fi-resource-offices:is(.fi-resource-edit-record-page, .fi-resource-create-record-page) form.fi-sc-form .fi-grid.fi-sc:has(> .fi-grid-col:nth-child(3) .fi-section):has(> .fi-grid-col:nth-child(2) .fi-section) > .fi-grid-col:first-child { grid-row: span 2; }
}

/* ---------- narrow screens ---------- */
@media (max-width: 1100px) {
    .cd-hero-top { grid-template-columns: minmax(0, 1fr); gap: 22px; }
    .cd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .cd-kpi:nth-child(3)::before { display: none; }
    .cd-two { grid-template-columns: 1fr; }
}
@media (max-width: 1023px) {
    .fi-panel-admin .fi-topbar { padding-inline: 12px !important; }
    .fi-panel-admin .fi-main { padding: 18px 16px 40px !important; }
    .fi-panel-admin .fi-header { padding: 18px 20px !important; flex-wrap: wrap !important; }
    .fi-panel-admin .fi-header::after { display: none !important; }
    .fi-panel-admin .fi-header-heading { font-size: 22px !important; }
    .fi-panel-admin .fv-obal-row { height: auto; margin-bottom: 12px; }
    .fi-panel-admin .fv-obal { transform: none; margin-inline-end: 0; }
    .fi-panel-admin .fi-resource-list-records-page:has(.fi-page-content > .fi-sc > .fi-grid-col:first-child .fi-sc-tabs) .fi-page-content > .fi-sc > .fi-grid-col:nth-child(2) .fi-ta-ctn > .fi-ta-main > .fi-ta-header-ctn > .fi-ta-header-toolbar:not(:has(.fi-ta-actions > *)) {
        position: static; height: auto; padding: 10px 16px !important; background: #fff !important; }
    .fi-panel-admin .fi-resource-list-records-page:has(.fi-page-content > .fi-sc > .fi-grid-col:first-child .fi-sc-tabs) .fi-ta-header-toolbar .fi-ta-search-field { width: auto; }
    .fi-panel-admin .fi-page-content > .fi-sc > .fi-grid-col:first-child > .fi-sc-component > .fi-sc-tabs > .fi-tabs { overflow-x: auto; padding: 0 8px !important; }
    .fi-panel-admin .fz-cards, .fi-panel-admin .fz-web-cards { grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)) !important; }
    /* the table bar: search takes the row, filter and columns stay beside it on the screen */
    .fi-panel-admin .fi-ta-header-toolbar > div:last-child { flex: 1 1 auto; min-width: 0; max-width: 100%; }
    .fi-panel-admin .fi-ta-header-toolbar .fi-ta-search-field { flex: 1 1 auto; min-width: 0; width: auto !important; max-width: none; }
}
@media (max-width: 640px) {
    .cd-hero-top { padding: 20px 18px 22px; }
    .cd-arc { display: none; }
    .cd-greet h1 { font-size: 22px; }
    .cd-kpis { grid-template-columns: 1fr 1fr; }
    .cd-kpi { padding: 14px 16px 16px; }
    .cd-kpi .val { font-size: 20px; }
    .cd-wait .cd-row { grid-template-columns: minmax(0, 1fr) auto auto; height: auto; min-height: 60px; padding: 10px 16px; gap: 12px; }
    .cd-wait .cd-row .cell:nth-child(3) { text-align: end; }
    .cd-sbar { padding-left: 14px; gap: 8px; }
    .cd-sbar .cd-btn { padding: 0 14px; }
    .cd-wait .cd-row .cell:nth-child(2) { display: none; }
    .cd-late .cd-row { grid-template-columns: minmax(0, 1fr) auto auto; height: auto; padding: 10px 16px; }
    .cd-late .cd-row .cell:nth-child(2) { display: none; }
    .cd-note, .cd-alert { padding: 0 12px; }
    /* the home search: the Find button keeps its magnifier only, so the whole hint fits */
    .fi-panel-admin .cd-sbar > svg.cd-i { display: none; }
    .cd-sbar { padding-left: 16px; }
    .cd-sbar .cd-btn { font-size: 0; gap: 0; width: 46px; padding: 0; }
    .fi-panel-admin .cd-sbar .cd-btn svg.cd-i { width: 18px; height: 18px; opacity: 1; }
    .cd-sbar input { font-size: 14px !important; }
    .fi-panel-admin .fz-cards, .fi-panel-admin .fz-web-cards { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
    .fi-panel-admin .fz-card { padding: 12px 14px 14px !important; }
    .fi-panel-admin .fz-card .fz-value, .fi-panel-admin .fz-web-cards .c b { font-size: 18px !important; }
    .fi-panel-admin .fz-web-cards .c { padding: 12px 14px 14px !important; }
    .fi-panel-admin .fi-page-content .fi-sc-component > div:not([class]) > .fi-grid.fi-sc:has(> .fi-grid-col .fi-in-entry):not(.fi-section *):not(.fi-modal *) { padding: 6px 0; }
    .fi-panel-admin .fi-page-content .fi-sc-component > div:not([class]) > .fi-grid.fi-sc:has(> .fi-grid-col .fi-in-entry):not(.fi-section *):not(.fi-modal *) > .fi-grid-col { padding: 10px 16px; }
    .fi-panel-admin .fi-page-content .fi-sc-component > div:not([class]) > .fi-grid.fi-sc:has(> .fi-grid-col .fi-in-entry):not(.fi-section *):not(.fi-modal *) > .fi-grid-col + .fi-grid-col { box-shadow: inset 0 1px 0 var(--d-line2); }
    .fi-panel-admin .br-bar { flex-wrap: wrap; }
}

/* ---------- print: no navy, no top bar ---------- */
@media print {
    .fi-panel-admin .fi-topbar-ctn { display: none !important; }
    .fi-panel-admin .fi-header { background: none !important; color: #000 !important; box-shadow: none !important; padding: 0 !important; min-height: 0; }
    .fi-panel-admin .fi-header::after { display: none !important; }
    .fi-panel-admin .fi-header-heading { color: #000 !important; }
    .fi-panel-admin .fi-main { max-width: none !important; padding: 0 !important; }
}