/* Lexxic Bootstrap 5 theme — CSS custom-property override
   Usage: load AFTER bootstrap.min.css (5.3+, which reads its own CSS vars).
   <link rel="stylesheet" href="bootstrap.min.css">
   <link rel="stylesheet" href="lexxic-bootstrap-theme.css">
*/
@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700;800;900&display=swap");

:root,[data-bs-theme=light]{
  --bs-font-sans-serif:"Poppins",system-ui,sans-serif;
  --bs-body-font-family:var(--bs-font-sans-serif);
  --bs-body-color:#212529;
  --bs-body-bg:#ffffff;
  --bs-emphasis-color:#0f172a;
  --bs-heading-color:#0f172a;

  --bs-primary:#4b8fd9;
  --bs-primary-rgb:75,143,217;
  --bs-primary-text-emphasis:#1c3a6b;
  --bs-primary-bg-subtle:#bcd2eb;
  --bs-primary-border-subtle:#a0b2c8;

  --bs-secondary:#7b4fa6;
  --bs-secondary-rgb:123,79,166;
  --bs-secondary-text-emphasis:#4f3369;
  --bs-secondary-bg-subtle:#ede4f5;
  --bs-secondary-border-subtle:#dfd0ec;

  --bs-success:#6bbd45;
  --bs-success-rgb:107,189,69;
  --bs-success-bg-subtle:#e6f4dc;
  --bs-success-border-subtle:#cbe9b8;
  --bs-success-text-emphasis:#3a7a20;

  --bs-warning:#f5c842;
  --bs-warning-rgb:245,200,66;
  --bs-warning-bg-subtle:#fdf6d8;
  --bs-warning-border-subtle:#f5eab8;
  --bs-warning-text-emphasis:#8a6a08;

  --bs-danger:#e8799a;
  --bs-danger-rgb:232,121,154;
  --bs-danger-bg-subtle:#fbe3ea;
  --bs-danger-border-subtle:#f5c9d6;
  --bs-danger-text-emphasis:#a13a5a;

  --bs-info:#64748b;
  --bs-info-rgb:100,116,139;
  --bs-info-bg-subtle:#f1f5f9;
  --bs-info-border-subtle:#e2e8f0;
  --bs-info-text-emphasis:#334155;

  --bs-dark:#1a1a1a;
  --bs-dark-rgb:26,26,26;
  --bs-light:#f8fafc;
  --bs-light-rgb:248,250,252;

  --bs-border-radius:12px;
  --bs-border-radius-sm:8px;
  --bs-border-radius-lg:20px;
  --bs-border-radius-pill:999px;
  --bs-border-color:#f3f4f6;
  --bs-box-shadow:0 1px 2px rgba(15,23,42,.05),0 8px 24px rgba(15,23,42,.06);
  --bs-box-shadow-sm:0 1px 2px rgba(15,23,42,.05);
  --bs-link-color:#4b8fd9;
  --bs-link-color-rgb:75,143,217;
  --bs-link-hover-color:#1c3a6b;
  --bs-link-hover-color-rgb:28,58,107;

  --bs-nav-link-padding-y:.5rem;
  --bs-nav-link-padding-x:1rem;
  --bs-nav-link-font-size:.875rem;
  --bs-nav-link-font-weight:600;

  --bs-focus-ring-color:rgba(75,143,217,.35);

  --bs-card-border-color:#f3f4f6;
  --bs-card-border-radius:12px;
  --bs-card-box-shadow:0 1px 2px rgba(15,23,42,.05),0 8px 24px rgba(15,23,42,.06);
  --bs-card-cap-bg:#fff;

  --bs-dropdown-border-color:#f3f4f6;
  --bs-dropdown-border-radius:12px;
  --bs-dropdown-box-shadow:0 4px 8px rgba(15,23,42,.06),0 16px 32px rgba(15,23,42,.10);
  --bs-dropdown-link-active-bg:#4b8fd9;
  --bs-dropdown-link-hover-bg:#f1f5f9;

  --bs-modal-border-radius:20px;
  --bs-modal-box-shadow:0 12px 40px rgba(15,23,42,.16);

  --bs-nav-tabs-link-active-border-color:#f3f4f6 #f3f4f6 #fff;
  --bs-nav-tabs-link-active-color:#4b8fd9;
  --bs-nav-pills-link-active-bg:#4b8fd9;
  --bs-nav-pills-border-radius:999px;

  --bs-list-group-border-color:#f3f4f6;
  --bs-list-group-active-bg:#4b8fd9;
  --bs-list-group-active-border-color:#4b8fd9;

  --bs-tooltip-bg:#1a1a1a;
  --bs-tooltip-border-radius:8px;

  --bs-progress-border-radius:999px;
  --bs-progress-bar-bg:#4b8fd9;

  --bs-code-color:#7b4fa6;

  --bs-dark-bg-subtle:#f3f4f6;
  --bs-dark-border-subtle:#d5d8dc;
  --bs-dark-text-emphasis:#1a1a1a;
}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-family:"Poppins",system-ui,sans-serif;font-weight:800;letter-spacing:-.02em}

/* Buttons — full pill, bold Poppins label, brand hover/press language
   (padding/font-weight/border-radius are compiled Sass values in Bootstrap's CSS, not var-driven — set directly) */
.btn{font-family:"Poppins",system-ui,sans-serif;font-weight:600;border-radius:999px;padding:.4rem .9rem;transition:filter .12s ease,transform .12s ease}
.btn-sm,.btn-group-sm>.btn{font-weight:500;padding:.3rem .7rem}
.btn-lg,.btn-group-lg>.btn{padding:.65rem 1.4rem}
.btn-xs,.btn-group-xs>.btn{font-weight:500;padding:.2rem .6rem;font-size:.75rem}
.btn:hover{filter:brightness(.92)}
.btn:active{transform:scale(.97)}
.btn:disabled,.btn.disabled{opacity:.55;filter:grayscale(.2)}
.btn-primary{--bs-btn-bg:#4b8fd9;--bs-btn-border-color:#4b8fd9;--bs-btn-hover-bg:#427ebf;--bs-btn-hover-border-color:#427ebf;--bs-btn-active-bg:#1c3a6b;--bs-btn-active-border-color:#1c3a6b}
.btn-dark{--bs-btn-bg:#1a1a1a;--bs-btn-border-color:#1a1a1a}
.btn-secondary{--bs-btn-bg:#7b4fa6;--bs-btn-border-color:#7b4fa6;--bs-btn-hover-bg:#6a4390;--bs-btn-hover-border-color:#6a4390;--bs-btn-active-bg:#4f3369;--bs-btn-active-border-color:#4f3369}
.btn-success{--bs-btn-bg:#6bbd45;--bs-btn-border-color:#6bbd45;--bs-btn-hover-bg:#5da33b;--bs-btn-hover-border-color:#5da33b;--bs-btn-active-bg:#3a7a20;--bs-btn-active-border-color:#3a7a20}
.btn-info{--bs-btn-bg:#64748b;--bs-btn-border-color:#64748b;--bs-btn-color:#fff;--bs-btn-hover-bg:#586477;--bs-btn-hover-border-color:#586477;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#334155;--bs-btn-active-border-color:#334155;--bs-btn-active-color:#fff}
.btn-warning{--bs-btn-bg:#f5c842;--bs-btn-border-color:#f5c842;--bs-btn-color:#1a1a1a;--bs-btn-hover-bg:#ddb43a;--bs-btn-hover-border-color:#ddb43a;--bs-btn-hover-color:#1a1a1a;--bs-btn-active-bg:#8a6a08;--bs-btn-active-border-color:#8a6a08;--bs-btn-active-color:#fff}
.btn-danger{--bs-btn-bg:#e8799a;--bs-btn-border-color:#e8799a;--bs-btn-color:#fff;--bs-btn-hover-bg:#d1698a;--bs-btn-hover-border-color:#d1698a;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#a13a5a;--bs-btn-active-border-color:#a13a5a;--bs-btn-active-color:#fff}
.btn-light{--bs-btn-bg:#f8fafc;--bs-btn-border-color:#f3f4f6;--bs-btn-color:#0f172a}
.btn-outline-primary{--bs-btn-color:#0f172a;--bs-btn-border-color:#4b8fd9;--bs-btn-hover-bg:#4b8fd9;--bs-btn-hover-border-color:#4b8fd9;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#4b8fd9;--bs-btn-active-border-color:#4b8fd9;--bs-btn-active-color:#fff}
.btn-outline-secondary{--bs-btn-color:#0f172a;--bs-btn-border-color:#7b4fa6;--bs-btn-hover-bg:#7b4fa6;--bs-btn-hover-border-color:#7b4fa6;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#7b4fa6;--bs-btn-active-border-color:#7b4fa6;--bs-btn-active-color:#fff}
.btn-outline-success{--bs-btn-color:#0f172a;--bs-btn-border-color:#6bbd45;--bs-btn-hover-bg:#6bbd45;--bs-btn-hover-border-color:#6bbd45;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#6bbd45;--bs-btn-active-border-color:#6bbd45;--bs-btn-active-color:#fff}
.btn-outline-info{--bs-btn-color:#0f172a;--bs-btn-border-color:#64748b;--bs-btn-hover-bg:#64748b;--bs-btn-hover-border-color:#64748b;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#64748b;--bs-btn-active-border-color:#64748b;--bs-btn-active-color:#fff}
.btn-outline-warning{--bs-btn-color:#0f172a;--bs-btn-border-color:#f5c842;--bs-btn-hover-bg:#f5c842;--bs-btn-hover-border-color:#f5c842;--bs-btn-hover-color:#1a1a1a;--bs-btn-active-bg:#f5c842;--bs-btn-active-border-color:#f5c842;--bs-btn-active-color:#1a1a1a}
.btn-outline-danger{--bs-btn-color:#0f172a;--bs-btn-border-color:#e8799a;--bs-btn-hover-bg:#e8799a;--bs-btn-hover-border-color:#e8799a;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#e8799a;--bs-btn-active-border-color:#e8799a;--bs-btn-active-color:#fff}
.btn-outline-dark{--bs-btn-color:#0f172a;--bs-btn-border-color:#1a1a1a;--bs-btn-hover-bg:#1a1a1a;--bs-btn-hover-border-color:#1a1a1a;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#1a1a1a;--bs-btn-active-border-color:#1a1a1a;--bs-btn-active-color:#fff}
[class*="btn-outline-"]{border-width:2px}
.btn-group>[class*="btn-outline-"]:not(:first-child){margin-left:-2px}
.btn-outline-primary.active,.btn-check:checked+.btn-outline-primary{background-color:#4b8fd9;border-color:#4b8fd9;color:#fff}
.btn-group>.btn.active,.btn-group>.btn:active,.btn-group-vertical>.btn.active{background-color:#4b8fd9!important;border-color:#4b8fd9!important;color:#fff!important}
.btn-group>.btn,.btn-group-vertical>.btn{border-radius:0}
.btn-group>.btn:first-child{border-top-left-radius:999px;border-bottom-left-radius:999px}
.btn-group>.btn:last-child{border-top-right-radius:999px;border-bottom-right-radius:999px}
.btn-group-vertical>.btn:first-child{border-top-left-radius:var(--bs-border-radius);border-top-right-radius:var(--bs-border-radius)}
.btn-group-vertical>.btn:last-child{border-bottom-left-radius:var(--bs-border-radius);border-bottom-right-radius:var(--bs-border-radius)}
.dropdown-toggle-split{border-top-right-radius:999px!important;border-bottom-right-radius:999px!important}
.btn-group>.btn:not(.dropdown-toggle-split):not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}
.input-group .btn{border-radius:0}
.input-group>.btn:first-child,.input-group>:first-child.btn{border-top-left-radius:999px;border-bottom-left-radius:999px}
.input-group>.btn:last-child,.input-group>:last-child.btn{border-top-right-radius:999px;border-bottom-right-radius:999px}

/* Badges — eyebrow-pill style */
.badge{font-family:"Poppins",system-ui,sans-serif;font-weight:600;letter-spacing:.05em;text-transform:uppercase;border-radius:var(--bs-border-radius-pill);font-size:.65rem;padding:.6em .85em .5em}
.text-bg-info{color:#fff!important}

/* Cards — thin border, soft shadow, optional colored top accent via .card-accent-* (base card styling now driven by --bs-card-* vars above) */
.card-header{background-color:#fff;border-bottom-color:#f3f4f6}
.card-footer{background-color:#fff;border-top-color:#f3f4f6}
.card{border-color:#f3f4f6;--bs-card-bg:#fff}
body{background-color:#f8fafc}
.toast{--bs-toast-border-color:#f3f4f6;--bs-toast-header-border-color:#f3f4f6}
.table{border-radius:var(--bs-border-radius)}
.table thead:first-child tr:first-child th:first-child,.table tbody:first-child tr:first-child td:first-child{border-top-left-radius:var(--bs-border-radius)}
.table thead:first-child tr:first-child th:last-child,.table tbody:first-child tr:first-child td:last-child{border-top-right-radius:var(--bs-border-radius)}
.table tr:last-child td:first-child{border-bottom-left-radius:var(--bs-border-radius)}
.table tr:last-child td:last-child{border-bottom-right-radius:var(--bs-border-radius)}
.table-bordered{border-color:#f3f4f6}
.card-accent-primary{border-top:3px solid #4b8fd9}
.card-accent-secondary{border-top:3px solid #7b4fa6}
.card-accent-success{border-top:3px solid #6bbd45}
.card-accent-info{border-top:3px solid #64748b}
.card-accent-danger{border-top:3px solid #e8799a}
.card-accent-warning{border-top:3px solid #f5c842}

/* Forms (--bs-form-* vars not exposed by Bootstrap for these, kept as direct rules) */
.form-control,.form-select{border-radius:var(--bs-border-radius-sm);border-color:#f3f4f6}
.form-control:focus,.form-select:focus{border-color:#4b8fd9;box-shadow:0 0 0 3px rgba(75,143,217,.35)}
.form-check-input:checked{background-color:#4b8fd9;border-color:#4b8fd9}

/* Native <select> popup menu — browser-rendered, so only a handful of
   properties are stylable at all (Chrome/Edge honor these; Firefox/Safari
   largely ignore them and fall back to their own OS-native menu chrome). */
select.form-select option{padding:8px 12px;font-family:"Poppins",system-ui,sans-serif}
select.form-select{accent-color:#4b8fd9}

/* Range slider — brand blue thumb/track instead of stock Bootstrap blue */
.form-range::-webkit-slider-thumb{background-color:#4b8fd9}
.form-range::-moz-range-thumb{background-color:#4b8fd9}
.form-range:focus::-webkit-slider-thumb{box-shadow:0 0 0 1px #fff,0 0 0 3px rgba(75,143,217,.35)}
.form-range:focus::-moz-range-thumb{box-shadow:0 0 0 1px #fff,0 0 0 3px rgba(75,143,217,.35)}

/* Navbar / footer dark surfaces */
.navbar-dark,.bg-dark{background-color:#1a1a1a!important}

/* Alerts — .alert-info uses the same neutral grey as card headers rather than
   a saturated category color, for a calmer informational tone. */
.alert-info{--bs-alert-color:#334155;--bs-alert-bg:#f1f5f9;--bs-alert-border-color:#e2e8f0}
.alert{border-top-width:3px}

/* Component-scoped overrides: Bootstrap compiles some --bs-* vars onto the
   component's own selector (not just :root), so a global var alone won't
   apply — redeclare on the same selector Bootstrap uses. */
.list-group{--bs-list-group-border-color:#f3f4f6;--bs-list-group-active-bg:#4b8fd9;--bs-list-group-active-border-color:#4b8fd9;--bs-list-group-action-hover-bg:#f1f5f9}
.list-group-item.active,.list-group-item-action.active{background-color:#4b8fd9!important;border-color:#4b8fd9!important;color:#fff!important}
.dropdown-menu{--bs-dropdown-link-active-bg:#4b8fd9;--bs-dropdown-link-active-color:#fff;--bs-dropdown-link-hover-bg:#f1f5f9}
.navbar-nav .dropdown-menu{position:absolute}
.dropdown-item.active,.dropdown-item:active{background-color:#4b8fd9!important;color:#fff!important}
.pagination{--bs-pagination-color:#4b8fd9;--bs-pagination-hover-color:#1c3a6b;--bs-pagination-active-bg:#4b8fd9;--bs-pagination-active-border-color:#4b8fd9}
.list-group-horizontal{display:flex;flex-direction:row}
.pagination{display:flex;flex-wrap:wrap}

/* App switcher — 3x2 dot grid icon button (Atlassian/Microsoft-style), brand palette */
.lexxic-app-switcher{width:40px;height:36px;padding:8px 6px 6px 8px;border:none;border-radius:var(--bs-border-radius-sm);background:transparent;display:inline-grid;grid-template-columns:repeat(3,1fr);gap:3px;cursor:pointer;align-content:center;justify-items:center}
.lexxic-app-switcher:hover,.lexxic-app-switcher[aria-expanded="true"]{background:rgba(255,255,255,.12)}
.lexxic-app-switcher span{width:6px;height:6px;border-radius:50%}
.lexxic-app-switcher span:nth-child(1){background:#4b8fd9}
.lexxic-app-switcher span:nth-child(2){background:#6bbd45}
.lexxic-app-switcher span:nth-child(3){background:#f5832a}
.lexxic-app-switcher span:nth-child(4){background:#7b4fa6}
.lexxic-app-switcher span:nth-child(5){background:#f5c842}
.lexxic-app-switcher span:nth-child(6){background:#e8799a}
.navbar-light .lexxic-app-switcher:hover,.navbar-light .lexxic-app-switcher[aria-expanded="true"]{background:rgba(0,0,0,.06)}
.progress-bar{background-color:#4b8fd9}
.nav-pills .nav-link.active,.nav-pills .show>.nav-link{background-color:#4b8fd9}

/* Breadcrumb separator — bold ">" echoing the Do-IT mark's angular form, matching the pagination arrows' visual weight */
.breadcrumb-item+.breadcrumb-item::before{content:">";font-weight:600;color:var(--bs-secondary-color,#64748b)}

/* Brand dots — static by default (footer/navbar). Add .lexxic-dots-animate for the pulse loader. */
.lexxic-dots{display:inline-flex;align-items:center;gap:6px}
.lexxic-dots span{width:9px;height:9px;border-radius:50%;display:inline-block;flex-shrink:0}
.lexxic-dots span:nth-child(1){background:#4b8fd9}
.lexxic-dots span:nth-child(2){background:#6bbd45}
.lexxic-dots span:nth-child(3){background:#f5832a}
.lexxic-dots span:nth-child(4){background:#7b4fa6}
.lexxic-dots span:nth-child(5){background:#f5c842}
.lexxic-dots span:nth-child(6){background:#e8799a}
.lexxic-dots-animate span{animation:lexxic-dot-pulse 1.2s ease-in-out infinite}
.lexxic-dots-animate span:nth-child(1){animation-delay:0s}
.lexxic-dots-animate span:nth-child(2){animation-delay:.12s}
.lexxic-dots-animate span:nth-child(3){animation-delay:.24s}
.lexxic-dots-animate span:nth-child(4){animation-delay:.36s}
.lexxic-dots-animate span:nth-child(5){animation-delay:.48s}
.lexxic-dots-animate span:nth-child(6){animation-delay:.6s}
.lexxic-dots.lexxic-dots-sm span{width:6px;height:6px}
.lexxic-dots.lexxic-dots-lg span{width:14px;height:14px}
.lexxic-dots.lexxic-dots-xl span{width:20px;height:20px}
.lexxic-dots.lexxic-dots-xxl span{width:28px;height:28px}

/* Single-dot loader variants — brand-colored alternatives to spinner-border/spinner-grow */
.lexxic-dot-single{width:14px;height:14px;border-radius:50%;display:inline-block;background:#4b8fd9}
.lexxic-dot-single-pulse{animation:lexxic-dot-pulse 1.2s ease-in-out infinite}
.lexxic-dot-single-grow{animation:lexxic-dot-single-grow 1s ease-in-out infinite}
@keyframes lexxic-dot-single-grow{0%{transform:scale(0);opacity:1}100%{transform:scale(1);opacity:0}}
.lexxic-dot-single-bounce{animation:lexxic-dot-single-bounce .8s ease-in-out infinite}
@keyframes lexxic-dot-single-bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes lexxic-dot-pulse{0%,80%,100%{transform:scale(.4);opacity:.35}40%{transform:scale(1);opacity:1}}

/* Variant: dots bounce vertically instead of scaling in place */
.lexxic-dots-bounce span{animation:lexxic-dot-bounce 1.2s ease-in-out infinite}
.lexxic-dots-bounce span:nth-child(1){animation-delay:0s}
.lexxic-dots-bounce span:nth-child(2){animation-delay:.12s}
.lexxic-dots-bounce span:nth-child(3){animation-delay:.24s}
.lexxic-dots-bounce span:nth-child(4){animation-delay:.36s}
.lexxic-dots-bounce span:nth-child(5){animation-delay:.48s}
.lexxic-dots-bounce span:nth-child(6){animation-delay:.6s}
@keyframes lexxic-dot-bounce{0%,80%,100%{transform:translateY(0)}40%{transform:translateY(-8px)}}

/* Variant: dots travel left-to-right in a wave, fading as they go */
.lexxic-dots-wave span{animation:lexxic-dot-wave 1.2s ease-in-out infinite}
.lexxic-dots-wave span:nth-child(1){animation-delay:0s}
.lexxic-dots-wave span:nth-child(2){animation-delay:.12s}
.lexxic-dots-wave span:nth-child(3){animation-delay:.24s}
.lexxic-dots-wave span:nth-child(4){animation-delay:.36s}
.lexxic-dots-wave span:nth-child(5){animation-delay:.48s}
.lexxic-dots-wave span:nth-child(6){animation-delay:.6s}
@keyframes lexxic-dot-wave{0%,100%{opacity:.25;transform:scale(.7)}50%{opacity:1;transform:scale(1.15)}}

/* Variant: single dot spins around the circle (loading-ring style), rest stay dim */
.lexxic-dots-spin{position:relative}
.lexxic-dots-spin span{animation:none;opacity:.25}
.lexxic-dots-spin span:nth-child(1){animation:lexxic-dot-spin 1.2s linear infinite}
@keyframes lexxic-dot-spin{0%,100%{opacity:.25}8.33%{opacity:1}}
.lexxic-dots-spin span:nth-child(2){animation:lexxic-dot-spin 1.2s linear infinite;animation-delay:.2s}
.lexxic-dots-spin span:nth-child(3){animation:lexxic-dot-spin 1.2s linear infinite;animation-delay:.4s}
.lexxic-dots-spin span:nth-child(4){animation:lexxic-dot-spin 1.2s linear infinite;animation-delay:.6s}
.lexxic-dots-spin span:nth-child(5){animation:lexxic-dot-spin 1.2s linear infinite;animation-delay:.8s}
.lexxic-dots-spin span:nth-child(6){animation:lexxic-dot-spin 1.2s linear infinite;animation-delay:1s}

/* Dark mode — Bootstrap 5.3's [data-bs-theme=dark] scope, aligned with the
   Lexxic NC dark palette:
     page #221f1f · surfaces (cards, menus, modals) #2c2a2a · secondary-bg #343131 · hover #383535
     borders #4e4c4c · form-control borders #8a8787 (>=3:1 non-text contrast)
     text #fff · secondary text #b0adad (6.4:1 on #2c2a2a)
     accent/links Lexxic blue #329dfb (5.0:1 on #2c2a2a, 5.7:1 on #221f1f)
     success green #79c942.
   White on #329dfb is only 2.86:1, so filled blue (and green/pink) controls use
   dark #221f1f text instead. Everything here is scoped to [data-bs-theme=dark];
   light mode is untouched. Component-level rules (.card, .list-group, .dropdown-menu,
   .pagination, ...) are redeclared because the light rules above set those vars on
   the component selector, which a :root-level dark var can't override. */
[data-bs-theme=dark]{
  color-scheme:dark;
  --bs-body-color:#fff;
  --bs-body-color-rgb:255,255,255;
  --bs-body-bg:#221f1f;
  --bs-body-bg-rgb:34,31,31;
  --bs-emphasis-color:#fff;
  --bs-emphasis-color-rgb:255,255,255;
  --bs-heading-color:#fff;
  --bs-border-color:#4e4c4c;
  --bs-border-color-translucent:rgba(255,255,255,.15);
  --bs-secondary-color:#b0adad;
  --bs-secondary-color-rgb:176,173,173;
  --bs-secondary-bg:#343131;
  --bs-secondary-bg-rgb:52,49,49;
  --bs-tertiary-color:rgba(176,173,173,.75);
  --bs-tertiary-bg:#2c2a2a;
  --bs-tertiary-bg-rgb:44,42,42;

  --bs-link-color:#329dfb;
  --bs-link-color-rgb:50,157,251;
  --bs-link-hover-color:#6db8fc;
  --bs-link-hover-color-rgb:109,184,252;
  --bs-focus-ring-color:rgba(50,157,251,.4);

  --bs-primary:#329dfb;
  --bs-primary-rgb:50,157,251;
  --bs-success:#79c942;
  --bs-success-rgb:121,201,66;
  --bs-info:#b0adad;
  --bs-info-rgb:176,173,173;

  --bs-primary-text-emphasis:#8cc6fd;
  --bs-primary-bg-subtle:#1b2d3e;
  --bs-primary-border-subtle:#1f5f99;

  --bs-secondary-text-emphasis:#c9b3e0;
  --bs-secondary-bg-subtle:#2e2536;
  --bs-secondary-border-subtle:#5b3f78;

  --bs-success-text-emphasis:#79c942;
  --bs-success-bg-subtle:#212c1b;
  --bs-success-border-subtle:#3a7a20;

  --bs-warning-text-emphasis:#f5dd8e;
  --bs-warning-bg-subtle:#362e16;
  --bs-warning-border-subtle:#8a6a08;

  --bs-danger-text-emphasis:#f3aec2;
  --bs-danger-bg-subtle:#3a2128;
  --bs-danger-border-subtle:#a13a5a;

  --bs-info-text-emphasis:#fff;
  --bs-info-bg-subtle:#2c2a2a;
  --bs-info-border-subtle:#4e4c4c;

  --bs-light-text-emphasis:#fff;
  --bs-light-bg-subtle:#383535;
  --bs-light-border-subtle:#4e4c4c;

  --bs-dark-text-emphasis:#fff;
  --bs-dark-bg-subtle:#2c2a2a;
  --bs-dark-border-subtle:#4e4c4c;

  --bs-form-valid-color:#79c942;
  --bs-form-valid-border-color:#79c942;
  --bs-form-invalid-color:#e8799a;
  --bs-form-invalid-border-color:#e8799a;

  --bs-card-border-color:#4e4c4c;
  --bs-card-cap-bg:#2c2a2a;
  --bs-dropdown-border-color:#4e4c4c;
  --bs-dropdown-link-hover-bg:#383535;
  --bs-list-group-border-color:#4e4c4c;
  --bs-list-group-action-hover-bg:#383535;
}
[data-bs-theme=dark] body{background-color:#221f1f}

/* Surfaces */
[data-bs-theme=dark] .card{border-color:#4e4c4c;--bs-card-bg:#2c2a2a;--bs-card-cap-bg:#2c2a2a;--bs-card-border-color:#4e4c4c}
[data-bs-theme=dark] .card-header{background-color:#2c2a2a;border-bottom-color:#4e4c4c}
[data-bs-theme=dark] .card-footer{background-color:#2c2a2a;border-top-color:#4e4c4c}
[data-bs-theme=dark] .card-header.bg-white,[data-bs-theme=dark] .card-footer.bg-white{background-color:#2c2a2a!important}
[data-bs-theme=dark] .card .table{--bs-table-bg:#2c2a2a}
[data-bs-theme=dark] .table-bordered{border-color:#4e4c4c}
[data-bs-theme=dark] .modal{--bs-modal-bg:#2c2a2a;--bs-modal-border-color:#4e4c4c;--bs-modal-header-border-color:#4e4c4c;--bs-modal-footer-border-color:#4e4c4c}
[data-bs-theme=dark] .toast{--bs-toast-bg:rgba(44,42,42,.95);--bs-toast-border-color:#4e4c4c;--bs-toast-header-bg:#2c2a2a;--bs-toast-header-color:#b0adad;--bs-toast-header-border-color:#4e4c4c}
[data-bs-theme=dark] .progress{--bs-progress-bg:#383535}
[data-bs-theme=dark] .progress-bar{background-color:#329dfb}

/* Forms */
[data-bs-theme=dark] .form-control,[data-bs-theme=dark] .form-select,[data-bs-theme=dark] .input-group-text{border-color:#8a8787}
[data-bs-theme=dark] .form-control:focus,[data-bs-theme=dark] .form-select:focus{border-color:#329dfb;box-shadow:0 0 0 3px rgba(50,157,251,.4)}
[data-bs-theme=dark] .form-control.bg-light{background-color:#383535!important}
[data-bs-theme=dark] select.form-select{accent-color:#329dfb}

/* Buttons — filled blue/green/pink use dark text (white on #329dfb is 2.86:1) */
[data-bs-theme=dark] .btn-primary{--bs-btn-color:#221f1f;--bs-btn-bg:#329dfb;--bs-btn-border-color:#329dfb;--bs-btn-hover-color:#221f1f;--bs-btn-hover-bg:#5cb1fc;--bs-btn-hover-border-color:#5cb1fc;--bs-btn-active-color:#221f1f;--bs-btn-active-bg:#8cc6fd;--bs-btn-active-border-color:#8cc6fd;--bs-btn-disabled-color:#221f1f;--bs-btn-disabled-bg:#329dfb;--bs-btn-disabled-border-color:#329dfb}
[data-bs-theme=dark] .btn-success{--bs-btn-color:#221f1f;--bs-btn-bg:#79c942;--bs-btn-border-color:#79c942;--bs-btn-hover-color:#221f1f;--bs-btn-hover-bg:#8fd35e;--bs-btn-hover-border-color:#8fd35e;--bs-btn-active-color:#221f1f;--bs-btn-active-bg:#a8dd8e;--bs-btn-active-border-color:#a8dd8e;--bs-btn-disabled-color:#221f1f;--bs-btn-disabled-bg:#79c942;--bs-btn-disabled-border-color:#79c942}
[data-bs-theme=dark] .btn-danger{--bs-btn-color:#221f1f;--bs-btn-hover-color:#221f1f;--bs-btn-hover-bg:#f08fab;--bs-btn-hover-border-color:#f08fab;--bs-btn-active-color:#221f1f;--bs-btn-active-bg:#f3aec2;--bs-btn-active-border-color:#f3aec2;--bs-btn-disabled-color:#221f1f}
[data-bs-theme=dark] .btn-light{--bs-btn-bg:#383535;--bs-btn-border-color:#4e4c4c;--bs-btn-color:#fff;--bs-btn-hover-bg:#4e4c4c;--bs-btn-hover-border-color:#4e4c4c;--bs-btn-hover-color:#fff;--bs-btn-active-bg:#4e4c4c;--bs-btn-active-border-color:#4e4c4c;--bs-btn-active-color:#fff}
[data-bs-theme=dark] .btn-outline-primary,[data-bs-theme=dark] .btn-outline-secondary,[data-bs-theme=dark] .btn-outline-success,[data-bs-theme=dark] .btn-outline-info,[data-bs-theme=dark] .btn-outline-warning,[data-bs-theme=dark] .btn-outline-danger,[data-bs-theme=dark] .btn-outline-dark{--bs-btn-color:#fff;--bs-btn-hover-color:#221f1f;--bs-btn-active-color:#221f1f}
[data-bs-theme=dark] .btn-outline-primary{--bs-btn-border-color:#329dfb;--bs-btn-hover-bg:#329dfb;--bs-btn-hover-border-color:#329dfb;--bs-btn-active-bg:#329dfb;--bs-btn-active-border-color:#329dfb}
[data-bs-theme=dark] .btn-outline-secondary{--bs-btn-border-color:#b48fd6;--bs-btn-hover-bg:#b48fd6;--bs-btn-hover-border-color:#b48fd6;--bs-btn-active-bg:#b48fd6;--bs-btn-active-border-color:#b48fd6}
[data-bs-theme=dark] .btn-outline-success{--bs-btn-border-color:#79c942;--bs-btn-hover-bg:#79c942;--bs-btn-hover-border-color:#79c942;--bs-btn-active-bg:#79c942;--bs-btn-active-border-color:#79c942}
[data-bs-theme=dark] .btn-outline-info{--bs-btn-border-color:#b0adad;--bs-btn-hover-bg:#b0adad;--bs-btn-hover-border-color:#b0adad;--bs-btn-active-bg:#b0adad;--bs-btn-active-border-color:#b0adad}
[data-bs-theme=dark] .btn-outline-danger{--bs-btn-border-color:#e8799a;--bs-btn-hover-bg:#e8799a;--bs-btn-hover-border-color:#e8799a;--bs-btn-active-bg:#e8799a;--bs-btn-active-border-color:#e8799a}
[data-bs-theme=dark] .btn-outline-dark{--bs-btn-border-color:#8a8787;--bs-btn-hover-bg:#fff;--bs-btn-hover-border-color:#fff;--bs-btn-active-bg:#fff;--bs-btn-active-border-color:#fff}
[data-bs-theme=dark] .btn-outline-primary.active,[data-bs-theme=dark] .btn-check:checked+.btn-outline-primary{background-color:#329dfb;border-color:#329dfb;color:#221f1f}
[data-bs-theme=dark] .btn-group>.btn.active,[data-bs-theme=dark] .btn-group>.btn:active,[data-bs-theme=dark] .btn-group-vertical>.btn.active{background-color:#329dfb!important;border-color:#329dfb!important;color:#221f1f!important}

/* Badges on bright fills get dark text in dark mode */
[data-bs-theme=dark] .badge.bg-primary,[data-bs-theme=dark] .badge.bg-success,[data-bs-theme=dark] .badge.bg-danger,[data-bs-theme=dark] .badge.bg-info{color:#221f1f}
[data-bs-theme=dark] .text-bg-primary,[data-bs-theme=dark] .text-bg-info{color:#221f1f!important}
[data-bs-theme=dark] .badge.bg-light:not(.text-dark){background-color:#383535!important}

/* Lists, menus, nav */
[data-bs-theme=dark] .list-group{--bs-list-group-bg:#2c2a2a;--bs-list-group-border-color:#4e4c4c;--bs-list-group-action-hover-bg:#383535;--bs-list-group-active-bg:#329dfb;--bs-list-group-active-border-color:#329dfb;--bs-list-group-active-color:#221f1f}
[data-bs-theme=dark] .list-group-item.active,[data-bs-theme=dark] .list-group-item-action.active{background-color:#329dfb!important;border-color:#329dfb!important;color:#221f1f!important}
[data-bs-theme=dark] .dropdown-menu{--bs-dropdown-bg:#2c2a2a;--bs-dropdown-border-color:#4e4c4c;--bs-dropdown-divider-bg:#4e4c4c;--bs-dropdown-link-color:#fff;--bs-dropdown-link-hover-color:#fff;--bs-dropdown-link-hover-bg:#383535;--bs-dropdown-link-active-bg:#329dfb;--bs-dropdown-link-active-color:#221f1f;--bs-dropdown-header-color:#b0adad}
[data-bs-theme=dark] .dropdown-item.active,[data-bs-theme=dark] .dropdown-item:active{background-color:#329dfb!important;color:#221f1f!important}
[data-bs-theme=dark] .pagination{--bs-pagination-color:#329dfb;--bs-pagination-bg:#2c2a2a;--bs-pagination-border-color:#4e4c4c;--bs-pagination-hover-color:#6db8fc;--bs-pagination-hover-bg:#383535;--bs-pagination-hover-border-color:#4e4c4c;--bs-pagination-focus-color:#6db8fc;--bs-pagination-focus-bg:#383535;--bs-pagination-active-color:#221f1f;--bs-pagination-active-bg:#329dfb;--bs-pagination-active-border-color:#329dfb;--bs-pagination-disabled-color:#b0adad;--bs-pagination-disabled-bg:#2c2a2a;--bs-pagination-disabled-border-color:#4e4c4c}
[data-bs-theme=dark] .nav-pills{--bs-nav-pills-link-active-bg:#329dfb;--bs-nav-pills-link-active-color:#221f1f}
[data-bs-theme=dark] .nav-pills .nav-link.active,[data-bs-theme=dark] .nav-pills .show>.nav-link{background-color:#329dfb;color:#221f1f}
[data-bs-theme=dark] .navbar-dark,[data-bs-theme=dark] .bg-dark{background-color:#1a1818!important}
/* Light navbars (e.g. Hub's navbar-light bg-white) stay light in dark mode so the
   dark-ink logo images stay legible. */
[data-bs-theme=dark] .navbar-light{--bs-navbar-color:rgba(0,0,0,.65);--bs-navbar-hover-color:rgba(0,0,0,.85);--bs-navbar-brand-color:#221f1f}
[data-bs-theme=dark] .navbar-light.bg-light{background-color:#f3f4f6!important}

/* Alerts — .alert-info stays neutral: white text on the surface grey */
[data-bs-theme=dark] .alert-info{--bs-alert-color:#fff;--bs-alert-bg:#2c2a2a;--bs-alert-border-color:#4e4c4c}

/* Pure-CSS tooltip/popover — no JS positioning engine, so it can't drift
   at scroll depth or under a scaled/transformed ancestor the way a
   Popper-driven tooltip can inside an embedded preview iframe. */
.lexxic-tooltip-wrap{position:relative;display:inline-block}
.lexxic-tooltip{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%) translateY(4px);background:#1a1a1a;color:#fff;font-size:.8rem;padding:.4rem .65rem;border-radius:8px;white-space:nowrap;opacity:0;visibility:hidden;transition:opacity .12s ease,transform .12s ease;pointer-events:none;z-index:10}
.lexxic-tooltip::after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border:5px solid transparent;border-top-color:#1a1a1a}
.lexxic-tooltip-wrap:hover .lexxic-tooltip{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.lexxic-popover{white-space:normal;width:220px;text-align:left;background:#fff;color:#0f172a;border:1px solid #f3f4f6;box-shadow:0 4px 8px rgba(15,23,42,.06),0 16px 32px rgba(15,23,42,.10)}
.lexxic-popover::after{border-top-color:#fff}
.lexxic-popover strong{display:block;margin-bottom:4px;font-family:"Poppins",system-ui,sans-serif}

/* Account avatar menu (Hub / Admin navbar) */
.lexxic-avatar{width:2.5rem;height:2.5rem;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:700;letter-spacing:.02em;line-height:1;background:#4b8fd9;color:#fff;flex-shrink:0;user-select:none}
.lexxic-avatar-lg{width:2.75rem;height:2.75rem;font-size:.875rem}
.lexxic-avatar-img{object-fit:cover;padding:0;background:none}
.lexxic-user-menu-toggle{padding-left:.35rem;padding-right:.35rem}
.lexxic-user-menu{min-width:17.5rem;padding:.35rem 0;border-radius:.75rem;--bs-dropdown-link-hover-bg:#f1f5f9}
.lexxic-user-menu-header{background:linear-gradient(180deg,#f8fafc 0%,#fff 100%)}
.lexxic-user-menu-status{background:#e6f4dc;color:#3a7a20;font-weight:600}
.navbar-dark .lexxic-user-menu-toggle{color:rgba(255,255,255,.9)}
.navbar-dark .lexxic-user-menu-toggle:hover,.navbar-dark .lexxic-user-menu-toggle:focus,.navbar-dark .lexxic-user-menu-toggle.show{color:#fff}
[data-bs-theme=dark] .lexxic-popover{background:#2c2a2a;color:#fff;border-color:#4e4c4c;box-shadow:0 4px 8px rgba(0,0,0,.3),0 16px 32px rgba(0,0,0,.4)}
[data-bs-theme=dark] .lexxic-popover::after{border-top-color:#2c2a2a}
[data-bs-theme=dark] .lexxic-avatar{background:#329dfb;color:#221f1f}
[data-bs-theme=dark] .lexxic-avatar-img{background:none}
[data-bs-theme=dark] .lexxic-user-menu-header{background:linear-gradient(180deg,#383535 0%,#2c2a2a 100%)}
[data-bs-theme=dark] .lexxic-user-menu{--bs-dropdown-link-hover-bg:#383535}
[data-bs-theme=dark] .lexxic-user-menu-status{background:#212c1b;color:#79c942}


/* Light/dark theme toggle (Web.Core _ThemeToggle). Fixed 2.5rem box so the icon
   swap never shifts layout. Icon, 1px border and focus ring all use currentColor,
   which inherits the header's text colour (>=4.5:1 on every header), so the control
   clears 3:1 in both themes. */
.lexxic-theme-toggle{width:2.5rem;height:2.5rem;padding:0;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;border:1px solid currentColor;border-radius:50%;background:transparent;color:var(--bs-body-color);font-size:1.05rem;line-height:1;cursor:pointer;transition:background-color .12s ease}
.lexxic-theme-toggle:hover{background:rgba(128,128,128,.15)}
.lexxic-theme-toggle:focus{outline:none}
.lexxic-theme-toggle:focus-visible{outline:2px solid currentColor;outline-offset:2px}
.lexxic-theme-toggle-sun{display:none}
[data-bs-theme=dark] .lexxic-theme-toggle-moon{display:none}
[data-bs-theme=dark] .lexxic-theme-toggle-sun{display:inline}
.navbar-light .lexxic-theme-toggle,.bg-white .lexxic-theme-toggle{color:#1a1a1a}
.navbar-dark .lexxic-theme-toggle,.bg-dark .lexxic-theme-toggle{color:#fff}
/* Corner placement for headerless pages (Identity login): fixed, so it takes no layout space */
.lexxic-theme-toggle-corner{position:fixed;top:1rem;right:1rem;z-index:1030}