/* Custom, hand-written overrides layered on top of the vendored styles.css (SB Admin
   template + compiled Bootstrap 5.2.3). Kept in this single file, separate from the
   vendor CSS, so all site-wide custom rules are easy to find/revert in one place and
   the vendor file can still be swapped out wholesale on a template update. */

/* =====================================================================
   Mobile-friendliness patches
   The sidebar/topnav toggle itself is already responsive out of the box (SB Admin's
   standard #layoutSidenav off-canvas behaviour below 992px) -- these rules cover the
   gaps: legacy raw <table> layouts and fixed pixel-width inputs that predate Bootstrap
   and would otherwise force the whole page to scroll horizontally on a phone.
   ===================================================================== */

/* Fixed-width form controls (old pages hardcode style="width:200px" etc.) can't exceed
   their container on narrow screens. !important is required to beat those inline styles. */
img, input, select, textarea {
    max-width: 100% !important;
}

/* Any plain HTML table gets its own horizontal scroll instead of blowing out the page
   width. Harmless no-op on tables already inside a Bootstrap .table-responsive wrapper
   (that div already scrolls; this just adds a redundant inner scroll container rather
   than fighting it). DataTables are excluded since this would interfere with their own
   column-width calculations. */
@media (max-width: 767.98px) {
    table:not(.dataTable) {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}

/* Card/page headers built as "title on the left, button on the right" via d-flex
   justify-content-between don't wrap by default and can overlap on narrow phones. */
@media (max-width: 575.98px) {
    .d-flex.justify-content-between {
        flex-wrap: wrap;
        row-gap: 10px;
    }
}

/* Final backstop: if something still overflows, scroll that element instead of the
   whole page (tables above already get their own scroll container, so this shouldn't
   normally trigger). */
body {
    overflow-x: hidden;
}

/* =====================================================================
   Flat, minimal card style
   Overrides the SB Admin template's default card look (heavy drop shadow, gray header
   band, tight corners) site-wide. Bootstrap's .shadow/.shadow-sm/.shadow-lg utilities
   are !important, so beating them needs matching specificity + !important, not just
   source order.
   ===================================================================== */

.card {
    --bs-card-border-color: rgba(0, 0, 0, 0.08);
    --bs-card-border-radius: 0.75rem;
    --bs-card-cap-bg: transparent;
}

.card.shadow,
.card.shadow-sm,
.card.shadow-lg {
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

.card-header {
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    font-weight: 600;
}