:root {
    --bni-red: #cf2030;
    --bni-red-dark: #a71926;
    --bni-red-soft: #fff1f2;
    --bni-red-border: #fecdd3;
    --bni-charcoal: #252525;
}

[data-cloak] { display: none !important; }
::selection { background: var(--bni-red); color: white; }
.crm-card { border: 1px solid rgb(226 232 240); border-radius: 1rem; background: white; box-shadow: 0 1px 2px rgb(15 23 42 / .05); }
.crm-label { display: block; margin-bottom: .35rem; font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: rgb(100 116 139); }
.crm-input { width: 100%; border: 1px solid rgb(203 213 225); border-radius: .65rem; padding: .6rem .75rem; background: white; }
.crm-input:focus { outline: 3px solid rgb(207 32 48 / .18); border-color: var(--bni-red); }
.bni-header { background: var(--bni-red); color: white; }
.bni-logo {
    display: grid;
    place-items: center;
    background: white;
    color: var(--bni-red);
    border: 1px solid rgb(255 255 255 / .72);
    box-shadow: 0 2px 8px rgb(111 13 24 / .22);
}
.bni-primary {
    background: var(--bni-red);
    color: white;
    transition: background-color .15s ease, transform .15s ease;
}
.bni-primary:hover { background: var(--bni-red-dark); }
.bni-primary:active { transform: translateY(1px); }
.bni-primary-soft {
    background: var(--bni-red-soft);
    color: var(--bni-red-dark);
    border-color: var(--bni-red-border);
}
.bni-primary-soft:hover { background: #ffe4e6; }
.bni-eyebrow, .bni-link { color: var(--bni-red-dark); }
.bni-card-link:hover { border-color: #fda4af; }
.bni-card-link:hover .bni-card-title { color: var(--bni-red-dark); }
.bni-progress { background: var(--bni-red); }
.bni-header-muted { color: #ffe4e6; }
.bni-header-control { background: rgb(126 18 31 / .62); color: white; }
.bni-header-control:hover { background: rgb(105 15 26 / .78); }
.bni-nav-link { color: #fff1f2; }
.bni-nav-link:hover { background: rgb(145 18 34 / .58); color: white; }
.bni-nav-active { background: white; color: var(--bni-charcoal); }
.table-sticky thead { position: sticky; top: 0; z-index: 5; }
.modal-scroll { max-height: calc(94vh - 73px); }
.nav-mobile-scroll { scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.nav-mobile-scroll::-webkit-scrollbar { display: none; }
button, a, input, select, textarea { -webkit-tap-highlight-color: transparent; }
button, select { touch-action: manipulation; }

@media (max-width: 767px) {
    .crm-card { border-radius: .85rem; }
    .crm-input { min-height: 2.85rem; font-size: 1rem; }
    .crm-responsive-table,
    .crm-responsive-table tbody,
    .crm-responsive-table tr,
    .crm-responsive-table td { display: block; width: 100%; }
    .crm-responsive-table thead { display: none; }
    .crm-responsive-table tbody { padding: .65rem; background: rgb(241 245 249); }
    .crm-responsive-table tr {
        margin-bottom: .75rem;
        border: 1px solid rgb(226 232 240);
        border-radius: .85rem;
        background: white;
        overflow: hidden;
        box-shadow: 0 1px 2px rgb(15 23 42 / .05);
    }
    .crm-responsive-table td {
        display: grid;
        grid-template-columns: minmax(6rem, 34%) minmax(0, 1fr);
        gap: .75rem;
        padding: .75rem;
        border-bottom: 1px solid rgb(241 245 249);
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .crm-responsive-table td:last-child { border-bottom: 0; }
    .crm-responsive-table td::before {
        content: attr(data-label);
        color: rgb(100 116 139);
        font-size: .7rem;
        line-height: 1rem;
        font-weight: 700;
        letter-spacing: .04em;
        text-transform: uppercase;
    }
    .modal-scroll { max-height: calc(100dvh - 68px); }
}
