/* ── DocOrbit Admin Theme ─────────────────────────────────────────────────── */

:root {
    --do-primary: #3A6463;
    --do-secondary: #E08040;
    --tblr-primary: #3A6463;
    --tblr-primary-rgb: 58, 100, 99;
}

.bg-primary { background-color: var(--do-primary) !important; }

/* Alerts */
.alert-success { border: 1px solid #2fb344; background-color: #f0faf1; color: #1a6928; }
.alert-danger  { border: 1px solid #d63939; background-color: #fdf0f0; color: #8b2020; }
.alert-success .btn-close,
.alert-danger .btn-close { color: inherit; }

/* ── Sidebar ─────────────────────────────────────────────────────────────── */
.navbar-vertical { background-color: var(--do-primary) !important; }

/* ── Top navbar ──────────────────────────────────────────────────────────── */
header.navbar { background-color: var(--do-primary) !important; }
header.navbar,
header.navbar .nav-link,
header.navbar .btn,
header.navbar .navbar-toggler-icon { color: #fff !important; }
header.navbar .btn { border-color: rgba(255,255,255,0.2); background-color: transparent !important; }
header.navbar .btn:hover { background-color: rgba(255,255,255,0.1) !important; }
header.navbar .dropdown-toggle::after { border-top-color: #fff; }

/* Language and timezone switchers: icon, label, caret. Tabler spaces button
   icons through `.btn .icon`, which only matches its own icon class, and these
   use Font Awesome, so the glyph sat flush against the label ("[icon]Türkçe").
   A flex gap spaces all three without touching icon-only buttons, and the
   caret's own margin comes off so it is not spaced twice. */
header.navbar .btn.dropdown-toggle { display: inline-flex; align-items: center; gap: 0.375rem; }
header.navbar .btn.dropdown-toggle::after { margin-left: 0; }

/* ── Dropdown menus (always light) ───────────────────────────────────────── */
.dropdown-menu { background-color: #fff !important; color: #1e293b !important; }
.dropdown-menu .dropdown-item { color: #1e293b !important; }
.dropdown-menu .dropdown-item:hover { background-color: #f1f5f9 !important; color: #1e293b !important; }

/* ── Action buttons (secondary brand color) ──────────────────────────────── */
.btn-primary { background-color: var(--do-secondary) !important; border-color: var(--do-secondary) !important; color: #fff !important; }
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active { background-color: #c46e30 !important; border-color: #c46e30 !important; color: #fff !important; }
.btn-success { background-color: var(--do-secondary) !important; border-color: var(--do-secondary) !important; color: #fff !important; }
.btn-success:hover,
.btn-success:focus,
.btn-success:active { background-color: #c46e30 !important; border-color: #c46e30 !important; color: #fff !important; }

/* ── Links ───────────────────────────────────────────────────────────────── */
a { color: var(--do-primary); }
a:hover { color: #2d504f; }

/* ── Breadcrumbs ─────────────────────────────────────────────────────────── */
.breadcrumb-item a { color: var(--do-primary) !important; }
.breadcrumb-item.active { color: var(--do-primary) !important; opacity: 0.7; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--do-primary) !important; }

/* Breadcrumb left margin to align with table content */
.page-header .breadcrumb { margin-left: 0.75rem; }

/* ── Logo ────────────────────────────────────────────────────────────────── */
/* Mark plus wordmark. Tabler already lays out .navbar-brand (the <h1>) as a
   centred flex row, but the real content sits inside the <a> it wraps, which is
   a plain inline link: it needs the same treatment, or the mark and the word
   align on their text baselines and the word rides low against a round mark. */
.navbar-brand .brand-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    line-height: 1;
}

/* Bootstrap underlines links on hover, and .navbar-brand's own no-underline
   rule lands on the <h1>, not on the <a> inside it. */
.navbar-brand .brand-link,
.navbar-brand .brand-link:hover,
.navbar-brand .brand-link:focus { text-decoration: none; color: #fff; }

.navbar-brand .brand-link img { height: 30px; width: auto; object-fit: contain; display: block; }

/* The login page reuses .navbar-brand for a standalone logo and Tabler's
   `navbar-brand-autodark` flattens it to solid white (brightness(0) invert(1)),
   which is meant for a white-on-dark wordmark. The Orbius mark carries its own
   colour on a light card, so the filter has to come off or it renders as a
   featureless white disc. */
.navbar-brand-autodark .navbar-brand-image { filter: none; }

.navbar-wordmark {
    /* The h1 carries Tabler's own brand font-size; the wordmark is set here so
       it stays proportionate to the mark rather than to the heading scale. */
    font-size: 1.0625rem;
    font-weight: 600;
    /* The disc has visual weight the letters do not, so a touch of tracking
       keeps the word from crowding it. */
    letter-spacing: 0.01em;
    line-height: 1;
    /* Optical centring: the mark is a circle, the word has no descenders, so
       matching their boxes leaves the word looking a hair high. */
    padding-top: 1px;
}

/* ── Mobile user avatar ──────────────────────────────────────────────────── */
.navbar-nav .avatar { background-color: transparent !important; border: 1px solid rgba(255,255,255,0.4) !important; color: #fff !important; }
.navbar-nav .nav-link.d-flex { background: transparent !important; }

/* ── DataTable toolbar buttons (export, show/hide columns, filter) ────── */
#btn_container .btn.btn-secondary {
    background-color: var(--do-secondary) !important;
    border-color: var(--do-secondary) !important;
    color: #fff !important;
}
#btn_container .btn.btn-secondary:hover,
#btn_container .btn.btn-secondary:focus,
#btn_container .btn.btn-secondary:active {
    background-color: #c46e30 !important;
    border-color: #c46e30 !important;
    color: #fff !important;
}

/* Keep border-radius on filter (searchBuilder) button when active */
#btn_container .btn.btn-secondary {
    border-radius: 4px !important;
    margin-right: 0.35rem;
}

/* Vertically center toolbar button groups in card header */
.card-header { align-items: center !important; }
#btn_container { display: flex; align-items: center; }
#btn_container .dt-buttons.btn-group { margin-bottom: 0 !important; box-shadow: none !important; }


/* ── Mobile: icon-only toolbar buttons (exclude filter panel internals) ─── */
@media (max-width: 991.98px) {
    #btn_container .btn { font-size: 0 !important; padding: 0.375rem 0.5rem !important; }
    #btn_container .btn i,
    #btn_container .btn .fa-solid { font-size: 1rem !important; }
    /* Restore text for buttons inside filter/searchBuilder panels */
    #btn_container .dtsb-group .btn,
    #btn_container .dt-button-collection .btn { font-size: 0.875rem !important; padding: 0.25rem 0.5rem !important; }
    /* Hide text on "New X" and card-action buttons on mobile */
    .card-actions .btn-primary,
    .card-actions .btn-list .btn { font-size: 0 !important; padding: 0.375rem 0.5rem !important; }
    .card-actions .btn-primary i,
    .card-actions .btn-list .btn i { font-size: 1rem !important; margin-right: 0 !important; }
    .card-actions .btn-primary .me-2,
    .card-actions .btn-list .btn .me-2 { margin-right: 0 !important; }
}

/* ── Fixed sidebar vs Tabler's scrollbar compensation ────────────────────── */
/* Tabler 1.4 ships:
       @media (min-width: 992px) { :host, :root { margin-left: calc(100vw - 100%) } }
   which shifts the whole document right by the scrollbar width so centred content does
   not jump when a scrollbar appears. The sidebar is `position: fixed; left: 0` and is
   anchored to the viewport, so it does NOT shift with it: every page long enough to
   scroll showed a strip of page background between the sidebar and the header, exactly
   the width of the scrollbar. Most visible on view-report, which is the longest page.

   `scrollbar-gutter: stable` reserves the same space without moving the root box, so the
   no-jump behaviour Tabler wanted is kept and the sidebar stays flush. */
@media (min-width: 992px) {
    :root {
        margin-left: 0;
        scrollbar-gutter: stable;
    }
}