*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;background:#f4f7fb;color:#1d2939}.top{background:#0d2b4d;color:#fff;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{display:flex;align-items:center;gap:10px}.brand img{width:46px;height:46px;object-fit:contain;background:white;border-radius:10px}.brand b{font-size:20px}.brand small{display:block;opacity:.85}.wrap{max-width:1100px;margin:28px auto;padding:0 16px}.card{background:#fff;border-radius:16px;padding:22px;box-shadow:0 8px 28px rgba(16,24,40,.08);margin-bottom:18px}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.c3{grid-column:span 3}.c4{grid-column:span 4}.c6{grid-column:span 6}.c8{grid-column:span 8}.c12{grid-column:span 12}label{display:block;font-weight:700;font-size:13px;margin:10px 0 6px}input,select,textarea{width:100%;padding:11px 12px;border:1px solid #d0d5dd;border-radius:10px;font-size:15px;background:white}textarea{min-height:100px}.btn{display:inline-block;border:0;border-radius:10px;padding:11px 15px;background:#1268c4;color:#fff;text-decoration:none;font-weight:700;cursor:pointer}.btn.alt{background:#475467}.btn.ok{background:#18864b}.btn.danger{background:#b42318}.actions{display:flex;gap:8px;flex-wrap:wrap}.notice{padding:12px 14px;border-radius:10px;margin:12px 0;background:#eef4ff;border:1px solid #c7d7fe}.notice.ok{background:#ecfdf3;border-color:#abefc6}.notice.err{background:#fff1f0;border-color:#fecdca}.muted{color:#667085}.login{max-width:460px;margin:55px auto;padding:0 16px}.hero{text-align:center}.hero img{max-width:260px;width:80%;height:auto}.stat{font-size:28px;font-weight:800}.kpi{padding:16px;background:#f8fafc;border-radius:12px}table{width:100%;border-collapse:collapse}th,td{padding:11px 9px;border-bottom:1px solid #eaecf0;text-align:left;font-size:14px}th{background:#f8fafc}.badge{display:inline-block;padding:5px 9px;border-radius:999px;background:#e8f1ff;color:#1849a9;font-size:12px}.install{position:fixed;right:18px;bottom:18px;z-index:20}@media(max-width:780px){.c3,.c4,.c6,.c8{grid-column:span 12}.top{align-items:flex-start;flex-direction:column}.install{left:16px;right:16px}.install .btn{width:100%}table{display:block;overflow-x:auto;white-space:nowrap}}
.table-scroll{overflow-x:auto}.turmas-box{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:8px;padding:12px;border:1px solid #d0d5dd;border-radius:12px;background:#f8fafc}.check-turma{display:flex;align-items:center;gap:9px;margin:0;padding:10px;background:#fff;border:1px solid #eaecf0;border-radius:10px;cursor:pointer}.check-turma input{width:auto;margin:0}.check-turma span{display:flex;flex-direction:column}.check-turma small{color:#667085;margin-top:2px}.badge-ok{background:#dcfae6;color:#067647}.badge-off{background:#fee4e2;color:#b42318}@media(max-width:780px){.turmas-box{grid-template-columns:1fr}}


.install-app-btn{
    display:none;
    align-items:center;
    justify-content:center;
    gap:7px;
    white-space:nowrap;
    background:#18864b;
}
.install-app-btn:hover{
    filter:brightness(.94);
}
.install-login{
    margin-top:10px;
    width:100%;
}
@media(max-width:780px){
    .install-app-btn{
        width:100%;
    }
}

/* ===== Menu administrativo compacto ===== */
.top{
    padding:10px 16px;
    gap:12px;
}
.top .brand{
    flex:0 0 auto;
    min-width:250px;
}
.top .brand img{
    width:42px;
    height:42px;
}
.top .brand b{
    font-size:18px;
    white-space:nowrap;
}
.top .actions{
    flex:1 1 auto;
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:nowrap;
    gap:5px;
    min-width:0;
}
.top .actions .btn{
    padding:9px 10px;
    border-radius:8px;
    font-size:13px;
    line-height:1;
    white-space:nowrap;
}
.top .actions .btn.alt{
    background:#40546d;
}
.top .actions .install-app-btn{
    width:auto;
    padding:9px 10px;
    font-size:13px;
}
.top .actions .btn.danger{
    padding-left:11px;
    padding-right:11px;
}

/* No computador, mantém o menu em uma única linha. */
@media (min-width:781px){
    .top{
        flex-direction:row;
        align-items:center;
    }
    .top .actions{
        overflow:visible;
    }
}

/* No celular, mantém os botões compactos e permite rolagem horizontal. */
@media (max-width:780px){
    .top{
        padding:10px 12px;
        gap:9px;
    }
    .top .brand{
        min-width:0;
        width:100%;
    }
    .top .brand b{
        font-size:17px;
    }
    .top .actions{
        width:100%;
        justify-content:flex-start;
        flex-wrap:nowrap;
        overflow-x:auto;
        padding-bottom:4px;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:thin;
    }
    .top .actions .btn,
    .top .actions .install-app-btn{
        flex:0 0 auto;
        width:auto;
        padding:9px 10px;
        font-size:13px;
    }
}

/* ===== MENU ADMIN: UMA UNICA LINHA NO COMPUTADOR ===== */
@media (min-width: 900px) {
  .top {
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    width:100% !important;
    padding:10px 14px !important;
    gap:10px !important;
  }
  .top .brand {
    flex:0 0 265px !important;
    width:265px !important;
    min-width:265px !important;
    gap:8px !important;
    white-space:nowrap !important;
  }
  .top .brand img { width:42px !important; height:42px !important; }
  .top .brand b { font-size:17px !important; line-height:18px !important; }
  .top .brand small { font-size:11px !important; line-height:13px !important; }
  .top .actions {
    flex:1 1 auto !important;
    min-width:0 !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:4px !important;
    white-space:nowrap !important;
    margin:0 !important;
    padding:0 !important;
  }
  .top .actions .btn {
    flex:0 0 auto !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    min-width:0 !important;
    min-height:36px !important;
    padding:8px 9px !important;
    margin:0 !important;
    font-size:13px !important;
    line-height:1 !important;
    border-radius:8px !important;
    white-space:nowrap !important;
  }
  .top .actions .install-app-btn { display:inline-flex !important; width:auto !important; }
}


/* =========================================================
   AJUSTE FINAL - MENU ADMINISTRATIVO COMPACTO EM UMA LINHA
   Mantém todos os botões, inclusive SAIR, na mesma linha.
========================================================= */
@media (min-width: 900px) {
    .top {
        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        justify-content:flex-start !important;
        padding:9px 14px !important;
        gap:8px !important;
    }

    .top .brand {
        flex:0 0 245px !important;
        width:245px !important;
        min-width:245px !important;
        gap:7px !important;
        white-space:nowrap !important;
    }

    .top .brand img {
        width:40px !important;
        height:40px !important;
    }

    .top .brand b {
        font-size:15px !important;
        line-height:16px !important;
    }

    .top .brand small {
        font-size:10px !important;
        line-height:11px !important;
    }

    .top .actions {
        flex:1 1 auto !important;
        min-width:0 !important;
        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;
        align-items:center !important;
        justify-content:flex-start !important;
        gap:4px !important;
        white-space:nowrap !important;
        overflow:visible !important;
        margin:0 !important;
        padding:0 !important;
    }

    .top .actions .btn,
    .top .actions .install-app-btn {
        flex:0 0 auto !important;
        width:auto !important;
        min-width:0 !important;
        min-height:32px !important;
        padding:7px 8px !important;
        margin:0 !important;
        font-size:11px !important;
        line-height:14px !important;
        border-radius:7px !important;
        display:inline-flex !important;
        align-items:center !important;
        justify-content:center !important;
        white-space:nowrap !important;
    }
}