/* ===========================
   MEDCLIN • STYLE GLOBAL
   =========================== */

/* ======== BASE ======== */
:root{
  --azul:#0d47a1;
  --azul-escuro:#0b2e6d;
  --nav-bg:linear-gradient(180deg,#0d2c66 0%, #0b2250 100%);
  --nav-bd: rgba(255,255,255,.14);
  --nav-fg: #eaf2ff;
  --drop-bg:#0f1a2b;
  --drop-bd: rgba(255,255,255,.08);
  --fg:#111;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter,system-ui,Segoe UI,Arial,sans-serif;
  color:var(--fg);
  background:
    linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.92)),
    url('https://clinicabigdoctor.com.br/wp-content/uploads/2020/01/medicina-do-trabalho-slider-clinica-bigdoctor-home-14.jpg')
      center/cover no-repeat fixed;
  padding-bottom:56px; /* reserva pro footer fixo */
}
body::before{
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:url('https://clinicabigdoctor.com.br/wp-content/uploads/2020/01/medicina-do-trabalho-slider-clinica-bigdoctor-home-14.jpg') center/contain no-repeat;
  opacity:.07; filter:grayscale(30%);
}

/* ======== CONTAINER E CARTÕES ======== */
.container{max-width:980px;margin:32px auto;padding:0 16px;position:relative;z-index:1}
.container.wide{max-width:none;width:100%;margin:24px 0;padding:0 20px}

.card{
  background:#fff; border:1px solid #e8ebf2;
  border-radius:16px; padding:22px;
  box-shadow:0 8px 24px rgba(0,0,0,.06)
}

/* ======== TABELA ======== */
.table{width:100%;border-collapse:collapse;margin-top:10px;background:#fff}
.table th,.table td{border-bottom:1px solid #eef1f5;padding:10px;text-align:left}
.table th{font-weight:800;color:#334155;background:#f8fafc}

/* ======== FORM ======== */
.input{
  width:100%;padding:12px 14px;border:1px solid #d8dbe6;border-radius:12px;margin:8px 0;background:#eef4ff
}
select.input{background:#eef4ff}
.btn{
  display:inline-block;background:#0b2e6d;color:#fff;border:none;
  padding:10px 16px;border-radius:10px;font-weight:700;cursor:pointer;text-decoration:none
}
.btn:hover{background:#0a2c62}
.btn-dark{background:#111}.btn-dark:hover{background:#000}
.btn.danger{background:#8b1111}.btn.danger:hover{background:#a51616}
.actions{display:flex;gap:10px;flex-wrap:wrap}

.filters{display:grid;grid-template-columns:repeat(3,minmax(220px,1fr));gap:10px}
@media (max-width:1000px){ .filters{grid-template-columns:repeat(2,minmax(200px,1fr))} }
@media (max-width:640px){ .filters{grid-template-columns:1fr} }

/* ======== AVISOS ======== */
.notice{background:#eaf2ff;border:1px solid #cfdfff;color:#0b2e6d;padding:12px;border-radius:12px;margin:10px 0}
.hint{padding:.75rem;background:#fff8e1;border:1px solid #ffe0a3;border-radius:8px;margin-bottom:10px}

/* ======== BADGES ======== (usadas nos Periódicos) */
.bdg{display:inline-block;padding:.28rem .55rem;border-radius:999px;font-weight:800;font-size:.78rem}
.bdg-yellow{background:#fff7d1;border:1px solid #ffe082;color:#7a5c00}
.bdg-orange{background:#ffe6cc;border:1px solid #ffcc99;color:#8a3d00}
.bdg-red{background:#ffe0e0;border:1px solid #ffb3b3;color:#8b0000}
.bdg-black{background:#1f2937;border:1px solid #111827;color:#fff}
.bdg-green{background:#e8f6ee;border:1px solid #cdebd7;color:#166534}

.row-warn30{background:#fffdf0}
.row-warn20{background:#fff7ed}
.row-warn10{background:#fff2f2}
.row-overdue{background:#f3f4f6}

/* ======== HEADER (DUAS LINHAS) ======== */
.hdr{ position:sticky; top:0; z-index:1000; padding:.5rem .5rem; }
.hdr-top{
  display:flex; align-items:center; justify-content:space-between; gap:.8rem;
  background:var(--nav-bg); color:var(--nav-fg);
  border:1px solid var(--nav-bd);
  border-radius:16px; padding:.55rem .7rem;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.hdr-brand{display:inline-flex; align-items:center; gap:.6rem; text-decoration:none; color:#fff; font-weight:800}
.hdr-brand img{
  height:72px; width:auto; display:block;
  background:#fff; padding:8px 12px; border-radius:12px;
  border:1px solid #e5e7eb; box-shadow:0 3px 10px rgba(0,0,0,.12); object-fit:contain;
}
.hdr-right{display:flex; align-items:center; gap:.5rem; flex-wrap:wrap}

/* Linha 2 (nav) */
.hdr-nav{
  margin-top:.45rem;
  display:flex; align-items:center; gap:.5rem; flex-wrap:wrap;
  background:var(--nav-bg);
  border:1px solid var(--nav-bd);
  border-radius:16px; padding:.45rem .55rem;
  box-shadow:0 12px 28px rgba(0,0,0,.18);
  overflow:visible; /* p/ dropdown aparecer */
}

.nav-btn{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.52rem .8rem; border-radius:12px; text-decoration:none;
  color:#fff; background:rgba(255,255,255,.06); border:1px solid var(--nav-bd);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 6px 16px rgba(0,0,0,.18);
  font-weight:700; transition:.15s; white-space:nowrap;
}
.nav-btn:hover{ transform:translateY(-1px); background:rgba(255,255,255,.10) }
.nav-btn.is-active{ background:rgba(73,120,255,.22); border-color:rgba(114,149,255,.45) }
.nav-btn.ghost{ background:transparent }
.nav-btn.danger{ background:#8b1111; border-color:#a51f1f }
.nav-btn.danger:hover{ background:#a51616 }
.nav-ico{font-size:1.05rem}

.avatar{
  width:22px; height:22px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  background:#1f3b80; border:1px solid rgba(255,255,255,.35);
  font-weight:800; font-size:.86rem;
}

/* ======== DROPDOWNS ======== */
.menu-drop{ position:relative; list-style:none; }
.menu-drop .drop{
  position:absolute; top:calc(100% + 8px); left:0; min-width:240px;
  background:var(--drop-bg); color:#e9eefc; border:1px solid var(--drop-bd);
  border-radius:14px; box-shadow:0 14px 28px rgba(0,0,0,.28);
  padding:.4rem; display:none; z-index:9999;
}
.menu-drop:hover .drop,
.menu-drop:focus-within .drop{ display:block }
.menu-drop .drop li{list-style:none}
.menu-drop .drop a{
  display:block; padding:.6rem .75rem; border-radius:10px; color:#e9eefc; text-decoration:none; font-weight:600;
}
.menu-drop .drop a:hover{ background:#14337a; color:#fff }
.caret{opacity:.85}

/* some qualquer menu antigo da esquerda, se ainda existir no HTML */
.container > .menu, .nav-old, .toolbar-old { display:none !important }

/* ======== FOOTER FIXO ======== */
.footerbar{
  position:fixed;left:0;right:0;bottom:0;z-index:10;
  background: rgba(11,46,109,.92); color:#fff;
  box-shadow:0 -4px 10px rgba(0,0,0,.15);
  text-align:center; font-weight:600; padding:10px 14px;
}

/* ======== MODAL ASO ======== */
.aso-modal.hidden{display:none}
.aso-modal{position:fixed;inset:0;z-index:9999}
.aso-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.aso-dialog{position:relative;margin:3vh auto;width:96vw;height:94vh;max-width:1300px;background:#fff;border-radius:10px;overflow:hidden;box-shadow:0 25px 60px rgba(0,0,0,.25);display:flex;flex-direction:column}
.aso-bar{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background:#0b2e6d;color:#fff}
.aso-title{font-weight:700}
.aso-actions .btn{margin-left:8px}
.aso-body{position:relative;flex:1;background:#f6f7fb}
#asoFrame{width:100%;height:100%;border:0;background:#fff}
.aso-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-weight:600;color:#334155}

/* ======== SELECT2 AJUSTES (quando usado) ======== */
.select2-container .select2-selection--single{
  height:42px;border-radius:12px;border:1px solid #d8dbe6;background:#eef4ff
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
  line-height:42px;padding:0 12px;color:#111
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
  height:42px;right:8px
}
.select2-dropdown{
  border:1px solid #d8dbe6;border-radius:10px;overflow:hidden
}

/* ======== UTILITÁRIOS ======== */
.float-right{float:right}
.text-center{text-align:center}
.mt-0{margin-top:0}
.mb-0{margin-bottom:0}

/* === Alias p/ links do topo que usam .topnav-item === */
.topnav-item{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:.52rem .8rem; border-radius:12px; text-decoration:none;
  color:#fff; background:rgba(255,255,255,.06); border:1px solid var(--nav-bd);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 6px 16px rgba(0,0,0,.18);
  font-weight:700; transition:.15s; white-space:nowrap;
}
.topnav-item:hover{ transform:translateY(-1px); background:rgba(255,255,255,.10) }
.topnav-item.is-active{ background:rgba(73,120,255,.22); border-color:rgba(114,149,255,.45) }
.topnav-item.ghost{ background:transparent }
.topnav-item.danger{ background:#8b1111; border-color:#a51f1f }
.topnav-item.danger:hover{ background:#a51616 }

/* força a cor dos botões/links do topo, inclusive quando já visitados */
.nav-btn,
.nav-btn:visited,
.topnav-item,
.topnav-item:visited {
  color:#fff !important;
  text-decoration:none !important;
}

/* só pra garantir pointer e hover bonitinho */
.nav-btn:hover,
.topnav-item:hover {
  transform: translateY(-1px);
  background: rgba(255,255,255,.10);
}

/* ====== FIX: rodapé não sobrepor conteúdo ====== */
:root { --footer-h: 64px; }            /* altura do rodapé */

.footerbar{
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 10;
  min-height: var(--footer-h);
  padding: 12px 14px;                  /* mantém visual */
}

/* dá respiro pro conteúdo equivalente à altura do rodapé */
html, body { min-height: 100%; }
body{ padding-bottom: calc(var(--footer-h) + 16px) !important; }

/* em telas menores o rodapé costuma ficar mais alto */
@media (max-width: 640px){
  :root { --footer-h: 80px; }
}

/* ===== FIX rodapé: não sobrepor conteúdo ===== */
.footerbar{
  position: sticky !important;  /* ocupa espaço no fluxo e gruda no fim da viewport */
  bottom: 0;
  left: 0; right: 0;
  z-index: 10;
  background: rgba(11,46,109,.92);
  box-shadow: 0 -4px 10px rgba(0,0,0,.15);
  padding: 12px 14px;
  min-height: 58px;             /* ajuste fino se precisar */
}

/* remove o respiro que tínhamos colocado antes */
body{ padding-bottom: 0 !important; }

/* se algum CSS antigo ainda seta fixed, mata aqui */
.footerbar[style],
.footerbar{ position: sticky !important; }

/* opcional: em telas muito pequenas, dá um espacinho a mais interno */
@media (max-width: 640px){
  .footerbar{ min-height: 68px; }
}

/* ===== FIX rodapé: não sobrepor conteúdo ===== */
.footerbar{
  position: sticky !important;  /* ocupa espaço no fluxo e gruda no fim da viewport */
  bottom: 0;
  left: 0; right: 0;
  z-index: 10;
  background: rgba(11,46,109,.92);
  box-shadow: 0 -4px 10px rgba(0,0,0,.15);
  padding: 12px 14px;
  min-height: 58px;             /* ajuste fino se precisar */
}

/* remove o respiro que tínhamos colocado antes */
body{ padding-bottom: 0 !important; }

/* se algum CSS antigo ainda seta fixed, mata aqui */
.footerbar[style],
.footerbar{ position: sticky !important; }

/* opcional: em telas muito pequenas, dá um espacinho a mais interno */
@media (max-width: 640px){
  .footerbar{ min-height: 68px; }
}

/* Tela de login: esconde toda a navegação e botões do topo */
.is-login .hdr-nav,
.is-login .hdr-right .nav-btn,
.is-login .hdr-right .topnav-item { display: none !important; }

/* opcional: aproxima o card do topo */
.is-login .container { margin-top: 18px; }

/* Botão de Pendência e-Social: tom amarelado */
.nav-btn.warn{
  background: rgba(255,193,7,.14);
  border-color: rgba(255,193,7,.35);
}
.nav-btn.warn:hover{
  background: rgba(255,193,7,.22);
}
.nav-btn.warn.is-active{
  background: rgba(255,193,7,.28);
  border-color: rgba(255,193,7,.55);
}