/* =====================================================================
   ASA JANKALYAN DAL - PREMIUM LAYER (member app + admin panel + auth)
   The single colour style of docs/PREMIUM_STYLE.md: navy / white with
   gold only for highlights, Mukta for every letter, soft motion.
   Loaded LAST (after theme / custom / sidebar / dashboard / gi-skin) so
   it wins; Bootstrap classes keep working, only their look changes.
   ===================================================================== */

:root {
    --asa-navy: #0b2a6f;
    --asa-blue: #1e56b8;
    --asa-gold: #f5b400;
    --asa-gold-deep: #c8901a;
    --asa-gold-grad: linear-gradient(135deg, #fbe7a1 0%, #f5c84c 35%, #d4a017 65%, #b8860b 100%);
    --asa-navy-grad: linear-gradient(135deg, #0b2a6f 0%, #12398f 55%, #1e56b8 100%);
    --asa-saffron: #ff9933;
    --asa-green: #138808;
    --asa-bg: #f5f7fb;
    --asa-card: #ffffff;
    --asa-ink: #14213d;
    --asa-muted: #6b7690;
    --asa-line: #e3e8f2;
    --asa-radius: 18px;
    --asa-radius-sm: 12px;
    --asa-shadow: 0 10px 30px rgba(11, 42, 111, .10);
    --asa-shadow-lift: 0 18px 40px rgba(11, 42, 111, .18);
    --asa-hairline: 1px solid rgba(212, 160, 23, .55);
    --asa-font: 'Mukta', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --asa-font-hi: 'Mukta', 'Nirmala UI', 'Mangal', sans-serif;

    /* the member skin (gi-skin.css) reads these - remap them to the guide */
    --gi-bg: var(--asa-bg);
    --gi-surface: #ffffff;
    --gi-text: var(--asa-ink);
    --gi-muted: var(--asa-muted);
    --gi-line: var(--asa-line);
    --gi-teal: var(--asa-blue);
    --gi-teal-soft: #e6eefb;
    --gi-navy: var(--asa-navy);
    --gi-blue: var(--asa-blue);
    --gi-gold: var(--asa-gold);
    --gi-grad: var(--asa-navy-grad);
    --gi-grad-gold: var(--asa-gold-grad);
    --gi-radius: var(--asa-radius);
    --gi-radius-sm: var(--asa-radius-sm);
    --gi-raise: var(--asa-shadow);
    --gi-raise-sm: 0 4px 14px rgba(11, 42, 111, .08);
    --gi-inset: inset 0 0 0 1px #d6deec;
    --gi-font: var(--asa-font);
    --gi-font-hi: var(--asa-font-hi);

    /* Bootstrap / Front theme tokens */
    --bs-primary: #1e56b8;
    --bs-primary-rgb: 30, 86, 184;
    --bs-link-color: #1e56b8;
    --bs-link-hover-color: #0b2a6f;
    --bs-body-font-family: var(--asa-font);
    --bs-body-color: #14213d;
    --bs-border-radius: 12px;
}

/* ================================================================ type */
body.gi-skin, body.asa-admin {
    font-family: var(--asa-font) !important;
    font-size: 16px;
    line-height: 1.55;
    color: var(--asa-ink);
    -webkit-font-smoothing: antialiased;
}
:is(body.gi-skin, body.asa-admin) :is(button, input, select, textarea, .btn, .form-control, .form-select, .dropdown-item, .nav-link, .badge, .table, .modal, .tooltip, .popover, small, label) {
    font-family: var(--asa-font) !important;
}
:is(body.gi-skin, body.asa-admin) :is(h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6, .page-header-title, .card-header-title) {
    font-family: var(--asa-font) !important;
    font-weight: 700;
    letter-spacing: -.01em;
    color: var(--asa-navy);
    line-height: 1.25;
}
:is(body.gi-skin, body.asa-admin) :is(h1, .h1) { font-weight: 800; }
body.asa-admin .page-header-title { font-size: 1.6rem; font-weight: 800; }
body.asa-admin .page-header { padding-bottom: 1.25rem; margin-bottom: 1.5rem; border-bottom-color: var(--asa-line); }
:is(body.gi-skin, body.asa-admin) [lang="hi"], :is(body.gi-skin, body.asa-admin) .notranslate { font-family: var(--asa-font-hi); }
:is(body.gi-skin, body.asa-admin) :is(.dwc__value, .gi-tile__value, .table td, .dash-sum strong, [data-countup], .asa-num) {
    font-variant-numeric: tabular-nums;
}
:is(body.gi-skin, body.asa-admin) .text-primary { color: var(--asa-blue) !important; }
:is(body.gi-skin, body.asa-admin) .text-dark { color: var(--asa-ink) !important; }
:is(body.gi-skin, body.asa-admin) .text-muted, :is(body.gi-skin, body.asa-admin) .text-body-secondary { color: var(--asa-muted) !important; }
:is(body.gi-skin, body.asa-admin) .text-cap, :is(body.gi-skin, body.asa-admin) .gi-cap {
    color: var(--asa-muted) !important; letter-spacing: .1em; font-weight: 700; font-size: .74rem;
}
:is(body.gi-skin, body.asa-admin) .bg-primary { background-color: var(--asa-navy) !important; }

/* ========================================================= canvas */
body.gi-skin, body.gi-skin .main, body.gi-skin #content,
body.asa-admin, body.asa-admin .main, body.asa-admin #content { background-color: var(--asa-bg) !important; }
body.asa-admin .content.container-fluid { padding-top: 1.75rem; padding-bottom: 2rem; }

/* ========================================================== cards */
:is(body.gi-skin, body.asa-admin) :is(.card, .dash-card, .gi-card) {
    background: var(--asa-card) !important;
    border: 1px solid var(--asa-line) !important;
    border-radius: var(--asa-radius) !important;
    box-shadow: var(--asa-shadow) !important;
    color: var(--asa-ink);
}
:is(body.gi-skin, body.asa-admin) .card > .card-header:first-child { border-radius: var(--asa-radius) var(--asa-radius) 0 0; }
:is(body.gi-skin, body.asa-admin) :is(.card-header, .card-footer) {
    background: transparent !important;
    border-color: var(--asa-line) !important;
    padding: 1.1rem 1.35rem;
}
:is(body.gi-skin, body.asa-admin) .card-body { padding: 1.35rem; }
:is(body.gi-skin, body.asa-admin) .card-header-title {
    color: var(--asa-navy) !important; text-transform: none; letter-spacing: -.005em; font-size: 1.08rem; font-weight: 700;
}
:is(body.gi-skin, body.asa-admin) .card-header-title i { color: var(--asa-gold-deep) !important; }
/* premium card: gold hairline (opt-in) */
:is(body.gi-skin, body.asa-admin) .asa-premium-card { border: var(--asa-hairline) !important; }
:is(body.gi-skin, body.asa-admin) .modal-content {
    border: 0; border-radius: var(--asa-radius); box-shadow: 0 30px 60px rgba(11, 42, 111, .22);
}
:is(body.gi-skin, body.asa-admin) .modal-header { border-bottom-color: var(--asa-line); }
:is(body.gi-skin, body.asa-admin) .dropdown-menu {
    border: 1px solid var(--asa-line); border-radius: 14px; box-shadow: var(--asa-shadow);
}
:is(body.gi-skin, body.asa-admin) .dropdown-item:hover, :is(body.gi-skin, body.asa-admin) .dropdown-item:focus { background: #eef3fc; color: var(--asa-navy); }

/* ======================================================== buttons */
:is(body.gi-skin, body.asa-admin) .btn {
    border-radius: var(--asa-radius-sm);
    font-weight: 600;
    letter-spacing: .005em;
    transition: transform .2s ease, box-shadow .2s ease, filter .2s ease, background-color .2s ease;
}
:is(body.gi-skin, body.asa-admin) :is(.btn-primary, .btn-gi) {
    background: var(--asa-navy-grad) !important;
    border: 0 !important;
    color: #fff !important;
    box-shadow: 0 8px 20px rgba(11, 42, 111, .22) !important;
}
:is(body.gi-skin, body.asa-admin) :is(.btn-primary, .btn-gi):hover {
    filter: brightness(1.08); transform: translateY(-1px); box-shadow: 0 12px 26px rgba(11, 42, 111, .28) !important;
}
:is(body.gi-skin, body.asa-admin) :is(.btn-primary, .btn-gi):focus-visible { box-shadow: 0 0 0 .2rem rgba(245, 180, 0, .45) !important; }
:is(body.gi-skin, body.asa-admin) :is(.btn-white, .btn-light, .btn-outline-primary, .btn-soft-primary, .btn-outline-secondary, .btn-ghost-secondary) {
    background: #fff !important;
    border: 1px solid #d6deec !important;
    color: var(--asa-navy) !important;
    box-shadow: 0 2px 8px rgba(11, 42, 111, .06) !important;
}
:is(body.gi-skin, body.asa-admin) :is(.btn-white, .btn-light, .btn-outline-primary, .btn-soft-primary, .btn-outline-secondary):hover {
    border-color: var(--asa-blue) !important; color: var(--asa-blue) !important; background: #f6f9ff !important;
}
:is(body.gi-skin, body.asa-admin) .btn-secondary {
    background: #eef2f9 !important; border: 1px solid #d6deec !important; color: var(--asa-navy) !important; box-shadow: none !important;
}
/* gold = highlight only: warning buttons and the explicit .btn-gold */
:is(body.gi-skin, body.asa-admin) :is(.btn-warning, .btn-gold) {
    background: var(--asa-gold-grad) !important; border: 0 !important; color: var(--asa-navy) !important;
    box-shadow: 0 8px 20px rgba(200, 144, 26, .30) !important;
}
:is(body.gi-skin, body.asa-admin) .btn-success {
    background: linear-gradient(135deg, #1a9c4a 0%, #138808 100%) !important; border: 0 !important; color: #fff !important;
}
:is(body.gi-skin, body.asa-admin) .btn-danger {
    background: linear-gradient(135deg, #e5394f 0%, #b81d34 100%) !important; border: 0 !important; color: #fff !important;
}
:is(body.gi-skin, body.asa-admin) .btn:active { transform: scale(.98); }
:is(body.gi-skin, body.asa-admin) .btn:disabled, :is(body.gi-skin, body.asa-admin) .btn.disabled { opacity: .55; transform: none; filter: grayscale(.25); }

/* ========================================================= inputs */
:is(body.gi-skin, body.asa-admin) :is(.form-control, .form-select, .tom-select-custom .ts-control) {
    border-radius: var(--asa-radius-sm) !important;
    border: 1px solid #d6deec !important;
    background-color: #fff !important;
    color: var(--asa-ink);
    min-height: 46px;
    box-shadow: none !important;
    transition: border-color .2s ease, box-shadow .2s ease;
}
:is(body.gi-skin, body.asa-admin) :is(.form-control, .form-select):focus {
    border-color: var(--asa-blue) !important;
    box-shadow: 0 0 0 .22rem rgba(30, 86, 184, .16) !important;
}
:is(body.gi-skin, body.asa-admin) .form-control[readonly] { background-color: #f7f9fd !important; }
:is(body.gi-skin, body.asa-admin) .input-group:not(.input-group-merge) .input-group-text {
    border-radius: var(--asa-radius-sm); border: 1px solid #d6deec !important; background: #f3f6fc !important; color: var(--asa-navy); box-shadow: none !important;
}
:is(body.gi-skin, body.asa-admin) .input-group-merge .input-group-text { color: var(--asa-muted); }
:is(body.gi-skin, body.asa-admin) .input-group:not(.input-group-merge) > :not(:first-child) { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; }
:is(body.gi-skin, body.asa-admin) .input-group:not(.input-group-merge) > :not(:last-child):not(.dropdown-menu) { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; }
:is(body.gi-skin, body.asa-admin) .form-label { font-weight: 600; color: var(--asa-ink); margin-bottom: .4rem; }
:is(body.gi-skin, body.asa-admin) .form-check-input:checked { background-color: var(--asa-blue); border-color: var(--asa-blue); }
:is(body.gi-skin, body.asa-admin) .form-switch .form-check-input:checked { background-color: var(--asa-navy); }

/* ========================================================= tables */
:is(body.gi-skin, body.asa-admin) .table { --bs-table-hover-bg: #f4f7fd; color: var(--asa-ink); }
:is(body.gi-skin, body.asa-admin) .table :is(thead th, .thead-light th) {
    background: #f1f4fa !important;
    color: var(--asa-muted) !important;
    font-size: .74rem;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    border-bottom: 1px solid var(--asa-line) !important;
    padding-top: .85rem; padding-bottom: .85rem;
}
:is(body.gi-skin, body.asa-admin) .table td { border-color: #edf1f7; vertical-align: middle; padding-top: .8rem; padding-bottom: .8rem; }
:is(body.gi-skin, body.asa-admin) .table-hover tbody tr:hover > * { background-color: #f4f7fd; }
:is(body.gi-skin, body.asa-admin) .table-responsive { border-radius: 0 0 var(--asa-radius) var(--asa-radius); }

/* ========================================================= badges */
:is(body.gi-skin, body.asa-admin) .badge {
    border-radius: 999px; font-weight: 600; letter-spacing: .01em; padding: .38em .75em;
}
:is(body.gi-skin, body.asa-admin) :is(.bg-soft-primary, .badge.bg-soft-primary) { background: #e6eefb !important; color: var(--asa-blue) !important; }
:is(body.gi-skin, body.asa-admin) :is(.bg-warning, .bg-soft-warning) { color: #6b4b00 !important; }
:is(body.gi-skin, body.asa-admin) .bg-soft-warning { background: #fff4d1 !important; }
:is(body.gi-skin, body.asa-admin) .page-item.active .page-link { background: var(--asa-navy); border-color: var(--asa-navy); color: #fff; }
:is(body.gi-skin, body.asa-admin) .page-link { border-radius: 10px; margin: 0 2px; color: var(--asa-navy); }
:is(body.gi-skin, body.asa-admin) .nav-segment .nav-link.active, :is(body.gi-skin, body.asa-admin) .nav-tabs .nav-link.active { color: var(--asa-navy); border-bottom-color: var(--asa-gold); }
:is(body.gi-skin, body.asa-admin) .progress { border-radius: 999px; background: #e9eef7; }
:is(body.gi-skin, body.asa-admin) .progress-bar { background: var(--asa-navy-grad); }
:is(body.gi-skin, body.asa-admin) .alert { border-radius: 14px; border: 0; }
:is(body.gi-skin, body.asa-admin) .alert-soft-success { background: #e4f4e7; color: #0f5f12; border-left: 4px solid var(--asa-green); }
:is(body.gi-skin, body.asa-admin) .alert-soft-danger { border-left: 4px solid #d62839; }
:is(body.gi-skin, body.asa-admin) .alert-soft-warning { border-left: 4px solid var(--asa-gold); }

/* ===================================================== member app bar */
body.gi-skin .gi-appbar {
    background: var(--asa-navy-grad) !important;
    border-bottom: 0 !important;
    box-shadow: 0 8px 24px rgba(11, 42, 111, .28);
}
body.gi-skin .gi-appbar::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--asa-gold-grad);
}
body.gi-skin .gi-appbar__title span { font-weight: 700; letter-spacing: -.005em; }
body.gi-skin .gi-appbar__title small { font-family: var(--asa-font-hi); color: #f5c84c; }
body.gi-skin .gi-appbar__btn { border-radius: 12px; background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .16); }
body.gi-skin .gi-appbar__btn:hover { background: rgba(255, 255, 255, .2); }
body.gi-skin .gi-appbar__avatar { background: var(--asa-gold-grad); color: var(--asa-navy) !important; }
body.gi-skin .asa-sound-btn { border: 1px solid rgba(255, 255, 255, .16); cursor: pointer; padding: 0; }
body.gi-skin .asa-sound-btn[aria-pressed="false"] i { opacity: .55; }
@media (max-width: 400px) { body.gi-skin .asa-sound-btn { width: 36px; height: 36px; } body.gi-skin .gi-appbar__actions { gap: .4rem; } }

/* ===================================================== bottom nav */
body.gi-skin .gi-bottomnav {
    background: rgba(255, 255, 255, .97);
    border-top: 1px solid var(--asa-line);
    box-shadow: 0 -10px 30px rgba(11, 42, 111, .12);
}
body.gi-skin .gi-bottomnav__item, body.gi-skin .gi-bottomnav__fab { color: #8390a8; font-weight: 600; }
body.gi-skin .gi-bottomnav__item.is-active, body.gi-skin .gi-bottomnav__item:hover, body.gi-skin .gi-bottomnav__fab.is-active { color: var(--asa-navy); }
body.gi-skin .gi-bottomnav__item.is-active::before { background: var(--asa-gold-grad); height: 3px; width: 30px; margin-left: -15px; }
body.gi-skin .gi-bottomnav__fab-btn {
    background: var(--asa-navy-grad); color: #fff;
    box-shadow: 0 10px 22px rgba(11, 42, 111, .32), 0 0 0 6px #fff, 0 0 0 7.5px rgba(212, 160, 23, .55);
}
body.gi-skin .gi-bottomnav__fab-btn i { color: #f5c84c; }
body.gi-skin .gi-bottomnav__fab.is-alert .gi-bottomnav__fab-btn i { color: #fff; }

/* ========================================== admin header + sidebar */
body.asa-admin #header.navbar {
    background: #fff !important;
    border-bottom: 1px solid var(--asa-line) !important;
    box-shadow: 0 4px 18px rgba(11, 42, 111, .06);
}
body.asa-admin #header.navbar::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--asa-gold-grad); opacity: .85;
}
body.asa-admin .asa-admin-brand { color: var(--asa-navy); }
body.asa-admin .navbar-vertical-aside.navbar {
    background-color: #0b2a6f !important;
    background-image:
        radial-gradient(circle at 100% 0, rgba(245, 180, 0, .16), transparent 46%),
        linear-gradient(180deg, #0b2a6f 0%, #0a2563 55%, #071b4b 100%) !important;
}
body.asa-admin .navbar-vertical-aside .navbar-brand { border-bottom: 0 !important; position: relative; }
body.asa-admin .navbar-vertical-aside .navbar-brand::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--asa-gold-grad);
}
body.asa-admin .navbar-vertical-aside .nav.nav-vertical.nav-pills .nav-link { font-family: var(--asa-font); font-weight: 500; }
body.asa-admin .navbar-vertical-aside .nav.nav-vertical.nav-pills .nav-link.active { font-weight: 700; }
body.asa-admin .navbar-vertical-aside .navbar-aside-toggler { background-color: #0b2a6f; }
body.asa-admin .navbar-vertical-aside .sidebar-lockup__txt small { font-family: var(--asa-font-hi); color: #f5c84c; }

/* ===================================================== auth pages */
body.gi-auth .card, body.gi-auth .gi-card, body.gi-auth .gi-auth__card { border: var(--asa-hairline) !important; }
body.gi-skin.gi-auth, body.gi-skin.gi-auth .main {
    background: radial-gradient(900px 420px at 50% -8%, #dfe7f8 0%, var(--asa-bg) 62%) !important;
}

/* ===================================================== motion */
html.asa-motion .asa-reveal { opacity: 0; transform: translateY(18px); }
html.asa-motion .asa-reveal.is-in {
    opacity: 1; transform: none;
    transition: opacity .6s cubic-bezier(.2, .7, .2, 1), transform .6s cubic-bezier(.2, .7, .2, 1);
}
@media (hover: hover) {
    html.asa-motion .asa-lift { transition: transform .2s ease, box-shadow .2s ease !important; }
    html.asa-motion .asa-lift:hover { transform: translateY(-3px); box-shadow: var(--asa-shadow-lift) !important; }
}
@media (prefers-reduced-motion: reduce) {
    html .asa-reveal, html.asa-motion .asa-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
    .asa-lift, .asa-lift:hover, :is(body.gi-skin, body.asa-admin) .btn { transition: none !important; transform: none !important; }
    .asa-welcome__bar > span { transition: none !important; }
}

/* ============================================ member WELCOME screen */
body.gi-skin .asa-welcome {
    position: relative;
    overflow: hidden;
    margin-bottom: 1.5rem;
    padding: 1.5rem 1.35rem 1.35rem;
    border-radius: 22px;
    color: #fff;
    background:
        radial-gradient(120% 90% at 100% 0%, rgba(245, 200, 76, .22) 0%, transparent 45%),
        var(--asa-navy-grad);
    box-shadow: 0 18px 40px rgba(11, 42, 111, .28);
    isolation: isolate;
}
body.gi-skin .asa-welcome::before { /* gold foil edge */
    content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1px; pointer-events: none;
    background: var(--asa-gold-grad);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor; mask-composite: exclude;
    z-index: 1;
}
body.gi-skin .asa-welcome::after { /* tricolour hairline */
    content: ""; position: absolute; left: 22px; right: 22px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0;
    background: linear-gradient(90deg, var(--asa-saffron) 0 33.3%, #fff 33.3% 66.6%, var(--asa-green) 66.6% 100%);
    opacity: .9;
}
.asa-welcome__top { display: flex; align-items: center; gap: .9rem; }
.asa-welcome__avatar {
    flex: 0 0 auto; width: 58px; height: 58px; border-radius: 50%; padding: 2px; background: var(--asa-gold-grad);
    display: inline-flex; position: relative;
}
.asa-welcome__avatar > span, .asa-welcome__avatar > img {
    width: 100%; height: 100%; border-radius: 50%; object-fit: cover; background: #0b2a6f;
    display: inline-flex; align-items: center; justify-content: center; font-weight: 800; font-size: 1.35rem; color: #f5c84c;
}
.asa-welcome__dot {
    position: absolute; right: 1px; bottom: 1px; width: 14px; height: 14px; border-radius: 50%;
    background: #d62839; border: 2px solid #0b2a6f;
}
.asa-welcome__dot.is-on { background: #22c55e; }
.asa-welcome__who { min-width: 0; flex: 1 1 auto; }
.asa-welcome__hello { display: block; font-size: .95rem; font-weight: 600; color: #f5c84c; line-height: 1.2; }
body.gi-skin .asa-welcome__name {
    margin: .1rem 0 .3rem; color: #fff !important; font-size: 1.65rem; font-weight: 800; line-height: 1.15;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.asa-welcome__chips { display: flex; flex-wrap: wrap; gap: .4rem; align-items: center; }
.asa-chip {
    display: inline-flex; align-items: center; gap: .3rem; white-space: nowrap;
    padding: .18rem .62rem; border-radius: 999px; font-size: .78rem; font-weight: 600; line-height: 1.4;
    background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .22); color: #fff;
}
.asa-chip--gold { background: var(--asa-gold-grad); border-color: transparent; color: #0b2a6f; font-weight: 700; }
.asa-chip--warn { background: rgba(214, 40, 57, .9); border-color: transparent; }
.asa-chip--ok { background: rgba(34, 197, 94, .18); border-color: rgba(34, 197, 94, .45); }
.asa-welcome__stats {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; margin-top: 1.2rem;
}
.asa-welcome__stat {
    padding: .85rem .95rem; border-radius: 16px; min-width: 0;
    background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14);
}
.asa-welcome__stat small { display: block; color: rgba(255, 255, 255, .72); font-size: .78rem; font-weight: 500; line-height: 1.3; }
.asa-welcome__stat strong {
    display: block; margin-top: .15rem; color: #fff; font-size: 1.45rem; font-weight: 800; line-height: 1.2;
    font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.asa-welcome__stat strong.is-gold { color: #f5c84c; }
.asa-welcome__stat .asa-rank-badge {
    display: inline-flex; align-items: center; gap: .35rem; margin-top: .25rem; padding: .2rem .7rem .2rem .3rem;
    border-radius: 999px; background: rgba(255, 255, 255, .1); border: var(--asa-hairline); color: #fff; font-weight: 700; font-size: .95rem;
    max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.asa-rank-badge__star {
    flex: 0 0 auto; width: 24px; height: 24px; border-radius: 50%; background: var(--asa-gold-grad); color: #0b2a6f;
    display: inline-flex; align-items: center; justify-content: center; font-size: .75rem;
}
.asa-welcome__goal { margin-top: 1rem; padding: .95rem 1rem 1rem; border-radius: 16px; background: rgba(5, 18, 52, .28); border: 1px solid rgba(255, 255, 255, .1); }
.asa-welcome__goal-head { display: flex; align-items: baseline; justify-content: space-between; gap: .6rem; }
.asa-welcome__goal-head small { color: rgba(255, 255, 255, .72); font-size: .78rem; }
.asa-welcome__goal-head strong { color: #fff; font-size: 1.02rem; font-weight: 700; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.asa-welcome__goal-head b { color: #f5c84c; font-weight: 700; white-space: nowrap; font-variant-numeric: tabular-nums; }
.asa-welcome__bar { height: 6px; margin-top: .6rem; border-radius: 999px; background: rgba(255, 255, 255, .14); overflow: hidden; }
.asa-welcome__bar > span { display: block; height: 100%; border-radius: inherit; background: var(--asa-gold-grad); transition: width 1s cubic-bezier(.2, .7, .2, 1); }
.asa-welcome__goal-foot { display: flex; justify-content: space-between; gap: .5rem; margin-top: .4rem; font-size: .76rem; color: rgba(255, 255, 255, .7); font-variant-numeric: tabular-nums; }
.asa-welcome__cta { margin-top: 1rem; }
body.gi-skin .asa-welcome .btn-gold { width: 100%; min-height: 46px; }
@media (min-width: 768px) {
    body.gi-skin .asa-welcome { padding: 1.9rem 2rem 1.7rem; }
    body.gi-skin .asa-welcome__name { font-size: 2rem; }
    .asa-welcome__stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .asa-welcome__stat strong { font-size: 1.7rem; }
}
@media (max-width: 380px) {
    body.gi-skin .asa-welcome__name { font-size: 1.4rem; }
    .asa-welcome__stat strong { font-size: 1.2rem; }
}

/* section spacing - more white space on the member dashboard */
body.gi-skin .gi-dash .gi-section-head, body.gi-skin .gi-dash .dwc-head { margin-top: 1.9rem; margin-bottom: .9rem; }
body.gi-skin .gi-section-title, body.gi-skin .dwc-head__title, body.asa-admin .dwc-head__title {
    font-size: 1.2rem !important; font-weight: 800 !important; color: var(--asa-navy) !important; letter-spacing: -.01em;
}

/* ============================================ admin dashboard hero */
body.asa-admin .dash-hero {
    border-radius: 22px;
    padding: 1.6rem 1.75rem;
    color: #fff;
    border: 1px solid transparent;
    background:
        radial-gradient(120% 120% at 100% 0%, rgba(245, 200, 76, .2) 0%, transparent 45%) padding-box,
        linear-gradient(135deg, #0b2a6f 0%, #12398f 55%, #1e56b8 100%) padding-box,
        linear-gradient(135deg, #fbe7a1 0%, #f5c84c 35%, #d4a017 65%, #b8860b 100%) border-box;
    box-shadow: 0 18px 40px rgba(11, 42, 111, .24);
}
body.asa-admin .dash-hero .dash-hero__glow { display: none; }
body.asa-admin .dash-hero :is(h1, .h2, .h3) { color: #fff !important; }
body.asa-admin .dash-hero .text-cap { color: #f5c84c !important; }
body.asa-admin .dash-hero .dash-chip { background: rgba(255, 255, 255, .12); border-color: rgba(255, 255, 255, .22); color: #fff; }
body.asa-admin .dash-hero .dash-chip i { color: #f5c84c !important; }
body.asa-admin .dash-hero .btn-primary {
    background: linear-gradient(135deg, #fbe7a1 0%, #f5c84c 35%, #d4a017 65%, #b8860b 100%) !important; color: #0b2a6f !important;
}
body.asa-admin .dash-hero .btn-white { background: rgba(255, 255, 255, .1) !important; border-color: rgba(255, 255, 255, .3) !important; color: #fff !important; }
body.asa-admin .dash-hero .btn-white:hover { background: rgba(255, 255, 255, .2) !important; color: #fff !important; }
body.asa-admin .dwc-head__meta strong { color: var(--asa-navy); }

/* Layout QA 2026-10-25: body.gi-app is a flex container, so a wide table inside <main> stretched
   the whole page sideways on phones. Children may shrink to the screen; tables scroll inside their card. */
body.gi-app > header, body.gi-app > main, body.gi-app > .gi-pwa-banner { min-width: 0; max-width: 100%; }
body.gi-app main .content { min-width: 0; }

/* member QA 2026-10-25 */
/* .min-w-0 is used in many member views but was never defined, so flex children refused to shrink */
.min-w-0 { min-width: 0 !important; }
.gi-member .min-w-0 .gi-date { white-space: normal; }
.gi-member .d-flex > .gi-amt-in, .gi-member .d-flex > .gi-amt-out { flex-shrink: 0; }
/* empty-state illustrations (.width-20 = 20rem) must fit a 320px phone */
.gi-member img.width-20 { max-width: 100%; height: auto; }
/* phone stacked tables: label on the left, every child of the cell stacked on the right
   (a cell with several children - badge, name, A/c, IFSC - used to lay them out side by side) */
@media (max-width: 767.98px) {
    .gi-member .gi-stack td:not(.gi-stack__empty) { display: grid; grid-template-columns: 38% minmax(0, 1fr); column-gap: 1rem; row-gap: 0; justify-items: end; align-items: start; }
    .gi-member .gi-stack td:not(.gi-stack__empty)::before { grid-column: 1; grid-row: 1 / span 8; justify-self: start; }
    .gi-member .gi-stack td:not(.gi-stack__empty) > * { grid-column: 2; max-width: 100%; min-width: 0; overflow-wrap: anywhere; }
    .gi-member .gi-stack td .text-nowrap { white-space: normal !important; }
}