/*
 * Admin theme overrides on top of vendored Tabler (assets/vendor/@tabler/core/tabler.min.css).
 * Plain CSS on purpose — no Sass variables needed, so this file does not go through the
 * sass-bundle build. Linked after tabler.min.css in admin_base.html.twig.
 *
 * Only brand-level tweaks live here; layout comes from Tabler's own classes
 * (.page / .navbar-vertical / .page-wrapper / .page-body / .container-xl).
 */

:root,
[data-bs-theme="light"] {
    /* Brand accent — keep in step with the Zephyr $primary used on the public site. */
    --tblr-primary: #206bc4;
    --tblr-primary-rgb: 32, 107, 196;
}

/* Bootstrap Icons render a touch large next to Tabler's text; nudge to match. */
.navbar-vertical .nav-link-icon .bi,
.navbar .nav-link .bi {
    font-size: 1rem;
    line-height: 1;
}

/* The sidebar brand line. */
.navbar-brand-autodark {
    font-weight: 600;
    font-size: 1.05rem;
}

/* Keep long tables readable inside Tabler's .card without a horizontal jump. */
.card > .table-responsive {
    border-radius: inherit;
}

/* Tom Select's Bootstrap5 CSS skin (theme-vendor/tom-select/tom-select.bootstrap5.min.css)
   reads standard Bootstrap dropdown vars (--bs-dropdown-bg / --bs-body-color etc.) that
   Tabler never defines (it has its own --tblr-* set) — without this the open dropdown list
   is background-transparent, so the page behind it bleeds through. */
.ts-dropdown {
    background-color: var(--tblr-bg-surface, #fff);
    color: var(--tblr-body-color, #182433);
    border-color: var(--tblr-border-color, #dce1e7);
    box-shadow: var(--tblr-dropdown-box-shadow, 0 .5rem 1.5rem rgba(0, 0, 0, .1));
}
.ts-dropdown .ts-dropdown-content .option.active {
    background-color: var(--tblr-primary-lt, rgba(32, 107, 196, .1));
    color: var(--tblr-primary, #206bc4);
}

/* Trix rich-text editor (App\Form\RichTextType) — comfortable default height that
   still grows with content. */
trix-editor {
    min-height: 400px;
}

/* Collapsible sidebar sections (SGA-N38). The section header is a collapse toggle (Tabler's
   own `.nav-link-toggle` span draws + auto-rotates the caret off `aria-expanded`); its
   children sit indented in a nested list that Bootstrap's .collapse shows/hides. */
.navbar-vertical .nav-admin-subsection {
    margin-left: 1.25rem;
    border-left: 1px solid var(--tblr-border-color, rgba(255, 255, 255, .12));
    padding-left: .25rem;
}
/* Nested items read a touch dimmer than the section headers by default — lift them so the
   two levels stay legible on the dark sidebar. */
.navbar-vertical .nav-admin-subsection .nav-link {
    color: var(--tblr-navbar-color, rgba(255, 255, 255, .8));
}
.navbar-vertical .nav-admin-subsection .nav-link:hover,
.navbar-vertical .nav-admin-subsection .nav-item.active .nav-link {
    color: var(--tblr-navbar-active-color, #fff);
}