/* Atitude · estilo das aplicações sem Bootstrap (SM, TOOLS e IRIS). Variáveis em tokens.css. */

/* ==========================================================================
   Iris Painel — design system v2 ("Panze style")
   Atitude Comunicação · híbrido navy + azul Atitude · Geist
   ========================================================================== */
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:var(--font);
  color:var(--text);
  font-size:14px;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  /* canvas claro com brilho laranja (esq) e azul Atitude (dir) no topo */
  background:
    radial-gradient(820px 460px at 0% -4%, rgba(249,115,22,.12), transparent 60%),
    radial-gradient(820px 460px at 100% -4%, rgba(25,37,210,.12), transparent 60%),
    var(--bg);
  background-attachment:fixed;
  min-height:100vh;
}
a{ color:inherit; text-decoration:none; }
/* ===== Layout shell ===================================================== */
.app{ display:flex; min-height:100vh; }
.sidebar{
  width:var(--sidebar-w);
  background:transparent;
  color:var(--text);
  display:flex;
  flex-direction:column;
  position:fixed;
  inset:0 auto 0 0;
  z-index:40;
  padding:8px 12px;
  transition:transform .22s ease;
}
.sidebar__brand{
  display:flex; flex-direction:column; align-items:flex-start; gap:8px;
  padding:22px 14px 18px;
}
.sidebar__brand .brand-logo{ width:150px; max-width:100%; height:auto; display:block; }
.sidebar__brand .brand-modulo{
  font-size:10.5px; font-weight:700; letter-spacing:.18em; text-transform:uppercase;
  color:var(--text-2); padding-left:3px;
}
.sidebar__nav{ padding:6px; display:flex; flex-direction:column; gap:4px; flex:1; }
.nav-link{
  display:flex; align-items:center; gap:13px;
  padding:11px 14px; border-radius:var(--radius-sm);
  color:var(--text-2); font-weight:600; font-size:13.5px;
  transition:background .15s, color .15s, transform .15s;
}
.nav-link .ic{ width:22px; text-align:center; font-size:17px; }
.nav-section{ display:block; padding:16px 14px 4px; font-size:10.5px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--text-3); }
.nav-section:first-child{ padding-top:4px; }
.nav-count{ margin-left:auto; min-width:20px; height:20px; padding:0 6px; border-radius:999px; background:var(--red); color:#fff; font-size:11px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
/* Abas da Agenda (SM): Hoje · 7 dias · 30 dias · Publicados · Com erro */
.abas-agenda{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:20px; }
.abas-agenda .aba__n{ font-size:11px; font-weight:700; opacity:.7; }
/* abas de filtro dentro de uma página: mais discretas que as da Agenda */
.abas-status{ margin-bottom:16px; }
.abas-status .aba{ padding:6px 12px; font-size:12.5px; }
.abas-status .aba.is-active{ background:var(--accent-soft); border-color:var(--accent-soft); color:var(--accent); }
/* Menu "⋯" de ações (helpers.php: menuAcoes) */
.acoes{ position:relative; display:inline-block; }
.menu-acoes{ display:none; position:absolute; left:0; top:calc(100% + 6px); z-index:60; min-width:230px; margin:0; padding:6px; list-style:none;
  background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:var(--shadow-md); text-align:left; }
.acoes.is-open .menu-acoes{ display:block; }
.acoes.para-cima .menu-acoes{ top:auto; bottom:calc(100% + 6px); }
.acoes.para-esquerda .menu-acoes{ left:auto; right:0; }
.menu-acoes .item{ display:flex; align-items:center; gap:9px; width:100%; padding:8px 10px; border:0; background:none; border-radius:8px;
  font:inherit; font-size:13px; font-weight:500; color:var(--text); text-decoration:none; cursor:pointer; white-space:nowrap; }
.menu-acoes .item:hover{ background:var(--surface-2); }
.menu-acoes .item i{ width:16px; text-align:center; color:var(--text-2); }
.menu-acoes .item--perigo, .menu-acoes .item--perigo i{ color:var(--red); }
.menu-acoes .sep{ height:1px; background:var(--border); margin:5px 2px; }
.menu-acoes form{ margin:0; }
/* Números de largura fixa (Geist): tabelas, métricas e contagens se alinham */
.tbl, .num, .metric__value, .aba__n, .count{ font-variant-numeric:tabular-nums; }
/* Topo e menu iguais em todas as aplicações */
.topbar__user{ cursor:pointer; font:inherit; border:0; }
.menu-usuario .menu-acoes{ min-width:200px; }
.sidebar__foot .user-info{ color:var(--text); font-size:13px; font-weight:700; }
.sidebar__foot .user-role{ color:var(--text-3); font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; margin-top:2px; }
/* a página já tem o próprio título grande: o topo não repete */
.content:has(.main .page-head h1) .topbar__title{ display:none; }
/* Aviso rápido no canto da tela */
.aviso-rapido{ position:fixed; right:24px; bottom:24px; z-index:90; background:var(--navy); color:#fff; padding:10px 16px; border-radius:12px; box-shadow:var(--shadow-md); font-size:13px; font-weight:600; transition:opacity .3s; }
.aviso-rapido.saindo{ opacity:0; }
/* com o menu aberto, o card para de se mexer e deixa o menu passar da borda */
.post-card:has(.acoes.is-open), .err-item:has(.acoes.is-open), .card:has(.acoes.is-open){ position:relative; overflow:visible !important; transform:none; z-index:20; }
.table-wrap:has(.acoes.is-open){ overflow:visible !important; }
.abas-agenda .aba{ display:inline-flex; align-items:center; gap:7px; padding:8px 15px; border-radius:999px; background:var(--surface); border:1px solid var(--border); color:var(--text-2); font-size:13px; font-weight:600; transition:background .15s, color .15s; }
.abas-agenda .aba:hover{ color:var(--navy); box-shadow:var(--shadow); }
.abas-agenda .aba.is-active{ background:var(--navy); border-color:var(--navy); color:#fff; }
.aba__count{ min-width:19px; height:19px; padding:0 6px; border-radius:999px; background:var(--red); color:#fff; font-size:11px; font-weight:700; display:inline-flex; align-items:center; justify-content:center; }
.nav-link:hover{ background:var(--surface); color:var(--navy); box-shadow:var(--shadow); }
.nav-link.is-active{ background:var(--navy); color:#fff; box-shadow:0 8px 20px rgba(24,33,47,.22); }
.nav-link.is-active:hover{ background:var(--navy-700); color:#fff; }
.sidebar__foot{
  padding:16px; font-size:12px; color:var(--text-3); font-weight:500;
}
.content{ flex:1; margin-left:var(--sidebar-w); display:flex; flex-direction:column; min-width:0; }
.topbar{
  background:transparent;
  padding:18px 30px 6px; min-height:60px;
  display:flex; align-items:center; justify-content:space-between;
  position:sticky; top:0; z-index:30;
  backdrop-filter:saturate(1.2) blur(2px);
}
.topbar__title{ font-size:18px; font-weight:700; letter-spacing:-.01em; }
.topbar__right{ display:flex; align-items:center; gap:12px; font-size:13px; color:var(--text-2); }
.topbar__user{
  display:flex; align-items:center; gap:9px;
  background:var(--surface); padding:6px 12px 6px 6px; border-radius:var(--pill);
  box-shadow:var(--shadow); font-weight:600;
}
.topbar__user .avatar{
  width:30px;height:30px;border-radius:50%;
  background:var(--navy); color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;
}
.hamburger{ display:none; background:var(--surface); border:0; font-size:20px; cursor:pointer; color:var(--navy); width:42px;height:42px;border-radius:13px; box-shadow:var(--shadow); }
.main{ padding:18px 30px 32px; max-width:1240px; width:100%; margin:0 auto; }
/* ===== Page header ===================================================== */
.page-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:22px; flex-wrap:wrap; }
.page-head h1{ font-size:28px; font-weight:800; letter-spacing:-.025em; margin:0 0 2px; }
.page-head .sub{ font-size:13.5px; color:var(--text-2); margin:0; font-weight:500; }
/* ===== Buttons (pill) ================================================== */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 18px; border-radius:var(--pill);
  font-size:13px; font-weight:700; cursor:pointer;
  border:1px solid transparent; transition:background .15s, border .15s, color .15s, transform .12s, box-shadow .15s;
  background:var(--navy); color:#fff;
}
.btn:hover{ background:var(--navy-700); transform:translateY(-1px); }
.btn--ghost{ background:var(--surface); color:var(--text-2); border-color:var(--border-2); box-shadow:var(--shadow); }
.btn--ghost:hover{ background:#fff; color:var(--navy); border-color:var(--border-2); }
.btn--sm{ padding:8px 13px; font-size:12px; }
.btn--accent{ background:var(--accent); }
.btn--accent:hover{ background:var(--accent-700); }
.btn--danger{ background:var(--red); }
.btn--danger:hover{ background:#c93a3f; }
.btn--danger-ghost{ background:var(--surface); color:var(--red); border-color:var(--red-border); box-shadow:var(--shadow); }
.btn--danger-ghost:hover{ background:var(--red-soft); color:#c93a3f; }
/* ===== Cards =========================================================== */
.card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); }
.card--pad{ padding:22px; }
/* grid helpers */
.grid{ display:grid; gap:18px; }
.grid--metrics{ grid-template-columns:repeat(4,1fr); }
.grid--posts{ grid-template-columns:repeat(3,1fr); }
@media (max-width:1024px){ .grid--posts{ grid-template-columns:repeat(2,1fr); } .grid--metrics{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .grid--posts,.grid--metrics{ grid-template-columns:1fr; } }
/* ===== Metric tiles ==================================================== */
.metric{
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius);
  padding:22px; box-shadow:var(--shadow); display:flex; flex-direction:column; gap:7px;
  position:relative; overflow:hidden; transition:box-shadow .15s, transform .15s;
}
.metric:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px); }
.metric__top{ display:flex; align-items:center; justify-content:space-between; }
.metric__icon{
  width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:20px;
  background:var(--accent-soft); color:var(--accent);
}
.metric__value{ font-size:34px; font-weight:800; line-height:1; color:var(--text); letter-spacing:-.02em; }
.metric__label{ font-size:13px; color:var(--text-2); font-weight:600; }
.metric__hint{ font-size:12px; color:var(--text-3); }
.metric--green  .metric__icon{ background:var(--green-soft); color:var(--green); }
.metric--red    .metric__icon{ background:var(--red-soft); color:var(--red); }
.metric--amber  .metric__icon{ background:var(--amber-soft); color:var(--amber); }
.metric a.metric__link{ position:absolute; inset:0; }
/* ===== Post card (Hoje / Próximos) ===================================== */
.post-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow); transition:box-shadow .15s, transform .15s; display:flex; flex-direction:column; }
.post-card:hover{ box-shadow:var(--shadow-md); transform:translateY(-2px); }
.post-card__media{ aspect-ratio:1/1; background:var(--surface-2); overflow:hidden; position:relative; }
.post-card__media img,.post-card__media video{ width:100%; height:100%; object-fit:cover; display:block; }
.post-card__placeholder{ width:100%; height:100%; display:flex; align-items:center; justify-content:center; font-size:46px; color:var(--text-3); }
.post-card__body{ padding:14px 16px; display:flex; flex-direction:column; gap:6px; flex:1; }
.post-card__meta{ display:flex; align-items:center; justify-content:space-between; font-size:12px; color:var(--text-2); font-weight:600; }
.post-card__time{ font-variant-numeric:tabular-nums; font-weight:700; }
.post-card__title{ font-size:14px; font-weight:600; color:var(--text); margin:0; }
.post-card__profile{ font-size:12px; color:var(--text-3); }
.post-card__actions{ display:flex; gap:8px; padding:0 16px 14px; }
/* ===== Badges ========================================================== */
.badge{ display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:700; padding:3px 11px; border-radius:var(--pill); border:1px solid var(--border-2); color:var(--text-2); background:var(--surface-2); }
.badge--green{ color:var(--green); background:var(--green-soft); border-color:var(--green-border); }
.badge--red{ color:var(--red); background:var(--red-soft); border-color:var(--red-border); }
.badge--accent{ color:var(--accent); background:var(--accent-soft); border-color:#c7ccff; }
/* ===== Tables ========================================================== */
.table-wrap{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); }
table.tbl{ width:100%; border-collapse:collapse; font-size:13px; }
.tbl thead th{ text-align:left; padding:13px 18px; background:var(--surface-2); border-bottom:1px solid var(--border); font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-2); font-weight:700; }
.tbl tbody td{ padding:13px 18px; border-top:1px solid var(--border); vertical-align:middle; }
.tbl tbody tr:hover{ background:var(--surface-2); }
.tbl .num{ font-variant-numeric:tabular-nums; white-space:nowrap; }
.tbl .err-row td{ background:var(--red-soft); color:var(--red); font-size:12px; padding-top:9px; padding-bottom:9px; border-top:0; }
/* ===== Error / list cards (Em erro) ==================================== */
.err-item{ background:var(--surface); border:1px solid var(--border); border-left:4px solid var(--red); border-radius:var(--radius-md); padding:18px; box-shadow:var(--shadow); }
.err-item__head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.err-item__name{ font-weight:700; margin:0; }
.err-item__meta{ display:flex; flex-wrap:wrap; gap:6px 16px; margin-top:5px; font-size:12px; color:var(--text-2); font-weight:500; }
.err-item__reason{ background:var(--red-soft); border:1px solid var(--red-border); color:#c93a3f; font-size:13px; padding:9px 13px; border-radius:var(--radius-sm); margin-top:11px; }
/* ===== Empty state ===================================================== */
.empty{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:54px 24px; text-align:center; box-shadow:var(--shadow); }
.empty__icon{ font-size:40px; margin-bottom:10px; color:var(--text-3); line-height:1; }
.empty__title{ font-weight:700; color:var(--text); }
.empty__sub{ font-size:13px; color:var(--text-2); margin-top:5px; }
/* ===== Alerts / flash ================================================== */
.alert{ border-radius:var(--radius-sm); padding:13px 17px; font-size:13px; margin-bottom:18px; border:1px solid; font-weight:500; }
.alert--error{ background:var(--red-soft); border-color:var(--red-border); color:#c93a3f; }
.alert--ok{ background:var(--green-soft); border-color:var(--green-border); color:#15803d; }
/* ===== Section title (group by day) ==================================== */
.section-title{ font-size:15px; font-weight:700; color:var(--text); padding-bottom:4px; margin:26px 0 14px; letter-spacing:-.01em; }
.section-title .count{ font-weight:500; color:var(--text-3); font-size:13px; margin-left:6px; }
/* ===== Forms =========================================================== */
.field{ margin-bottom:15px; }
.field label{ display:block; font-size:13px; font-weight:600; color:var(--text); margin-bottom:6px; }
.field input,.field textarea{
  width:100%; padding:11px 14px; border:1px solid var(--border-2); border-radius:var(--radius-sm);
  font-size:14px; font-family:inherit; color:var(--text); background:#fff;
}
.field input:focus,.field textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.field textarea{ resize:vertical; min-height:90px; }
.field .hint{ font-size:12px; color:var(--text-3); margin-top:5px; }
/* ===== Modal =========================================================== */
.modal-overlay{ position:fixed; inset:0; background:rgba(24,33,47,.45); display:none; align-items:center; justify-content:center; z-index:60; padding:16px; backdrop-filter:blur(3px); }
.modal-overlay.is-open{ display:flex; }
.modal{ background:#fff; border-radius:var(--radius); width:100%; max-width:480px; box-shadow:0 24px 60px rgba(24,33,47,.28); max-height:90vh; overflow:auto; }
.modal__head{ display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:1px solid var(--border); }
.modal__head h3{ margin:0; font-size:16px; font-weight:700; }
.modal__close{ background:none; border:0; font-size:24px; line-height:1; cursor:pointer; color:var(--text-3); }
.modal__close:hover{ color:var(--text); }
.modal__body{ padding:22px; }
.modal__foot{ display:flex; justify-content:flex-end; gap:10px; padding:18px 22px; border-top:1px solid var(--border); background:var(--surface-2); }
/* ===== Footer note ===================================================== */
.foot-note{ font-size:12px; color:var(--text-3); text-align:center; margin:30px 0 8px; font-weight:500; }
/* ===== Responsive (sidebar off-canvas) ================================= */
.scrim{ position:fixed; inset:0; background:rgba(24,33,47,.4); z-index:35; display:none; }
.scrim.is-open{ display:block; }
@media (max-width:880px){
  .sidebar{ transform:translateX(-100%); background:var(--bg); box-shadow:var(--shadow-md); }
  .sidebar.is-open{ transform:translateX(0); }
  .content{ margin-left:0; }
  .hamburger{ display:block; }
  .main{ padding:16px; }
  .topbar{ padding:14px 16px 6px; }
}