/* ============================================================
   Backoffice — Agrupamento de Escolas de Albufeira Poente
   Mesmo sistema visual do site ("mar a poente"): azul-marinho,
   amarelo do sol, azuis do mar; Ubuntu Condensed nos títulos,
   Diodrum Rounded no texto. As classes são as usadas nos templates.
   ============================================================ */
:root {
    --ad-navy: #012255; --ad-navy-2: #0a3a7a; --ad-azul: #1f496f; --ad-ceu: #7099bf; --ad-gelo: #c6dbfa; --ad-neve: #f3f7fc;
    --ad-sol: #edbf07; --ad-sol-escuro: #b8930a; --ad-texto: #15223a; --ad-texto-2: #4b5a70; --ad-linha: #e2e9f3;
    --ad-ok: #1f8f4d; --ad-err: #c0392b; --ad-aviso: #b8930a;
    --ad-fonte: "Diodrum Rounded", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --ad-fonte-titulo: "Ubuntu Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
    --ad-raio: 14px; --ad-raio-sm: 8px;
    --ad-sombra: 0 10px 28px rgba(1, 34, 85, 0.08); --ad-sombra-forte: 0 22px 48px rgba(1, 34, 85, 0.20);
    --ad-side: 250px; --ad-transicao: 200ms cubic-bezier(.2, .7, .3, 1);
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { font-family: var(--ad-fonte); font-size: 15px; line-height: 1.5; color: var(--ad-texto); background: var(--ad-neve); -webkit-font-smoothing: antialiased; }
a { color: var(--ad-navy-2); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
h1, h2, h3 { margin: 0 0 12px; font-family: var(--ad-fonte-titulo); font-weight: 700; color: var(--ad-navy); line-height: 1.1; letter-spacing: -0.01em; }
h2 { font-size: 24px; } h3 { font-size: 19px; }
code { background: #e9eef6; padding: 2px 6px; border-radius: 5px; font-size: 12.5px; color: var(--ad-navy); }
:focus-visible { outline: 3px solid var(--ad-sol); outline-offset: 2px; border-radius: 4px; }
img { max-width: 100%; }

/* ---------- Estrutura ---------- */
.admin-shell { display: flex; min-height: 100vh; }
.admin-side { width: var(--ad-side); background: var(--ad-navy) url('../../img/textura-mar.jpg') center top / cover no-repeat; color: #fff; display: flex; flex-direction: column; flex-shrink: 0; position: sticky; top: 0; height: 100vh; overflow-y: auto; z-index: 30; }
.admin-side::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(1,34,85,.86), rgba(1,34,85,.97) 40%); pointer-events: none; }
.admin-side > * { position: relative; }
.admin-brand { padding: 20px 18px 14px; border-bottom: 1px solid rgba(255,255,255,.12); }
.admin-brand img { width: 100%; height: auto; display: block; }
.admin-brand span { display: block; margin-top: 12px; font-family: var(--ad-fonte-titulo); font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--ad-sol); }
.admin-nav { flex: 1; padding: 12px 10px; }
.admin-nav a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; margin: 2px 0; border-radius: 10px; color: #d7e0ee; font-size: 15px; transition: background var(--ad-transicao), color var(--ad-transicao), transform var(--ad-transicao); }
.admin-nav a:hover { background: rgba(255,255,255,.09); color: #fff; text-decoration: none; transform: translateX(2px); }
.admin-nav a.is-active { background: var(--ad-sol); color: var(--ad-navy); font-weight: 700; }
.admin-nav a.is-active .bi { color: var(--ad-navy); }
.admin-nav .bi { font-size: 17px; width: 22px; text-align: center; color: var(--ad-gelo); }
.admin-nav-sep { padding: 16px 12px 6px; font-family: var(--ad-fonte-titulo); font-size: 12px; text-transform: uppercase; letter-spacing: .16em; color: rgba(255,255,255,.55); }
.admin-badge { margin-left: auto; background: #fff; color: var(--ad-navy); font-weight: 700; font-size: 12px; padding: 2px 8px; border-radius: 999px; min-width: 24px; text-align: center; }
.admin-nav a.is-active .admin-badge { background: var(--ad-navy); color: #fff; }
.admin-side-foot { padding: 14px 18px 18px; border-top: 1px solid rgba(255,255,255,.12); display: grid; gap: 8px; font-size: 13.5px; }
.admin-side-foot a { color: #d7e0ee; display: flex; align-items: center; gap: 8px; }
.admin-side-foot a:hover { color: var(--ad-sol); text-decoration: none; }

.admin-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.admin-top { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 32px; background: rgba(255,255,255,.9); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border-bottom: 1px solid var(--ad-linha); position: sticky; top: 0; z-index: 20; }
.admin-top h1 { font-size: 26px; margin: 0; display: flex; align-items: center; gap: 12px; }
.admin-top-botao { display: none; width: 42px; height: 42px; border: 1px solid var(--ad-linha); border-radius: 10px; background: #fff; color: var(--ad-navy); font-size: 20px; cursor: pointer; align-items: center; justify-content: center; }
.admin-user { color: var(--ad-texto-2); font-size: 13.5px; display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.admin-user::before { content: ""; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(135deg, var(--ad-gelo), var(--ad-ceu)); display: inline-block; flex-shrink: 0; }
.admin-content { padding: 28px 32px 56px; max-width: 1480px; width: 100%; }

/* ---------- Avisos ---------- */
.admin-alert { padding: 12px 16px; border-radius: 10px; margin-bottom: 18px; border: 1px solid; display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; }
.admin-alert::before { font-family: "bootstrap-icons"; font-size: 16px; line-height: 1.3; }
.admin-alert.ok { background: #e9f7ee; border-color: #b7e0c4; color: #155d33; }
.admin-alert.ok::before { content: "\f26b"; }
.admin-alert.err { background: #fdecea; border-color: #f3b9b3; color: #7a1f16; }
.admin-alert.err::before { content: "\f33a"; }

/* ---------- Painel ---------- */
.admin-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 14px; margin-bottom: 26px; }
.admin-card { background: #fff; border: 1px solid var(--ad-linha); border-radius: var(--ad-raio); padding: 18px 20px; color: var(--ad-texto); box-shadow: var(--ad-sombra); transition: transform var(--ad-transicao), box-shadow var(--ad-transicao), border-color var(--ad-transicao); position: relative; overflow: hidden; }
.admin-card::after { content: ""; position: absolute; right: -18px; bottom: -18px; width: 70px; height: 70px; border-radius: 50%; background: var(--ad-neve); }
.admin-card:hover { text-decoration: none; transform: translateY(-3px); box-shadow: var(--ad-sombra-forte); border-color: var(--ad-gelo); }
.admin-card.is-accent { background: var(--ad-navy); color: #fff; border-color: var(--ad-navy); }
.admin-card.is-accent::after { background: rgba(255,255,255,.08); }
.admin-card .num { font-family: var(--ad-fonte-titulo); font-size: 36px; font-weight: 700; line-height: 1; position: relative; }
.admin-card .lbl { font-size: 13.5px; opacity: .85; margin-top: 6px; position: relative; }
.admin-grid-2 { display: grid; grid-template-columns: 1.4fr 1fr; gap: 22px; align-items: start; }
@media (max-width: 1100px) { .admin-grid-2 { grid-template-columns: 1fr; } }
.admin-block { background: #fff; border: 1px solid var(--ad-linha); border-radius: var(--ad-raio); padding: 20px 22px; margin-bottom: 22px; box-shadow: var(--ad-sombra); }
.admin-block > h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .16em; color: var(--ad-ceu); margin-bottom: 14px; font-weight: 700; }

/* ---------- Barra de ações, trilho ---------- */
.admin-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 18px; }
.admin-toolbar .espaco { flex: 1; }
.admin-crumbs { font-size: 13.5px; color: var(--ad-texto-2); margin-bottom: 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px; }
.admin-crumbs a { color: var(--ad-navy-2); display: inline-flex; align-items: center; gap: 5px; padding: 4px 10px; background: #fff; border: 1px solid var(--ad-linha); border-radius: 999px; }
.admin-crumbs a:hover { border-color: var(--ad-ceu); text-decoration: none; }
.admin-crumbs span { margin: 0 2px; color: var(--ad-ceu); }
.admin-crumbs strong { padding: 4px 10px; background: var(--ad-navy); color: #fff; border-radius: 999px; font-weight: 700; }
.admin-filtro { display: flex; align-items: center; gap: 8px; background: #fff; border: 1px solid var(--ad-linha); border-radius: 999px; padding: 6px 12px; min-width: 240px; }
.admin-filtro .bi { color: var(--ad-ceu); }
.admin-filtro input { border: 0; outline: 0; font: inherit; width: 100%; background: transparent; color: var(--ad-texto); }

/* ---------- Botões ---------- */
.btn-ad, .btn-ad-sm, details.admin-novo > summary { display: inline-flex; align-items: center; gap: 8px; background: var(--ad-navy); color: #fff; border: 1px solid var(--ad-navy); border-radius: 999px; padding: 10px 18px; font-size: 14.5px; font-weight: 700; cursor: pointer; font-family: inherit; line-height: 1.2; transition: transform var(--ad-transicao), box-shadow var(--ad-transicao), background var(--ad-transicao), color var(--ad-transicao); white-space: nowrap; }
.btn-ad-sm { padding: 6px 12px; font-size: 13.5px; }
.btn-ad:hover, .btn-ad-sm:hover, details.admin-novo > summary:hover { background: var(--ad-navy-2); text-decoration: none; color: #fff; transform: translateY(-1px); box-shadow: 0 8px 18px rgba(1,34,85,.18); }
.btn-ad.is-sec, .btn-ad-sm.is-sec { background: #fff; color: var(--ad-navy); border-color: var(--ad-linha); }
.btn-ad.is-sec:hover, .btn-ad-sm.is-sec:hover { background: var(--ad-neve); color: var(--ad-navy); border-color: var(--ad-gelo); }
.btn-ad.is-perigo, .btn-ad-sm.is-perigo { background: #fff; color: var(--ad-err); border-color: #e8b8b2; }
.btn-ad.is-perigo:hover, .btn-ad-sm.is-perigo:hover { background: #fdecea; color: var(--ad-err); }
.btn-ad.is-amarelo, details.admin-novo > summary { background: var(--ad-sol); color: var(--ad-navy); border-color: var(--ad-sol); box-shadow: 0 8px 18px rgba(237,191,7,.3); }
.btn-ad.is-amarelo:hover, details.admin-novo > summary:hover { background: #f5cb2a; color: var(--ad-navy); }
.btn-icone { background: none; border: 1px solid transparent; color: var(--ad-texto-2); cursor: pointer; padding: 6px 8px; border-radius: 8px; font-size: 16px; font-family: inherit; display: inline-flex; align-items: center; transition: background var(--ad-transicao), color var(--ad-transicao); }
.btn-icone:hover { background: var(--ad-neve); color: var(--ad-navy); text-decoration: none; }
details.admin-novo { position: relative; }
details.admin-novo > summary { list-style: none; }
details.admin-novo > summary::-webkit-details-marker { display: none; }
details.admin-novo > .admin-tipos { position: absolute; right: 0; top: calc(100% + 8px); z-index: 25; background: #fff; border: 1px solid var(--ad-linha); border-radius: var(--ad-raio); box-shadow: var(--ad-sombra-forte); padding: 12px; width: 560px; max-width: calc(100vw - 48px); }

/* ---------- Tabelas ---------- */
.admin-table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--ad-linha); border-radius: var(--ad-raio); overflow: hidden; box-shadow: var(--ad-sombra); }
.admin-table th, .admin-table td { padding: 11px 14px; text-align: left; border-bottom: 1px solid var(--ad-linha); vertical-align: middle; }
.admin-table th { background: var(--ad-neve); font-family: var(--ad-fonte-titulo); font-size: 12.5px; text-transform: uppercase; letter-spacing: .12em; color: var(--ad-ceu); font-weight: 700; }
.admin-table tr:last-child td { border-bottom: 0; }
.admin-table tr.is-nova td { font-weight: 700; }
.admin-table tr.is-clicavel { cursor: pointer; }
.admin-table tbody tr:hover td { background: #fafcff; }
.admin-table td.acoes { white-space: nowrap; text-align: right; }
.admin-table td.acoes .btn-icone { opacity: .55; }
.admin-table tbody tr:hover td.acoes .btn-icone { opacity: 1; }
.admin-table .tipo-icone { width: 54px; text-align: center; color: var(--ad-navy-2); font-size: 18px; }
.admin-table .tipo-icone .bi { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--ad-neve); }
.admin-table .mini { width: 44px; height: 34px; object-fit: cover; border-radius: 8px; border: 1px solid var(--ad-linha); vertical-align: middle; }
.admin-table td small { color: var(--ad-texto-2); font-size: 12.5px; }
.admin-table td a strong { font-family: var(--ad-fonte-titulo); font-size: 16px; }
.admin-table tr.is-oculto { display: none; }
.admin-empty { background: #fff; border: 1px dashed var(--ad-gelo); border-radius: var(--ad-raio); padding: 36px; text-align: center; color: var(--ad-texto-2); }
.pill { display: inline-block; padding: 3px 9px; border-radius: 999px; font-family: var(--ad-fonte-titulo); font-size: 11.5px; background: var(--ad-neve); color: var(--ad-navy-2); text-transform: uppercase; letter-spacing: .08em; margin-right: 4px; }
.pill.is-off { background: #fdecea; color: var(--ad-err); }
.pill.is-ok { background: #e9f7ee; color: var(--ad-ok); }
.badge-estado { display: inline-block; padding: 3px 9px; border-radius: 999px; font-family: var(--ad-fonte-titulo); font-size: 11.5px; text-transform: uppercase; letter-spacing: .08em; }
.estado-nova { background: #fff3cd; color: #7a5a00; } .estado-lida { background: var(--ad-neve); color: var(--ad-texto-2); } .estado-arquivada { background: #e9f7ee; color: var(--ad-ok); }

/* ---------- Formulários ---------- */
.admin-form { background: #fff; border: 1px solid var(--ad-linha); border-radius: var(--ad-raio); padding: 24px 26px; box-shadow: var(--ad-sombra); }
.admin-form-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 26px; align-items: start; }
@media (max-width: 1100px) { .admin-form-grid { grid-template-columns: 1fr; } }
.admin-lateral { display: grid; gap: 14px; position: sticky; top: 86px; }
@media (max-width: 1100px) { .admin-lateral { position: static; } }
.admin-lateral .admin-block { box-shadow: none; background: var(--ad-neve); border-color: transparent; }
.admin-lateral .admin-block > h3 { color: var(--ad-navy); font-size: 14px; letter-spacing: .14em; }
.admin-field { margin-bottom: 16px; }
.admin-field label { display: block; font-weight: 700; margin-bottom: 6px; font-size: 13.5px; color: var(--ad-navy); }
.admin-field input[type="text"], .admin-field input[type="email"], .admin-field input[type="password"], .admin-field input[type="url"], .admin-field input[type="date"],
.admin-field input[type="datetime-local"], .admin-field input[type="number"], .admin-field select, .admin-field textarea {
    width: 100%; padding: 10px 12px; border: 1px solid #c9d2dc; border-radius: var(--ad-raio-sm); font: inherit; background: #fff; color: var(--ad-texto); transition: border-color var(--ad-transicao), box-shadow var(--ad-transicao); }
.admin-field textarea { min-height: 96px; resize: vertical; }
.admin-field input:focus, .admin-field select:focus, .admin-field textarea:focus { outline: none; border-color: var(--ad-ceu); box-shadow: 0 0 0 3px rgba(112,153,191,.25); }
.admin-field input[type="file"] { display: block; width: 100%; padding: 10px; border: 1px dashed var(--ad-gelo); border-radius: var(--ad-raio-sm); background: var(--ad-neve); font: inherit; font-size: 13.5px; color: var(--ad-texto-2); }
.admin-field input[type="file"]::file-selector-button { background: var(--ad-navy); color: #fff; border: 0; border-radius: 999px; padding: 7px 14px; font: inherit; font-weight: 700; margin-right: 12px; cursor: pointer; }
.admin-hint { font-size: 12.5px; color: var(--ad-texto-2); margin-top: 5px; }
.admin-check { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; font-size: 14.5px; cursor: pointer; }
.admin-check input { width: 18px; height: 18px; accent-color: var(--ad-navy); margin: 0; }
.admin-prefixo { display: flex; align-items: stretch; }
.admin-prefixo span { background: var(--ad-neve); border: 1px solid #c9d2dc; border-right: 0; border-radius: var(--ad-raio-sm) 0 0 var(--ad-raio-sm); padding: 10px 12px; color: var(--ad-texto-2); white-space: nowrap; font-size: 13px; max-width: 50%; overflow: hidden; text-overflow: ellipsis; }
.admin-prefixo input { border-radius: 0 var(--ad-raio-sm) var(--ad-raio-sm) 0 !important; }
.admin-readonly { background: var(--ad-neve) !important; color: var(--ad-texto-2); }
.admin-acoes-form { display: flex; gap: 10px; align-items: center; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--ad-linha); flex-wrap: wrap; }
.admin-pre { background: var(--ad-neve); border: 1px solid var(--ad-linha); border-radius: var(--ad-raio-sm); padding: 14px; white-space: pre-wrap; font-size: 14px; line-height: 1.55; }
.admin-imagem-atual { margin-bottom: 10px; }
.admin-imagem-atual img { max-width: 100%; max-height: 200px; border-radius: 10px; box-shadow: var(--ad-sombra); display: block; }
.editor-html { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }
.tox-tinymce { border-radius: var(--ad-raio-sm) !important; border-color: #c9d2dc !important; }

.admin-detalhes > summary { cursor: pointer; list-style: none; }
.admin-detalhes > summary::-webkit-details-marker { display: none; }
.admin-detalhes > summary::before { content: "\f282"; font-family: "bootstrap-icons"; display: inline-block; margin-right: 8px; color: var(--ad-ceu); transition: transform var(--ad-transicao); }
.admin-detalhes[open] > summary::before { transform: rotate(90deg); }

/* ---------- Lista de tipos para criar ---------- */
.admin-tipos { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; }
.admin-tipos a { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: #fff; border: 1px solid var(--ad-linha); border-radius: 10px; color: var(--ad-texto); font-weight: 700; transition: border-color var(--ad-transicao), transform var(--ad-transicao), background var(--ad-transicao); }
.admin-tipos a:hover { border-color: var(--ad-ceu); background: var(--ad-neve); text-decoration: none; transform: translateY(-2px); }
.admin-tipos .bi { color: var(--ad-navy-2); font-size: 20px; width: 34px; height: 34px; display: inline-grid; place-items: center; border-radius: 9px; background: var(--ad-neve); }

/* ---------- Login ---------- */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 24px; background: var(--ad-navy) url('../../img/textura-mar.jpg') center / cover no-repeat; position: relative; }
.login-wrap::before { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(1,34,85,.55), rgba(1,34,85,.9)); }
.login-card { position: relative; background: #fff; border-radius: 18px; padding: 32px; width: 100%; max-width: 400px; box-shadow: 0 30px 70px rgba(0,0,0,.4); }
.login-card h1 { font-size: 26px; margin-bottom: 4px; }
.login-card .login-sub { color: var(--ad-texto-2); font-size: 14px; margin: 0 0 20px; }
.login-logo img { width: 100%; max-width: 300px; height: auto; margin: 0 auto 22px; display: block; }
.login-card .admin-field input { font-size: 15px; padding: 12px 14px; }
.login-voltar { display: block; text-align: center; margin-top: 16px; font-size: 13.5px; }

/* ---------- Paginação ---------- */
.admin-pag { display: flex; gap: 6px; margin-top: 18px; flex-wrap: wrap; }
.admin-pag a, .admin-pag span { padding: 6px 12px; border: 1px solid var(--ad-linha); border-radius: 999px; background: #fff; font-size: 13.5px; }
.admin-pag span.is-atual { background: var(--ad-navy); color: #fff; border-color: var(--ad-navy); }

/* ---------- Ecrãs pequenos ---------- */
@media (max-width: 900px) {
    .admin-side { position: fixed; left: 0; top: 0; bottom: 0; transform: translateX(-100%); transition: transform 260ms cubic-bezier(.2,.7,.3,1); box-shadow: var(--ad-sombra-forte); }
    body.side-aberta .admin-side { transform: none; }
    body.side-aberta::after { content: ""; position: fixed; inset: 0; background: rgba(1,34,85,.4); z-index: 25; }
    .admin-top { padding: 12px 16px; }
    .admin-top h1 { font-size: 21px; }
    .admin-top-botao { display: inline-flex; }
    .admin-user { display: none; }
    .admin-content { padding: 18px 16px 48px; }
    .admin-table { display: block; overflow-x: auto; }
    details.admin-novo > .admin-tipos { position: fixed; left: 16px; right: 16px; top: auto; width: auto; }
}