/* Identidade visual central da Plataforma Escolar. */
.feedback-page .feedback-unavailable {
    width: min(470px, 92%); margin: 10vh auto; padding: 2rem;
    background: #fff; border: 1px solid #dce4ec; border-radius: 18px;
    text-align: center; box-shadow: 0 10px 30px #0f172a17;
}
.feedback-page .brand-mark {
    background: url("../brand/modules/avaliamais.svg") center/contain no-repeat;
    color: transparent;
}
.feedback-page .head, .feedback-page .hero { background: #17324d; color: #fff; }
.feedback-page .head h1, .feedback-page .hero h1 { color: #fff; }
:root {
    --pe-blue: #0b4ddb;
    --pe-blue-2: #1e88ff;
    --pe-cyan: #00cfe8;
    --pe-orange: #ff8a00;
    --pe-navy: #0b2a4a;
    --pe-bg: #f8fafc;
    --am-navy: #17324d;
    --am-green: #198754;
    --am-green-dark: #146c43;
    --am-blue: #2563eb;
    --am-red: #b91c1c;
    --am-bg: #f4f7fa;
    --am-surface: #ffffff;
    --am-text: #1e293b;
    --am-muted: #64748b;
    --am-line: #dce4ec;
    --am-font: "Poppins", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    --am-space-1: 0.25rem;
    --am-space-2: 0.5rem;
    --am-space-3: 0.75rem;
    --am-space-4: 1rem;
    --am-space-5: 1.5rem;
    --am-space-6: 2rem;
    --am-radius-sm: 8px;
    --am-radius-md: 12px;
    --am-radius-lg: 18px;
    --am-shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
    --am-shadow-md: 0 10px 30px rgba(15, 23, 42, 0.09);
    --am-shadow-lg: 0 22px 54px rgba(15, 23, 42, 0.16);
    --am-focus: 0 0 0 4px rgba(25, 135, 84, 0.18);
    --am-transition: 160ms ease;

    /* Compatibilidade com as variáveis usadas pelas telas anteriores. */
    --navy: var(--am-navy);
    --green: var(--am-green);
    --blue: var(--am-blue);
    --danger: var(--am-red);
    --bg-body: var(--am-bg);
    --text-main: var(--am-text);
    --line: var(--am-line);
    --muted: var(--am-muted);
    --primary-color: var(--am-green);
    --primary-hover: var(--am-green-dark);
}

.platform-inline-brand{display:inline-flex;align-items:center;gap:.65rem;color:var(--pe-navy)!important;font-size:1.14rem;font-weight:800;text-decoration:none}.platform-inline-brand img{width:2.35rem;height:2.35rem}

html,
body,
button,
input,
select,
textarea {
    font-family: var(--am-font) !important;
}

body {
    background-color: var(--am-bg) !important;
    color: var(--am-text) !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: var(--am-navy);
    font-family: var(--am-font);
    letter-spacing: -0.012em;
}

body > header,
.navbar-custom {
    background: #fff !important;
    color: var(--am-navy) !important;
    border-bottom: 3px solid var(--am-green) !important;
    box-shadow: 0 3px 14px rgba(15, 23, 42, 0.13) !important;
}

body > header a,
.navbar-custom a,
.navbar-custom .navbar-brand,
.navbar-custom .text-secondary,
.navbar-custom .user-info {
    color: var(--am-navy) !important;
}

body > header .nav a.active,
.navbar-custom a:hover {
    color: var(--am-green) !important;
}

.am-brand,
.navbar-brand {
    display: inline-flex !important;
    align-items: center;
    gap: 0.58rem;
    color: var(--am-green) !important;
    font-size: 1.35rem;
    font-weight: 750;
    line-height: 1;
    text-decoration: none;
    white-space: nowrap;
}

.am-brand::before,
.navbar-brand::before {
    content: "";
    width: 1.55rem;
    height: 1.55rem;
    flex: 0 0 auto;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath d='M320 32 0 160l320 128 256-102.4V352h64V160L320 32zM128 259.2V352c0 53 86 96 192 96s192-43 192-96v-92.8L320 336 128 259.2z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 512'%3E%3Cpath d='M320 32 0 160l320 128 256-102.4V352h64V160L320 32zM128 259.2V352c0 53 86 96 192 96s192-43 192-96v-92.8L320 336 128 259.2z'/%3E%3C/svg%3E") center/contain no-repeat;
}

.am-brand > i,
.navbar-brand > i {
    display: none !important;
}

.am-brand::before,
.navbar-brand::before {
    color: var(--am-green) !important;
}

.card,
.card-custom,
.action-card,
dialog,
.login-card,
.container-box,
.form-container {
    background-color: var(--am-surface);
    border-color: var(--am-line) !important;
    border-radius: 14px !important;
    box-shadow: 0 5px 18px rgba(15, 23, 42, 0.06) !important;
}

.action-card:hover {
    border-color: var(--am-green) !important;
    color: var(--am-green) !important;
}

.action-card i,
.text-success {
    color: var(--am-green) !important;
}

label,
.form-label {
    color: #475569;
    font-weight: 650;
}

input:not([type="checkbox"]):not([type="radio"]),
select,
textarea,
.form-control,
.form-select {
    border-color: #cbd5e1 !important;
    border-radius: 8px !important;
    color: var(--am-text);
}

input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
    border-color: var(--am-green) !important;
    box-shadow: 0 0 0 0.2rem rgba(25, 135, 84, 0.14) !important;
    outline: none;
}

.primary,
.btn-primary,
.btn-success,
.btn-success-custom,
.btn-submit,
.btn-corrigir-main {
    background-color: var(--am-green) !important;
    border-color: var(--am-green) !important;
    color: #fff !important;
}

.primary:hover,
.btn-primary:hover,
.btn-success:hover,
.btn-success-custom:hover,
.btn-submit:hover,
.btn-corrigir-main:hover {
    background-color: var(--am-green-dark) !important;
    border-color: var(--am-green-dark) !important;
}

.secondary,
.btn-secondary,
.btn-submit.btn-cadastro {
    background-color: var(--am-blue) !important;
    border-color: var(--am-blue) !important;
    color: #fff !important;
}

.btn-submit.btn-cadastro:hover {
    background-color: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

.danger,
.btn-danger {
    background-color: var(--am-red) !important;
    border-color: var(--am-red) !important;
    color: #fff !important;
}

.btn-outline-success {
    border-color: var(--am-green) !important;
    color: var(--am-green) !important;
}

.btn-outline-success:hover {
    background: var(--am-green) !important;
    color: #fff !important;
}

.muted,
.text-muted {
    color: var(--am-muted) !important;
}

table thead th,
.table-light th {
    background-color: #f1f5f9 !important;
    color: #475569 !important;
    border-color: var(--am-line) !important;
}

table td,
table th {
    border-color: #e5e7eb !important;
}

a {
    accent-color: var(--am-green);
}

@media print {
    body {
        background: #fff !important;
    }

    body > header,
    .navbar-custom {
        box-shadow: none !important;
    }
}

/* Mesmo cabeçalho e escala de leitura em todos os módulos, somente na tela.
   Não altera fontes escolhidas pelo professor nem documentos de impressão. */
@media screen {
    .module-page {font-size:1rem;line-height:1.5;--pe-header-height:84px}
    .module-page > header {box-sizing:border-box;display:flex!important;align-items:center!important;justify-content:space-between!important;flex-direction:row!important;flex-wrap:wrap;gap:16px!important;min-height:var(--pe-header-height)!important;width:100%;padding:16px clamp(16px,4vw,64px)!important;background:#fff!important;border-bottom:1px solid #cbded5!important;box-shadow:0 2px 10px #17324d08!important;color:var(--am-navy)!important}
    .module-page > header nav {display:flex;align-items:center;flex-wrap:wrap;gap:12px!important;min-width:0;font-size:.875rem!important;line-height:1.4}
    .module-page > header nav a {font-size:.875rem!important;font-weight:600;line-height:1.4;text-decoration:none}
    .module-page > header nav a:hover {color:var(--am-green)!important}
    .module-page > header .pe-module-brand {display:inline-flex!important;align-items:center;gap:12px!important;font-size:1.125rem!important;line-height:1.2;white-space:normal;color:var(--am-navy)!important;text-decoration:none!important}
    .module-page > header .pe-module-brand::before {display:none!important}
    .module-page > header .pe-module-brand > img {display:block;width:40px!important;height:40px!important;object-fit:contain;flex:0 0 40px}
    .module-page > header .pe-brand-content {display:flex!important;flex-direction:column;gap:3px;min-width:0}
    .module-page > header .pe-brand-content strong {font-size:1.125rem!important;font-weight:750;line-height:1.25;letter-spacing:-.01em;color:var(--am-navy)!important}
    .module-page > header .pe-brand-content small {display:block!important;font-size:.75rem!important;font-weight:400!important;line-height:1.4;letter-spacing:0;color:var(--am-muted)!important}
    .module-page main h1 {font-size:clamp(1.5rem,2.2vw,1.875rem)!important;line-height:1.25!important;font-weight:750;color:var(--am-navy)}
    .module-page main h2 {font-size:1.375rem!important;line-height:1.35!important;color:var(--am-navy)}
    .module-page main h3 {font-size:1.0625rem!important;line-height:1.4!important;color:var(--am-navy)}
    .module-page main label {font-size:.875rem;line-height:1.45;color:#334155}
    .module-page main .muted,.module-page main .hint,.module-page main .field-help {color:var(--am-muted)}
    .module-page :where(button,.at-button,.button,.btn) {font-family:var(--am-font);line-height:1.4}
    .module-page main :where(.primary,.btn-primary) {background:var(--am-green)!important;color:white!important}
    .module-page main :where(.secondary,.btn-secondary) {background:var(--am-blue)!important;color:white!important}
    .module-page :where(input,select,textarea,button,a,summary):focus-visible {outline:3px solid #19875470;outline-offset:3px}
    .module-page [hidden] {display:none!important}
}
@media screen and (max-width:760px) {
    .module-page > header {align-items:flex-start!important;gap:12px!important;padding:14px 16px!important}
    .module-page > header nav {width:100%;gap:10px!important}
    .module-page main h2 {font-size:1.25rem!important}
    .module-page > header{min-height:0!important;padding:10px 12px!important;gap:8px!important}
    .module-page > header .pe-module-brand{min-width:0;max-width:100%;gap:9px!important}
    .module-page > header .pe-module-brand > img{width:32px!important;height:32px!important;flex:0 0 32px}
    .module-page > header .pe-brand-content strong{font-size:1rem!important;overflow-wrap:break-word}
    .module-page > header .pe-brand-content small{font-size:.72rem!important}
    .module-page > header nav{flex-wrap:wrap;gap:6px 12px!important}
    .module-page > header nav a,.module-page > header nav button{min-height:44px;display:inline-flex;align-items:center;gap:6px;max-width:100%;white-space:normal}
    .module-page > header nav svg{width:20px!important;height:20px!important;max-width:20px!important;max-height:20px!important;flex:0 0 20px}
    .module-page > header nav img{max-width:24px;max-height:24px;object-fit:contain;flex-shrink:0}
    .module-page > header nav.platform-user{flex-direction:row!important;justify-content:flex-start;text-align:left}
    .module-page > header nav.platform-user>span{flex:1 1 100%;order:-1;min-width:0;overflow-wrap:break-word}
}

/* Ponte visual Plataforma Escolar → Avalia+.
   A estrutura usa o azul institucional; as ações pedagógicas preservam o verde do módulo. */
body.module-page:not(.communication-page) > header,
body.module-page:not(.communication-page) .role-header,
body.module-page:not(.communication-page) .page-header,
body.module-page:not(.communication-page) .saved-header,
body.module-page:not(.communication-page) .navbar-custom {
    border-top: 3px solid var(--pe-blue) !important;
    border-bottom-color: rgba(34, 197, 94, 0.62) !important;
}

body.module-page:not(.communication-page) .am-brand::before,
body.module-page:not(.communication-page) .navbar-brand::before {
    width: 2rem;
    height: 2rem;
    border-radius: 0.62rem;
    background: url("../brand/modules/avaliamais.svg") center/contain no-repeat !important;
    -webkit-mask: none !important;
    mask: none !important;
}

body.module-page:not(.communication-page) .platform-back {
    border-color: #cfe0f7 !important;
    background: #f3f8ff !important;
    color: var(--pe-blue) !important;
}

/* ========================================================================== 
   Sistema visual profissional v2 — Plataforma Escolar / módulo Avalia+
   ========================================================================== */

html {
    color-scheme: light;
    line-height: 1.5;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

[hidden] {
    display: none !important;
}

::selection {
    background: rgba(25, 135, 84, 0.2);
    color: var(--am-navy);
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
    outline: 3px solid rgba(25, 135, 84, 0.38) !important;
    outline-offset: 3px;
}

.module-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 100% 0, rgba(37, 99, 235, 0.045), transparent 28rem),
        linear-gradient(180deg, #f8fafc 0, var(--am-bg) 24rem) !important;
}

.module-page > header,
.module-page .role-header,
.module-page .page-header,
.module-page .saved-header,
.module-page .navbar-custom {
    position: relative;
    z-index: 20;
    min-height: 68px;
    border-bottom: 1px solid rgba(25, 135, 84, 0.24) !important;
    box-shadow: var(--am-shadow-sm) !important;
}

.module-page > header nav,
.module-page .role-header nav {
    display: flex;
    align-items: center;
    gap: var(--am-space-3);
}

.module-page > header nav a,
.module-page .role-header nav > a:not(.logout-link),
.module-page .navbar-custom .nav-link {
    border-radius: var(--am-radius-sm);
    padding: 0.55rem 0.72rem;
    font-size: 0.82rem;
    font-weight: 700;
    text-decoration: none;
    transition: color var(--am-transition), background var(--am-transition), border-color var(--am-transition);
}

.module-page > header nav a:hover,
.module-page .role-header nav > a:not(.logout-link):hover,
.module-page .navbar-custom .nav-link:hover {
    background: #ecfdf5;
    color: var(--am-green-dark) !important;
}

.module-page :where(main, .wrap, .dashboard-wrap, .container, .container-fluid) {
    animation: am-page-in 280ms ease both;
}

@keyframes am-page-in {
    from { opacity: 0; transform: translateY(5px); }
    to { opacity: 1; transform: translateY(0); }
}

.module-page :where(h1, .h1) {
    font-size: clamp(1.65rem, 2.2vw, 2.2rem);
    line-height: 1.15;
}

.module-page :where(h2, .h2) {
    font-size: clamp(1.15rem, 1.6vw, 1.45rem);
    line-height: 1.25;
}

.module-page :where(.card, .card-custom, .action-card, .panel, .box, .container-box, .form-container, .overview-card, .shortcut) {
    border: 1px solid rgba(203, 213, 225, 0.86) !important;
    border-radius: var(--am-radius-md) !important;
    box-shadow: var(--am-shadow-sm) !important;
    transition: border-color var(--am-transition), box-shadow var(--am-transition), transform var(--am-transition);
}

.module-page :where(.card, .card-custom, .panel, .box, .container-box, .form-container, .overview-card) {
    background: rgba(255, 255, 255, 0.98) !important;
}

.module-page :where(.action-card, .shortcut):hover {
    border-color: rgba(25, 135, 84, 0.55) !important;
    box-shadow: var(--am-shadow-md) !important;
    transform: translateY(-2px);
}

.module-page :where(label, .form-label) {
    display: inline-block;
    margin-bottom: 0.35rem;
    color: #334155;
    font-size: 0.84rem;
    font-weight: 700;
}

.module-page label.assignment-switch {
    display: flex;
}

.module-page :where(input:not([type="checkbox"]):not([type="radio"]), select, textarea, .form-control, .form-select) {
    min-height: 42px;
    border: 1px solid #cbd5e1 !important;
    border-radius: var(--am-radius-sm) !important;
    background-color: #fff;
    color: var(--am-text);
    transition: border-color var(--am-transition), box-shadow var(--am-transition), background var(--am-transition);
}

.module-page :where(textarea) {
    min-height: 96px;
    resize: vertical;
}

.module-page :where(input, select, textarea)::placeholder {
    color: #94a3b8;
    opacity: 1;
}

.module-page :where(input, select, textarea):disabled {
    background: #f1f5f9 !important;
    color: #64748b;
    cursor: not-allowed;
}

.module-page :where(.primary, .secondary, .danger, .light, .btn, .btn-submit, .btn-success-custom, .btn-corrigir-main, .open-invite) {
    min-height: 40px;
    border-radius: var(--am-radius-sm) !important;
    font-size: 0.84rem;
    font-weight: 750;
    line-height: 1.1;
    text-decoration: none;
    transition: transform var(--am-transition), box-shadow var(--am-transition), background var(--am-transition), border-color var(--am-transition);
}

.module-page :where(.primary, .secondary, .danger, .light, .btn, .btn-submit, .btn-success-custom, .btn-corrigir-main, .open-invite):not(:disabled):hover {
    box-shadow: 0 7px 16px rgba(15, 23, 42, 0.13);
    transform: translateY(-1px);
}

.module-page :where(button, .btn, .primary, .secondary, .danger, .light):disabled {
    cursor: not-allowed;
    filter: grayscale(0.25);
    opacity: 0.58;
}

.module-page .light,
.module-page .btn-light,
.module-page .btn-outline-secondary {
    border: 1px solid #cbd5e1 !important;
    background: #fff !important;
    color: #334155 !important;
}

.module-page .light:hover,
.module-page .btn-light:hover,
.module-page .btn-outline-secondary:hover {
    border-color: #94a3b8 !important;
    background: #f8fafc !important;
}

.module-page :where(.table-wrap, .table-responsive) {
    overflow-x: auto;
    border: 1px solid var(--am-line);
    border-radius: var(--am-radius-md);
    background: #fff;
}

.module-page table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.87rem;
}

.module-page table thead th {
    padding: 0.8rem 0.9rem;
    background: #f1f5f9 !important;
    color: #334155 !important;
    font-size: 0.73rem;
    font-weight: 800;
    letter-spacing: 0.035em;
    text-transform: uppercase;
    white-space: nowrap;
}

.module-page table tbody td {
    padding: 0.78rem 0.9rem;
    vertical-align: middle;
}

.module-page table tbody tr:nth-child(even) {
    background: rgba(248, 250, 252, 0.78);
}

.module-page table tbody tr:hover {
    background: #f0fdf4;
}

.module-page :where(.alert, .notice, .tip, .warning, .erro-msg, .sucesso-msg, [role="alert"], [role="status"]) {
    border-radius: var(--am-radius-sm) !important;
    line-height: 1.45;
}

.module-page :where(.badge, .role-tag, .status, [class*="badge"]) {
    border-radius: 999px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.01em;
}

.module-page details {
    border-radius: var(--am-radius-md);
}

.module-page summary {
    cursor: pointer;
    font-weight: 750;
}

.module-page dialog,
.module-page .modal-content {
    border: 1px solid var(--am-line) !important;
    border-radius: var(--am-radius-lg) !important;
    box-shadow: var(--am-shadow-lg) !important;
}

.module-page dialog::backdrop,
.module-page .modal-backdrop {
    background: rgba(15, 23, 42, 0.56);
    backdrop-filter: blur(2px);
}

.auth-page {
    position: relative;
    isolation: isolate;
    min-height: 100vh;
    background:
        radial-gradient(circle at 18% 18%, rgba(34, 197, 94, 0.18), transparent 24rem),
        radial-gradient(circle at 86% 80%, rgba(37, 99, 235, 0.18), transparent 28rem),
        linear-gradient(135deg, #0f2942 0%, #17324d 55%, #10283e 100%) !important;
}

.auth-page::before {
    position: fixed;
    inset: 0;
    z-index: -1;
    background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 40px 40px;
    content: "";
    pointer-events: none;
}

.auth-page .auth-card {
    width: min(100%, 430px);
    padding: clamp(1.7rem, 4vw, 2.4rem) !important;
    border: 1px solid rgba(255, 255, 255, 0.64) !important;
    border-radius: var(--am-radius-lg) !important;
    box-shadow: var(--am-shadow-lg) !important;
    animation: am-page-in 320ms ease both;
}

.auth-page .auth-header {
    margin-bottom: 1.65rem;
}

.auth-page .auth-header h2 {
    color: var(--am-navy) !important;
    letter-spacing: -0.025em;
}

.auth-page .auth-header p {
    color: var(--am-muted) !important;
    line-height: 1.5 !important;
}

.auth-page .back-home {
    top: 1.35rem;
    left: 1.5rem;
    padding: 0.55rem 0.75rem;
    border: 1px solid rgba(255,255,255,.24);
    border-radius: var(--am-radius-sm);
    color: #fff;
    transition: background var(--am-transition), border-color var(--am-transition);
}

.auth-page .back-home:hover {
    border-color: rgba(255,255,255,.44);
    background: rgba(255,255,255,.09);
    text-decoration: none;
}

.auth-page .tabs {
    gap: 0.25rem;
    padding: 0.25rem;
    border: 0;
    border-radius: 10px;
    background: #f1f5f9;
}

.auth-page .tab-btn {
    border-radius: 7px;
    color: #64748b;
}

.auth-page .tab-btn.active {
    border-bottom: 0;
    background: #fff;
    color: var(--am-green-dark);
    box-shadow: var(--am-shadow-sm);
}

.auth-page .form-control {
    min-height: 46px;
}

.auth-page .btn-submit {
    min-height: 46px;
    border-radius: var(--am-radius-sm) !important;
    box-shadow: 0 8px 18px rgba(25, 135, 84, 0.2);
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

@media (max-width: 720px) {
    .module-page > header,
    .module-page .role-header,
    .module-page .page-header,
    .module-page .saved-header {
        min-height: auto;
    }

    .module-page > header nav,
    .module-page .role-header nav {
        flex-wrap: wrap;
    }

    .module-page :where(.card, .card-custom, .panel, .box, .container-box, .form-container, .overview-card) {
        border-radius: 10px !important;
    }

    .auth-page {
        align-items: flex-start !important;
        padding-top: 5rem !important;
    }

    .auth-page .back-home {
        left: 1rem;
    }
}

@media print {
    .module-page {
        background: #fff !important;
    }

    .module-page > header,
    .module-page .role-header,
    .module-page .navbar-custom,
    .module-page .no-print {
        display: none !important;
    }

    .module-page :where(main, .wrap, .dashboard-wrap, .container, .container-fluid) {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        animation: none !important;
    }

    .module-page :where(.card, .card-custom, .panel, .box, .container-box, .form-container, .overview-card) {
        border-color: #bbb !important;
        box-shadow: none !important;
    }
}