/* Admin overrides on top of Tabler. Keep minimal. */
.nav-item-header { pointer-events: none; }

/* Per-page "What this is" help box -- auto-injected by the layout from the PageHelp registry.
   Only shown while Help mode is on (the "?" toggle in the top bar). */
.adm-pagehelp { display: none; position: relative; background: #eff6ff; border: 1px solid #dbeafe; border-left: 4px solid #3b82f6;
    border-radius: 0 8px 8px 0; padding: 12px 40px 12px 14px; margin-bottom: 1rem; }
body.help-on .adm-pagehelp { display: block; }
.adm-pagehelp-title { font-weight: 500; color: #1e40af; }
.adm-pagehelp-body { font-size: 13px; color: #1e3a5f; line-height: 1.6; }
.adm-pagehelp-body code { background: #dbeafe; color: #1e3a5f; padding: 0 4px; border-radius: 4px; }
.adm-pagehelp-x { position: absolute; top: 10px; right: 10px; }

/* Block-toolbar "AI" control -- purple so AI actions read as distinct from the
   neutral (grey) editing/template tools. Matches the purple AI accent used elsewhere. */
.rt-ai-toggle { color: #534AB7; background: #EEEDFE; border: 1px solid #AFA9EC; }
.rt-ai-toggle:hover, .rt-ai-toggle:focus, .rt-ai-toggle.show { color: #3C3489; background: #CECBF6; border-color: #7F77DD; }
.rt-ai-group .dropdown-menu .dropdown-item i { color: #7F77DD; }

/* -- Admin design tokens ------------------------------------------------------
   Single source of truth for the admin's semantic colours/shape. Layered on top
   of Tabler's own --tblr-* vars. Tune values HERE rather than hardcoding hex in
   page markup or scattered rules. The status-* pairs (bg + fg) are each chosen
   for >=4.5:1 contrast (WCAG AA) and drive the .adm-chip status component below. */
:root {
    --adm-text-muted: #5a6270;   /* muted labels/hints (AA on white) */
    --adm-link:       #1c64c4;   /* link / link-button blue (AA on white) */
    --adm-accent:     #206bc4;   /* admin accent (Tabler primary) -- used for hovers/active chrome */
    --adm-border:     var(--tblr-border-color, #dadfe5);
    --adm-radius:     .375rem;
    --adm-radius-pill: 999px;

    --adm-status-published-bg: #e6f6ec; --adm-status-published-fg: #1a7f43;
    --adm-status-draft-bg:     #fdf3d8; --adm-status-draft-fg:     #8a6d1a;
    --adm-status-pending-bg:   #ffe9d6; --adm-status-pending-fg:   #b45309;
    --adm-status-scheduled-bg: #e2eefb; --adm-status-scheduled-fg: #1c64c4;
    --adm-status-expired-bg:   #fde2e2; --adm-status-expired-fg:   #b42318;
    --adm-status-muted-bg:     #eceef1; --adm-status-muted-fg:     #4a5160;
}

/* Accessibility: bump a few Tabler defaults that fail WCAG AA contrast (4.5:1).
   Now driven by the tokens above. */
.page-pretitle { color: var(--adm-text-muted) !important; }   /* was too light grey on white */
.btn-link { color: var(--adm-link) !important; }              /* link buttons need darker blue */
.nav-tabs .nav-link { color: #4a5160; }                       /* inactive tab labels */
.text-secondary { color: var(--adm-text-muted) !important; }  /* generic muted text used as labels/hints */
.badge.bg-secondary { background-color: #525e70 !important; } /* white-on-secondary needs >=4.5:1 */

/* -- Status chip --------------------------------------------------------------
   Consistent status pill used across admin lists/editors (page & post approval,
   visibility, publish window...). One look everywhere; colours come from tokens.
   Usage: <span class="adm-chip adm-chip--pending">Pending</span> */
.adm-chip {
    display: inline-flex; align-items: center; gap: .25rem;
    padding: .125rem .5rem; border-radius: var(--adm-radius-pill);
    font-size: .6875rem; font-weight: 600; line-height: 1.5;
    text-transform: uppercase; letter-spacing: .02em; white-space: nowrap;
    background: var(--adm-status-muted-bg); color: var(--adm-status-muted-fg);
}
.adm-chip--published { background: var(--adm-status-published-bg); color: var(--adm-status-published-fg); }
.adm-chip--draft     { background: var(--adm-status-draft-bg);     color: var(--adm-status-draft-fg); }
.adm-chip--pending   { background: var(--adm-status-pending-bg);   color: var(--adm-status-pending-fg); }
.adm-chip--scheduled { background: var(--adm-status-scheduled-bg); color: var(--adm-status-scheduled-fg); }
.adm-chip--expired   { background: var(--adm-status-expired-bg);   color: var(--adm-status-expired-fg); }
.adm-chip--muted     { background: var(--adm-status-muted-bg);     color: var(--adm-status-muted-fg); }

/* -- Content Tree Picker (searchable hierarchical dropdown) ----------------- */
.ctp { position: relative; }
.ctp-toggle { width: 100%; cursor: pointer; }
.ctp-label { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctp-panel {
    position: absolute; z-index: 1050; left: 0; right: 0; top: calc(100% + 2px);
    background: #fff; border: 1px solid var(--tblr-border-color, #dadfe5); border-radius: .375rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.12); padding: .5rem;
}
.ctp-search { margin-bottom: .375rem; }
.ctp-list { list-style: none; margin: 0; padding: 0; max-height: 18rem; overflow-y: auto; }
/* "New page" action pinned under the list. */
.ctp-foot { margin-top: .375rem; padding-top: .375rem; border-top: 1px solid var(--tblr-border-color, #e6e9ee); }
.ctp-newpage { display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .5rem; border-radius: .25rem;
    color: var(--tblr-primary, #206bc4); font-weight: 600; text-decoration: none; font-size: .875rem; }
.ctp-newpage:hover { background: var(--tblr-primary, #206bc4); color: #fff; }
.ctp-item {
    padding: .25rem .5rem; border-radius: .25rem; cursor: pointer; line-height: 1.3;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.ctp-item.is-active { background: var(--tblr-primary, #066fd1); color: #fff; }
.ctp-item.is-selected { font-weight: 600; }
.ctp-item.is-selected::after { content: " ✓"; color: var(--tblr-success, #2fb344); }
.ctp-item.is-active.is-selected::after { color: #fff; }

/* -- Theme families: Original anchors the left, clones flow right ------------ */
.theme-family { scrollbar-width: thin; }
.theme-original { border-left: 3px solid var(--tblr-secondary, #6c757d); }
.theme-original.border-primary { border-left-color: var(--tblr-primary, #066fd1); }

/* Sticky "Save" bar on long editor forms -- stays put while scrolling. */
/* Floating "Save" button (corner FAB) -- no full-width bar, so it never writes over page content. */
.cms-save-fab { position: fixed; right: 1.5rem; bottom: 1.5rem; z-index: 1030;
    border-radius: 999px; padding: .55rem 1.15rem; box-shadow: 0 6px 20px rgba(0,0,0,.22); }

/* Page-editor block-setting popovers (shape divider, section, animation, control list) are Bootstrap dropdowns
   at z-index 1000 -- below the floating Save FAB (1030), which would otherwise cover one opened near it. Lift them. */
.block-editor .dropdown-menu { z-index: 1040; }

/* Add-on store -- master-detail (Layout 3): a searchable list on the left, a live preview + details on the right. */
.addon-browser { min-height: 26rem; }
.addon-list { max-height: 34rem; overflow-y: auto; }
.addon-group-h { position: sticky; top: 0; z-index: 1; padding: .4rem .75rem; font-size: .7rem; font-weight: 700;
    letter-spacing: .04em; text-transform: uppercase; color: var(--adm-text-muted, #5a6270);
    background: var(--tblr-bg-surface-secondary, #f5f7fa); border-bottom: .5px solid var(--tblr-border-color, #e6e9ee); }
.addon-row { display: flex; align-items: center; width: 100%; text-align: left; border: 0; background: none;
    padding: .55rem .75rem; border-bottom: .5px solid var(--tblr-border-color, #e6e9ee); cursor: pointer; }
.addon-row:hover { background: var(--tblr-bg-surface-secondary, #f5f7fa); }
.addon-row.is-active { background: #eef4fb; box-shadow: inset 3px 0 0 var(--tblr-primary, #206bc4); }
.addon-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-left: .35rem; }
.addon-dot.is-installed { background: var(--tblr-green, #2fb344); }
.addon-dot.is-available { background: #b4b8bd; }
.addon-dot.is-structural { background: var(--tblr-blue, #4299e1); }
/* The preview iframe gets a generous, viewport-relative height so it uses the available space instead of a
   short fixed box with white space below. The embedded preview page centres itself to fill whatever height
   the iframe has, so a short placeholder shows no scrollbar -- only a genuinely tall preview scrolls. */
.addon-detail { padding: 1.1rem 1.25rem; }
.addon-detail-empty { color: var(--adm-text-muted, #5a6270); text-align: center; padding: 4rem 1rem; }
.addon-detail-prev { width: 100%; height: clamp(20rem, 58vh, 44rem); border: 1px solid var(--tblr-border-color, #e6e9ee);
    border-radius: 10px; background: #fff; }
@media (max-width: 991.98px) { .addon-list { max-height: 18rem; } }

/* Product category multi-select tree. */
.cat-tree .cat-row { display: flex; align-items: center; gap: .4rem; }
.cat-tree .cat-row .form-check-input { margin-top: 0; }
.prod-manage .list-group-item { padding-top: .6rem; padding-bottom: .6rem; }

/* Theme Layout editor -- declutter the toolbar's token-insert buttons (CSS-only, no markup change). The 7 token
   buttons shrink to small grey "chips" so they read as one compact insert-cluster instead of seven full-size
   buttons, and an "Insert:" label is shown before the first one. */
.card-header .btn-list .token {
    font-size: .72rem; padding: .15rem .5rem; line-height: 1.3; color: #51607a;
    background: #f1f3f5; border: 1px solid #e4e7eb; border-radius: 6px; box-shadow: none;
}
.card-header .btn-list .token:hover { background: #e6eaef; color: #1a2230; border-color: #cfd6de; }
.card-header .btn-list .token:first-of-type { margin-left: .15rem; }
.card-header .btn-list .token:first-of-type::before {
    content: "Insert:"; font-weight: 600; color: #8a94a6; margin-right: .4rem;
    text-transform: uppercase; font-size: .66rem; letter-spacing: .03em;
}

/* Media Library toolbar: keep the search + upload controls a uniform height so the Search and Upload
   buttons line up even when the native file input renders taller than the other inputs. */
.media-toolbar .form-control,
.media-toolbar .form-select,
.media-toolbar .btn { height: 38px; }
.media-toolbar input[type="file"].form-control { padding-top: .35rem; line-height: 1.5; }

/* Floating Save (admin detail/edit pages) -- fixed bottom-right; mirrors the form's real Save button. */
.adm-floating-save {
    position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 1030;
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .7rem 1.25rem; border: 0; border-radius: 999px;
    background: var(--adm-success, #2fb344); color: #fff; font-weight: 600; font-size: .95rem;
    box-shadow: 0 6px 20px rgba(16,24,40,.25); cursor: pointer;
    transition: transform .06s ease, filter .12s ease, box-shadow .12s ease;
}
.adm-floating-save:hover { filter: brightness(1.05); box-shadow: 0 8px 26px rgba(16,24,40,.3); }
.adm-floating-save:active { transform: translateY(1px); box-shadow: inset 0 2px 5px rgba(0,0,0,.2); }
.adm-floating-save .ti { font-size: 1.15rem; }
@media print { .adm-floating-save { display: none; } }

/* Menu search: add-on results sit on the normal row background (same as nav results); only the "Add Ons"
   sub-label is recoloured so they're identifiable without washing out the row. */
#adminMenuResultsList .adm-search-addon .small { color: #4dabf7; font-weight: 600; opacity: 1; }

/* -- Command palette (Ctrl/Cmd-K) ------------------------------------------- */
#cmdk { position: fixed; inset: 0; z-index: 2000; background: rgba(15,23,42,.5); display: flex; align-items: flex-start; justify-content: center; padding-top: 11vh; }
#cmdk[hidden] { display: none; }
#cmdk .cmdk-box { width: 92%; max-width: 600px; background: var(--tblr-bg-surface, #fff); border: 1px solid var(--tblr-border-color, #e6e7e9); border-radius: 14px; box-shadow: 0 24px 60px rgba(0,0,0,.35); overflow: hidden; }
#cmdk .cmdk-top { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid var(--tblr-border-color, #e6e7e9); }
#cmdk .cmdk-search { font-size: 20px; color: var(--tblr-secondary, #6b7280); }
#cmdk-input { flex: 1; border: 0; padding: 4px 0; font-size: 16px; outline: none; background: transparent; color: inherit; }
#cmdk .cmdk-kbd { font-size: 11px; color: var(--tblr-secondary, #6b7280); border: 1px solid var(--tblr-border-color, #e6e7e9); border-radius: 6px; padding: 2px 7px; white-space: nowrap; }
#cmdk-list { list-style: none; margin: 0; padding: 8px; max-height: 56vh; overflow: auto; }
#cmdk-list .cmdk-grp { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--tblr-secondary, #9ca3af); padding: 10px 12px 4px; cursor: default; }
#cmdk-list li[data-i] { display: flex; align-items: center; gap: 12px; padding: 8px 12px; border-radius: 8px; cursor: pointer; }
#cmdk-list li.on { background: #eef2ff; }
#cmdk-list .cmdk-ic { width: 30px; height: 30px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; border-radius: 8px; background: rgba(79,70,229,.1); color: #4f46e5; font-size: 17px; }
#cmdk-list li.on .cmdk-ic { background: #fff; }
#cmdk-list .cmdk-l { font-weight: 500; flex: 1 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--tblr-body-color, #1f2937); }
#cmdk-list li.on .cmdk-l { color: #312e81; }
#cmdk-list .cmdk-sub { font-size: 12px; color: var(--tblr-secondary, #6b7280); margin-left: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 45%; }
#cmdk-list li.on .cmdk-sub { color: #6366f1; }
#cmdk-list .cmdk-none { color: var(--tblr-secondary, #6b7280); padding: 16px 12px; cursor: default; }
#cmdk .cmdk-foot { display: flex; align-items: center; gap: 16px; padding: 9px 16px; border-top: 1px solid var(--tblr-border-color, #e6e7e9); font-size: 11px; color: var(--tblr-secondary, #6b7280); }
#cmdk .cmdk-foot-r { margin-left: auto; }

/* "Start from a layout" picker -- shown in the block list on an empty/new page so first-timers get a
   starting scaffold instead of a blank canvas. Not a .card, so Sortable + serialize ignore it. */
.page-template-picker { border: 0.5px dashed var(--adm-border); border-radius: 12px; padding: 18px; background: #fbfcfd; }
.page-template-picker .ptpl-head { font-size: 1rem; font-weight: 600; }
.page-template-picker .ptpl-sub { font-size: .8rem; color: var(--adm-text-muted); margin: 2px 0 14px; }
.page-template-picker .ptpl-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; }
.ptpl-card { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; text-align: left;
    border: 0.5px solid var(--adm-border); border-radius: 10px; background: #fff; padding: 12px; cursor: pointer; transition: border-color .12s, box-shadow .12s; }
.ptpl-card:hover { border-color: var(--adm-link); box-shadow: 0 0 0 1px var(--adm-link); }
.ptpl-card .ptpl-thumb { width: 34px; height: 34px; border-radius: 8px; display: flex; align-items: center; justify-content: center;
    background: #eef2fb; color: var(--adm-link); margin-bottom: 6px; }
.ptpl-card .ptpl-thumb .ti { font-size: 1.1rem; }
.ptpl-card .ptpl-title { font-size: .85rem; font-weight: 500; }
.ptpl-card .ptpl-desc { font-size: .74rem; color: var(--adm-text-muted); line-height: 1.35; }
.ptpl-card.ptpl-blank .ptpl-thumb { background: #f1f3f5; color: var(--adm-text-muted); }

/* Quick-add palette -- press "/" (when not typing) to insert a block by name. Fast finder over the toolbar. */
.qadd-ov { position: fixed; inset: 0; z-index: 1090; background: rgba(15,23,42,.35);
    display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; }
.qadd-box { width: 100%; max-width: 30rem; background: #fff; border-radius: 12px; box-shadow: 0 12px 40px rgba(0,0,0,.28); overflow: hidden; }
.qadd-input { width: 100%; border: 0; border-bottom: 1px solid var(--adm-border); padding: 14px 16px; font-size: 1rem; outline: none; }
.qadd-list { max-height: 46vh; overflow-y: auto; padding: 6px; }
.qadd-item { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 0; background: none;
    padding: 8px 10px; border-radius: 8px; font-size: .9rem; cursor: pointer; color: var(--tblr-body-color, #1e293b); }
.qadd-item .ti { color: var(--adm-text-muted); width: 18px; text-align: center; }
.qadd-item.active, .qadd-item:hover { background: #eef2fb; }
.qadd-item.active .ti { color: var(--adm-link); }
.qadd-none { padding: 14px 16px; color: var(--adm-text-muted); font-size: .875rem; }

/* Persistent "type to add" bar under the block list -- the visible twin of the "/" palette (reuses .qadd-item/.qadd-none). */
.qadd-bar { position: relative; display: flex; align-items: center; gap: 8px; margin-top: 10px;
    border: 1px dashed var(--adm-border); border-radius: 8px; padding: 8px 12px; background: #fff; }
.qadd-bar:focus-within { border-style: solid; border-color: var(--adm-link); }
.qadd-bar-ic { color: var(--adm-link); }
.qadd-bar-input { flex: 1; border: 0; outline: none; background: none; font-size: .9rem; color: inherit; }
.qadd-bar-input::placeholder { color: var(--adm-text-muted); }
.qadd-bar-list { position: absolute; left: 0; right: 0; bottom: calc(100% + 4px); z-index: 1050;
    background: #fff; border: 0.5px solid var(--adm-border); border-radius: 10px; box-shadow: 0 -6px 24px rgba(0,0,0,.14);
    max-height: 40vh; overflow-y: auto; padding: 6px; display: none; }
.qadd-bar-list.open { display: block; }

/* Admin card headers: the bold card-title and its inline hint (card-subtitle) were running together
   ("DownloadsBrochure, course outline...") -- give the hint breathing room on the same line. */
.card-header .card-title + .card-subtitle { margin-left: .75rem; }
/* ============================================================================
   Utility classes -- inline-style cleanup (v2026.07.05.21).
   Presentation moved out of style="..." attributes across the admin views.
   Deliberately still inline in the views: JS-toggled STATE (display:none,
   visibility, progress widths) and styles computed from data (@Model.../JS).
   Single-property utilities use !important (Bootstrap convention) so they win
   exactly like the inline styles they replace.
   ==========================================================================*/
/* widths (rem) */
.adm-w-1-2r{width:1.2rem!important}.adm-w-3r{width:3rem!important}.adm-w-3-5r{width:3.5rem!important}
.adm-w-4r{width:4rem!important}.adm-w-4-5r{width:4.5rem!important}.adm-w-5r{width:5rem!important}
.adm-w-5-5r{width:5.5rem!important}.adm-w-6r{width:6rem!important}.adm-w-7r{width:7rem!important}
.adm-w-8r{width:8rem!important}.adm-w-9r{width:9rem!important}.adm-w-10-5r{width:10.5rem!important}
.adm-w-11r{width:11rem!important}.adm-w-14r{width:14rem!important}.adm-w-18r{width:18rem!important}
/* widths (px / % / misc) */
.adm-w-42{width:42px!important}.adm-w-46{width:46px!important}.adm-w-48{width:48px!important}
.adm-w-60{width:60px!important}.adm-w-64{width:64px!important}.adm-w-70{width:70px!important}
.adm-w-82{width:82px!important}.adm-w-92{width:92px!important}.adm-w-130{width:130px!important}
.adm-w-200{width:200px!important}.adm-w-260{width:260px!important}.adm-w-max{width:max-content!important}
.adm-w-1pct{width:1%!important}.adm-w-8pct{width:8%!important}.adm-w-12pct{width:12%!important}
.adm-w-34pct{width:34%!important}.adm-w-40pct{width:40%!important}.adm-w-42pct{width:42%!important}
.adm-w-46pct{width:46%!important}
/* max-widths (px) */
.adm-mw-90{max-width:90px!important}.adm-mw-130{max-width:130px!important}.adm-mw-150{max-width:150px!important}
.adm-mw-160{max-width:160px!important}.adm-mw-180{max-width:180px!important}.adm-mw-190{max-width:190px!important}
.adm-mw-200{max-width:200px!important}.adm-mw-220{max-width:220px!important}.adm-mw-240{max-width:240px!important}
.adm-mw-260{max-width:260px!important}.adm-mw-280{max-width:280px!important}.adm-mw-300{max-width:300px!important}
.adm-mw-320{max-width:320px!important}.adm-mw-340{max-width:340px!important}.adm-mw-360{max-width:360px!important}
.adm-mw-380{max-width:380px!important}.adm-mw-440{max-width:440px!important}.adm-mw-560{max-width:560px!important}
.adm-mw-720{max-width:720px!important}
/* max-widths (rem) */
.adm-mw-8r{max-width:8rem!important}.adm-mw-14r{max-width:14rem!important}.adm-mw-16r{max-width:16rem!important}
.adm-mw-17r{max-width:17rem!important}.adm-mw-18r{max-width:18rem!important}.adm-mw-20r{max-width:20rem!important}
.adm-mw-22r{max-width:22rem!important}.adm-mw-24r{max-width:24rem!important}.adm-mw-26r{max-width:26rem!important}
.adm-mw-28r{max-width:28rem!important}.adm-mw-32r{max-width:32rem!important}.adm-mw-34r{max-width:34rem!important}
.adm-mw-36r{max-width:36rem!important}.adm-mw-40r{max-width:40rem!important}.adm-mw-48r{max-width:48rem!important}
/* min-widths */
.adm-minw-0{min-width:0!important}.adm-minw-4{min-width:4px!important}.adm-minw-72{min-width:72px!important}
.adm-minw-240{min-width:240px!important}.adm-minw-300{min-width:300px!important}.adm-minw-6r{min-width:6rem!important}
.adm-minw-8r{min-width:8rem!important}.adm-minw-18r{min-width:18rem!important}.adm-minw-22r{min-width:22rem!important}
.adm-minw-24r{min-width:24rem!important}
/* heights / max-heights / scroll boxes */
.adm-h-6{height:6px!important}.adm-h-8{height:8px!important}.adm-h-200{height:200px!important}
.adm-mh-48{max-height:48px!important}.adm-mh-90{max-height:90px!important}.adm-mh-110{max-height:110px!important}
.adm-mh-120{max-height:120px!important}.adm-mh-140{max-height:140px!important}.adm-mh-160{max-height:160px!important}
.adm-minh-125em{min-height:1.25em!important}
.adm-scroll-7r{max-height:7rem;overflow:auto}.adm-scroll-9r{max-height:9rem;overflow:auto}
.adm-scroll-10r{max-height:10rem;overflow:auto}.adm-scroll-16r{max-height:16rem;overflow:auto}
.adm-scroll-18r{max-height:18rem;overflow:auto}.adm-scroll-24r{max-height:24rem;overflow:auto}
.adm-scroll-240{max-height:240px;overflow:auto}.adm-scroll-280{max-height:280px;overflow:auto}
.adm-scroll-320{max-height:320px;overflow:auto}.adm-scroll-340{max-height:340px;overflow:auto}
.adm-scroll-360{max-height:360px;overflow:auto}.adm-scroll-420{max-height:420px;overflow:auto}
.adm-scroll-38vh{max-height:38vh;overflow:auto}
.adm-pop-scroll-280{z-index:1050;max-height:280px;overflow:auto}
.adm-pop-scroll-60vh{max-height:60vh;overflow:auto;z-index:1080}
.adm-pop-menu-300{max-height:70vh;overflow:auto;min-width:300px;z-index:1080}
.adm-pop-menu-260{max-height:70vh;overflow:auto;min-width:260px;z-index:1080}
/* deploy-page recovery actions: equal-width buttons in a left column so the rows line up
   (and stay clear of the floating Save button bottom-right) */
.adm-recover-btn{min-width:16.5rem;text-align:left}
/* direction-board cells: full-height arrow rail on the left (green = can't lose live data, red = overwrites live) */
.adm-board-rail{width:44px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:1.4rem}
/* font sizes / text */
.adm-fs-3r{font-size:3rem!important}.adm-fs-2-5r{font-size:2.5rem!important}.adm-fs-2r{font-size:2rem!important}
.adm-fs-1-45r{font-size:1.45rem!important}.adm-fs-1-4r{font-size:1.4rem!important}.adm-fs-1-35r{font-size:1.35rem!important}
.adm-fs-1-25r{font-size:1.25rem!important}.adm-fs-1-2r{font-size:1.2rem!important}.adm-fs-1-05r{font-size:1.05rem!important}
.adm-fs-0-95r{font-size:.95rem!important}.adm-fs-0-85r{font-size:.85rem!important}.adm-fs-0-82r{font-size:.82rem!important}
.adm-fs-0-8r{font-size:.8rem!important}.adm-fs-0-78r{font-size:.78rem!important}.adm-fs-0-75r{font-size:.75rem!important}
.adm-fs-0-72r{font-size:.72rem!important}.adm-fs-0-65r{font-size:.65rem!important}.adm-fs-0-6r{font-size:.6rem!important}
.adm-fs-14px{font-size:14px!important}.adm-fs-13px{font-size:13px!important}.adm-fs-11px{font-size:11px!important}
.adm-fs-10px{font-size:10px!important}
.adm-op-40{opacity:.4!important}.adm-op-65{opacity:.65!important}.adm-op-80{opacity:.8!important}.adm-op-90{opacity:.9!important}
.adm-bw-2{border-width:2px!important}.adm-tt-none{text-transform:none!important}
.adm-prewrap{white-space:pre-wrap!important}.adm-pre-scroll{white-space:pre;overflow-wrap:normal;overflow-x:auto}
.adm-list-revert{list-style:revert!important}
.adm-overline{font-size:.62rem;text-transform:uppercase;letter-spacing:.04em;font-weight:700;color:#64748b;margin-bottom:.35rem}
.adm-wordmark{font-weight:800;font-size:1.1rem;letter-spacing:.04em}
.adm-stat-num{font-size:1.5rem;font-weight:800;margin-bottom:.35rem}
/* Websites-grid KPI cell that navigates (switch site + open the page behind the number). Fills the td
   (td gets p-0) so the whole cell is the click target; link affordance on hover only. */
.adm-cell-link{border:0;background:transparent;width:100%;padding:.5rem .25rem;color:var(--tblr-secondary,#6c757d);cursor:pointer;line-height:1.35}
.adm-cell-link:hover,.adm-cell-link:focus-visible{color:var(--tblr-primary,#206bc4);text-decoration:underline}
/* KPI tile that navigates: keep the card look, add link affordance on hover only. */
a.adm-stat-link{color:inherit;text-decoration:none;display:block}
a.adm-stat-link:hover,a.adm-stat-link:focus-visible{color:inherit;border-color:var(--tblr-primary,#206bc4);box-shadow:0 1px 6px rgba(24,36,55,.10);text-decoration:none}
a.adm-stat-link:hover .text-secondary{color:var(--tblr-primary,#206bc4)!important}
/* layout misc */
.adm-resize-y{resize:vertical!important}.adm-grid-span-all{grid-column:1/-1!important}
.adm-r-2{border-radius:2px!important}.adm-border-dashed{border-style:dashed!important}
.adm-border-heavy{border-width:3px!important;border-color:#dadfe5!important}
.adm-accent-left-purple{border-left:4px solid #ae3ec9!important}
.adm-mt-75{margin-top:.75rem!important}.adm-mt-15{margin-top:.15rem!important}
.adm-compact-note{margin:5px 6px 6px;line-height:1.3}
/* Sidebar identity card (brand block): version pill + site/db/user rows on a shared left edge.
   Dark-sidebar only -- colours are literal because the card never renders on a light ground. */
.adm-idcard{margin-top:10px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.09);border-radius:8px;padding:6px 8px;text-align:left}
.adm-idrow{display:flex;align-items:center;gap:8px;padding:4px 2px;min-width:0;color:rgba(255,255,255,.62);text-decoration:none;font-size:11.5px;font-weight:400;line-height:1.35}
.adm-idrow i{flex:0 0 14px;font-size:13px;opacity:.55;text-align:center}
a.adm-idrow:hover,a.adm-idrow:focus{color:#fff;text-decoration:none}
.adm-idval{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.adm-idrow-site{background:rgba(255,255,255,.06);border-radius:6px;padding:6px;color:#fff;font-weight:600;font-size:12.5px}
.adm-idrow-site i{opacity:.85}
.adm-iddot{width:7px;height:7px;border-radius:50%;background:#2fbf71;flex:0 0 7px}
.adm-idswap{margin-left:auto;opacity:.5}
.adm-idrow-site.is-override{color:#ffd43b}
.adm-idrow-site.is-override .adm-iddot{background:#ffd43b}
.adm-flex-1{flex:1 1 0%!important}.adm-flex-fill-min0{min-width:0;flex:1 1 auto}
.adm-sticky-top-2{position:sticky;top:.5rem;z-index:5}
.adm-abs-bottom-center{position:absolute;bottom:8px;left:50%;transform:translateX(-50%)}
.adm-mini-col{display:flex;flex-direction:column;gap:.25rem;min-width:8rem}
.adm-meter-bar{min-width:10rem;max-width:22rem;height:8px}
/* images / thumbs / covers */
.adm-cover-120{height:120px;object-fit:cover}.adm-cover-56{width:56px;height:56px;object-fit:cover}
.adm-cover-34{width:34px;height:34px;object-fit:cover}
.adm-cover-max160{max-width:160px;max-height:160px;object-fit:cover}
.adm-cover-mh120{max-height:120px;object-fit:cover}
.adm-cover-top-fill{object-fit:cover;object-position:top center;width:100%;height:100%}
.adm-thumb-34{height:34px;max-width:90px;object-fit:cover;border-radius:4px}
.adm-thumb-30x44{height:30px;width:44px;object-fit:cover;border-radius:4px}
.adm-thumb-30x48{height:30px;width:48px;object-fit:cover;border-radius:4px}
.adm-avatar-28{height:28px;width:28px;object-fit:cover;border-radius:3px}
.adm-avatar-34{height:34px;width:34px;object-fit:cover;border-radius:6px}
.adm-avatar-64{height:64px;width:64px;object-fit:cover;border-radius:6px;border:1px solid #e0e2e6}
.adm-icon-32{height:32px;width:32px;object-fit:contain}
.adm-flag-sm{height:1rem;width:1.4rem;object-fit:cover;border-radius:2px}
.adm-img-h90{max-height:90px;max-width:100%;border-radius:6px}
.adm-img-h56{height:56px;border-radius:6px;margin-top:.4rem}.adm-img-h48{height:48px;border-radius:6px;margin-top:.4rem}
.adm-logo-box{max-height:48px;background:#f4f5f7;padding:.25rem;border-radius:6px}
.adm-logo-box-dark{max-height:42px;background:#222;padding:4px;border-radius:6px}
.adm-logo-thumb{max-height:40px;max-width:90px;object-fit:contain;border:1px solid #e6e9ee;border-radius:6px;padding:2px}
.adm-logo-h48{height:48px;max-width:180px;object-fit:contain;background:#f6f8fa;border-radius:6px;padding:4px}
.adm-logo-h30{height:30px;max-width:110px;object-fit:contain}
.adm-fit-60vh{max-width:100%;max-height:60vh;object-fit:contain}
.adm-fit-full{max-width:100%;max-height:100%;object-fit:contain}
.adm-img-framed{max-width:100%;border-radius:8px;border:1px solid #e6e9ee}
.adm-img-320{display:block;max-width:320px;max-height:320px;border-radius:3px}
.adm-card-img-square{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px 6px 0 0}
.adm-thumb-43{aspect-ratio:4/3;background:#f1f3f5;display:flex;align-items:center;justify-content:center;overflow:hidden}
.adm-thumb-box-110{height:110px;background:#f6f6f6;display:flex;align-items:center;justify-content:center;overflow:hidden}
.adm-preview-box{background:#f1f3f5;border-radius:8px;display:flex;align-items:center;justify-content:center;min-height:220px;max-height:60vh;overflow:hidden}
.adm-preview-strip{position:relative;height:120px;overflow:hidden;background:linear-gradient(135deg,#f7f9fc,#eceff4)}
.adm-icon-125{width:1.25rem;height:1.25rem;flex:0 0 1.25rem}
.adm-sq-1-25r{width:1.25rem;height:1.25rem}.adm-icon-w-125{width:1.25rem;flex:0 0 1.25rem}
/* tints / swatches / panels */
.adm-tint-red{background:#fde8e8;color:#b42318}.adm-tint-orange{background:#fff4e5;color:#b54708}
.adm-tint-amber{background:#ffe2c2;color:#9a3412}.adm-tint-green{background:#d7f5dd;color:#15803d}
.adm-tint-grey{background:#eef0f2;color:#475467}.adm-text-slate{color:#475569!important}
.adm-swatch-blue{background:#206bc4}.adm-swatch-green{background:#2fb344}
.adm-swatch-purple{background:#ae3ec9}.adm-swatch-yellow{background:#f59f00}.adm-bg-soft{background:#eef1f5}
.adm-panel-soft{background:#f6f8fb;border:1px solid #e6e9ee}
.adm-dropzone{border:1px dashed #cbd5e1;border-radius:8px;padding:1rem;background:#fff}
.adm-dropzone-tint{border:1px dashed #cbd5e1;border-radius:8px;padding:1rem;background:#f8fafc}
.adm-dash-frame{border:1px dashed #d0d5dd;border-radius:10px;overflow:hidden}
/* skeleton loaders */
.adm-skel{height:.6rem;background:#eef2f7;border-radius:3px;margin:.3rem 0}
.adm-skel-90{width:90%}.adm-skel-80{width:80%}.adm-skel-70{width:70%}
/* iframes / frames / maps / panes */
.adm-iframe-fill{width:100%;border:0}.adm-iframe-fill-white{width:100%;border:0;background:#fff}
.adm-iframe-720{width:100%;height:720px;border:0}
.adm-iframe-70vh{width:100%;height:70vh;border:0;background:#fff}
.adm-iframe-280{width:100%;height:280px;border:0;border-radius:6px;background:#fff;display:block;margin:0 auto}
.adm-iframe-full{width:100%;height:100%;border:0;display:block}
.adm-iframe-min400{width:100%;border:0;min-height:400px;display:block;background:transparent}
.adm-frame-75vh{height:75vh;min-height:480px}
.adm-offscreen-frame{position:fixed;left:-9999px;width:1280px;height:900px;border:0}
.adm-theme-thumb-frame{position:absolute;top:0;left:0;width:1280px;height:533px;max-width:none;border:0;transform:scale(.225);transform-origin:top left;pointer-events:none}
.adm-map-320{height:320px;border:1px solid var(--tblr-border-color,#dee2e6);border-radius:8px;overflow:hidden;background:#eef2f5}
.adm-map-280{height:280px;border:1px solid #e6e8eb;border-radius:8px;overflow:hidden}
.adm-split-pane-textarea{flex:1 1 50%;resize:none;min-height:0}
.adm-split-pane-frame{flex:1 1 50%;border:0;border-left:1px solid #e6e8eb}
/* floating / positioned chrome */
.adm-fab-save{right:28px;bottom:28px;z-index:1040;border-radius:999px;padding:.75rem 1.5rem}
.adm-fab-save-sm{right:24px;bottom:24px;z-index:1060;border-radius:999px;padding:.7rem 1.4rem}
.adm-corner-badge{top:-2px;right:-4px;font-size:.6rem;line-height:1;padding:.2rem .3rem;border-radius:999px}
.adm-dropdown-panel-230{position:absolute;top:calc(100% + 4px);left:0;z-index:1060;width:230px}
.adm-carousel-next{position:absolute;right:8px;top:50%;transform:translateY(-50%);font-size:1.6rem;opacity:.85}
.adm-carousel-prev{position:absolute;left:8px;top:50%;transform:translateY(-50%);font-size:1.6rem;opacity:.85}
.adm-toast-center{z-index:2000;top:1rem;left:50%;transform:translateX(-50%);min-width:20rem;max-width:42rem}
.adm-score-circle{width:74px;height:74px;border-radius:50%;background:var(--tblr-bg-surface,#fff);display:flex;flex-direction:column;align-items:center;justify-content:center}
.adm-input-17r{width:17rem;padding-right:1.9rem}
.adm-top-0{top:0}.adm-top-50{top:50%}.adm-top-100{top:100%}

/* Grip cells rendered as .dragcell are draggable (js-grid module 9 accepts both handle classes). */
.js-grid .dragcell{cursor:grab}


/* Keyboard-shortcut chips (v2026.07.16.13). .adm-kbd-btn = the header "Ctrl K" quick-jump button:
   transparent at rest, a soft tint on hover -- the old btn-ghost-secondary hover painted a solid pill
   behind the <kbd> and made it unreadable. .adm-menu-kbd = the "Ctrl M" hint inside the dark sidebar
   search box; it hides while typing so it never overlaps the text. */
.adm-kbd-btn{border:0;background:transparent;color:var(--tblr-secondary,#6c7a91);display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .5rem}
.adm-kbd-btn:hover,.adm-kbd-btn:focus-visible{background:rgba(98,105,118,.12);color:var(--tblr-body-color,#1d273b)}
.adm-kbd-btn kbd{background:transparent;color:inherit;border:1px solid rgba(98,105,118,.35);border-radius:4px;padding:.1rem .35rem;font-size:.7rem;box-shadow:none}
.adm-menu-search{position:relative}
.adm-menu-kbd{position:absolute;right:.5rem;top:50%;transform:translateY(-50%);pointer-events:none;background:transparent;color:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.25);border-radius:4px;padding:.05rem .3rem;font-size:.65rem;box-shadow:none}
.adm-menu-search input:focus ~ .adm-menu-kbd,.adm-menu-search input:not(:placeholder-shown) ~ .adm-menu-kbd{display:none}
.adm-menu-search.input-icon input.form-control{padding-right:3.4rem}

/* Website switcher panel on the sidebar identity card (v2026.07.16.14): the yellow site row IS the
   switcher (click or Alt+W). Panel overlays the sidebar; items are full-width forms posting SwitchSite. */
.adm-idcard{position:relative}
.adm-idkbd{background:transparent;color:rgba(255,255,255,.45);border:1px solid rgba(255,255,255,.25);border-radius:4px;padding:.05rem .3rem;font-size:.62rem;box-shadow:none;margin-left:auto}
/* Full sidebar swap (v2026.07.16.17): the panel is a static block — opening it hides #sidebar-menu and
   this list takes the menu's place, with a "Back to menu" row on top. The hide needs !important because
   Bootstrap's .navbar-expand-lg .navbar-collapse is display:flex !important on desktop. */
.navbar-collapse.adm-menu-swapped{display:none !important}
.adm-site-panel{background:#182135;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:.25rem;margin-top:.5rem;max-height:70vh;overflow-y:auto}
.adm-site-back{color:rgba(255,255,255,.55);border-bottom:1px solid rgba(255,255,255,.12);border-radius:6px 6px 0 0;margin-bottom:.25rem}

/* AI-builder colour toggle (v2026.07.16.19): palette greys out while "the AI picks the colours" (default). */
.ab-pal-off{opacity:.45;pointer-events:none}
/* Switcher domain search: same dark chrome as the panel; the icon sits inside the field's left edge. */
.adm-site-search{position:relative;margin:.15rem .15rem .3rem}
.adm-site-search .ti-search{position:absolute;left:.55rem;top:50%;transform:translateY(-50%);color:rgba(255,255,255,.45);font-size:.85rem;pointer-events:none}
.adm-site-search input{width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.18);border-radius:6px;color:#fff;font-size:.82rem;padding:.4rem .6rem .4rem 1.7rem;outline:none}
.adm-site-search input::placeholder{color:rgba(255,255,255,.45)}
.adm-site-search input:focus{border-color:rgba(255,255,255,.4);background:rgba(255,255,255,.1)}
.adm-site-none{color:rgba(255,255,255,.5);cursor:default}
.adm-site-item{display:flex;align-items:center;width:100%;border:0;background:transparent;color:rgba(255,255,255,.8);text-align:left;padding:.45rem .6rem;border-radius:6px;font-size:.82rem;text-decoration:none}
.adm-site-item:hover,.adm-site-item:focus-visible{background:rgba(255,255,255,.08);color:#fff}
.adm-site-item.is-current{color:#ffd43b}
.adm-site-foot{border-top:1px solid rgba(255,255,255,.12);border-radius:0 0 6px 6px;margin-top:.25rem;color:rgba(255,255,255,.55)}

/* Secret inputs (API keys, secrets): masked like a password but NOT type=password, because a password
   field makes Chrome treat the card as a LOGIN form — it autofills the saved site username into the
   nearest text box and the login password into the key box, silently corrupting saved keys on Save
   (the "northerncs in the Model box / key replaced by the login password" incident, 2026-07-17).
   -webkit-text-security masks in Chrome/Edge; other browsers show plain text on this owner-only page. */
.adm-secret{-webkit-text-security:disc}