/* ============================================================================
   Sistema de Gabaritos de CNH — 2ª DRPC / Alfenas
   Paleta e padrão herdados da Central de Sistemas (PCMG).
   ============================================================================ */
:root{
    --preto:        #0b0b0c;
    --fundo:        #121214;
    --painel:       #1b1b1e;
    --painel-alto:  #232327;
    --borda:        rgba(255,255,255,0.08);
    --dourado:      #c9a24b;
    --dourado-claro:#e0c274;
    --texto:        #ececed;
    --texto-2:      #9a9a9e;
    --azul:         #4c8bf5;
    --verde-whats:  #25d366;
    --vermelho-pdf: #d1433b;
}
*{ box-sizing: border-box; }
html, body{ margin: 0; }
html{ color-scheme: dark; }
body{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
    background: var(--fundo);
    color: var(--texto);
    min-height: 100vh;
    display: flex; flex-direction: column;
}
a{ text-decoration: none; color: inherit; }

/* ===== Cabeçalho ===== */
.cabecalho{
    background: var(--preto);
    border-bottom: 2px solid rgba(201,162,75,0.35);
    padding: 0.9rem 1.6rem;
}
.cabecalho .interno{
    max-width: 1180px; margin: 0 auto;
    display: flex; align-items: center; gap: 14px;
}
.cabecalho img{ width: 44px; height: 44px; object-fit: contain; }
.cabecalho .cab-textos{ flex: 1; }
.cabecalho .titulo{ color: var(--dourado); font-weight: 800; font-size: 1.2rem; letter-spacing: 0.02rem; line-height: 1.1; }
.cabecalho .subtitulo{ color: var(--texto-2); font-size: 0.74rem; margin-top: 3px; }

/* ===== Hero ===== */
.hero{
    background:
        radial-gradient(60% 120% at 20% 0%, rgba(201,162,75,0.10), transparent 60%),
        linear-gradient(180deg, #161618, var(--fundo));
    border-bottom: 1px solid var(--borda);
}
.hero .interno{ max-width: 1180px; margin: 0 auto; padding: 2rem 1.6rem 1.8rem; }
.hero h1{
    margin: 0 0 6px; font-size: 1.7rem; font-weight: 800; letter-spacing: 0.02rem;
    background: linear-gradient(135deg, var(--dourado), var(--dourado-claro));
    -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.hero p{ margin: 0; color: var(--texto-2); font-size: 0.92rem; max-width: 760px; line-height: 1.55; }

/* ===== Conteúdo ===== */
.conteudo{ flex: 1; max-width: 1180px; width: 100%; margin: 0 auto; padding: 2rem 1.6rem 2.5rem; }

.categoria{ margin-bottom: 2.4rem; }
.categoria > h3{
    color: var(--dourado);
    font-size: 0.74rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.14rem;
    margin: 0 0 1.1rem; padding-bottom: 0.6rem;
    border-bottom: 1px solid var(--borda);
    display: flex; align-items: center; gap: 0.6rem;
}
.categoria > h3 i{ font-size: 0.95rem; }

/* ===== Painel do gabarito em destaque ===== */
.painel-gabarito{
    background: var(--painel);
    border: 1px solid var(--borda);
    border-radius: 14px;
    padding: 1.4rem;
}
.gb-cabecalho{
    display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;
    margin-bottom: 1.4rem;
}
.gb-dado{
    background: var(--painel-alto);
    border: 1px solid var(--borda);
    border-radius: 10px;
    padding: 0.8rem 1rem;
    display: flex; flex-direction: column; gap: 4px;
}
.gb-dado .rot{ color: var(--texto-2); font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.08rem; }
.gb-dado .val{ color: var(--dourado-claro); font-size: 1.35rem; font-weight: 800; }

.gb-grade{
    display: grid;
    grid-template-columns: repeat(10, 1fr);
    gap: 8px;
    margin-bottom: 1.4rem;
}
/* Fallback para navegadores sem suporte a CSS Grid */
@supports not (display: grid){
    .gb-grade{ display: flex; flex-wrap: wrap; }
    .gb-grade .gb-questao{ width: calc(10% - 8px); }
}
.gb-questao{
    background: var(--painel-alto);
    border: 1px solid var(--borda);
    border-radius: 9px;
    overflow: hidden;
    text-align: center;
}
.gb-questao .q-num{
    display: block;
    background: var(--preto);
    color: var(--texto-2);
    font-size: 0.72rem; font-weight: 700;
    padding: 4px 0;
    border-bottom: 1px solid var(--borda);
}
.gb-questao .q-alt{
    display: block;
    color: var(--dourado);
    font-size: 1.25rem; font-weight: 800;
    padding: 7px 0;
}

/* ===== Botões ===== */
.gb-acoes{ display: flex; flex-wrap: wrap; gap: 10px; }
.btn{
    display: inline-flex; align-items: center; gap: 8px;
    border: 1px solid var(--borda);
    border-radius: 10px;
    padding: 0.7rem 1.1rem;
    font-size: 0.9rem; font-weight: 700;
    cursor: pointer;
    background: var(--painel-alto);
    color: var(--texto);
    transition: transform .12s, border-color .12s, background .12s, box-shadow .12s;
}
.btn:hover{ transform: translateY(-1px); box-shadow: 0 8px 18px rgba(0,0,0,0.4); }
.btn-pdf{ background: linear-gradient(135deg, #d1433b, #a5332c); color:#fff; border-color: transparent; }
.btn-download{ background: linear-gradient(135deg, #c9a24b, #a6822f); color:#111; border-color: transparent; }
.btn-whats{ background: linear-gradient(135deg, #25d366, #1da851); color:#08210f; border-color: transparent; }
.btn-buscar{ background: linear-gradient(135deg, #3b74d1, #2c5bb0); color:#fff; border-color: transparent; }
.btn-limpar{ background: var(--painel-alto); }

.gb-obs{
    margin: 1.1rem 0 0;
    color: var(--texto-2); font-size: 0.8rem; line-height: 1.5;
    display: flex; align-items: flex-start; gap: 8px;
}
.gb-obs i{ color: var(--dourado); margin-top: 2px; }

/* ===== Formulário de busca ===== */
.form-busca{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr auto;
    gap: 14px;
    align-items: end;
    background: var(--painel);
    border: 1px solid var(--borda);
    border-radius: 14px;
    padding: 1.3rem;
}
.form-busca .campo{ display: flex; flex-direction: column; gap: 6px; }
.form-busca label{ color: var(--texto-2); font-size: 0.76rem; text-transform: uppercase; letter-spacing: 0.06rem; }
.form-busca input{
    background: var(--painel-alto);
    border: 1px solid var(--borda);
    border-radius: 9px;
    padding: 0.65rem 0.8rem;
    color: var(--texto);
    font-size: 0.92rem;
}
.form-busca input:focus{ outline: none; border-color: rgba(201,162,75,0.6); }
.campo-botoes{ display: flex; gap: 10px; }

/* ===== Listas / resultados ===== */
.resultados{ margin-top: 1.3rem; }
.resultados h4{ color: var(--texto-2); font-size: 0.82rem; font-weight: 600; margin: 0 0 0.9rem; }
.lista-gabaritos{ display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; }
.item-gabarito{
    display: flex; align-items: center; gap: 12px;
    background: var(--painel);
    border: 1px solid var(--borda);
    border-radius: 12px;
    padding: 0.9rem 1rem;
    transition: border-color .15s, transform .15s, box-shadow .15s, background .15s;
}
.item-gabarito:hover{
    background: var(--painel-alto);
    border-color: rgba(201,162,75,0.55);
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(0,0,0,0.45);
}
.ig-icone{
    width: 40px; height: 40px; flex-shrink: 0;
    border-radius: 10px;
    display: flex; align-items: center; justify-content: center;
    font-size: 1.05rem; color: var(--dourado);
    background: linear-gradient(135deg, #0e0e10, #34343a);
    border: 1px solid rgba(201,162,75,0.3);
}
.ig-texto{ min-width: 0; flex: 1; }
.ig-titulo{ color: var(--texto); font-weight: 700; font-size: 0.95rem; }
.item-gabarito:hover .ig-titulo{ color: var(--dourado-claro); }
.ig-desc{ color: var(--texto-2); font-size: 0.8rem; margin-top: 3px; }
.item-gabarito .seta{ color: #55565b; font-size: 0.8rem; transition: color .15s, transform .15s; }
.item-gabarito:hover .seta{ color: var(--dourado); transform: translateX(2px); }

/* ===== Avisos ===== */
.aviso-vazio{
    background: var(--painel);
    border: 1px dashed var(--borda);
    border-radius: 12px;
    padding: 1.6rem;
    color: var(--texto-2);
    display: flex; align-items: center; gap: 12px;
    font-size: 0.92rem;
}
.aviso-vazio i{ color: var(--dourado); font-size: 1.3rem; }

/* ===== Rodapé ===== */
.rodape{
    background: var(--preto);
    border-top: 2px solid rgba(201,162,75,0.35);
    color: var(--texto-2);
    padding: 1.4rem 1.6rem;
    font-size: 0.78rem;
}
.rodape .interno{ max-width: 1180px; margin: 0 auto; display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; align-items: center; }
.rodape strong{ color: var(--dourado); font-weight: 700; }
.rodape .link-adm{ color: var(--texto-2); }
.rodape .link-adm:hover{ color: var(--dourado); }

/* ===== Mobile ===== */
@media (max-width: 860px){
    .form-busca{ grid-template-columns: 1fr 1fr; }
    .campo-botoes{ grid-column: 1 / -1; }
}
@media (max-width: 720px){
    .cabecalho .subtitulo{ display: block; }
    .hero h1{ font-size: 1.4rem; }
    .gb-cabecalho{ grid-template-columns: 1fr; }
    .gb-grade{ grid-template-columns: repeat(5, 1fr); }
    .form-busca{ grid-template-columns: 1fr; }
    .lista-gabaritos{ grid-template-columns: 1fr; }
    .rodape .interno{ flex-direction: column; align-items: flex-start; gap: 6px; }
}
@media (max-width: 420px){
    .gb-grade{ grid-template-columns: repeat(4, 1fr); }
}

/* ===== Agenda de exames (pública) ===== */
.lista-exames{ display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 12px; }
.item-exame{
    display: flex; align-items: stretch; gap: 0;
    background: var(--painel);
    border: 1px solid var(--borda);
    border-radius: 12px;
    overflow: hidden;
    transition: border-color .15s, transform .15s, box-shadow .15s;
}
.item-exame:hover{
    border-color: rgba(201,162,75,0.55);
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(0,0,0,0.45);
}
.ex-data{
    flex-shrink: 0;
    width: 74px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    background: linear-gradient(160deg, #0e0e10, #34343a);
    border-right: 1px solid rgba(201,162,75,0.3);
    padding: 0.6rem 0;
}
.ex-data .ex-dia{ color: var(--dourado-claro); font-size: 1.6rem; font-weight: 800; line-height: 1; }
.ex-data .ex-mes{ color: var(--dourado); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.1rem; margin-top: 2px; }
.ex-data .ex-ano{ color: var(--texto-2); font-size: 0.68rem; margin-top: 2px; }
.ex-texto{ padding: 0.85rem 1rem; display: flex; flex-direction: column; justify-content: center; gap: 5px; min-width: 0; }
.ex-tipo{ color: var(--texto); font-weight: 700; font-size: 0.95rem; line-height: 1.35; }
.item-exame:hover .ex-tipo{ color: var(--dourado-claro); }
.ex-desc{ color: var(--texto-2); font-size: 0.8rem; display: flex; align-items: center; gap: 6px; }
.ex-desc i{ color: var(--dourado); }
/* Exame já realizado (data passada) */
.exame-passado{ opacity: 0.55; }
.exame-passado .ex-data{ background: linear-gradient(160deg, #131315, #232327); border-right-color: var(--borda); }
.exame-passado .ex-data .ex-dia,
.exame-passado .ex-data .ex-mes{ color: var(--texto-2); }

/* ========================================================================
   NAVEGAÇÃO PÚBLICA
   ======================================================================== */
.nav-publica{ background:var(--painel); border-bottom:1px solid var(--borda); position:sticky; top:0; z-index:40; }
.nav-publica .interno{ display:flex; gap:4px; max-width:1080px; margin:0 auto; padding:0 1rem; overflow-x:auto; }
.np-item{
    display:inline-flex; align-items:center; gap:8px; white-space:nowrap;
    color:var(--texto-2); font-size:0.9rem; font-weight:600;
    padding:0.9rem 1.1rem; border-bottom:3px solid transparent; transition:all .14s;
}
.np-item i{ color:var(--dourado); }
.np-item:hover{ color:var(--texto); }
.np-item.ativo{ color:var(--dourado); border-bottom-color:var(--dourado); }

/* ========================================================================
   BARRA DE CONTROLES (escala pública)
   ======================================================================== */
.barra-controles{ display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:1.5rem; }
.nav-mes-publica{ display:flex; align-items:center; gap:14px; }
.btn-nav{
    width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center;
    background:var(--painel); border:1px solid var(--borda); border-radius:10px;
    color:var(--dourado); font-size:0.95rem; transition:all .12s;
}
.btn-nav:hover{ background:var(--painel-alto); border-color:rgba(201,162,75,0.5); }
.mes-atual{ font-size:1.15rem; font-weight:800; color:var(--dourado); min-width:180px; text-align:center; }
.controles-dir{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.toggle-vista{ display:inline-flex; background:var(--painel); border:1px solid var(--borda); border-radius:10px; overflow:hidden; }
.toggle-vista a{ padding:0.6rem 1rem; color:var(--texto-2); font-size:0.85rem; font-weight:600; display:inline-flex; align-items:center; gap:7px; }
.toggle-vista a.ativo{ background:linear-gradient(135deg,var(--dourado),#a6822f); color:#111; }
.toggle-vista a:not(.ativo):hover{ background:var(--painel-alto); color:var(--texto); }

/* ========================================================================
   LISTA DE ESCALA (pública)
   ======================================================================== */
.lista-escala{ display:flex; flex-direction:column; gap:0; }
.dia-cabecalho{
    display:flex; align-items:baseline; gap:12px;
    padding:0.7rem 0.2rem; margin-top:1rem; border-bottom:2px solid var(--borda);
}
.dc-dow{ background:var(--preto); color:var(--dourado); font-size:0.75rem; font-weight:800; padding:3px 10px; border-radius:6px; text-transform:uppercase; }
.dc-data{ font-size:1.1rem; font-weight:800; color:var(--texto); }
.dia-exames{ display:flex; flex-direction:column; gap:10px; padding:1rem 0; }
.exame-card{
    display:flex; align-items:center; gap:18px;
    background:var(--painel); border:1px solid var(--borda); border-left:4px solid var(--dourado);
    border-radius:12px; padding:1rem 1.2rem; flex-wrap:wrap;
}
.ec-hora{ font-size:1.05rem; font-weight:800; color:var(--dourado-claro); display:flex; align-items:center; gap:8px; min-width:90px; }
.ec-info{ flex:1; min-width:180px; }
.ec-tipo{ font-size:1.05rem; font-weight:700; color:var(--texto); }
.ec-local{ font-size:0.9rem; color:var(--texto-2); margin-top:3px; display:flex; align-items:center; gap:6px; }
.ec-local i{ color:var(--dourado); }
.ec-obs{ font-size:0.82rem; color:var(--texto-2); font-style:italic; margin-top:4px; }
.ec-equipe{ display:flex; flex-direction:column; gap:5px; min-width:150px; }
.ec-eq-linha{ display:flex; align-items:center; justify-content:space-between; gap:12px; background:var(--painel-alto); padding:5px 12px; border-radius:8px; }
.ec-eq-linha span{ font-size:0.72rem; color:var(--texto-2); text-transform:uppercase; letter-spacing:0.03rem; }
.ec-eq-linha b{ font-size:0.95rem; color:var(--dourado-claro); letter-spacing:0.05rem; }

/* Legenda de equipe */
.legenda-equipe{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:2rem; }
.leg-bloco{ background:var(--painel); border:1px solid var(--borda); border-radius:12px; padding:1.1rem 1.3rem; }
.leg-titulo{ color:var(--dourado); font-size:0.85rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05rem; margin-bottom:0.9rem; display:flex; align-items:center; gap:8px; }
.leg-itens{ display:flex; flex-wrap:wrap; gap:8px; }
.leg-item{ display:inline-flex; align-items:center; gap:7px; background:var(--painel-alto); border-radius:20px; padding:0.35rem 0.85rem; font-size:0.85rem; color:var(--texto-2); }
.leg-item b{ background:var(--preto); color:var(--dourado); width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:0.78rem; }

/* Atalhos de meses */
.meses-atalho{ display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-top:2rem; padding-top:1.5rem; border-top:1px solid var(--borda); }
.ma-rotulo{ color:var(--texto-2); font-size:0.85rem; }
.ma-chip{ background:var(--painel); border:1px solid var(--borda); border-radius:8px; padding:0.35rem 0.75rem; color:var(--texto-2); font-size:0.8rem; font-weight:700; }
.ma-chip:hover{ border-color:rgba(201,162,75,0.5); color:var(--dourado); }
.ma-chip.ativo{ background:linear-gradient(135deg,var(--dourado),#a6822f); color:#111; border-color:transparent; }

/* Vazio */
.vazio-publico{ text-align:center; padding:3.5rem 1rem; color:var(--texto-2); }
.vazio-publico i{ font-size:3rem; color:var(--borda); margin-bottom:1rem; }
.vazio-publico p{ font-size:1.05rem; }

/* ========================================================================
   CALENDÁRIO PÚBLICO
   ======================================================================== */
.calendario-publico{ border:1px solid var(--borda); border-radius:12px; overflow:hidden; }
.calendario-publico .cal-cabecalho{ display:grid; grid-template-columns:repeat(7,1fr); background:var(--preto); }
.calendario-publico .cal-ds{ padding:0.7rem; text-align:center; color:var(--dourado); font-size:0.75rem; font-weight:700; text-transform:uppercase; letter-spacing:0.05rem; }
.calendario-publico .cal-semana{ display:grid; grid-template-columns:repeat(7,1fr); }
.calendario-publico .cal-dia{ min-height:110px; border-top:1px solid var(--borda); border-left:1px solid var(--borda); padding:6px; }
.calendario-publico .cal-dia:nth-child(7n+1){ border-left:none; }
.calendario-publico .cal-dia.vazio{ background:rgba(0,0,0,0.15); }
.calendario-publico .cal-dia.com-exame{ background:var(--painel); }
.calendario-publico .cal-dia.hoje{ background:rgba(201,162,75,0.08); }
.calendario-publico .cal-num{ font-size:0.82rem; font-weight:700; color:var(--texto-2); width:26px; height:26px; display:flex; align-items:center; justify-content:center; border-radius:50%; }
.calendario-publico .cal-dia.hoje .cal-num{ background:var(--dourado); color:#111; }
.calendario-publico .cal-exames{ display:flex; flex-direction:column; gap:4px; margin-top:5px; }
.calendario-publico .cal-ex{ background:var(--painel-alto); border-left:3px solid var(--dourado); border-radius:5px; padding:4px 7px; }
.calendario-publico .ce-hora{ font-size:0.72rem; font-weight:800; color:var(--dourado-claro); min-width:auto; }
.calendario-publico .ce-tipo{ display:block; font-size:0.76rem; font-weight:700; color:var(--texto); }
.calendario-publico .ce-local{ display:block; font-size:0.7rem; color:var(--texto-2); }

/* ========================================================================
   LOCAIS (público)
   ======================================================================== */
.grid-locais-pub{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:18px; }
.local-pub{ background:var(--painel); border:1px solid var(--borda); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; transition:transform .15s,box-shadow .15s; }
.local-pub:hover{ transform:translateY(-3px); box-shadow:0 16px 34px rgba(0,0,0,0.45); }
.lp-foto{ height:190px; background:var(--painel-alto); }
.lp-foto img{ width:100%; height:100%; object-fit:cover; display:block; }
.lp-sem-foto{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; color:#3a3b40; font-size:3rem; }
.lp-corpo{ padding:1.2rem 1.3rem; display:flex; flex-direction:column; flex:1; }
.lp-nome{ font-size:1.25rem; font-weight:800; color:var(--dourado-claro); margin:0 0 0.7rem; }
.lp-linha{ color:var(--texto-2); font-size:0.9rem; margin-bottom:6px; display:flex; align-items:flex-start; gap:9px; }
.lp-linha i{ color:var(--dourado); width:16px; margin-top:2px; }
.lp-comochegar{ color:var(--texto-2); font-size:0.86rem; line-height:1.5; margin:0.6rem 0 1rem; padding-top:0.8rem; border-top:1px dashed var(--borda); }
.lp-acoes{ display:flex; gap:10px; margin-top:auto; padding-top:0.8rem; flex-wrap:wrap; }
.lp-acoes .btn{ flex:1; justify-content:center; font-size:0.85rem; }

@media (max-width:720px){
    .legenda-equipe{ grid-template-columns:1fr; }
    .barra-controles{ justify-content:center; }
    .calendario-publico .cal-dia{ min-height:78px; }
    .calendario-publico .ce-local{ display:none; }
    .exame-card{ gap:12px; }
}

/* ========================================================================
   MODAL DE DETALHES DO EXAME
   ======================================================================== */
/* Card em lista vira botão: reset visual mantendo o layout */
button.exame-card{ width:100%; text-align:left; cursor:pointer; font:inherit; color:inherit; position:relative; }
button.exame-card:hover{ border-color:rgba(201,162,75,0.5); }
.ec-ver{ position:absolute; top:10px; right:14px; font-size:0.72rem; color:var(--texto-2); display:flex; align-items:center; gap:5px; opacity:0; transition:opacity .12s; }
.ec-ver i{ color:var(--dourado); }
button.exame-card:hover .ec-ver{ opacity:1; }
/* Botão de exame no calendário */
button.cal-ex{ width:100%; text-align:left; cursor:pointer; font:inherit; color:inherit; border:none; }
button.cal-ex:hover{ filter:brightness(1.25); }

.modal-exame{ position:fixed; inset:0; z-index:1000; display:none; align-items:center; justify-content:center; padding:1rem; }
.modal-exame.aberto{ display:flex; }
.me-fundo{ position:absolute; inset:0; background:rgba(0,0,0,0.72); backdrop-filter:blur(2px); }
.me-caixa{
    position:relative; z-index:1; width:100%; max-width:460px;
    background:var(--painel); border:1px solid var(--borda); border-radius:16px;
    box-shadow:0 24px 60px rgba(0,0,0,0.6); overflow:hidden;
    animation:me-surge .18s ease;
}
@keyframes me-surge{ from{ opacity:0; transform:translateY(12px) scale(0.98); } to{ opacity:1; transform:none; } }
.me-fechar{
    position:absolute; top:12px; right:12px; z-index:2;
    width:34px; height:34px; border-radius:50%; border:1px solid var(--borda);
    background:var(--painel-alto); color:var(--texto-2); cursor:pointer; font-size:0.95rem;
    display:flex; align-items:center; justify-content:center; transition:all .12s;
}
.me-fechar:hover{ background:var(--preto); color:var(--dourado); }
.me-topo{ padding:1.4rem 1.5rem 1.1rem; border-left:5px solid var(--dourado); background:var(--painel-alto); }
.me-tipo{ font-size:1.35rem; font-weight:800; color:var(--dourado); line-height:1.1; }
.me-datahora{ font-size:0.95rem; color:var(--texto); margin-top:6px; font-weight:600; }
.me-corpo{ padding:1.2rem 1.5rem 1.5rem; display:flex; flex-direction:column; gap:1rem; }
.me-linha{ display:flex; flex-direction:column; gap:4px; }
.me-rot{ font-size:0.74rem; color:var(--texto-2); text-transform:uppercase; letter-spacing:0.05rem; display:flex; align-items:center; gap:7px; }
.me-rot i{ color:var(--dourado); width:15px; }
.me-val{ font-size:1rem; color:var(--texto); font-weight:600; line-height:1.4; padding-left:22px; }

/* Card de exame agora é div clicável */
div.exame-card{ cursor:pointer; position:relative; }
div.exame-card:hover{ border-color:rgba(201,162,75,0.5); }
.ec-acoes{ display:flex; flex-direction:column; align-items:flex-end; gap:8px; min-width:150px; }
.btn-como-chegar{
    display:inline-flex; align-items:center; gap:8px;
    background:linear-gradient(135deg,var(--dourado),#a6822f); color:#111;
    font-size:0.85rem; font-weight:700; padding:0.5rem 0.9rem; border-radius:9px;
    white-space:nowrap; transition:filter .12s;
}
.btn-como-chegar:hover{ filter:brightness(1.08); }
.ec-ver{ position:static; opacity:0.7; font-size:0.72rem; color:var(--texto-2); display:flex; align-items:center; gap:5px; }
.ec-ver i{ color:var(--dourado); }
div.exame-card:hover .ec-ver{ opacity:1; }
/* Botão como chegar dentro do modal */
.me-btn-chegar{ justify-content:center; margin-top:0.3rem; }

/* Rótulos de agendamento/local na lista pública */
.ec-rot{ color:var(--texto-2); font-weight:600; }
.ec-local .fa-map-pin{ color:var(--texto-2); }

/* ========================================================================
   TEMA CLARO (opt-in do usuário) — html[data-tema="claro"]
   Cores baseadas no tema claro do sistema GEPOL, adaptadas ao dourado.
   O cabeçalho e a barra de navegação permanecem escuros (identidade
   institucional); o corpo da página fica claro para melhor leitura.
   ======================================================================== */
html[data-tema="claro"]{
    --fundo:        #f4f5f7;
    --painel:       #ffffff;
    --painel-alto:  #eef0f3;
    --borda:        #e5e7eb;
    --texto:        #1f2430;
    --texto-2:      #6b7280;
    color-scheme: light;
}
html[data-tema="claro"] body{ background: var(--fundo); color: var(--texto); }

/* Sombras suaves nos cartões (no claro elas ajudam a separar do fundo) */
html[data-tema="claro"] .categoria,
html[data-tema="claro"] .exame-card,
html[data-tema="claro"] .local-pub,
html[data-tema="claro"] .gb-cartao,
html[data-tema="claro"] .leg-bloco{
    box-shadow: 0 1px 3px rgba(16,24,40,0.06), 0 1px 2px rgba(16,24,40,0.04);
}

/* Grade de gabaritos e cartões com fundo claro */
html[data-tema="claro"] .gb-grade .gb-quad{ background: var(--painel-alto); }

/* Calendário: cabeçalho dos dias claro (não fica um bloco preto no meio) */
html[data-tema="claro"] .calendario .cal-cabecalho,
html[data-tema="claro"] .calendario-publico .cal-cabecalho{
    background: #2a2d31;
}
html[data-tema="claro"] .cal-dia.vazio{ background: #eceef1; }
html[data-tema="claro"] .cal-ex,
html[data-tema="claro"] .calendario-publico .cal-ex{ background: var(--painel-alto); }

/* Badges "dia da semana" e números de legenda continuam escuros p/ contraste do dourado */
html[data-tema="claro"] .dc-dow,
html[data-tema="claro"] .leg-item b{ background: #2a2d31; }

/* Hero claro */
html[data-tema="claro"] .hero{
    background:
        radial-gradient(60% 120% at 20% 0%, rgba(201,162,75,0.12), transparent 60%),
        linear-gradient(180deg, #ffffff, var(--fundo));
}
html[data-tema="claro"] .hero p{ color: #4b5563; }

/* Modal no claro */
html[data-tema="claro"] .me-topo{ background: var(--painel-alto); }
html[data-tema="claro"] .me-fechar{ background: var(--painel-alto); }
html[data-tema="claro"] .me-fechar:hover{ background: #2a2d31; color: var(--dourado); }

/* Inputs no claro */
html[data-tema="claro"] input,
html[data-tema="claro"] select,
html[data-tema="claro"] textarea{
    background: #ffffff;
    color: var(--texto);
    border-color: var(--borda);
}

/* ===== Botão de alternância de tema (sol/lua) ===== */
.btn-tema{
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.18);
    color: var(--dourado);
    width: 36px; height: 36px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    cursor: pointer; font-size: 0.95rem; flex-shrink: 0;
    transition: background .15s, border-color .15s, transform .15s;
}
.btn-tema:hover{ background: rgba(255,255,255,0.16); transform: rotate(-15deg); }
.btn-tema .fa-sun{ display: none; }
html[data-tema="claro"] .btn-tema .fa-moon{ display: none; }
html[data-tema="claro"] .btn-tema .fa-sun{ display: inline; }
/* Posiciona no canto direito do cabeçalho */
.cabecalho .interno{ position: relative; }
.cab-tema{ position: absolute; top: 50%; right: 0; transform: translateY(-50%); }

/* ========================================================================
   TEMA CLARO — ajustes de contraste e redução do dourado
   (só afeta o tema claro; o escuro permanece como está)
   ======================================================================== */
/* 1) Texto secundário mais escuro no claro (cinza estava apagado) */
html[data-tema="claro"]{ --texto-2: #4b5563; }

/* 2) Números da grade de gabaritos: claros sobre o cabeçalho escuro */
html[data-tema="claro"] .gb-questao .q-num{ color: #e8e9ec; }

/* 3) Valores/dados deixam de ser dourados e viram texto escuro normal.
      O dourado fica reservado a poucos títulos (h3, cabeçalho, nomes). */
html[data-tema="claro"] .gb-dado .val{ color: var(--texto); }
html[data-tema="claro"] .ec-hora{ color: var(--texto); }
html[data-tema="claro"] .ec-eq-linha b{ color: var(--texto); }
html[data-tema="claro"] .calendario-publico .ce-hora{ color: #a6822f; }
html[data-tema="claro"] .ex-data .ex-dia{ color: var(--texto); }
html[data-tema="claro"] .mes-atual{ color: var(--texto); }

/* 4) Rótulos de campo continuam legíveis (herdaram o --texto-2 novo) */

/* Admin: valores/rótulos equivalentes no tema claro */
html[data-tema="claro"] .ag-local b{ color: var(--texto); }
html[data-tema="claro"] .tabela-escala .nums{ color: var(--texto); }
html[data-tema="claro"] .cod{ color: var(--texto); }

/* Tema claro: textos sobre as faixas ESCURAS (cabeçalho/nav/rodapé) precisam
   ser claros — o --texto-2 escuro do corpo fica apagado sobre o preto. */
html[data-tema="claro"] .cabecalho .subtitulo{ color: #b9bcc3; }
html[data-tema="claro"] .rodape{ color: #b9bcc3; }
html[data-tema="claro"] .rodape .link-adm{ color: #b9bcc3; }
html[data-tema="claro"] .cabecalho .cal-cabecalho{ color: inherit; }