/* Paginа: admin/reports.html — CSS extraido automaticamente */
:root {
            --bg-main:#F5F2E9;
            --bg-secondary:#181818;
            --bg-card:rgba(255,255,255,.045);
            --bg-card-strong:rgba(255,255,255,.065);
            --gold:#16804A;
            --gold-soft:rgba(22,128,74,.10);
            --green:#16804A;
            --green-soft:rgba(22,128,74,.10);
            --red:#C93632;
            --red-soft:rgba(201,54,50,.10);
            --text:#111111;
            --text-soft:#3b3b3b;
            --text-muted:#6f6a5f;
            --border:rgba(17,17,17,.10);
            --glass-bg:#FFFFFF;
            --radius:18px;
            --radius-small:13px;
            --nav-height:72px;
            --sidebar-width:270px;
        }

        * {
            box-sizing:border-box;
        }

        html {
            scroll-behavior:smooth;
        }

        body {
            margin:0;
            min-height:100vh;
            background:var(--bg-main);
            color:var(--text);
            font-family:'Montserrat',sans-serif;
            overflow-x:hidden;
        }

        body::before {
            content:"";
            position:fixed;
            inset:0;
            background:
                linear-gradient(rgba(11,11,15,.94),rgba(11,11,15,.98)),
                url("/imagens/logoaya2.png");
            background-position:center;
            background-repeat:no-repeat;
            background-size:430px;
            opacity:.16;
            pointer-events:none;
            z-index:-1;
        }

        a {
            color:inherit;
            text-decoration:none;
        }

        button,
        input,
        select {
            font-family:inherit;
        }

        /* =====================================================
           SIDEBAR — PADRAO CANONICO DO PORTAL
        ===================================================== */
        .sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar-width);height:100vh;background:var(--bg-secondary);border-right:1px solid var(--border);z-index:1050;display:flex;flex-direction:column;overflow-y:auto;overflow-x:hidden;transition:transform .25s ease;}
        .sidebar-brand{display:flex;align-items:center;gap:11px;padding:20px 18px 18px;border-bottom:1px solid var(--border);text-decoration:none;flex-shrink:0;}
        .sidebar-brand img{width:38px;height:38px;object-fit:contain;flex-shrink:0;}
        .sidebar-brand h5{margin:0;color:var(--gold);font-size:15px;font-weight:800;line-height:1.1;letter-spacing:.8px;}
        .sidebar-brand small{display:block;margin-top:2px;color:var(--text-muted);font-size:9px;font-weight:600;letter-spacing:1px;}
        .sidebar-menu{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:2px;}
        .sidebar-section{padding:14px 10px 5px;color:var(--text-muted);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:1.4px;}
        .sidebar-menu a{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:9px;color:var(--text-muted);text-decoration:none;font-size:12px;font-weight:600;transition:.15s ease;}
        .sidebar-menu a i{width:20px;text-align:center;font-size:16px;flex-shrink:0;}
        .sidebar-menu a:hover{background:rgba(255,255,255,.055);color:#fff;}
        .sidebar-menu a.active{background:rgba(255,215,0,.10);color:var(--gold);}
        .sidebar-divider{height:1px;margin:9px 10px;background:rgba(255,255,255,.045);flex-shrink:0;}
        .sidebar-footer{padding:14px 18px;border-top:1px solid var(--border);color:var(--text-muted);font-size:9px;text-align:center;flex-shrink:0;}
        .sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:1040;}
        .sidebar-overlay.show{display:block;}
        .main-content{margin-left:var(--sidebar-width);min-height:100vh;}
        #menuButton{display:none;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--border);border-radius:10px;background:var(--glass-bg);color:var(--text-muted);font-size:18px;cursor:pointer;flex-shrink:0;}
        #menuButton:hover{background:rgba(255,255,255,.075);color:#fff;}

        /* =========================
           MOBILE HEADER
        ========================== */

        .mobile-header {
            display:none;
            position:fixed;
            top:0;
            left:0;
            right:0;
            height:62px;
            z-index:900;
            background:rgba(10,10,14,.93);
            border-bottom:1px solid var(--border);
            backdrop-filter:blur(18px);
            align-items:center;
            justify-content:space-between;
            padding:0 16px;
        }

        .mobile-brand {
            display:flex;
            align-items:center;
            gap:9px;
        }

        .mobile-brand img {
            width:32px;
            height:32px;
            object-fit:contain;
        }

        .mobile-brand strong {
            font-size:13px;
        }

        .mobile-brand span {
            display:block;
            color:var(--text-muted);
            font-size:8px;
            text-transform:uppercase;
            letter-spacing:1px;
        }

        .mobile-menu-btn {
            border:1px solid var(--border);
            background:var(--bg-card);
            color:#fff;
            width:38px;
            height:38px;
            border-radius:11px;
            display:grid;
            place-items:center;
        }

        /* =========================
           MAIN
        ========================== */

        .main {
            margin-left:var(--sidebar-width);
            min-height:100vh;
            padding:28px 30px 40px;
        }

        .page-header {
            display:flex;
            align-items:flex-start;
            justify-content:space-between;
            gap:20px;
            margin-bottom:28px;
        }

        .page-title small {
            display:block;
            color:var(--gold);
            font-size:10px;
            font-weight:700;
            text-transform:uppercase;
            letter-spacing:1.8px;
            margin-bottom:7px;
        }

        .page-title h1 {
            margin:0;
            font-size:27px;
            font-weight:800;
            letter-spacing:-.6px;
        }

        .page-title p {
            margin:7px 0 0;
            color:var(--text-muted);
            font-size:11px;
        }

        .header-actions {
            display:flex;
            gap:8px;
        }

        .btn-aya {
            border:1px solid var(--border);
            background:var(--bg-card);
            color:var(--text-soft);
            border-radius:11px;
            padding:10px 14px;
            font-size:11px;
            font-weight:700;
            transition:.2s;
        }

        .btn-aya:hover {
            color:#fff;
            background:var(--bg-card-strong);
        }

        .btn-gold {
            background:var(--gold);
            color:#111;
            border-color:var(--gold);
        }

        .btn-gold:hover {
            color:#111;
            opacity:.9;
        }

        .icon-btn {
            width:40px;
            height:40px;
            border:1px solid var(--border);
            border-radius:11px;
            background:var(--bg-card);
            color:var(--text-soft);
            display:grid;
            place-items:center;
            transition:.2s;
            position:relative;
        }

        .icon-btn:hover {
            color:var(--gold);
            border-color:rgba(255,215,0,.25);
        }

        /* =========================
           FILTER BAR
        ========================== */

        .filter-bar {
            display:flex;
            align-items:center;
            gap:10px;
            flex-wrap:wrap;
            background:var(--bg-card);
            border:1px solid var(--border);
            border-radius:var(--radius);
            padding:13px;
            margin-bottom:20px;
        }

        .filter-group {
            display:flex;
            align-items:center;
            gap:7px;
        }

        .filter-group label {
            color:var(--text-muted);
            font-size:9px;
            text-transform:uppercase;
            letter-spacing:1px;
            font-weight:700;
        }

        .form-control-aya,
        .form-select-aya {
            min-width:125px;
            border:1px solid var(--border);
            background:#111117;
            color:#eee;
            border-radius:10px;
            padding:9px 11px;
            font-size:10px;
            outline:none;
        }

        .form-control-aya:focus,
        .form-select-aya:focus {
            border-color:rgba(255,215,0,.45);
            box-shadow:0 0 0 3px rgba(255,215,0,.06);
        }

        /* =========================
           KPI
        ========================== */

        .kpi-grid {
            display:grid;
            grid-template-columns:repeat(4,1fr);
            gap:14px;
            margin-bottom:20px;
        }

        .kpi {
            background:var(--bg-card);
            border:1px solid var(--border);
            border-radius:var(--radius);
            padding:18px;
            position:relative;
            overflow:hidden;
        }

        .kpi::after {
            content:"";
            position:absolute;
            right:-35px;
            bottom:-45px;
            width:100px;
            height:100px;
            border-radius:50%;
            background:var(--gold-soft);
            filter:blur(3px);
        }

        .kpi-icon {
            width:38px;
            height:38px;
            border-radius:11px;
            display:grid;
            place-items:center;
            background:var(--gold-soft);
            color:var(--gold);
            margin-bottom:15px;
        }

        .kpi-icon.green {
            color:#63d563;
            background:var(--green-soft);
        }

        .kpi-icon.red {
            color:#ff7168;
            background:var(--red-soft);
        }

        .kpi-label {
            color:var(--text-muted);
            font-size:9px;
            text-transform:uppercase;
            letter-spacing:1px;
            font-weight:700;
        }

        .kpi-value {
            margin-top:5px;
            font-size:25px;
            line-height:1;
            font-weight:800;
        }

        .kpi-info {
            margin-top:8px;
            font-size:9px;
            color:var(--text-muted);
        }

        .positive {
            color:#69d66b;
        }

        .negative {
            color:#ff7168;
        }

        /* =========================
           REPORT GRID
        ========================== */

        .report-grid {
            display:grid;
            grid-template-columns:1.35fr .9fr;
            gap:18px;
            margin-bottom:18px;
        }

        .report-card {
            background:var(--bg-card);
            border:1px solid var(--border);
            border-radius:var(--radius);
            overflow:hidden;
        }

        .card-head {
            display:flex;
            align-items:center;
            justify-content:space-between;
            gap:10px;
            padding:17px 18px;
            border-bottom:1px solid var(--border);
        }

        .card-head h2 {
            margin:0;
            font-size:13px;
            font-weight:800;
        }

        .card-head p {
            margin:4px 0 0;
            color:var(--text-muted);
            font-size:9px;
        }

        .card-head .icon-title {
            display:flex;
            align-items:center;
            gap:9px;
        }

        .title-icon {
            width:30px;
            height:30px;
            display:grid;
            place-items:center;
            border-radius:9px;
            background:var(--gold-soft);
            color:var(--gold);
        }

        .card-body {
            padding:18px;
        }

        /* =========================
           CHART
        ========================== */

        .chart-area {
            height:245px;
            position:relative;
            padding:10px 0 0;
        }

        .chart-grid-lines {
            position:absolute;
            left:38px;
            right:0;
            top:15px;
            bottom:30px;
            display:flex;
            flex-direction:column;
            justify-content:space-between;
        }

        .chart-line {
            width:100%;
            border-top:1px dashed rgba(255,255,255,.07);
        }

        .chart-y {
            position:absolute;
            left:0;
            top:12px;
            bottom:28px;
            width:30px;
            display:flex;
            flex-direction:column;
            justify-content:space-between;
            color:var(--text-muted);
            font-size:8px;
            text-align:right;
        }

        .chart-svg {
            position:absolute;
            left:40px;
            right:0;
            top:15px;
            bottom:28px;
            width:calc(100% - 40px);
            height:calc(100% - 43px);
            overflow:visible;
        }

        .chart-area-fill {
            fill:rgba(255,215,0,.06);
        }

        .chart-path {
            fill:none;
            stroke:var(--gold);
            stroke-width:3;
            stroke-linecap:round;
            stroke-linejoin:round;
        }

        .chart-point {
            fill:#111;
            stroke:var(--gold);
            stroke-width:3;
        }

        .chart-x {
            position:absolute;
            left:40px;
            right:0;
            bottom:0;
            display:grid;
            grid-template-columns:repeat(7,1fr);
            color:var(--text-muted);
            font-size:8px;
            text-align:center;
        }

        /* =========================
           DONUT
        ========================== */

        .donut-wrap {
            min-height:245px;
            display:flex;
            align-items:center;
            justify-content:center;
            gap:25px;
        }

        .donut {
            width:150px;
            height:150px;
            border-radius:50%;
            background:
                conic-gradient(
                    var(--green) 0deg 252deg,
                    var(--gold) 252deg 324deg,
                    var(--red) 324deg 360deg
                );
            display:grid;
            place-items:center;
            position:relative;
            flex-shrink:0;
        }

        .donut::after {
            content:"";
            width:104px;
            height:104px;
            border-radius:50%;
            background:#101015;
            position:absolute;
        }

        .donut-center {
            position:relative;
            z-index:2;
            text-align:center;
        }

        .donut-center strong {
            display:block;
            font-size:25px;
            font-weight:800;
        }

        .donut-center span {
            color:var(--text-muted);
            font-size:8px;
            text-transform:uppercase;
            letter-spacing:1px;
        }

        .legend {
            display:flex;
            flex-direction:column;
            gap:12px;
        }

        .legend-item {
            display:flex;
            align-items:center;
            gap:8px;
            color:var(--text-soft);
            font-size:9px;
        }

        .legend-dot {
            width:8px;
            height:8px;
            border-radius:50%;
            background:var(--green);
        }

        .legend-dot.gold {
            background:var(--gold);
        }

        .legend-dot.red {
            background:var(--red);
        }

        .legend-item strong {
            margin-left:auto;
            color:#fff;
            font-size:10px;
        }

        /* =========================
           BOTTOM REPORTS
        ========================== */

        .bottom-grid {
            display:grid;
            grid-template-columns:1fr 1fr;
            gap:18px;
        }

        .table-wrap {
            overflow-x:auto;
        }

        .aya-table {
            width:100%;
            border-collapse:collapse;
            min-width:520px;
        }

        .aya-table th {
            color:var(--text-muted);
            font-size:8px;
            text-transform:uppercase;
            letter-spacing:1px;
            font-weight:700;
            padding:11px 15px;
            border-bottom:1px solid var(--border);
            white-space:nowrap;
        }

        .aya-table td {
            padding:12px 15px;
            border-bottom:1px solid rgba(255,255,255,.045);
            font-size:10px;
            color:var(--text-soft);
        }

        .aya-table tr:last-child td {
            border-bottom:0;
        }

        .student {
            display:flex;
            align-items:center;
            gap:9px;
        }

        .student-avatar {
            width:30px;
            height:30px;
            border-radius:50%;
            display:grid;
            place-items:center;
            background:rgba(255,255,255,.08);
            color:#fff;
            font-size:9px;
            font-weight:800;
            flex-shrink:0;
        }

        .student strong {
            display:block;
            color:#fff;
            font-size:10px;
        }

        .student span {
            display:block;
            color:var(--text-muted);
            font-size:8px;
            margin-top:2px;
        }

        .progress-aya {
            height:5px;
            min-width:75px;
            background:rgba(255,255,255,.07);
            border-radius:20px;
            overflow:hidden;
        }

        .progress-aya span {
            display:block;
            height:100%;
            border-radius:inherit;
            background:var(--gold);
        }

        .badge-aya {
            display:inline-flex;
            align-items:center;
            padding:4px 7px;
            border-radius:7px;
            font-size:7px;
            font-weight:800;
            text-transform:uppercase;
            letter-spacing:.5px;
            background:var(--gold-soft);
            color:var(--gold);
        }

        .badge-green {
            background:var(--green-soft);
            color:#6dde70;
        }

        .badge-red {
            background:var(--red-soft);
            color:#ff756d;
        }

        /* =========================
           LOCATIONS
        ========================== */

        .location-list {
            display:flex;
            flex-direction:column;
        }

        .location-item {
            display:flex;
            align-items:center;
            gap:12px;
            padding:13px 0;
            border-bottom:1px solid rgba(255,255,255,.045);
        }

        .location-item:last-child {
            border-bottom:0;
        }

        .location-icon {
            width:34px;
            height:34px;
            border-radius:10px;
            display:grid;
            place-items:center;
            background:var(--green-soft);
            color:#67d66a;
            flex-shrink:0;
        }

        .location-info {
            flex:1;
            min-width:0;
        }

        .location-info strong {
            display:block;
            color:#fff;
            font-size:10px;
        }

        .location-info span {
            display:block;
            color:var(--text-muted);
            font-size:8px;
            margin-top:3px;
        }

        .location-number {
            font-size:15px;
            font-weight:800;
        }

        /* =========================
           EMPTY
        ========================== */

        .empty-state {
            text-align:center;
            padding:30px 15px;
            color:var(--text-muted);
        }

        .empty-state i {
            font-size:28px;
            opacity:.5;
        }

        .empty-state p {
            margin:10px 0 0;
            font-size:10px;
        }

        /* =========================
           BOTTOM NAV
        ========================== */

        .mobile-bottom-nav {
            display:none;
        }

        /* =========================
           TOAST
        ========================== */

        .toast-aya {
            position:fixed;
            right:22px;
            bottom:22px;
            z-index:2000;
            background:#17171d;
            border:1px solid var(--border);
            border-radius:13px;
            padding:12px 15px;
            display:none;
            align-items:center;
            gap:9px;
            box-shadow:0 15px 45px rgba(0,0,0,.4);
        }

        .toast-aya i {
            color:var(--gold);
        }

        .toast-aya span {
            font-size:10px;
            color:var(--text-soft);
        }

        /* =========================
           RESPONSIVE
        ========================== */

        @media (max-width:1100px) {
            .kpi-grid {
                grid-template-columns:repeat(2,1fr);
            }

            .report-grid,
            .bottom-grid {
                grid-template-columns:1fr;
            }
        }

        @media (max-width:800px) {
            .mobile-header {
                display:flex;
            }

            .page-title #menuButton {
                display:none;
            }

            .main {
                margin-left:0;
                padding:85px 15px 95px;
            }

            .page-header {
                flex-direction:column;
                margin-bottom:20px;
            }

            .page-title h1 {
                font-size:22px;
            }

            .header-actions {
                width:100%;
            }

            .header-actions .btn-aya {
                flex:1;
            }

            .filter-bar {
                align-items:stretch;
            }

            .filter-group {
                width:100%;
                flex-direction:column;
                align-items:stretch;
            }

            .form-control-aya,
            .form-select-aya {
                width:100%;
            }

            .kpi-grid {
                grid-template-columns:1fr 1fr;
                gap:10px;
            }

            .kpi {
                padding:14px;
            }

            .kpi-value {
                font-size:21px;
            }

            .donut-wrap {
                flex-direction:column;
                gap:20px;
                padding:10px 0 15px;
            }

            .legend {
                width:100%;
            }

            .mobile-bottom-nav {
                position:fixed;
                display:grid;
                grid-template-columns:repeat(4,1fr);
                left:0;
                right:0;
                bottom:0;
                height:var(--nav-height);
                z-index:1000;
                background:rgba(10,10,14,.96);
                border-top:1px solid var(--border);
                backdrop-filter:blur(18px);
            }

            .mobile-nav-item {
                display:flex;
                flex-direction:column;
                align-items:center;
                justify-content:center;
                gap:4px;
                color:var(--text-muted);
                font-size:8px;
                font-weight:700;
            }

            .mobile-nav-item i {
                font-size:19px;
            }

            .mobile-nav-item.active {
                color:var(--gold);
            }

            .toast-aya {
                left:15px;
                right:15px;
                bottom:85px;
            }
        }

        @media (max-width:450px) {
            .kpi-grid {
                grid-template-columns:1fr 1fr;
            }

            .kpi-label {
                font-size:8px;
            }

            .kpi-info {
                font-size:8px;
            }

            .chart-area {
                height:210px;
            }
        }

        @media(max-width:991px){.sidebar{transform:translateX(-100%);}.sidebar.show{transform:translateX(0);}.main-content,.main{margin-left:0;}#menuButton{display:flex;}}
        @media(min-width:992px){#menuButton{display:none;}}
            /* ===== IEPLUS_LIGHT_OVERRIDES : IÊ+ tema claro (estrutura/navegação preta com texto claro) ===== */
        .topbar,.sidebar,.sidebar-header,.bottom-navigation,.bottom-nav,.side-nav,.nav-drawer,.app-nav{background:#111111 !important;}
        .topbar,.topbar *,.sidebar *,.bottom-navigation *,.bottom-navigation a,.bottom-navigation i,.bottom-navigation span{color:rgba(255,255,255,.85) !important;}
        .sidebar a.active,.sidebar .active,.bottom-navigation .active{color:#8FE6B4 !important;}
        .sidebar a.active,.bottom-navigation .active{background:rgba(22,128,74,.30) !important;}