/* ====================================================================
   AcademiaOS - Tema futurista (Bootstrap 5 + custom)
   Variaveis de marca sao injetadas inline por empresa (white-label).
   ==================================================================== */
/* Fonte Poppins (self-hosted, usada no template Focar) */
@font-face{font-family:'Poppins';font-style:normal;font-weight:400;font-display:swap;src:url('../vendor/fonts/poppins/poppins-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:500;font-display:swap;src:url('../vendor/fonts/poppins/poppins-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:600;font-display:swap;src:url('../vendor/fonts/poppins/poppins-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:700;font-display:swap;src:url('../vendor/fonts/poppins/poppins-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'Poppins';font-style:normal;font-weight:800;font-display:swap;src:url('../vendor/fonts/poppins/poppins-latin-800-normal.woff2') format('woff2')}
:root{
    --cor-primaria:#6C5CE7;
    --cor-secundaria:#00CEC9;
    --cor-destaque:#FD79A8;
    --bg-dark:#0f1020;
    --bg-dark-2:#171a2e;
    --bg-card:#ffffff;
    --txt:#1f2330;
    --muted:#7a8194;
    --border:#e7e9f2;
    --radius:18px;
    --shadow:0 12px 40px rgba(20,22,60,.10);
    --portal:var(--cor-primaria);
    font-family:'Segoe UI',system-ui,-apple-system,sans-serif;
}
*{box-sizing:border-box}
body{margin:0;color:var(--txt);background:#f4f5fb}

/* ---------- Botoes de marca ---------- */
.btn-portal{
    background:linear-gradient(135deg,var(--portal),color-mix(in srgb,var(--portal) 55%,#000));
    border:none;color:#fff;font-weight:600;border-radius:12px;padding:.6rem 1.4rem;
    box-shadow:0 8px 22px color-mix(in srgb,var(--portal) 40%,transparent);transition:.2s;
}
.btn-portal:hover{transform:translateY(-2px);color:#fff;filter:brightness(1.08)}
.btn-portal-outline{
    background:transparent;border:1.5px solid var(--portal);color:var(--portal);
    font-weight:600;border-radius:12px;padding:.55rem 1.3rem;transition:.2s;
}
.btn-portal-outline:hover{background:var(--portal);color:#fff}

/* ====================================================================
   LANDING
   ==================================================================== */
.landing-body{background:var(--bg-dark);color:#e9ebf5;overflow-x:hidden}
.landing-nav{
    display:flex;align-items:center;gap:1.5rem;padding:1.1rem 6%;position:sticky;top:0;z-index:50;
    background:rgba(15,16,32,.72);backdrop-filter:blur(14px);border-bottom:1px solid rgba(255,255,255,.06);
}
.landing-nav .brand,.landing-footer .brand{font-size:1.4rem;font-weight:800;color:#fff;text-decoration:none}
.brand span{color:var(--cor-secundaria)}
.landing-nav-links{margin-left:auto;display:flex;gap:1.6rem}
.landing-nav-links a{color:#c3c7da;text-decoration:none;font-weight:500}
.landing-nav-links a:hover{color:#fff}
.landing-burger{display:none;background:none;border:0;color:#fff;font-size:1.55rem;line-height:1;cursor:pointer;padding:.15rem .35rem}
.entrar-dd .dropdown-toggle{display:inline-flex;align-items:center;gap:.4rem}
.entrar-menu{background:#171a2e;border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:.45rem;
    min-width:210px;box-shadow:0 16px 44px rgba(0,0,0,.45);margin-top:.6rem}
.entrar-menu .entrar-titulo{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:#8b90ad;padding:.4rem .7rem .2rem}
.entrar-menu .dropdown-item{color:#dfe2f2;border-radius:9px;padding:.6rem .7rem;display:flex;align-items:center;gap:.7rem;font-weight:500}
.entrar-menu .dropdown-item:hover{background:rgba(255,255,255,.09);color:#fff}
.entrar-menu .dropdown-item .bi{color:var(--cor-secundaria);width:18px;text-align:center}

.hero{position:relative;padding:6rem 6% 5rem;text-align:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0;
    background:
        radial-gradient(60% 60% at 20% 10%,color-mix(in srgb,var(--cor-primaria) 45%,transparent),transparent 60%),
        radial-gradient(50% 50% at 85% 20%,color-mix(in srgb,var(--cor-secundaria) 40%,transparent),transparent 60%),
        radial-gradient(50% 60% at 60% 100%,color-mix(in srgb,var(--cor-destaque) 35%,transparent),transparent 60%);
    filter:blur(10px);opacity:.9;animation:floaty 12s ease-in-out infinite alternate}
@keyframes floaty{from{transform:translateY(0)}to{transform:translateY(-18px)}}
.hero-content{position:relative;z-index:1;max-width:880px;margin:0 auto}
.hero-badge{display:inline-flex;gap:.5rem;align-items:center;background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.15);padding:.45rem 1rem;border-radius:30px;font-size:.85rem;color:#dfe2f2}
.hero h1{font-size:clamp(2.4rem,6vw,4.2rem);font-weight:800;margin:1.4rem 0;line-height:1.05;color:#fff}
.grad-text{background:linear-gradient(120deg,var(--cor-secundaria),var(--cor-destaque));
    -webkit-background-clip:text;background-clip:text;color:transparent}
.hero p{font-size:1.15rem;color:#b8bcd4;max-width:620px;margin:0 auto 2rem}
.hero-cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.hero-stats{display:flex;gap:2.5rem;justify-content:center;flex-wrap:wrap;margin-top:3.5rem}
.hero-stats div{display:flex;flex-direction:column}
.hero-stats strong{font-size:1.8rem;color:#fff}
.hero-stats span{color:#9aa0bd;font-size:.85rem}

.section{padding:5rem 6%}
.section-alt{background:var(--bg-dark-2)}
.section-head{text-align:center;max-width:680px;margin:0 auto 3rem}
.section-head h2{font-size:2.2rem;font-weight:800;color:#fff}
.section-head p{color:#9aa0bd}

.portais-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;max-width:1100px;margin:0 auto}
.portal-card{background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.02));
    border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:2rem;text-decoration:none;
    color:#e9ebf5;transition:.25s;position:relative;overflow:hidden}
.portal-card:hover{transform:translateY(-6px);border-color:var(--pc);box-shadow:0 18px 50px color-mix(in srgb,var(--pc) 35%,transparent)}
.portal-ic{width:62px;height:62px;border-radius:16px;display:grid;place-items:center;font-size:1.7rem;color:#fff;
    background:linear-gradient(135deg,var(--pc),color-mix(in srgb,var(--pc) 50%,#000));margin-bottom:1.2rem}
.portal-card h3{font-size:1.25rem;color:#fff}
.portal-card p{color:#a7accb;font-size:.95rem}
.portal-link{color:var(--pc,var(--cor-secundaria));font-weight:600}

.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem;max-width:1150px;margin:0 auto}
.feature-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:var(--radius);padding:1.8rem}
.feature-ic{width:54px;height:54px;border-radius:14px;display:grid;place-items:center;font-size:1.5rem;color:#fff;
    background:linear-gradient(135deg,var(--cor-primaria),var(--cor-secundaria));margin-bottom:1rem}
.feature-card h3{font-size:1.15rem;color:#fff}
.feature-card p{color:#a7accb;font-size:.92rem;margin:0}

.planos-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.5rem;max-width:1050px;margin:0 auto}
.plano-card{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius);padding:2rem;position:relative}
.plano-destaque{border-color:var(--cor-secundaria);background:linear-gradient(160deg,color-mix(in srgb,var(--cor-primaria) 22%,transparent),rgba(255,255,255,.03));transform:scale(1.04)}
.plano-tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--cor-secundaria);color:#08251f;
    font-size:.75rem;font-weight:700;padding:.25rem .9rem;border-radius:20px}
.plano-card h3{color:#fff}
.plano-preco{font-size:2.2rem;font-weight:800;color:#fff;margin:.5rem 0 1rem}
.plano-preco small{font-size:.9rem;color:#9aa0bd;font-weight:500}
.plano-card ul{list-style:none;padding:0;margin:0 0 1.5rem}
.plano-card li{color:#c3c7da;padding:.35rem 0}
.plano-card li i{color:var(--cor-secundaria)}

.cta{padding:5rem 6%}
.cta-box{background:linear-gradient(135deg,var(--cor-primaria),var(--cor-destaque));border-radius:28px;
    text-align:center;padding:3.5rem 2rem;max-width:900px;margin:0 auto;color:#fff}
.cta-box h2{font-weight:800}
.landing-footer{background:#0a0b18;padding:2.5rem 6%;text-align:center;color:#8b90ad}
.footer-portais{display:flex;gap:1.2rem;justify-content:center;margin-top:1rem}
.footer-portais a{color:#c3c7da;text-decoration:none}

.cursos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem;max-width:1150px;margin:0 auto}
.curso-card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.2s}
.curso-card:hover{transform:translateY(-5px)}
.curso-capa{height:150px;display:grid;place-items:center;font-size:3rem;color:#fff}
.curso-body{padding:1.2rem}
.curso-cat{font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--cor-primaria)}
.curso-body h3{font-size:1.1rem;color:var(--txt);margin:.3rem 0}
.curso-meta{color:var(--muted);font-size:.85rem;margin-bottom:1rem}
.curso-meta .bi-star-fill{color:#fdcb6e}

/* ====================================================================
   AUTH (login)
   ==================================================================== */
.auth-body{background:var(--bg-dark);min-height:100vh}
.auth-wrapper{display:grid;grid-template-columns:1fr 1fr;min-height:100vh}
.auth-brand{position:relative;background:linear-gradient(160deg,var(--bg-dark-2),var(--bg-dark));
    padding:4rem;display:flex;align-items:center;overflow:hidden}
.auth-brand-glow{position:absolute;inset:0;
    background:radial-gradient(50% 50% at 30% 30%,color-mix(in srgb,var(--portal) 55%,transparent),transparent 60%),
              radial-gradient(40% 40% at 80% 80%,color-mix(in srgb,var(--cor-secundaria) 45%,transparent),transparent 60%);
    filter:blur(20px);animation:floaty 10s ease-in-out infinite alternate}
.auth-brand-content{position:relative;z-index:1;color:#fff;max-width:420px}
.auth-logo{font-size:1.6rem;font-weight:800;color:#fff;text-decoration:none}
.auth-logo span{color:var(--cor-secundaria)}
.auth-brand h1{font-size:2.6rem;font-weight:800;margin:1.5rem 0 1rem;line-height:1.1}
.auth-brand p{color:#b8bcd4}
.auth-features{list-style:none;padding:0;margin-top:1.5rem}
.auth-features li{padding:.4rem 0;color:#d4d7ea}
.auth-features i{color:var(--cor-secundaria);margin-right:.4rem}
.auth-form-side{display:flex;align-items:center;justify-content:center;padding:2rem;background:#f4f5fb}
.auth-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);padding:2.6rem;width:100%;max-width:420px;position:relative}
.auth-portal-badge{width:60px;height:60px;border-radius:16px;display:grid;place-items:center;font-size:1.6rem;color:#fff;
    background:linear-gradient(135deg,var(--portal),color-mix(in srgb,var(--portal) 50%,#000));margin-bottom:1rem}
.auth-card h2{font-weight:800;font-size:1.5rem}
.auth-card .input-group-text{background:#f0f1f8;border-color:var(--border);color:var(--muted)}
.auth-card .form-control{border-color:var(--border);padding:.6rem .9rem}
.auth-card .form-control:focus{border-color:var(--portal);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--portal) 25%,transparent)}
.auth-switch{margin-top:1.4rem;font-size:.9rem;color:var(--muted);display:flex;gap:.8rem;flex-wrap:wrap;align-items:center}
.auth-switch a{color:var(--portal);font-weight:600;text-decoration:none}
.auth-demo{margin-top:1.2rem;background:#f0f1f8;border-radius:10px;padding:.6rem .8rem;font-size:.82rem;color:var(--muted)}
@media(max-width:860px){.auth-wrapper{grid-template-columns:1fr}.auth-brand{display:none}}

/* ====================================================================
   APP SHELL (areas internas)
   ==================================================================== */
.app-body{background:#f4f5fb}
.app-shell{display:flex;min-height:100vh}
.app-sidebar{width:260px;background:linear-gradient(180deg,var(--bg-dark),var(--bg-dark-2));color:#cfd3e8;
    display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:40;transition:.25s}
.sidebar-brand{display:flex;align-items:center;gap:.7rem;padding:1.4rem 1.5rem;font-weight:800;color:#fff;font-size:1.15rem;
    border-bottom:1px solid rgba(255,255,255,.07)}
.sidebar-brand .bi{color:var(--cor-secundaria);font-size:1.5rem}
.sidebar-logo-img{width:34px;height:34px;border-radius:8px;object-fit:cover}
.sidebar-nav{flex:1;overflow-y:auto;padding:1rem .8rem;scroll-behavior:smooth;overscroll-behavior:contain;
    scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.18) transparent;scrollbar-gutter:stable}
/* Barra de rolagem personalizada do menu lateral (WebKit/Chromium) */
.sidebar-nav::-webkit-scrollbar{width:8px}
.sidebar-nav::-webkit-scrollbar-track{background:transparent;margin:6px 0}
.sidebar-nav::-webkit-scrollbar-thumb{
    background:linear-gradient(180deg,color-mix(in srgb,var(--cor-secundaria) 55%,transparent),color-mix(in srgb,var(--cor-primaria) 55%,transparent));
    border-radius:20px;border:2px solid transparent;background-clip:padding-box;transition:background .2s}
.sidebar-nav::-webkit-scrollbar-thumb:hover{
    background:linear-gradient(180deg,var(--cor-secundaria),var(--cor-primaria));background-clip:padding-box}
.sidebar-nav::-webkit-scrollbar-thumb:active{background:var(--cor-primaria);background-clip:padding-box}
/* No menu recolhido (rail) a barra some para não poluir */
.app-shell.collapsed .sidebar-nav{scrollbar-width:none}
.app-shell.collapsed .sidebar-nav::-webkit-scrollbar{width:0}
.nav-item{display:flex;align-items:center;gap:.8rem;padding:.7rem .9rem;border-radius:12px;color:#aeb3d0;
    text-decoration:none;margin-bottom:.2rem;font-weight:500;position:relative;transition:.18s}
.nav-item:hover{background:rgba(255,255,255,.06);color:#fff}
.nav-item.active{background:linear-gradient(135deg,var(--cor-primaria),color-mix(in srgb,var(--cor-primaria) 55%,#000));color:#fff;
    box-shadow:0 8px 20px color-mix(in srgb,var(--cor-primaria) 35%,transparent)}
.nav-item .bi{font-size:1.1rem;width:20px;text-align:center}
.nav-item.em-breve{opacity:.55;cursor:default}
.badge-soon{position:absolute;right:.7rem;font-size:.6rem;background:rgba(255,255,255,.12);padding:.1rem .4rem;border-radius:6px}
.sidebar-foot{padding:.8rem;border-top:1px solid rgba(255,255,255,.07)}
.nav-group{margin:.4rem 0}
.nav-group-title{display:flex;align-items:center;gap:.5rem;padding:.45rem .9rem;font-size:.72rem;font-weight:700;
    text-transform:uppercase;letter-spacing:.04em;color:#7e84a3}
.nav-group-title .bi{font-size:.85rem;color:var(--cor-secundaria)}
.nav-group .nav-item{margin-left:.4rem}
.app-shell.collapsed .nav-group-title span{display:none}
.app-shell.collapsed .nav-group-title{justify-content:center}

.app-main{flex:1;margin-left:260px;display:flex;flex-direction:column;min-width:0}
.app-topbar{display:flex;align-items:center;gap:1rem;background:#fff;padding:1rem 1.8rem;
    box-shadow:0 2px 12px rgba(20,22,60,.05);position:sticky;top:0;z-index:30}
.btn-burger{display:none;border:none;background:none;font-size:1.4rem;color:var(--txt)}
.topbar-title{font-size:1.3rem;font-weight:700;margin:0}
.topbar-right{margin-left:auto;display:flex;align-items:center;gap:1rem}
.badge-perfil{background:color-mix(in srgb,var(--cor-primaria) 15%,transparent);color:var(--cor-primaria);
    font-weight:600;font-size:.8rem;padding:.35rem .8rem;border-radius:20px}
.topbar-user{display:flex;align-items:center;gap:.7rem}
.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:700;
    background:linear-gradient(135deg,var(--cor-primaria),var(--cor-destaque))}
.user-nome{font-weight:600;font-size:.9rem;line-height:1}
.user-mail{font-size:.78rem;color:var(--muted)}
.app-content{padding:1.8rem;flex:1}

/* KPIs */
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.2rem;margin-bottom:1.4rem}
.kpi-card{background:#fff;border-radius:var(--radius);padding:1.4rem;display:flex;align-items:center;gap:1rem;box-shadow:var(--shadow)}
.kpi-icon{width:56px;height:56px;border-radius:14px;display:grid;place-items:center;font-size:1.5rem;color:#fff}
.kpi-primaria .kpi-icon{background:linear-gradient(135deg,var(--cor-primaria),color-mix(in srgb,var(--cor-primaria) 55%,#000))}
.kpi-secundaria .kpi-icon{background:linear-gradient(135deg,var(--cor-secundaria),color-mix(in srgb,var(--cor-secundaria) 55%,#000))}
.kpi-destaque .kpi-icon{background:linear-gradient(135deg,var(--cor-destaque),color-mix(in srgb,var(--cor-destaque) 55%,#000))}
.kpi-valor{font-size:1.8rem;font-weight:800;line-height:1}
.kpi-label{color:var(--muted);font-size:.9rem}

/* Paineis */
.panel{background:#fff;border-radius:var(--radius);padding:1.6rem;box-shadow:var(--shadow)}
.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.2rem;gap:1rem}
.panel-head h3{font-size:1.1rem;font-weight:700;margin:0}
.panel-head .bi{color:var(--cor-primaria)}
.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
.quick-action{display:flex;flex-direction:column;gap:.4rem;padding:1rem;border-radius:14px;background:#f4f5fb;
    text-decoration:none;color:var(--txt);font-weight:600;font-size:.9rem;transition:.18s}
.quick-action:hover{background:color-mix(in srgb,var(--cor-primaria) 12%,transparent);color:var(--cor-primaria)}
.quick-action .bi{font-size:1.4rem;color:var(--cor-primaria)}
.quick-action.em-breve{opacity:.6}
.module-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}
.module-card{background:#f4f5fb;border-radius:14px;padding:1.2rem;text-align:center;color:var(--txt);transition:.18s;border:1px solid var(--border);text-decoration:none;display:block;cursor:pointer}
.module-card:hover{border-color:var(--cor-primaria);transform:translateY(-3px);color:var(--cor-primaria);box-shadow:0 8px 20px color-mix(in srgb,var(--cor-primaria) 18%,transparent)}
.module-card:hover .bi{color:var(--cor-primaria)}
.module-card .bi{font-size:1.8rem;color:var(--cor-primaria);display:block;margin-bottom:.5rem}
.module-card span{font-size:.85rem;font-weight:600}
.empty-state{text-align:center;padding:2.5rem 1rem;color:var(--muted)}
.empty-state .bi{font-size:3rem;color:var(--border);display:block;margin-bottom:.8rem}

@media(max-width:992px){
    .app-sidebar{transform:translateX(-100%)}
    .app-sidebar.open{transform:translateX(0)}
    .app-main{margin-left:0}
    .btn-burger{display:block}
}

/* ---- Landing page: ajustes para mobile ---- */
@media(max-width:768px){
    .landing-nav{padding:.8rem 5%;gap:.5rem;flex-wrap:nowrap}
    .landing-nav .brand,.landing-footer .brand{font-size:1.2rem}
    .landing-burger{display:inline-flex;align-items:center}
    .entrar-dd{margin-left:auto}
    /* Links viram um painel deslizante (hambúrguer) */
    .landing-nav-links{
        position:absolute;top:100%;left:0;right:0;margin:0;
        flex-direction:column;gap:0;font-size:1rem;
        background:rgba(15,16,32,.98);backdrop-filter:blur(14px);
        border-bottom:1px solid rgba(255,255,255,.08);
        max-height:0;overflow:hidden;opacity:0;pointer-events:none;padding:0 5%;
        transition:max-height .25s ease,opacity .2s ease,padding .2s ease;
    }
    .landing-nav.menu-open .landing-nav-links{max-height:70vh;opacity:1;pointer-events:auto;padding:.4rem 5% .8rem}
    .landing-nav-links a{padding:.85rem .2rem;border-bottom:1px solid rgba(255,255,255,.06);width:100%}
    .landing-nav-links a:last-child{border-bottom:0}
    .hero{padding:3.4rem 5% 2.8rem}
    .hero-badge{font-size:.78rem}
    .hero p{font-size:1rem;padding:0 .4rem}
    .hero-stats{gap:1.6rem;margin-top:2.2rem}
    .hero-stats strong{font-size:1.45rem}
    .section,.cta{padding:3rem 5%}
    .section-head{margin-bottom:2rem}
    .section-head h2{font-size:1.6rem}
    .portal-card,.feature-card,.plano-card{padding:1.5rem}
    .plano-destaque{transform:none}
    .plano-preco{font-size:1.9rem}
    .cta-box{padding:2.4rem 1.2rem;border-radius:20px}
    .landing-footer{padding:2rem 5%}
}
@media(max-width:480px){
    .landing-nav-links{width:100%;gap:.7rem 1rem}
    .hero h1{margin:1rem 0}
    .hero-cta{flex-direction:column}
    .hero-cta .btn,.hero-cta > a{width:100%;justify-content:center}
    .hero-stats{gap:1rem 1.4rem}
    .section-head h2{font-size:1.4rem}
}

/* ====================================================================
   CRUD (listas, toolbar, tabelas, formularios)
   ==================================================================== */
.crud-toolbar{display:flex;align-items:center;gap:1rem;margin-bottom:1.2rem;flex-wrap:wrap}
.crud-toolbar .search{flex:1;max-width:380px;position:relative}
.crud-toolbar .search input{padding-left:2.4rem;border-radius:12px;border:1px solid var(--border)}
.crud-toolbar .search .bi{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);color:var(--muted)}
.crud-toolbar .ms-auto{margin-left:auto}
.fin-select{position:relative;display:inline-flex;align-items:center}
.fin-select .bi{position:absolute;left:.6rem;color:var(--muted);font-size:.85rem;pointer-events:none}
.fin-select select{appearance:none;-webkit-appearance:none;padding:.42rem 1.8rem .42rem 1.9rem;border:1px solid var(--border);
    border-radius:10px;background:#fff;color:var(--text);font-size:.82rem;font-weight:600;cursor:pointer;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 16 16'><path fill='%237a8194' d='M4 6l4 4 4-4z'/></svg>");
    background-repeat:no-repeat;background-position:right .6rem center}
.fin-select select:focus{outline:none;border-color:var(--c1,#6C5CE7);box-shadow:0 0 0 2px rgba(108,92,231,.12)}

.data-table{width:100%;border-collapse:separate;border-spacing:0}
.data-table thead th{text-align:left;font-size:.78rem;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);
    padding:.8rem 1rem;border-bottom:2px solid var(--border)}
.data-table tbody td{padding:.85rem 1rem;border-bottom:1px solid var(--border);font-size:.92rem;vertical-align:middle}
.data-table tbody tr:hover{background:#f9faff}
.data-table .acoes{display:flex;gap:.4rem;justify-content:flex-end}
.btn-icon{width:34px;height:34px;border-radius:9px;display:inline-grid;place-items:center;border:1px solid var(--border);
    background:#fff;color:var(--muted);transition:.15s;cursor:pointer;text-decoration:none}
.btn-icon:hover{border-color:var(--cor-primaria);color:var(--cor-primaria)}
.btn-icon.danger:hover{border-color:#e74c3c;color:#e74c3c}
.cell-avatar{display:flex;align-items:center;gap:.7rem}
.cell-avatar .mini{width:38px;height:38px;border-radius:9px;object-fit:cover;background:#eef0f8;display:grid;place-items:center;color:var(--cor-primaria);font-weight:700}

.badge-status{font-size:.74rem;font-weight:600;padding:.25rem .65rem;border-radius:20px;text-transform:capitalize}
.st-verde{background:#e6f9f1;color:#0a8754}
.st-amarelo{background:#fff5e0;color:#b9770e}
.st-vermelho{background:#fdecec;color:#c0392b}
.st-cinza{background:#eef0f6;color:#5b6275}
.st-azul{background:#e7f0fd;color:#1565c0}
.st-roxo{background:#efe9fd;color:#6C5CE7}

/* Formularios */
.form-card{background:#fff;border-radius:var(--radius);padding:2rem;box-shadow:var(--shadow);max-width:920px}
.form-card .form-label{font-weight:600;font-size:.88rem;color:#39405a}
.form-card .form-control,.form-card .form-select{border-color:var(--border);border-radius:10px;padding:.55rem .8rem}
.form-card .form-control:focus,.form-card .form-select:focus{border-color:var(--cor-primaria);
    box-shadow:0 0 0 .2rem color-mix(in srgb,var(--cor-primaria) 20%,transparent)}
.form-actions{display:flex;gap:.8rem;margin-top:1.5rem;border-top:1px solid var(--border);padding-top:1.3rem}
.form-section-title{font-weight:700;color:var(--cor-primaria);margin:1.5rem 0 .8rem;font-size:.95rem;text-transform:uppercase;letter-spacing:.03em}
.capa-preview{width:100%;max-width:280px;height:150px;border-radius:12px;object-fit:cover;border:1px solid var(--border);background:#f4f5fb}
.banner-preview{width:100%;max-width:560px;height:150px;border-radius:12px;object-fit:cover;border:1px solid var(--border);background:#f4f5fb}

.empty-row{text-align:center;color:var(--muted);padding:2.5rem!important}
.pager-wrap{margin-top:1.2rem;display:flex;justify-content:center}
.pager-wrap .pagination{gap:.3rem}
.pager-wrap .page-link{border-radius:9px;border-color:var(--border);color:var(--cor-primaria)}
.pager-wrap .page-item.active .page-link{background:var(--cor-primaria);border-color:var(--cor-primaria)}

/* Toasts */
.sa-toast{position:fixed;bottom:24px;right:24px;z-index:9999;background:#fff;border-radius:12px;padding:.9rem 1.2rem;
    box-shadow:0 12px 40px rgba(20,22,60,.20);font-weight:600;transform:translateY(20px);opacity:0;transition:.3s;
    border-left:4px solid var(--cor-primaria)}
.sa-toast.show{transform:translateY(0);opacity:1}
.sa-toast-ok{border-left-color:#0a8754}.sa-toast-ok .bi{color:#0a8754}
.sa-toast-err{border-left-color:#c0392b}.sa-toast-err .bi{color:#c0392b}

.page-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.3rem;gap:1rem;flex-wrap:wrap}
.page-head h2{font-weight:800;font-size:1.5rem;margin:0}
.page-head .sub{color:var(--muted);font-size:.9rem}

/* ====================================================================
   Provas online (execução / resultado)
   ==================================================================== */
.prova-timer{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.2rem;
    background:var(--surface);border:2px solid var(--cor-primaria);color:var(--cor-primaria);
    border-radius:12px;padding:.4rem 1rem}
.prova-timer.urgente{border-color:#e74c3c;color:#e74c3c;animation:pulsa 1s infinite}
@keyframes pulsa{0%,100%{opacity:1}50%{opacity:.5}}
.questao-num{font-weight:700;color:var(--txt);margin-bottom:.5rem;display:flex;align-items:center;gap:.6rem}
.questao-enunciado{color:var(--txt);font-size:1.02rem;margin-bottom:1rem}

/* Editor de texto (Quill) do enunciado — visual integrado ao form + cantos arredondados */
.enunciado-wrap{margin-bottom:1.5rem}
.enunciado-wrap .ql-toolbar.ql-snow{
    border:1px solid var(--border);
    border-top-left-radius:12px;border-top-right-radius:12px;
    background:var(--surface-2);padding:8px 10px}
.enunciado-wrap .ql-container.ql-snow{
    border:1px solid var(--border);border-top:0;
    border-bottom-left-radius:12px;border-bottom-right-radius:12px;
    background:var(--bg-card);color:var(--txt);
    font-family:inherit;font-size:.95rem}
.enunciado-wrap .ql-editor{min-height:150px;line-height:1.5}
.enunciado-wrap .ql-editor img{max-width:100%;height:auto;border-radius:8px}
.enunciado-wrap .ql-editor.ql-blank::before{color:var(--muted);font-style:normal;left:15px;right:15px}
/* Ícones/menus da toolbar seguem o tema (claro/escuro) */
.enunciado-wrap .ql-snow .ql-stroke{stroke:var(--txt)}
.enunciado-wrap .ql-snow .ql-fill{fill:var(--txt)}
.enunciado-wrap .ql-snow .ql-picker{color:var(--txt)}
.enunciado-wrap .ql-snow .ql-picker-options{background:var(--bg-card);border-color:var(--border)}
.enunciado-wrap .ql-snow.ql-toolbar button:hover .ql-stroke,
.enunciado-wrap .ql-snow.ql-toolbar button.ql-active .ql-stroke{stroke:var(--cor-primaria)}
.enunciado-wrap .ql-snow.ql-toolbar button:hover .ql-fill,
.enunciado-wrap .ql-snow.ql-toolbar button.ql-active .ql-fill{fill:var(--cor-primaria)}
.enunciado-wrap .ql-snow.ql-toolbar button.ql-active,
.enunciado-wrap .ql-snow.ql-toolbar button:hover{color:var(--cor-primaria)}
.questao-alt{display:flex;align-items:center;gap:.7rem;padding:.7rem .9rem;border:1px solid var(--border);
    border-radius:10px;margin-bottom:.5rem;cursor:pointer;transition:.15s;color:var(--txt)}
.questao-alt:hover{border-color:var(--cor-primaria);background:var(--surface-2)}
.questao-alt input{flex:none}
.questao-alt.resultado{cursor:default}
.questao-alt.alt-correta{border-color:#0a8754;background:rgba(10,135,84,.08)}
.questao-alt.alt-correta .bi{color:#0a8754}
.questao-alt.alt-errada{border-color:#c0392b;background:rgba(192,57,43,.08)}
.questao-alt.alt-errada .bi{color:#c0392b}
.questao-alt.resultado .bi{font-size:1.1rem;flex:none}
.q-timer{font-size:.9rem;font-weight:700;color:var(--cor-primaria)}
.q-timer.urgente{color:#e74c3c}
.dissertativa-resp{background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:.8rem;color:var(--txt)}

/* ====================================================================
   EAD - builder de conteudo
   ==================================================================== */
.disc-card{border:1px solid var(--border);border-radius:12px;margin-bottom:1rem;overflow:hidden}
.disc-head{display:flex;justify-content:space-between;align-items:center;padding:.8rem 1rem;background:#f4f5fb;font-size:.95rem}
.disc-head .disc-ordem{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--cor-primaria);color:#fff;font-size:.78rem;margin-right:.4rem}
.disc-head .acoes{display:flex;gap:.3rem}
.aula-item{display:flex;justify-content:space-between;align-items:center;padding:.6rem 1rem;border-top:1px solid var(--border)}
.aula-main{display:flex;align-items:center;gap:.6rem;font-size:.9rem}
.aula-main .bi{color:var(--cor-primaria)}
.aula-side{display:flex;align-items:center;gap:.5rem}
.aula-empty{padding:.6rem 1rem;color:var(--muted);font-size:.85rem;border-top:1px solid var(--border)}
.midia-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.8rem}
.midia-item{border:1px solid var(--border);border-radius:10px;overflow:hidden}
.midia-thumb{height:80px;display:grid;place-items:center;background:#f4f5fb;font-size:1.8rem;color:var(--cor-primaria);overflow:hidden}
.midia-thumb img{width:100%;height:100%;object-fit:cover}
.midia-info{display:flex;justify-content:space-between;align-items:center;padding:.4rem .6rem;font-size:.78rem;gap:.3rem}
.midia-info span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ====================================================================
   EAD - vitrine publica e pagina do curso
   ==================================================================== */
.curso-hero{position:relative;background:linear-gradient(160deg,var(--bg-dark-2),var(--bg-dark));
    background-size:cover;background-position:center;color:#fff;padding:3rem 6%}
/* Com banner: mostra a imagem INTEIRA (sem corte), centralizada sobre o fundo escuro */
.curso-hero.tem-banner{background-color:var(--bg-dark);background-size:contain;background-repeat:no-repeat;background-position:center}
.curso-hero-overlay{position:absolute;inset:0;z-index:0;
    background:linear-gradient(180deg,rgba(14,15,26,.74),rgba(14,15,26,.92))}
.curso-hero-wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.5fr 1fr;gap:2.5rem;max-width:1100px;margin:0 auto;align-items:center}
.curso-hero h1{font-size:2.2rem;font-weight:800}
.curso-hero .cat{color:var(--cor-secundaria);font-weight:700;text-transform:uppercase;font-size:.8rem}
.curso-hero p{color:#b8bcd4}
.curso-hero-meta{display:flex;gap:1.5rem;margin-top:1rem;flex-wrap:wrap;color:#cdd1e6;font-size:.9rem}
.curso-card-buy{background:#fff;border-radius:16px;overflow:hidden;box-shadow:var(--shadow);color:var(--txt)}
.curso-card-buy .capa{height:160px;background-size:cover;background-position:center;display:grid;place-items:center;font-size:3rem;color:#fff}
/* Capa do card exibida INTEIRA (sem corte): imagem real, altura adapta */
.curso-card-buy .capa-img{display:block;width:100%;height:auto}
.curso-card-buy .body{padding:1.5rem}
.curso-card-buy .preco{font-size:2rem;font-weight:800}
.curso-conteudo{max-width:1100px;margin:0 auto;padding:3rem 6%}
.curso-conteudo .conteudo-titulo{color:#fff;font-weight:800;font-size:1.8rem;margin-bottom:1.5rem}
.curso-conteudo>.text-muted{color:#aab0cf!important}
.modulo{border:1px solid rgba(255,255,255,.1);border-radius:12px;margin-bottom:1rem;
    background:rgba(255,255,255,.045);overflow:hidden;color:#e9ebf5}
.modulo>summary{padding:1rem 1.2rem;font-weight:700;cursor:pointer;background:rgba(255,255,255,.06);
    list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem;color:#fff}
.modulo>summary::-webkit-details-marker{display:none}
.modulo>summary .text-muted{color:#aab0cf!important}
.modulo .aula-row{display:flex;align-items:center;gap:.7rem;padding:.75rem 1.2rem;
    border-top:1px solid rgba(255,255,255,.08);font-size:.92rem;color:#d4d7ea}
.modulo .aula-row .bi{color:var(--cor-secundaria);flex:none}
.modulo .aula-row .text-muted,
.modulo .aula-row.text-muted{color:#9aa0bd!important}
.modulo .aula-row .free{margin-left:auto;font-size:.72rem;flex:none}

/* Responsividade da página do curso */
@media(max-width:768px){
    .curso-hero{padding:2rem 5%}
    .curso-hero h1{font-size:1.7rem}
    .curso-hero-meta{gap:.6rem 1rem;font-size:.82rem}
    .curso-conteudo{padding:2rem 5%}
    .curso-conteudo .conteudo-titulo{font-size:1.4rem}
    .modulo>summary,.modulo .aula-row{padding-left:.9rem;padding-right:.9rem}
}

/* Player do aluno */
.player-wrap{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:1.5rem;align-items:start}
.player-main{min-width:0}
.player-main .video-box{background:#000;border-radius:14px;overflow:hidden;aspect-ratio:16/9;width:100%;max-width:100%}
.player-main .video-box iframe,.player-main .video-box video{width:100%;height:100%;border:0;display:block}
.player-side{background:#fff;border-radius:14px;box-shadow:var(--shadow);max-height:calc(100vh - 160px);overflow-y:auto;position:sticky;top:1rem}
.player-side .ps-disc{padding:.7rem 1rem;background:#f4f5fb;font-weight:700;font-size:.85rem;position:sticky;top:0;z-index:1}
.player-aula{display:flex;align-items:center;gap:.6rem;padding:.7rem 1rem;border-bottom:1px solid var(--border);cursor:pointer;text-decoration:none;color:var(--txt);font-size:.9rem}
.player-aula span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.player-aula:hover{background:#f9faff}
.player-aula.atual{background:color-mix(in srgb,var(--cor-primaria) 12%,transparent)}
.player-aula.feita .bi-check-circle-fill{color:#0a8754}
/* ====================================================================
   Gráficos & Análise (secretaria) — responsivo e dinâmico
   ==================================================================== */
.graf-tabs{display:inline-flex;gap:.25rem;background:var(--surface-2);padding:.25rem;border-radius:12px;border:1px solid var(--border)}
.graf-tabs a{padding:.4rem .9rem;border-radius:9px;font-weight:600;font-size:.85rem;color:var(--muted);text-decoration:none;
    display:inline-flex;align-items:center;gap:.4rem;transition:.15s;white-space:nowrap}
.graf-tabs a.ativo{background:var(--cor-primaria);color:#fff;box-shadow:0 4px 12px color-mix(in srgb,var(--cor-primaria) 35%,transparent)}
.graf-tabs a:not(.ativo):hover{color:var(--txt);background:var(--surface)}
.chart-wrap{position:relative;width:100%;height:300px}
.chart-wrap.sm{height:250px}
.chart-wrap.lg{height:340px}
@media(max-width:768px){.chart-wrap,.chart-wrap.sm,.chart-wrap.lg{height:250px}}
.mini-legend{display:flex;flex-wrap:wrap;gap:.4rem 1rem;justify-content:center;margin-top:.7rem;font-size:.78rem;color:var(--muted)}
.mini-legend i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:.35rem;vertical-align:middle}
.stat-pill{display:inline-flex;align-items:center;gap:.35rem;font-size:.72rem;font-weight:700;padding:.15rem .55rem;border-radius:999px;
    background:var(--surface-2);color:var(--muted)}
.panel-head.between{display:flex;align-items:center;justify-content:space-between;gap:.6rem;flex-wrap:wrap}

.player-aula.travada{opacity:.5;cursor:not-allowed}
.player-aula.travada .bi-lock-fill{color:var(--muted)}
.progress-bar-wrap{height:8px;background:#eef0f6;border-radius:6px;overflow:hidden;margin:.5rem 0}
.progress-bar-wrap > div{height:100%;background:linear-gradient(90deg,var(--cor-primaria),var(--cor-secundaria))}
/* Telas médias: estreita a lista lateral para não espremer o vídeo. */
@media(max-width:1200px){.player-wrap{grid-template-columns:minmax(0,1fr) 300px;gap:1rem}}
/* Tablets/celulares: empilha a lista abaixo do vídeo, em altura natural. */
@media(max-width:900px){
    .player-wrap{grid-template-columns:1fr}
    .player-side{position:static;max-height:60vh}
    .curso-hero-wrap{grid-template-columns:1fr}
}

/* ====================================================================
   TEMA (dark / light) + RAIL + MOBILE  — afeta o app shell
   ==================================================================== */
:root{
    --page-bg:#f4f5fb;
    --surface:#ffffff;
    --surface-2:#f4f5fb;
    --surface-hover:#f9faff;
}
[data-theme="dark"]{
    --page-bg:#0e0f1a;
    --surface:#181b2c;
    --surface-2:#20243a;
    --surface-hover:#242943;
    --txt:#eef0fa;
    --muted:#b4bad6;
    --border:#2c3148;
    --shadow:0 12px 40px rgba(0,0,0,.45);
}

/* Superfícies via variáveis (valem para os dois temas) */
.app-body{background:var(--page-bg)}
.app-topbar{background:var(--surface)}
.panel,.kpi-card,.form-card,.sa-toast{background:var(--surface)}
.module-card,.quick-action,.midia-thumb,.disc-head,.cell-avatar .mini{background:var(--surface-2)}
.data-table tbody tr:hover{background:var(--surface-hover)}
.btn-icon{background:var(--surface);color:var(--muted)}
.pager-wrap .page-link{background:var(--surface)}
.crud-toolbar .search input,.form-card .form-control,.form-card .form-select{background:var(--surface)}

/* Ajustes específicos do modo escuro (textos, campos, labels) */
[data-theme="dark"] .text-muted{color:var(--muted)!important}
[data-theme="dark"] .form-control,
[data-theme="dark"] .form-select{background:var(--surface-2);border-color:var(--border);color:var(--txt)}
[data-theme="dark"] .form-control::placeholder{color:#6b7088}
[data-theme="dark"] .form-control:focus,
[data-theme="dark"] .form-select:focus{background:var(--surface-2);color:var(--txt)}
[data-theme="dark"] .input-group-text{background:#23273c;border-color:var(--border);color:var(--muted)}
[data-theme="dark"] .form-check-input:not(:checked){background-color:#2a2f47;border-color:#3a4060}
[data-theme="dark"] code{color:#cdd2f5}
[data-theme="dark"] .modulo,
[data-theme="dark"] .curso-card{background:var(--surface)}
[data-theme="dark"] .alert{background:var(--surface-2);border-color:var(--border);color:var(--txt)}

/* Botões da topbar (tema + hambúrgueres) */
.btn-burger{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:10px;border:none;
    background:transparent;color:var(--txt);cursor:pointer;font-size:1.4rem;transition:.15s}
.btn-burger:hover{background:var(--surface-2)}
.btn-burger.right{display:none}
.btn-icon-top{width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:var(--surface);
    color:var(--txt);display:inline-grid;place-items:center;cursor:pointer;font-size:1.15rem;transition:.15s}
.btn-icon-top:hover{border-color:var(--cor-primaria);color:var(--cor-primaria)}

/* Sidebar recolhida (rail) - desktop */
.app-sidebar{transition:width .22s ease, transform .25s ease}
.app-shell.collapsed .app-sidebar{width:76px}
.app-shell.collapsed .app-main{margin-left:76px}
.app-shell.collapsed .sidebar-brand span,
.app-shell.collapsed .nav-item span,
.app-shell.collapsed .badge-soon{display:none}
.app-shell.collapsed .sidebar-brand{justify-content:center;padding-left:0;padding-right:0}
.app-shell.collapsed .nav-item{justify-content:center;padding-left:0;padding-right:0}
.app-shell.collapsed .nav-item .bi{margin:0;font-size:1.25rem}

/* Overlay do menu mobile */
.sidebar-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:35}
.sidebar-overlay.show{display:block}

@media(max-width:992px){
    #burger{display:none}
    .btn-burger.right{display:inline-grid}
    /* Em mobile o rail não se aplica: sidebar vira gaveta */
    .app-shell.collapsed .app-sidebar{width:260px}
    .app-shell.collapsed .app-main{margin-left:0}
    .app-shell.collapsed .sidebar-brand span,
    .app-shell.collapsed .nav-item span,
    .app-shell.collapsed .badge-soon{display:inline}
}
@media(min-width:993px){
    .sidebar-overlay{display:none!important}
}

/* ====================================================================
   Dropdown do usuário (topbar)
   ==================================================================== */
.topbar-user{display:flex;align-items:center;gap:.7rem;background:transparent;border:none;cursor:pointer;
    padding:.25rem .4rem;border-radius:12px;color:var(--txt);transition:.15s}
.topbar-user:hover{background:var(--surface-2)}
.avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.dd-caret{font-size:.75rem;color:var(--muted)}
.sa-usermenu{border:1px solid var(--border);border-radius:14px;box-shadow:var(--shadow);
    background:var(--surface);min-width:250px;padding:.4rem;margin-top:.4rem}
.sa-usermenu .dropdown-item{border-radius:9px;padding:.55rem .7rem;color:var(--txt);
    display:flex;align-items:center;gap:.6rem;font-size:.92rem}
.sa-usermenu .dropdown-item:hover{background:var(--surface-2);color:var(--cor-primaria)}
.sa-usermenu .dropdown-item .bi{color:var(--cor-primaria);width:18px;text-align:center}
.sa-usermenu .dd-sair,.sa-usermenu .dd-sair .bi{color:#e74c3c}
.sa-usermenu .dd-sair:hover{background:#fdecec;color:#c0392b}
.dd-userhead{padding:.5rem .7rem;display:flex;flex-direction:column;gap:.15rem}
.dd-userhead strong{color:var(--txt)}
.dd-userhead span{font-size:.8rem;color:var(--muted)}
.dropdown-divider{border-color:var(--border)}
[data-theme="dark"] .sa-usermenu .dd-sair:hover{background:rgba(231,76,60,.16);color:#ff7a6b}
.perfil-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;align-items:start}
.perfil-avatar{width:96px;height:96px;border-radius:50%;object-fit:cover;border:3px solid var(--border);
    background:linear-gradient(135deg,var(--cor-primaria),var(--cor-destaque));display:grid;place-items:center;color:#fff;font-size:2.2rem;font-weight:700}
@media(max-width:860px){.perfil-grid{grid-template-columns:1fr}}

/* ====================================================================
   Carteirinha do aluno
   ==================================================================== */
/* Carteirinha no tamanho real de cartão de crédito (ID-1): 85,6 x 53,98 mm */
.carteirinha{width:85.6mm;height:53.98mm;background:#fff;border-radius:3mm;overflow:hidden;color:#1f2330;
    box-shadow:0 8px 24px rgba(20,22,60,.15);border:1px solid #e7e9f2;font-family:'Segoe UI',system-ui,sans-serif;
    display:flex;flex-direction:column}
.cart-top{background:linear-gradient(135deg,var(--c1),var(--c2));color:#fff;padding:1.4mm 2.4mm;
    display:flex;justify-content:space-between;align-items:center;flex:none}
.cart-brand{display:flex;align-items:center;gap:1.2mm;font-weight:700;font-size:2.4mm;line-height:1.1}
.cart-brand img{width:5mm;height:5mm;border-radius:1mm;object-fit:cover;background:#fff}
.cart-top small{font-size:1.5mm;letter-spacing:.03em;opacity:.92;text-align:right;line-height:1.1}
.cart-body{display:flex;gap:2.4mm;padding:2mm 2.4mm;flex:1;overflow:hidden;align-items:center}
.cart-foto{width:15mm;height:19mm;border-radius:1.5mm;background:#eef0f8;display:grid;place-items:center;
    font-size:8mm;color:var(--c1);overflow:hidden;flex:none}
.cart-foto img{width:100%;height:100%;object-fit:cover}
.cart-dados{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}
.cart-nome{font-weight:800;font-size:2.9mm;margin-bottom:1mm;color:#1f2330;line-height:1.1;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cart-linha{display:flex;justify-content:space-between;gap:1.5mm;font-size:2.1mm;border-bottom:.2mm dashed #e7e9f2;padding:.5mm 0}
.cart-linha span{color:#7a8194}
.cart-linha strong{color:#1f2330;text-align:right;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cart-foot{background:#f4f5fb;padding:1mm 2.4mm;display:flex;justify-content:space-between;font-size:1.7mm;color:#7a8194;letter-spacing:.02em;flex:none}
.cart-par{display:flex;gap:4mm;flex-wrap:wrap;align-items:stretch}
.cart-vbody{padding:1.5mm;display:flex;flex-direction:column;align-items:center;text-align:center;gap:1mm;justify-content:center;flex:1;overflow:hidden}
.cart-qr-big{width:25mm;height:25mm;display:block;border:.2mm solid #e7e9f2;border-radius:1.5mm;background:#fff;padding:1mm}
.cart-vtxt{font-size:1.9mm;color:#3b4356;line-height:1.3}
.cart-vtxt span{color:var(--c1);font-weight:700;word-break:break-all}
.cart-vobs{font-size:1.5mm;color:#7a8194;line-height:1.25}
.carteirinhas-grid{display:flex;flex-wrap:wrap;gap:1.2rem}

/* Abas da pasta do aluno */
.pasta-tabs{display:flex;gap:.4rem;flex-wrap:wrap;border-bottom:1px solid var(--border);margin-bottom:1.2rem}
.pasta-tabs .nav-link{border:1px solid transparent;border-radius:8px;color:var(--muted);font-weight:600;font-size:.9rem;padding:.55rem 1rem;transition:border-color .15s,color .15s,background .15s}
/* Abas NÃO clicadas: moldura/faixa ao redor (chip delineado) */
.pasta-tabs .nav-link:not(.active){border-color:var(--border);background:var(--surface-2)}
.pasta-tabs .nav-link:not(.active):hover{border-color:var(--cor-primaria);color:var(--cor-primaria)}
/* Aba ativa: destaque com a linha inferior na cor primária (estilo aba) */
.pasta-tabs .nav-link.active{color:var(--cor-primaria);background:var(--surface);border-color:transparent;border-bottom:2px solid var(--cor-primaria);border-radius:8px 8px 0 0}
.pasta-tabs .nav-link .bi{margin-right:.35rem}
.aluno-resumo{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap}
.aluno-resumo .foto{width:70px;height:70px;border-radius:14px;object-fit:cover;display:grid;place-items:center;
    color:#fff;font-weight:700;font-size:1.8rem;background:linear-gradient(135deg,var(--cor-primaria),var(--cor-destaque))}
.fin-acoes{display:flex;gap:.3rem;flex-wrap:wrap}

@media print{
    .app-sidebar,.app-topbar,.no-print,.sidebar-overlay{display:none!important}
    .app-main{margin-left:0!important}
    .app-content{padding:0!important}
    body,.app-body{background:#fff!important}
}

/* Atribuição múltipla de grupos de permissão (chips com checkbox) */
.grupos-multi{display:flex;flex-wrap:wrap;gap:6px}
.grupo-chip{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border:1px solid var(--border,#d8d8e0);
    border-radius:20px;font-size:.82rem;cursor:pointer;user-select:none;transition:all .15s;background:var(--surface,#fff)}
.grupo-chip input{display:none}
.grupo-chip i{opacity:.25;font-size:.95rem}
.grupo-chip:hover{border-color:var(--cor-primaria,#6C5CE7)}
.grupo-chip.on{background:var(--cor-primaria,#6C5CE7);color:#fff;border-color:var(--cor-primaria,#6C5CE7)}
.grupo-chip.on i{opacity:1}
.grupos-hint{display:block;margin-top:6px}

/* Select pesquisável (combobox com filtro por digitação) */
.ss-wrap{position:relative}
.ss-wrap .select-search{position:absolute!important;width:1px;height:1px;opacity:0;pointer-events:none;left:-9999px}
.ss-list{position:absolute;z-index:50;left:0;right:0;top:calc(100% + 2px);max-height:240px;overflow-y:auto;
    background:var(--surface,#fff);border:1px solid var(--border,#d8d8e0);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.12);padding:4px}
.ss-list[hidden]{display:none}
.ss-opt{padding:7px 10px;border-radius:6px;cursor:pointer;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ss-opt[hidden]{display:none}
.ss-opt:hover,.ss-opt.ss-active{background:var(--cor-primaria,#6C5CE7);color:#fff}
.ss-empty{padding:8px 10px;color:#888;font-size:.85rem}

/* Conteúdo do curso: estados ativo/inativo, drag-drop e preview de mídia */
.disc-card.inativo, .aula-item.inativo, .midia-item.inativo { opacity: .5; }
.aula-item .drag-handle { cursor: grab; color: #aaa; margin-right: 2px; }
.aula-item.dragging { opacity: .4; background: var(--surface-2, #f0f0f5); }
.disc-aulas.dragover { outline: 2px dashed var(--cor-primaria, #6C5CE7); outline-offset: -4px; border-radius: 8px; }
.midia-item .midia-thumb { position: relative; width: 100%; border: 0; padding: 0; background: var(--surface-2, #f2f2f7); cursor: pointer; overflow: hidden; }
.midia-item .midia-thumb img { width: 100%; height: 100%; object-fit: cover; }
.midia-item .midia-thumb img,
.midia-item .midia-thumb video,
.midia-item .midia-thumb .midia-embed,
.midia-item .midia-thumb .midia-txt { pointer-events: none; }
.midia-item .midia-thumb video { width: 100%; height: 100%; object-fit: cover; background: #000; }
.midia-item .midia-thumb .midia-doc { display: grid; place-items: center; gap: 2px; width: 100%; height: 100%; }
.midia-item .midia-thumb .midia-doc i { font-size: 2rem; line-height: 1; }
.midia-item .midia-thumb .midia-doc small { font-size: .6rem; font-weight: 700; letter-spacing: .05em; color: var(--muted); }
.midia-item .midia-thumb .midia-doc.pdf i { color: #e03131; }
.midia-item .midia-thumb .midia-fallback { place-items: center; font-size: 1.8rem; color: var(--cor-primaria); }
.midia-item .midia-thumb .midia-txt { display: block; width: 100%; height: 100%; padding: .35rem .45rem; overflow: hidden;
    font: 600 .58rem/1.2 ui-monospace, Menlo, Consolas, monospace; color: var(--muted); text-align: left;
    white-space: pre-wrap; word-break: break-word; background: var(--surface, #fff); }
.midia-item .midia-thumb .midia-play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
    background: rgba(0,0,0,.25); color: #fff; opacity: 0; transition: opacity .15s; font-size: 1.4rem; }
.midia-item .midia-thumb:hover .midia-play { opacity: 1; }
.midia-info .midia-acoes { display: inline-flex; gap: 2px; }

/* Reordenar módulos (disciplinas) via alça */
.disc-drag { cursor: grab; color: #aaa; }
.disc-card.dragging { opacity: .5; outline: 2px dashed var(--cor-primaria, #6C5CE7); }
#discZona.dragover { background: rgba(108,92,231,.04); border-radius: 8px; }

/* Badge de contagem de anexos no botão da linha financeira */
.btn-fin-anexos { position: relative; }
.btn-fin-anexos .anex-badge { position: absolute; top: -4px; right: -4px; background: var(--cor-primaria, #6C5CE7); color: #fff;
    font-size: .6rem; line-height: 1; padding: 2px 4px; border-radius: 8px; font-weight: 700; }

/* ====================================================================
   INSCRIÇÃO PÚBLICA — página tema-aware (dark/light) + wizard
   ==================================================================== */
.insc-page{background:var(--page-bg);color:var(--txt);min-height:100vh}
.insc-nav{display:flex;align-items:center;gap:1rem;padding:.9rem 6%;border-bottom:1px solid var(--border);background:var(--surface)}
.insc-nav .brand{font-size:1.3rem;font-weight:800;color:var(--txt);text-decoration:none}
.insc-nav .brand span{color:var(--cor-primaria)}
.insc-nav a.nav-link-simple{color:var(--muted);text-decoration:none;font-weight:600}
.insc-nav a.nav-link-simple:hover{color:var(--cor-primaria)}
.insc-nav .spacer{margin-left:auto}
.insc-theme{width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:var(--surface);
    color:var(--txt);display:inline-grid;place-items:center;cursor:pointer;font-size:1.1rem;transition:.15s}
.insc-theme:hover{border-color:var(--cor-primaria);color:var(--cor-primaria)}
.insc-wrap{max-width:1360px;margin:0 auto;padding:2.2rem 4%}
.insc-page .form-card{max-width:none}
.insc-title{color:var(--txt);font-weight:800;margin:0 0 .3rem}
.insc-sub{color:var(--muted);margin-bottom:1.4rem}
.insc-page h5{color:var(--txt);font-weight:700}
.insc-page .form-label{color:var(--txt)}
.insc-page .field-hint{color:var(--muted);font-size:.8rem}

/* Stepper (cabeçalho de passos) */
.wiz-steps{display:flex;gap:.4rem;margin-bottom:1.6rem;flex-wrap:wrap}
.wiz-steps .st{display:flex;align-items:center;gap:.55rem;flex:1 1 150px;min-width:130px;opacity:.55;transition:.2s}
.wiz-steps .st.active,.wiz-steps .st.done{opacity:1}
.wiz-steps .st .num{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;font-weight:700;flex:none;
    background:var(--surface-2);color:var(--muted);border:2px solid var(--border);transition:.2s}
.wiz-steps .st.active .num{background:var(--cor-primaria);color:#fff;border-color:var(--cor-primaria)}
.wiz-steps .st.done .num{background:var(--cor-secundaria);color:#062b2a;border-color:var(--cor-secundaria)}
.wiz-steps .st .lbl{font-size:.85rem;font-weight:600;color:var(--txt);line-height:1.1;white-space:nowrap}

/* Painéis de passo */
.wiz-pane{display:none}
.wiz-pane.active{display:block;animation:wizfade .22s ease}
@keyframes wizfade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.wiz-nav{display:flex;justify-content:space-between;gap:.75rem;margin-top:1.6rem}
.wiz-review dl{display:grid;grid-template-columns:170px 1fr;gap:.35rem .8rem;margin:0}
.wiz-review dt{color:var(--muted);font-weight:600}
.wiz-review dd{color:var(--txt);margin:0}
@media(max-width:576px){.wiz-review dl{grid-template-columns:1fr}}

/* ====================================================================
   Landing pública por escola (/escola/{slug})
   ==================================================================== */
.esc-hero{position:relative;overflow:hidden;min-height:clamp(300px,30vw,560px);display:flex;align-items:flex-end;padding:2.5rem 6%;
    background:linear-gradient(160deg,var(--bg-dark-2),var(--bg-dark)) center/cover no-repeat;color:#fff}
/* Com banner: a imagem real define a altura (aparece INTEIRA, sem corte) */
.esc-hero.tem-banner{min-height:0;padding:0}
.esc-hero-bg{display:block;width:100%;height:auto}
.esc-hero.tem-banner::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(15,16,32,.30),rgba(15,16,32,.88))}
.esc-hero-in{position:relative;z-index:2;max-width:1100px;margin:0 auto;width:100%}
.esc-hero.tem-banner .esc-hero-in{position:absolute;left:50%;transform:translateX(-50%);bottom:0;padding:2.2rem 6% 2rem}
.esc-hero .cat{color:#c3c7da;font-weight:600;letter-spacing:.05em;text-transform:uppercase;font-size:.78rem}
.esc-hero h1{font-size:2.3rem;font-weight:800;margin:.25rem 0 .4rem;line-height:1.1}
.esc-hero .sub{color:#c3c7da;max-width:640px}
.esc-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.2rem}
.esc-card{background:var(--bg-dark-2,#171a2e);border:1px solid rgba(255,255,255,.06);border-radius:14px;overflow:hidden;
    color:#e9ebf5;transition:transform .18s,border-color .18s;text-decoration:none;display:block}
.esc-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--cor-primaria) 55%,transparent);color:#e9ebf5}
.esc-card .capa{height:160px;background-size:cover;background-position:center;display:grid;place-items:center;color:#8b90ad;font-size:2.2rem}
/* Banner do card exibido INTEIRO (sem corte): imagem real, o card se ajusta à altura */
.esc-card .esc-capa-img{display:block;width:100%;height:auto;background:#0e0f1e;border-bottom:1px solid rgba(255,255,255,.06)}
.esc-card .body{padding:1rem 1.1rem}
.esc-card .body h3{font-size:1.05rem;font-weight:700;margin:0 0 .3rem}
.esc-card .body p{color:#9aa0bd;font-size:.86rem;margin:0}
.esc-card .meta{color:#9aa0bd;font-size:.8rem;display:flex;gap:.9rem;flex-wrap:wrap;margin-top:.55rem}
.esc-aviso{background:var(--bg-dark-2,#171a2e);border-left:3px solid var(--cor-destaque,#FD79A8);border-radius:12px;
    padding:.9rem 1.1rem;color:#e9ebf5}
.esc-aviso .tit{font-weight:700;margin-bottom:.2rem}
.esc-aviso .data{color:#9aa0bd;font-size:.75rem}
.esc-aviso .msg{color:#c3c7da;font-size:.9rem;white-space:pre-wrap}
@media(max-width:992px){.esc-hero:not(.tem-banner){min-height:clamp(260px,40vw,420px)}}
@media(max-width:640px){
    /* Texto abaixo da imagem no celular */
    .esc-hero.tem-banner{flex-direction:column;align-items:stretch}
    .esc-hero.tem-banner::before{display:none}
    .esc-hero.tem-banner .esc-hero-in{position:static;transform:none;background:var(--bg-dark);padding:1.6rem 6% 1.8rem}
    .esc-hero:not(.tem-banner){min-height:clamp(220px,55vw,340px);padding:2rem 6%}}
@media(max-width:576px){.esc-hero h1{font-size:1.7rem}}

/* ====================================================================
   Template FOCAR — landing corporativa clara (opção de layout da escola)
   ==================================================================== */
.foc-body{background:#fff;color:#333;font-family:'Poppins','Segoe UI',system-ui,-apple-system,sans-serif}
.foc-nav{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:1.2rem;padding:.9rem 6%;
    background:#fff;border-bottom:1px solid #ececf2;box-shadow:0 2px 14px rgba(0,0,0,.04)}
.foc-nav .brand{font-weight:800;font-size:1.25rem;color:var(--cor-primaria);text-decoration:none;display:flex;align-items:center;gap:.5rem}
.foc-nav .links{margin-left:auto;display:flex;gap:1.5rem;align-items:center}
.foc-nav .links a{color:#555;text-decoration:none;font-weight:600;font-size:.92rem}
.foc-nav .links a:hover{color:var(--cor-primaria)}
.foc-btn{background:var(--cor-primaria);color:#fff;font-weight:700;padding:.6rem 1.4rem;border-radius:4px;text-decoration:none;
    display:inline-flex;align-items:center;gap:.5rem;border:2px solid var(--cor-primaria);transition:.15s;cursor:pointer}
.foc-btn:hover{background:transparent;color:var(--cor-primaria)}
.foc-btn.ghost{background:transparent;color:#fff;border-color:#fff}
.foc-btn.ghost:hover{background:#fff;color:var(--cor-primaria)}
.foc-hero{position:relative;overflow:hidden;min-height:clamp(340px,31vw,600px);display:flex;align-items:flex-end;padding:4rem 6% 3rem;color:#fff;
    background:var(--cor-primaria) center/cover no-repeat}
/* Com banner: a imagem real define a altura (aparece INTEIRA, sem corte, em qualquer monitor) */
.foc-hero.has-banner{min-height:0;padding:0}
.foc-hero-bg{display:block;width:100%;height:auto}
.foc-hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
    background:
        linear-gradient(180deg,color-mix(in srgb,var(--cor-primaria) 55%,transparent) 0%,transparent 35%,color-mix(in srgb,var(--cor-primaria) 90%,#000) 100%),
        linear-gradient(100deg,color-mix(in srgb,var(--cor-primaria) 55%,transparent),transparent 70%)}
.foc-hero-in{position:relative;z-index:2;max-width:760px;width:100%}
.foc-hero.has-banner .foc-hero-in{position:absolute;left:0;bottom:0;max-width:min(760px,100%);
    padding:clamp(1.4rem,4vw,3rem) 6% clamp(1rem,3vw,2.4rem)}
.foc-hero .eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:.8rem;font-weight:700;opacity:.85}
.foc-hero h1{font-size:clamp(2rem,5vw,3.2rem);font-weight:800;line-height:1.1;margin:.6rem 0 1rem}
.foc-hero p{font-size:1.1rem;opacity:.92;max-width:560px;margin:0 0 1.8rem}
.foc-hero .cta{display:flex;gap:1rem;flex-wrap:wrap}
/* Sem banner (só cor): altura responsiva. Com banner: a imagem manda na altura. */
@media(max-width:992px){.foc-hero:not(.has-banner){min-height:clamp(300px,42vw,460px);padding:3rem 6% 2.2rem}}
@media(max-width:640px){
    /* Em telas pequenas o texto vai ABAIXO da imagem (imagem inteira, texto legível) */
    .foc-hero.has-banner{flex-direction:column;align-items:stretch}
    .foc-hero.has-banner::before{display:none}
    .foc-hero.has-banner .foc-hero-in{position:static;max-width:none;background:var(--cor-primaria);padding:1.8rem 6% 2rem}
    .foc-hero:not(.has-banner){min-height:clamp(260px,58vw,380px);padding:2.4rem 6% 1.8rem}
    .foc-hero p{font-size:1rem;margin-bottom:1.3rem}.foc-hero .cta{gap:.6rem}}
.foc-sec{padding:4.5rem 6%}
.foc-sec.alt{background:#f6f7fb}
.foc-sec .head{max-width:720px;margin:0 auto 2.6rem;text-align:center}
.foc-sec .head .eyebrow{color:var(--cor-primaria);text-transform:uppercase;letter-spacing:.1em;font-size:.78rem;font-weight:800}
.foc-sec .head h2{font-size:2rem;font-weight:800;color:#1e2233;margin:.3rem 0}
.foc-sec .head p{color:#6b7280}
.foc-grid{display:grid;gap:1.4rem;max-width:1120px;margin:0 auto;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.foc-card{background:#fff;border:1px solid #ececf2;border-radius:12px;overflow:hidden;box-shadow:0 8px 26px rgba(20,22,60,.05);
    transition:transform .18s,box-shadow .18s;text-decoration:none;color:inherit;display:block}
.foc-card:hover{transform:translateY(-5px);box-shadow:0 16px 40px rgba(20,22,60,.12)}
.foc-card .capa{height:160px;background-size:cover;background-position:center;display:grid;place-items:center;color:#fff;font-size:2.2rem}
.foc-card .body{padding:1.2rem 1.3rem}
.foc-card .body h3{font-size:1.08rem;font-weight:700;color:#1e2233;margin:0 0 .35rem}
.foc-card .body p{color:#6b7280;font-size:.9rem;margin:0}
.foc-card .meta{color:#8a91a3;font-size:.82rem;display:flex;gap:.9rem;flex-wrap:wrap;margin-top:.6rem}
.foc-acesso{background:#fff;border:1px solid #ececf2;border-radius:12px;padding:1.6rem;text-align:center;text-decoration:none;color:inherit;
    transition:.18s;box-shadow:0 8px 26px rgba(20,22,60,.05)}
.foc-acesso:hover{transform:translateY(-5px);border-color:var(--ac,var(--cor-primaria));box-shadow:0 16px 40px color-mix(in srgb,var(--ac,var(--cor-primaria)) 22%,transparent)}
.foc-acesso .ic{width:60px;height:60px;border-radius:14px;display:grid;place-items:center;font-size:1.6rem;color:#fff;margin:0 auto 1rem;
    background:linear-gradient(135deg,var(--ac,var(--cor-primaria)),color-mix(in srgb,var(--ac,var(--cor-primaria)) 55%,#000))}
.foc-acesso h3{font-size:1.05rem;color:#1e2233;font-weight:700}
.foc-acesso p{color:#6b7280;font-size:.86rem;margin:.3rem 0 0}
.foc-aviso{background:#fff;border:1px solid #ececf2;border-left:4px solid var(--cor-destaque);border-radius:10px;padding:1rem 1.2rem;box-shadow:0 6px 20px rgba(20,22,60,.04)}
.foc-aviso .tit{font-weight:700;color:#1e2233}
.foc-aviso .data{color:#9aa0bd;font-size:.75rem}
.foc-aviso .msg{color:#5b6270;font-size:.9rem;white-space:pre-wrap;margin-top:.3rem}
.foc-contato{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.4rem;max-width:960px;margin:0 auto}
.foc-contato .item{display:flex;gap:.8rem;align-items:flex-start;color:#5b6270}
.foc-contato .item .bi{color:var(--cor-primaria);font-size:1.35rem}
.foc-footer{background:#1e2233;color:#c3c7da;padding:2.4rem 6%;text-align:center}
.foc-footer a{color:#fff;text-decoration:none;font-weight:700}
@media(max-width:768px){.foc-nav .links{display:none}}

/* ---- Overlay de loading de upload (imagem/vídeo/arquivo) ---- */
.upload-overlay{position:fixed;inset:0;z-index:20000;background:rgba(15,17,34,.55);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(2px)}
.upload-overlay .upload-box{background:var(--surface,#fff);color:var(--txt,#1f2330);border-radius:14px;padding:1.6rem 1.8rem;width:min(92vw,360px);box-shadow:0 20px 60px rgba(0,0,0,.35);text-align:center}
.upload-overlay .upload-spinner{width:40px;height:40px;margin:0 auto .8rem;border:4px solid var(--border,#e7e9f2);border-top-color:var(--cor-primaria,#6C5CE7);border-radius:50%;animation:upspin .8s linear infinite}
@keyframes upspin{to{transform:rotate(360deg)}}
.upload-overlay .upload-txt{font-weight:600;margin-bottom:.7rem}
.upload-overlay .upload-pct{color:var(--cor-primaria,#6C5CE7)}
.upload-overlay .upload-bar{height:8px;border-radius:6px;background:var(--border,#e7e9f2);overflow:hidden}
.upload-overlay .upload-bar>div{height:100%;width:0;background:linear-gradient(90deg,var(--cor-primaria,#6C5CE7),var(--cor-destaque,#FD79A8));border-radius:6px;transition:width .15s ease}
.upload-overlay .upload-hint{margin-top:.6rem;font-size:.78rem;color:var(--muted,#6a6f73)}