/* CESCAC Contable — Tema formal verde vivo (sidebar clara, marca #025338) */
:root {
    --sidebar-width: 260px;
    --color-accent: #025338;
    --color-accent-hover: #14b8a6;
    --color-accent-dark: #0f766e;
    --color-text: #1e293b;
    --color-text-muted: #475569;
    --sidebar-bg: #f0fdfa;
    --sidebar-border: #ccfbf1;
    --body-bg: #f8fafc;
    --success: #059669;
    --card-radius: 12px;
    --shadow: 0 4px 6px -1px rgba(0,0,0,.06), 0 2px 4px -2px rgba(0,0,0,.04);
    --shadow-hover: 0 10px 15px -3px rgba(0,0,0,.08), 0 4px 6px -4px rgba(0,0,0,.05);
}
body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; background: var(--body-bg); color: var(--color-text); }
/* Sidebar clara — formal, no oscura */
.sidebar {
    width: var(--sidebar-width);
    min-height: 100vh;
    max-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--sidebar-bg);
    border-right: 1px solid var(--sidebar-border);
    box-shadow: 2px 0 12px rgba(2, 83, 56, .06);
    z-index: 1030;
    transition: transform .25s ease, box-shadow .25s ease;
}
.sidebar .sidebar-nav-wrap {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.sidebar .nav-link {
    color: var(--color-text-muted);
    border-radius: 8px;
    margin: 2px 8px;
    padding: 8px 12px;
    font-size: 0.9375rem;
}
.sidebar .nav-link:hover { color: var(--color-accent-dark); background: rgba(2, 83, 56, .12); }
.sidebar .nav-link.active { color: #fff; background: var(--color-accent); font-weight: 600; }
.sidebar .brand { font-weight: 700; letter-spacing: -0.02em; color: var(--color-accent-dark); }
/* Logo/área venían con text-white (sidebar oscura); en barra clara forzamos texto verde oscuro */
.sidebar .text-white { color: var(--color-accent-dark) !important; }
.sidebar .nav-link.active,
.sidebar .nav-link.active i { color: #fff !important; }
.main-content { margin-left: var(--sidebar-width); min-height: 100vh; padding: 1rem 1.25rem; }
.sidebar-toggle {
    display: none;
    position: fixed;
    top: .75rem;
    left: .75rem;
    z-index: 1031;
    width: 44px;
    height: 44px;
    padding: 0;
    border-radius: 10px;
    background: var(--color-accent);
    color: #fff;
    border: 1px solid rgba(255,255,255,.25);
    box-shadow: var(--shadow);
    align-items: center;
    justify-content: center;
}
.sidebar-toggle:hover { background: var(--color-accent-hover); color: #fff; }
.sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, .35);
    z-index: 1025;
    opacity: 0;
    transition: opacity .25s ease;
}
.sidebar-overlay.is-open { display: block; opacity: 1; }
@media (max-width: 991px) {
    .sidebar {
        position: fixed;
        top: 0;
        left: 0;
        width: min(280px, 85vw);
        max-height: 100vh;
        transform: translateX(-100%);
        box-shadow: none;
    }
    .sidebar.is-open { transform: translateX(0); box-shadow: 8px 0 24px rgba(0,0,0,.12); }
    .main-content { margin-left: 0; padding-top: 3.5rem; padding-left: .75rem; padding-right: .75rem; }
    .sidebar-toggle { display: flex; }
}
@media (min-width: 992px) {
    .sidebar-overlay.is-open { display: none !important; }
}
.card {
    border: none;
    border-radius: var(--card-radius);
    box-shadow: var(--shadow);
    border: 1px solid #e2e8f0;
    transition: box-shadow .2s ease, transform .2s ease;
}
.card:hover { box-shadow: var(--shadow-hover); }
.table { border-radius: var(--card-radius); overflow: hidden; }
.table thead th { background: #ecfdf5; font-weight: 600; color: var(--color-accent-dark); border-bottom: 2px solid #99f6e4; }
.btn { border-radius: 8px; font-weight: 500; }
.btn-primary { background: var(--color-accent); border-color: #025338; color: #fff; }
.btn-primary:hover, .btn-primary:focus { background: var(--color-accent-hover); border-color: var(--color-accent-hover); color: #fff; }
h1.h4 { font-weight: 700; color: var(--color-accent-dark); }
.badge { font-weight: 500; padding: .35em .65em; }
.alert { border: none; border-radius: 10px; }
.main-content .text-primary { color: var(--color-accent) !important; }
.main-content a:not(.btn):not(.nav-link) { color: var(--color-accent-dark); }
.main-content a:not(.btn):not(.nav-link):hover { color: var(--color-accent); }
@media (max-width: 991px) {
    .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .main-content .card-body { padding: 0.75rem; }
    .main-content .btn { padding: 0.4rem 0.75rem; font-size: 0.875rem; }
}

/* --- UX P2: jerarquía en pantallas clave (Contable 2026-05-04) --- */
.text-accent { color: var(--color-accent-dark) !important; }
.page-hero { border-color: var(--sidebar-border) !important; }
.page-hero h1.h3 { letter-spacing: -0.02em; }
.main-content .card-header { font-size: 0.95rem; }
.main-content table thead th { font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--color-text-muted); border-bottom-width: 1px; }