/* ═══════════════════════════════════════════════════════════
   ERP Applied — shell chrome for ACC ERP modules
   Layered on spa/Sidebar/TabManager without rewriting sections
═══════════════════════════════════════════════════════════ */


:root {
    --erp-ink: #0B1220;
    --erp-slate: #1E293B;
    --erp-muted: #64748B;
    --erp-line: #E2E8F0;
    --erp-paper: #F8FAFC;
    --erp-card: #FFFFFF;
    --erp-accent: #0E7490;
    --erp-accent-soft: #ECFEFF;
    --erp-gold: #B45309;
    --erp-shadow: 0 16px 40px rgba(15, 23, 42, .08);
    --erp-font: 'Vazirmatn', 'DM Sans', system-ui, sans-serif;
    --erp-ui: 'DM Sans', 'Vazirmatn', system-ui, sans-serif;
}

/* Global: display:flex must not defeat [hidden] (wholesale/election bug class) */
[hidden] {
    display: none !important;
}

body {
    font-family: var(--erp-font);
    background: var(--erp-paper);
    color: var(--erp-ink);
}

.acc-spa-root {
    font-family: var(--erp-font);
}

/* ── Brand shell header ── */
.erp-shell-header {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 10px 20px;
    background: linear-gradient(105deg, #0B1220 0%, #164E63 55%, #0E7490 100%);
    color: #fff;
    border-bottom: 1px solid rgba(255,255,255,.08);
    flex-shrink: 0;
    z-index: 40;
}
.erp-shell-header[hidden] { display: none !important; }

.erp-shell-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    color: inherit;
    min-width: 0;
}
.erp-shell-brand__mark {
    width: 36px; height: 36px;
    border-radius: 8px;
    background: linear-gradient(135deg, #22D3EE, #0E7490);
    display: flex; align-items: center; justify-content: center;
    font-family: var(--erp-ui);
    font-weight: 800;
    font-size: .95rem;
    color: #0B1220;
    box-shadow: 0 8px 20px rgba(34, 211, 238, .35);
}
.erp-shell-brand__text { display: flex; flex-direction: column; line-height: 1.15; }
.erp-shell-brand__name {
    font-family: var(--erp-ui);
    font-weight: 800;
    font-size: 1.05rem;
    letter-spacing: -.02em;
}
.erp-shell-brand__name em {
    font-style: normal;
    color: #67E8F9;
    font-weight: 700;
}
.erp-shell-brand__sub {
    font-size: .62rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: rgba(255,255,255,.55);
    font-weight: 600;
}

.erp-shell-links {
    display: flex; align-items: center; gap: 4px;
    margin-inline-start: 12px;
}
.erp-shell-links a {
    color: rgba(255,255,255,.7);
    text-decoration: none;
    font-size: .78rem;
    font-weight: 600;
    padding: 6px 10px;
    border-radius: 6px;
}
.erp-shell-links a:hover {
    background: rgba(255,255,255,.1);
    color: #fff;
}

.erp-shell-user {
    margin-inline-start: auto;
    display: flex;
    align-items: center;
    gap: 10px;
}
.erp-shell-user__name {
    font-size: .88rem;
    font-weight: 700;
}
.erp-shell-user__role {
    font-size: .72rem;
    font-weight: 700;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(180, 83, 9, .95);
    color: #fff;
}
.erp-shell-logout {
    border: 1px solid rgba(255,255,255,.3);
    background: rgba(255,255,255,.08);
    color: #fff;
    border-radius: 8px;
    padding: 8px 14px;
    font-family: inherit;
    font-size: .82rem;
    font-weight: 700;
    cursor: pointer;
    transition: background .15s, border-color .15s;
}
.erp-shell-logout:hover {
    background: rgba(255,255,255,.18);
    border-color: #67E8F9;
}

/* ── Workspace ── */
.acc-workspace {
    background: var(--erp-paper);
}

.acc-tabbar {
    height: 40px;
    padding: 0 10px;
    gap: 4px;
    background: #0F172A;
    border-bottom: 1px solid #1E293B;
}
.acc-tabbar .acc-tab,
.acc-tab {
    border-radius: 8px 8px 0 0 !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
}

/* ── Module header (BaseView) ── */
.bv-hdr {
    background: var(--erp-card) !important;
    border-bottom: 1px solid var(--erp-line) !important;
    box-shadow: 0 1px 0 rgba(15,23,42,.04);
    padding: 12px 18px !important;
}
.bv-hdr .bv-title,
.bv-title {
    font-family: var(--erp-ui) !important;
    font-weight: 800 !important;
    color: var(--erp-ink) !important;
    font-size: 1.05rem !important;
}

/* ── Sidebar module tiles ── */
.acc-menu-wrapper {
    padding: 28px 0 48px !important;
    background:
        radial-gradient(ellipse 80% 50% at 50% -10%, rgba(14,116,144,.08), transparent 60%),
        var(--erp-paper);
}
.acc-card-grid {
    gap: 18px !important;
    max-width: 1180px !important;
}
.acc-card-item {
    border-radius: 14px !important;
    border: 1px solid var(--erp-line) !important;
    box-shadow: var(--erp-shadow) !important;
    padding: 22px 20px !important;
    background: var(--erp-card) !important;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease !important;
}
.acc-card-item:hover {
    transform: translateY(-5px) !important;
    border-color: var(--erp-accent) !important;
    box-shadow: 0 22px 50px rgba(14, 116, 144, .14) !important;
}
.acc-card-icon {
    font-size: 1.75rem !important;
    width: 48px; height: 48px;
    display: inline-flex !important;
    align-items: center; justify-content: center;
    background: var(--erp-accent-soft);
    border-radius: 12px;
}
.acc-card-title {
    font-family: var(--erp-ui) !important;
    font-weight: 800 !important;
    font-size: 1.05rem !important;
    color: var(--erp-ink) !important;
}
.acc-card-desc {
    color: var(--erp-muted) !important;
    font-weight: 500 !important;
}

/* Unify section nav cards slightly */
.sp-nav-card,
.acc-nav-card {
    border-radius: 12px !important;
    transition: transform .15s, box-shadow .15s !important;
}
.sp-nav-card:hover,
.acc-nav-card:hover {
    transform: translateY(-2px);
}

@media (max-width: 720px) {
    .erp-shell-links { display: none; }
    .erp-shell-brand__sub { display: none; }
    .erp-shell-user__role { display: none; }
    .acc-card-grid {
        grid-template-columns: 1fr 1fr !important;
        width: 94% !important;
    }
}
