/*
 * TAM Evolution brand theme (Brand System v1.0, "option A").
 *
 * Active only while <html data-brand="tam">; with data-brand="normal" this
 * file does nothing and the Modernize template renders exactly as before.
 * The platform-wide choice is made in central System Setting (see
 * src/lib/brand.ts and backend AppearanceController).
 *
 * Rules of the brand that shape this file:
 *  - Black/white/graphite carry the surfaces; red and gold are accents and
 *    together stay under ~5% of a screen. So the main colour is graphite,
 *    and red only marks focus, link hover, the selected menu item and danger.
 *  - Red accent on light, gold accent on dark.
 *  - Manrope for headings, IBM Plex Sans for text, IBM Plex Mono for codes,
 *    tabular figures in columns.
 *
 * Specificity: the template's colour presets are
 * `[data-bs-theme][data-color-theme=X]:root` (0,3,0), so every override here
 * starts from `html:root[data-brand="tam"][data-color-theme]` (0,3,1) and is
 * loaded after styles.css.
 */

/* ---------- Tokens: light ---------- */
html:root[data-brand="tam"][data-color-theme] {
  --tam-red: #e3120b;
  --tam-red-deep: #c4001a;
  --tam-gold: #f4b324;
  --tam-gold-deep: #8a6400;
  --tam-graphite: #16171a;
  --tam-slate: #2e3036;
  --tam-steel: #6a6e78;
  --tam-mist: #c8cbd1;
  --tam-cloud: #ecedf0;
  --tam-paper: #f6f6f7;
  --tam-accent: var(--tam-red);

  --bs-primary: #16171a;
  --bs-primary-rgb: 22, 23, 26;
  --bs-light-primary: #ecedf0;
  --bs-primary-bg-subtle: #ecedf0;
  --bs-primary-text-emphasis: #16171a;
  --bs-primary-border-subtle: #c8cbd1;

  --bs-secondary: #6a6e78;
  --bs-secondary-rgb: 106, 110, 120;
  --bs-light-secondary: #f6f6f7;
  --bs-secondary-bg-subtle: #f6f6f7;
  --bs-secondary-text-emphasis: #2e3036;
  --bs-secondary-border-subtle: #c8cbd1;

  --bs-success: #1f8a5b;
  --bs-success-rgb: 31, 138, 91;
  --bs-success-bg-subtle: #e4f3eb;
  --bs-success-text-emphasis: #17734b;
  --bs-success-border-subtle: #a9d8bf;

  --bs-warning: #f4b324;
  --bs-warning-rgb: 244, 179, 36;
  --bs-warning-bg-subtle: #fdf2d6;
  --bs-warning-text-emphasis: #8a6400;
  --bs-warning-border-subtle: #f6d68a;

  --bs-danger: #c4001a;
  --bs-danger-rgb: 196, 0, 26;
  --bs-danger-bg-subtle: #fbe6e8;
  --bs-danger-text-emphasis: #c4001a;
  --bs-danger-border-subtle: #f0a6b0;

  --bs-info: #2f6fb0;
  --bs-info-rgb: 47, 111, 176;
  --bs-info-bg-subtle: #e5eef7;
  --bs-info-text-emphasis: #255c94;
  --bs-info-border-subtle: #a9c5e3;

  --bs-dark: #16171a;
  --bs-dark-rgb: 22, 23, 26;
  --bs-muted: #6a6e78;
  --bs-muted-rgb: 106, 110, 120;

  --bs-font-sans-serif: "IBM Plex Sans", "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  --bs-font-monospace: "IBM Plex Mono", "SFMono-Regular", Consolas, monospace;
  --bs-body-font-family: var(--bs-font-sans-serif);
  --tam-font-display: "Manrope", "Segoe UI", "Helvetica Neue", Arial, sans-serif;

  --bs-body-color: #2e3036;
  --bs-body-color-rgb: 46, 48, 54;
  --bs-emphasis-color: #000;
  --bs-heading-color: #16171a;
  --bs-secondary-bg: #ecedf0;
  --bs-secondary-bg-rgb: 236, 237, 240;
  --bs-tertiary-bg: #f6f6f7;
  --bs-tertiary-bg-rgb: 246, 246, 247;
  --bs-border-color: #e3e5e9;
  /* The template uses the link colour for ordinary navigation text (menus,
     card titles, table names), so links stay graphite and turn red on hover. */
  --bs-link-color: #16171a;
  --bs-link-color-rgb: 22, 23, 26;
  --bs-link-hover-color: #c4001a;
  --bs-link-hover-color-rgb: 196, 0, 26;
  --bs-focus-ring-color: rgba(227, 18, 11, 0.25);
  --bs-border-radius: 8px;
  --bs-border-radius-sm: 4px;
  --bs-border-radius-lg: 12px;
}

/* ---------- Tokens: dark (gold accent on the template's dark surfaces) ---------- */
html:root[data-brand="tam"][data-color-theme][data-bs-theme="dark"] {
  --tam-accent: var(--tam-gold);

  --bs-primary: #ecedf0;
  --bs-primary-rgb: 236, 237, 240;
  --bs-light-primary: #333f55;
  --bs-primary-bg-subtle: #333f55;
  --bs-primary-text-emphasis: #ecedf0;
  --bs-primary-border-subtle: #465670;

  --bs-secondary: #8d919b;
  --bs-secondary-rgb: 141, 145, 155;
  --bs-light-secondary: #2a3447;
  --bs-secondary-bg-subtle: #2a3447;
  --bs-secondary-text-emphasis: #c8cbd1;

  --bs-success: #3cc48a;
  --bs-success-rgb: 60, 196, 138;
  --bs-success-bg-subtle: #12291f;
  --bs-success-text-emphasis: #5bd39e;
  --bs-warning-bg-subtle: #2c2410;
  --bs-warning-text-emphasis: #f4b324;
  --bs-danger: #f0524a;
  --bs-danger-rgb: 240, 82, 74;
  --bs-danger-bg-subtle: #2e1513;
  --bs-danger-text-emphasis: #ff7a72;
  --bs-info: #6aa6e8;
  --bs-info-rgb: 106, 166, 232;
  --bs-info-bg-subtle: #132235;
  --bs-info-text-emphasis: #8dbbf0;

  /* Surfaces (body, cards, borders, text) keep the template's dark palette:
     styles.css hard-codes those slate values in ~60 dark-mode rules (tables,
     inputs, editors, pickers), so replacing only some would mix two greys. */
  --bs-body-color: #7c8fac;
  --bs-body-color-rgb: 124, 143, 172;
  --bs-body-bg: #202936;
  --bs-body-bg-rgb: 32, 41, 54;
  --bs-emphasis-color: #fff;
  --bs-heading-color: #eaeff4;
  --bs-secondary-bg: #333f55;
  --bs-secondary-bg-rgb: 51, 63, 85;
  --bs-tertiary-bg: #2a3447;
  --bs-tertiary-bg-rgb: 42, 52, 71;
  --bs-border-color: #333f55;
  --bs-link-color: #ecedf0;
  --bs-link-color-rgb: 236, 237, 240;
  --bs-link-hover-color: #f4b324;
  --bs-link-hover-color-rgb: 244, 179, 36;
  --bs-focus-ring-color: rgba(244, 179, 36, 0.3);
}

/* ---------- Typography ---------- */
/* styles.css pins body (and the date range picker) to Plus Jakarta Sans with !important. */
html[data-brand="tam"] body,
html[data-brand="tam"] body .daterangepicker {
  font-family: var(--bs-body-font-family) !important;
}
html[data-brand="tam"] :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .card-title, .modal-title, .offcanvas-title) {
  font-family: var(--tam-font-display);
  letter-spacing: -0.005em;
}
html[data-brand="tam"] .table :is(td, th) {
  font-variant-numeric: tabular-nums;
}
html[data-brand="tam"] :is(code, kbd, pre, samp) {
  font-family: var(--bs-font-monospace);
}

/* ---------- Components whose colours the template compiled to literals ---------- */
html:root[data-brand="tam"][data-color-theme] .btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #16171a;
  --bs-btn-border-color: #16171a;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #2e3036;
  --bs-btn-hover-border-color: #2e3036;
  --bs-btn-focus-shadow-rgb: 227, 18, 11;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #000;
  --bs-btn-active-border-color: #000;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #6a6e78;
  --bs-btn-disabled-border-color: #6a6e78;
}
html:root[data-brand="tam"][data-color-theme][data-bs-theme="dark"] .btn-primary {
  --bs-btn-color: #000;
  --bs-btn-bg: #ecedf0;
  --bs-btn-border-color: #ecedf0;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-focus-shadow-rgb: 244, 179, 36;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #c8cbd1;
  --bs-btn-active-border-color: #c8cbd1;
  --bs-btn-disabled-color: #2e3036;
  --bs-btn-disabled-bg: #6a6e78;
  --bs-btn-disabled-border-color: #6a6e78;
}
html:root[data-brand="tam"][data-color-theme] .btn-outline-primary {
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--tam-mist);
  --bs-btn-hover-color: var(--bs-body-bg);
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: 227, 18, 11;
  --bs-btn-active-color: var(--bs-body-bg);
  --bs-btn-active-bg: var(--bs-primary);
  --bs-btn-active-border-color: var(--bs-primary);
  --bs-btn-disabled-color: var(--tam-steel);
  --bs-btn-disabled-border-color: var(--tam-mist);
}
html:root[data-brand="tam"][data-color-theme][data-bs-theme="dark"] .btn-outline-primary {
  --bs-btn-border-color: #465670;
  --bs-btn-focus-shadow-rgb: 244, 179, 36;
}
html:root[data-brand="tam"][data-color-theme] .btn-secondary {
  --bs-btn-color: #fff;
  --bs-btn-bg: #6a6e78;
  --bs-btn-border-color: #6a6e78;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #555963;
  --bs-btn-hover-border-color: #555963;
  --bs-btn-active-bg: #45484f;
  --bs-btn-active-border-color: #45484f;
  --bs-btn-disabled-bg: #6a6e78;
  --bs-btn-disabled-border-color: #6a6e78;
}
html:root[data-brand="tam"][data-color-theme] .btn-outline-secondary {
  --bs-btn-color: var(--bs-secondary-text-emphasis);
  --bs-btn-border-color: var(--tam-mist);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #6a6e78;
  --bs-btn-hover-border-color: #6a6e78;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #6a6e78;
  --bs-btn-active-border-color: #6a6e78;
}
html:root[data-brand="tam"][data-color-theme] .btn-danger {
  --bs-btn-color: #fff;
  --bs-btn-bg: #c4001a;
  --bs-btn-border-color: #c4001a;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #9a0014;
  --bs-btn-hover-border-color: #9a0014;
  --bs-btn-focus-shadow-rgb: 196, 0, 26;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #82000f;
  --bs-btn-active-border-color: #82000f;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #c4001a;
  --bs-btn-disabled-border-color: #c4001a;
}
html:root[data-brand="tam"][data-color-theme] .btn-outline-danger {
  --bs-btn-color: var(--bs-danger);
  --bs-btn-border-color: var(--bs-danger);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-danger);
  --bs-btn-hover-border-color: var(--bs-danger);
  --bs-btn-focus-shadow-rgb: 196, 0, 26;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-danger);
  --bs-btn-active-border-color: var(--bs-danger);
  --bs-btn-disabled-color: var(--bs-danger);
  --bs-btn-disabled-border-color: var(--bs-danger);
}
html:root[data-brand="tam"][data-color-theme] .btn-success {
  --bs-btn-color: #fff;
  --bs-btn-bg: #1f8a5b;
  --bs-btn-border-color: #1f8a5b;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #17734b;
  --bs-btn-hover-border-color: #17734b;
  --bs-btn-focus-shadow-rgb: 31, 138, 91;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #125c3c;
  --bs-btn-active-border-color: #125c3c;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #1f8a5b;
  --bs-btn-disabled-border-color: #1f8a5b;
}
html:root[data-brand="tam"][data-color-theme] .btn-outline-success {
  --bs-btn-color: var(--bs-success);
  --bs-btn-border-color: var(--bs-success);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-success);
  --bs-btn-hover-border-color: var(--bs-success);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-success);
  --bs-btn-active-border-color: var(--bs-success);
}
/* Gold is too light for white text: warning buttons carry black text. */
html:root[data-brand="tam"][data-color-theme] .btn-warning {
  --bs-btn-color: #000;
  --bs-btn-bg: #f4b324;
  --bs-btn-border-color: #f4b324;
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #e0a113;
  --bs-btn-hover-border-color: #e0a113;
  --bs-btn-focus-shadow-rgb: 244, 179, 36;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #cc920e;
  --bs-btn-active-border-color: #cc920e;
  --bs-btn-disabled-color: #000;
  --bs-btn-disabled-bg: #f4b324;
  --bs-btn-disabled-border-color: #f4b324;
}
html:root[data-brand="tam"][data-color-theme] .btn-outline-warning {
  --bs-btn-color: var(--bs-warning-text-emphasis);
  --bs-btn-border-color: var(--bs-warning);
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: var(--bs-warning);
  --bs-btn-hover-border-color: var(--bs-warning);
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: var(--bs-warning);
  --bs-btn-active-border-color: var(--bs-warning);
}
html:root[data-brand="tam"][data-color-theme] .btn-info {
  --bs-btn-color: #fff;
  --bs-btn-bg: #2f6fb0;
  --bs-btn-border-color: #2f6fb0;
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: #255c94;
  --bs-btn-hover-border-color: #255c94;
  --bs-btn-focus-shadow-rgb: 47, 111, 176;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: #1d4a78;
  --bs-btn-active-border-color: #1d4a78;
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: #2f6fb0;
  --bs-btn-disabled-border-color: #2f6fb0;
}
html:root[data-brand="tam"][data-color-theme] .btn-outline-info {
  --bs-btn-color: var(--bs-info);
  --bs-btn-border-color: var(--bs-info);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-info);
  --bs-btn-hover-border-color: var(--bs-info);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--bs-info);
  --bs-btn-active-border-color: var(--bs-info);
}
html:root[data-brand="tam"][data-color-theme] .text-bg-warning,
html:root[data-brand="tam"][data-color-theme] .badge.bg-warning {
  color: #000 !important;
}

html:root[data-brand="tam"][data-color-theme] :is(.form-control, .form-select):focus {
  /* !important: the template's dark-mode focus border is !important too. */
  border-color: var(--tam-accent) !important;
  box-shadow: 0 0 0 0.2rem var(--bs-focus-ring-color);
}
html:root[data-brand="tam"][data-color-theme] .form-check-input:focus {
  border-color: var(--tam-accent);
  box-shadow: 0 0 0 0.2rem var(--bs-focus-ring-color);
}
html:root[data-brand="tam"][data-color-theme] .form-check-input:is(:checked, [type=checkbox]:indeterminate) {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary);
}
html:root[data-brand="tam"][data-color-theme][data-bs-theme="dark"] .form-check-input:checked[type=checkbox] {
  --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
html:root[data-brand="tam"][data-color-theme] .form-range::-webkit-slider-thumb { background-color: var(--bs-primary); }
html:root[data-brand="tam"][data-color-theme] .form-range::-moz-range-thumb { background-color: var(--bs-primary); }
html:root[data-brand="tam"][data-color-theme] .form-range:focus::-webkit-slider-thumb { box-shadow: 0 0 0 1px var(--bs-body-bg), 0 0 0 0.2rem var(--bs-focus-ring-color); }
html:root[data-brand="tam"][data-color-theme] .form-range:focus::-moz-range-thumb { box-shadow: 0 0 0 1px var(--bs-body-bg), 0 0 0 0.2rem var(--bs-focus-ring-color); }

html:root[data-brand="tam"][data-color-theme] .nav-pills {
  --bs-nav-pills-link-active-color: var(--bs-body-bg);
  --bs-nav-pills-link-active-bg: var(--bs-primary);
}
html:root[data-brand="tam"][data-color-theme] .nav-tabs {
  --bs-nav-tabs-link-active-color: var(--bs-body-bg);
  --bs-nav-tabs-link-active-bg: var(--bs-primary);
  --bs-nav-tabs-link-active-border-color: var(--bs-border-color) var(--bs-border-color) var(--bs-primary);
}
html:root[data-brand="tam"][data-color-theme] .nav-link:focus-visible {
  box-shadow: 0 0 0 0.2rem var(--bs-focus-ring-color);
}
html:root[data-brand="tam"][data-color-theme] .accordion {
  --bs-accordion-btn-focus-border-color: var(--tam-accent);
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.2rem var(--bs-focus-ring-color);
  --bs-accordion-active-color: var(--bs-emphasis-color);
  --bs-accordion-active-bg: var(--bs-tertiary-bg);
}
html:root[data-brand="tam"][data-color-theme] .btn-close {
  --bs-btn-close-focus-shadow: 0 0 0 0.2rem var(--bs-focus-ring-color);
}
html:root[data-brand="tam"][data-color-theme][dir="rtl"] .border-start.border-2.border-primary {
  border-right-color: var(--bs-primary) !important;
}
html:root[data-brand="tam"][data-color-theme] .pagination {
  --bs-pagination-active-color: var(--bs-body-bg);
  --bs-pagination-active-bg: var(--bs-primary);
  --bs-pagination-active-border-color: var(--bs-primary);
  --bs-pagination-focus-box-shadow: 0 0 0 0.2rem var(--bs-focus-ring-color);
}
html:root[data-brand="tam"][data-color-theme] :is(.progress, .progress-stacked) {
  --bs-progress-bar-bg: var(--bs-primary);
}
html:root[data-brand="tam"][data-color-theme] .list-group {
  --bs-list-group-active-color: var(--bs-body-bg);
  --bs-list-group-active-bg: var(--bs-primary);
  --bs-list-group-active-border-color: var(--bs-primary);
}
html:root[data-brand="tam"][data-color-theme] .dropdown-menu {
  --bs-dropdown-link-active-color: var(--bs-emphasis-color);
  --bs-dropdown-link-active-bg: var(--bs-tertiary-bg);
}

html:root[data-brand="tam"][data-color-theme] .card {
  --bs-card-border-color: var(--bs-border-color);
}

/* ---------- Sidebar ----------
 * Top-level rows (group parents and standalone links) carry a brand icon:
 * black with a red accent, white with gold on dark. A group's pages keep
 * the template's own ring bullet (Tabler ti-circle), recoloured; one group
 * is open at a time as before. The current page gets a pale fill, bold text
 * and an accent bar on the sidebar's edge; its bullet turns accent.
 * Icons come from tam-sidebar-icons.css (scripts/make-tam-sidebar-icons.mjs).
 */
html:root[data-brand="tam"] {
  --tam-nav-fg: #2e3036;
  --tam-nav-fg-strong: #000;
  --tam-nav-icon: #16171a;
  --tam-nav-bullet: #9a9ea8;
  --tam-nav-caption: #6a6e78;
  --tam-nav-hover: #f6f6f7;
  --tam-nav-active: #f6f6f7;
  --tam-nav-pill: #ecedf0;
}
html:root[data-brand="tam"][data-bs-theme="dark"] {
  --tam-nav-fg: #c8cbd1;
  --tam-nav-fg-strong: #fff;
  --tam-nav-icon: #ecedf0;
  --tam-nav-bullet: #6a6e78;
  --tam-nav-caption: #8d919b;
  --tam-nav-hover: rgba(255, 255, 255, 0.04);
  --tam-nav-active: rgba(255, 255, 255, 0.08);
  --tam-nav-pill: rgba(255, 255, 255, 0.1);
}

/* Section captions (the template's small caps, e.g. "SPMK-MRSM"). */
html[data-brand="tam"] .left-sidebar .sidebar-nav .nav-small-cap:not(.central-org-switch) {
  margin: 0;
  padding: 18px 10px 8px !important;
  min-height: 0;
  color: var(--tam-nav-caption) !important;
  font: 700 11px/1.2 var(--tam-font-display);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav .nav-small-cap .nav-small-cap-icon {
  display: none !important;
}
html[data-brand="tam"] .left-sidebar #sidebarnav > li.nav-small-cap:first-child {
  padding-top: 8px !important;
}

/* Every row: group parents, standalone links and a group's pages. */
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 2px;
  padding: 9px 12px !important;
  border-radius: 8px;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--tam-nav-fg) !important;
  font-family: var(--bs-body-font-family);
  font-size: 14px;
  font-weight: 500;
  line-height: 22px;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link:hover {
  background: var(--tam-nav-hover) !important;
  color: var(--tam-nav-fg-strong) !important;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul.first-level {
  padding: 0;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul.first-level > .sidebar-item:last-child {
  margin-bottom: 6px;
}

/* Group parent: chevron on the right, down when closed and up when open.
   The group holding the current page gets bold text (no fill, no bar). */
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow {
  padding-right: 32px !important;
  cursor: pointer;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow.active {
  color: var(--tam-nav-fg-strong) !important;
  font-weight: 600;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow::before {
  display: none !important;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow::after,
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow[aria-expanded="true"]::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 14px;
  width: 6px;
  height: 6px;
  margin: 0;
  border-style: solid;
  border-width: 0 1.5px 1.5px 0;
  border-color: currentColor !important;
  transform-origin: center;
  transform: translateY(-75%) rotate(45deg);
  transition: transform 0.3s ease-out;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow[aria-expanded="true"]::after {
  transform: translateY(-25%) rotate(-135deg);
}
html[dir="rtl"][data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow {
  padding-right: 12px !important;
  padding-left: 32px !important;
}
html[dir="rtl"][data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.has-arrow::after {
  right: auto;
  left: 14px;
}

/* Current page. The accent bar sits on the sidebar's edge
   (.scroll-sidebar has 24px side padding). */
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.active:not(.has-arrow) {
  background: var(--tam-nav-active) !important;
  color: var(--tam-nav-fg-strong) !important;
  font-weight: 600;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.active:not(.has-arrow)::before {
  content: "";
  position: absolute;
  left: -24px;
  top: 6px;
  bottom: 6px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: var(--tam-accent);
}
html[dir="rtl"][data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.active:not(.has-arrow)::before {
  left: auto;
  right: -24px;
  border-radius: 3px 0 0 3px;
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.disabled,
html[data-brand="tam"] .left-sidebar .sidebar-nav ul .sidebar-item > a.sidebar-link.link-disabled {
  opacity: 0.45;
}

/* Icon slot (20px, so a page's text lines up under its group's text). Top-level
   rows draw their brand icon as two masks so colours follow the theme. */
html[data-brand="tam"] .left-sidebar #sidebarnav > li > .sidebar-link > span:first-child,
html[data-brand="tam"] .left-sidebar .sidebar-nav .sidebar-link > .round-16 {
  display: flex;
  flex: none;
  width: 20px;
  height: 20px;
  margin: 0 !important;
}
html[data-brand="tam"] .left-sidebar #sidebarnav > li > .sidebar-link .ti {
  position: relative;
  display: block;
  flex: none;
  width: 20px;
  height: 20px;
  font-size: 0 !important;
}
html[data-brand="tam"] .left-sidebar #sidebarnav > li > .sidebar-link .ti::before,
html[data-brand="tam"] .left-sidebar #sidebarnav > li > .sidebar-link .ti::after {
  content: "";
  position: absolute;
  inset: 0;
  -webkit-mask: var(--tam-ib, var(--tam-i-dot-b)) center / contain no-repeat;
  mask: var(--tam-ib, var(--tam-i-dot-b)) center / contain no-repeat;
  background: var(--tam-nav-icon);
}
/* No accent (an icon tam-sidebar-icons.css does not map yet): mask the accent
   layer out completely. `none` would leave it unmasked — a solid accent square. */
html[data-brand="tam"] .left-sidebar #sidebarnav > li > .sidebar-link .ti::after {
  -webkit-mask-image: var(--tam-ia, linear-gradient(transparent, transparent));
  mask-image: var(--tam-ia, linear-gradient(transparent, transparent));
  background: var(--tam-accent);
}
/* A group's pages: the template's ring glyph (7px ti-circle), recoloured;
   accent on the current page. */
html[data-brand="tam"] .left-sidebar .sidebar-nav ul.first-level .sidebar-link .ti {
  font-size: 7px;
  color: var(--tam-nav-bullet);
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul.first-level .sidebar-link:hover .ti {
  color: var(--tam-nav-fg-strong);
}
html[data-brand="tam"] .left-sidebar .sidebar-nav ul.first-level .sidebar-link.active .ti {
  color: var(--tam-accent);
}

/* Count pills. */
html[data-brand="tam"] .left-sidebar .sidebar-nav .sidebar-link .badge {
  margin-left: auto;
  padding: 4px 8px;
  border-radius: 99px;
  background: var(--tam-nav-pill) !important;
  color: var(--tam-nav-fg-strong) !important;
  font: 600 11px/1 var(--bs-body-font-family);
}

/* Collapsed rail (mini sidebar, not hovered): captions shrink to a hairline. */
html[data-brand="tam"][data-layout="vertical"] body[data-sidebartype="mini-sidebar"] .left-sidebar:not(:hover) .sidebar-nav .nav-small-cap:not(.central-org-switch) {
  height: 0;
  padding: 0 !important;
  margin: 10px 8px;
  border-top: 1px solid var(--bs-border-color);
  overflow: hidden;
}

/* ---------- Module banner (BannerBreadcrumb strip) ----------
 * The banner is black in both modes, so outline buttons placed on it need a
 * light outline; graphite would disappear. */
html:root[data-brand="tam"][data-color-theme] .module-banner .btn-outline-primary,
html:root[data-brand="tam"][data-color-theme] .module-banner .btn-outline-secondary {
  --bs-btn-color: #fff;
  --bs-btn-border-color: rgba(255, 255, 255, 0.55);
  --bs-btn-hover-color: #000;
  --bs-btn-hover-bg: #fff;
  --bs-btn-hover-border-color: #fff;
  --bs-btn-active-color: #000;
  --bs-btn-active-bg: #ecedf0;
  --bs-btn-active-border-color: #ecedf0;
}

/* ---------- Logo: swap the template wordmark for the TAM lockup ----------
 * Every logo <img> (sidebar, header, horizontal header, auth pages) points at
 * logos/dark-logo.svg (shown on light) or logos/light-logo.svg (shown on
 * dark). Several of those files are generated from the template, so instead
 * of editing them the image is replaced here: the padding pushes the
 * original artwork out of the box and the TAM lockup is drawn as background.
 */
html[data-brand="tam"] img[src$="logos/dark-logo.svg"],
html[data-brand="tam"] img[src$="logos/light-logo.svg"] {
  box-sizing: border-box;
  width: 160px !important;
  height: 36px !important;
  padding-left: 160px;
  background: url("/assets/images/brand/tam-logo-primary.svg") left center / contain no-repeat;
}
html[data-brand="tam"] img[src$="logos/light-logo.svg"] {
  background-image: url("/assets/images/brand/tam-logo-reverse.svg");
}

/* ---------- Customizer: the template colour presets don't apply under TAM ---------- */
html[data-brand="tam"] .customizer h6:has(+ .color-pallete),
html[data-brand="tam"] .customizer .color-pallete {
  display: none !important;
}

/* ---------- Show/hide helpers for markup that differs per brand ---------- */
html[data-brand="tam"] .brand-normal-only,
html:not([data-brand="tam"]) .brand-tam-only {
  display: none !important;
}

/* ---------- Auth pages ---------- */
html[data-brand="tam"] .radial-gradient::before {
  background: none;
  opacity: 0;
}
/* On wide screens the brand panel carries the logo, so drop the page logo. */
@media (min-width: 1200px) {
  html[data-brand="tam"] .auth-page-logo {
    visibility: hidden;
  }
}
html[data-brand="tam"] .auth-login-art {
  position: relative;
  overflow: hidden;
  background: #000;
  color: #fff;
  border-radius: 12px;
  padding: 40px;
  min-height: 520px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 24px;
}
html[data-brand="tam"] .auth-login-art .auth-login-ring {
  position: absolute;
  width: 620px;
  max-width: none;
  right: -200px;
  bottom: -220px;
  pointer-events: none;
}
html[data-brand="tam"] .auth-login-art .auth-login-logo {
  position: relative;
  width: 200px;
  height: auto;
}
html[data-brand="tam"] .auth-login-art h2 {
  position: relative;
  margin: 0;
  color: #fff;
  font-size: 2rem;
  font-weight: 800;
  line-height: 1.12;
  max-width: 14ch;
}
html[data-brand="tam"] .auth-login-art p {
  position: relative;
  margin: 12px 0 0;
  color: var(--tam-mist);
  max-width: 36ch;
}
html[data-brand="tam"] .auth-login-art .auth-login-steps {
  position: relative;
  display: flex;
  gap: 6px;
}
html[data-brand="tam"] .auth-login-art .auth-login-steps i {
  display: block;
  height: 4px;
  width: 28px;
  border-radius: 2px;
  background: var(--tam-slate);
}
html[data-brand="tam"] .auth-login-art .auth-login-steps i:nth-child(1) { background: var(--tam-red); }
html[data-brand="tam"] .auth-login-art .auth-login-steps i:nth-child(2) { background: var(--tam-gold); }