/*
 * padminnew — override styles ONLY. Core layout/components come from the shared local
 * Metrica bundle (merchantnew/assets, no CDN). Keep this file small: brand + admin tweaks.
 */

:root {
    --pa-brand: #1b84ff;
    --pa-brand-dark: #155fbf;
}

/* Admin console accent: distinguish from the merchant panel at a glance. */
.leftbar-tab-menu .main-icon-menu { border-top: 3px solid var(--pa-brand); }

/* Sortable header links inherit table color, subtle hover. */
thead a.text-reset:hover { color: var(--pa-brand) !important; }

/* Filter panel spacing on mobile (webview-friendly). */
@media (max-width: 575.98px) {
    #paFilterForm .col-6 { flex: 0 0 auto; width: 50%; }
    .page-title-box { flex-wrap: wrap; gap: .35rem; }
    .table-responsive { -webkit-overflow-scrolling: touch; }
}

/* Soft badge fallbacks (Metrica provides bg-soft-* but guard the tones we use). */
.bg-soft-primary { background-color: rgba(27,132,255,.12); }
.bg-soft-success { background-color: rgba(25,182,122,.12); }
.bg-soft-danger  { background-color: rgba(240,101,72,.12); }
.bg-soft-warning { background-color: rgba(255,193,7,.14); }
.bg-soft-info    { background-color: rgba(13,202,240,.12); }

/* Keep bulk toolbar controls from wrapping awkwardly on small screens. */
.pagination { row-gap: .25rem; }

/* Dark mode (Bootstrap 5.3 data-bs-theme handles the bulk; these tune padminnew's custom bits).
   Toggle lives in the command palette (Ctrl+K → "Toggle dark / light mode") + the topbar. */
[data-bs-theme="dark"] {
    --pa-brand: #4c9dff;
}
[data-bs-theme="dark"] .leftbar-tab-menu .main-icon-menu { border-top-color: var(--pa-brand); }
[data-bs-theme="dark"] .bg-soft-primary { background-color: rgba(76,157,255,.16); }
[data-bs-theme="dark"] .bg-soft-success { background-color: rgba(41,204,151,.16); }
[data-bs-theme="dark"] .bg-soft-danger  { background-color: rgba(255,120,95,.16); }
[data-bs-theme="dark"] .bg-soft-warning { background-color: rgba(255,193,7,.18); }
[data-bs-theme="dark"] .bg-soft-info    { background-color: rgba(13,202,240,.16); }
[data-bs-theme="dark"] .bg-soft-secondary { background-color: rgba(148,158,171,.18); }
/* Metrica's sidebar/topbar use their own light surfaces; nudge them dark so the shell matches. */
[data-bs-theme="dark"] .leftbar-tab-menu .main-menu-inner,
[data-bs-theme="dark"] .topbar .navbar-custom { background-color: #1a2231; }
[data-bs-theme="dark"] .card { background-color: #1e2637; }

/* (Reverted the in-rail text labels — Metrica's icon rail is intentionally narrow; the readable
   section names live in the secondary pane. Cramming 16 long labels into the rail broke the layout.) */

/* ------------------------------------------------------------------------------------------------
   Mobile stacked-card listings (WebView, ~375px). Under 576px a listing `.table` that the JS
   enhancer (includes/list_mobile.php) has tagged `.pa-cards` degrades from a horizontally-scrolling
   grid into one card per row: each cell becomes a "Label  value" line (label from data-label).
   Desktop / JS-disabled = untouched (rules are scoped to .pa-cards + the media query only).
   ------------------------------------------------------------------------------------------------ */
@media (max-width: 575.98px) {
    .table-responsive .table.pa-cards { border-collapse: separate; }
    .table-responsive .table.pa-cards thead { display: none; } /* headers move into each cell's data-label */
    .table-responsive .table.pa-cards tbody tr {
        display: block;
        margin-bottom: .6rem;
        padding: .25rem .35rem;
        border: 1px solid var(--bs-border-color, #e6e8eb);
        border-radius: 12px;
        background: var(--bs-card-bg, transparent);
    }
    .table-responsive .table.pa-cards tbody td {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 1rem;
        width: 100%;
        padding: .4rem .55rem;
        border: 0;
        border-bottom: 1px solid var(--bs-border-color-translucent, rgba(128,128,128,.14));
        text-align: right;
        white-space: normal;
    }
    .table-responsive .table.pa-cards tbody td:last-child { border-bottom: 0; }
    .table-responsive .table.pa-cards tbody td::before {
        content: attr(data-label);
        flex: 0 0 42%;
        margin-right: auto;
        color: var(--bs-secondary-color, #6c757d);
        font-weight: 600;
        font-size: .78rem;
        text-align: left;
        white-space: nowrap;
    }
    /* Cells with no header (checkbox / actions column) show only their value, full-width. */
    .table-responsive .table.pa-cards tbody td[data-label=""]::before { content: ""; flex-basis: 0; margin: 0; }
    .table-responsive .table.pa-cards tbody td[data-label=""] { justify-content: flex-end; }
}