/* =========================================================
   BP CESTE — Gestão de Projeto — Estilos
   ========================================================= */
:root{
  --navy: #102A43;
  --navy-dark: #0A1C2E;
  --navy-light: #1E4064;
  --gold: #C8A951;
  --gold-dark: #A8873A;
  --bg: #F6F5F0;
  --surface: #FFFFFF;
  --surface-alt: #FBFAF6;
  --border: #E3E0D6;
  --text: #1C2733;
  --text-muted: #5B6672;
  --text-soft: #8A939E;

  --green: #1F8A5F;
  --green-bg: #E6F4EC;
  --yellow: #B8860B;
  --yellow-bg: #FBF3D9;
  --orange: #C9691A;
  --orange-bg: #FBEADA;
  --red: #C23B3B;
  --red-bg: #FBE7E7;
  --gray: #6B7280;
  --gray-bg: #EEEEEA;
  --blue: #2C5C8A;
  --blue-bg: #E6EEF5;

  --radius-sm: 6px;
  --radius: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 2px rgba(16,42,67,0.06), 0 1px 1px rgba(16,42,67,0.04);
  --shadow: 0 2px 8px rgba(16,42,67,0.08), 0 1px 3px rgba(16,42,67,0.06);
  --shadow-lg: 0 12px 32px rgba(16,42,67,0.16), 0 4px 10px rgba(16,42,67,0.08);
  --font: Montserrat, Inter, Arial, sans-serif;
}

*, *::before, *::after{ box-sizing: border-box; }
html{ -webkit-text-size-adjust: 100%; scroll-behavior:smooth; }
body{
  margin:0;
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  font-size: 14px;
  line-height:1.5;
  -webkit-font-smoothing: antialiased;
}
h1,h2,h3,h4{ margin:0; font-weight:700; color: var(--navy); }
p{ margin:0; }
button{ font-family: inherit; }
a{ color: var(--navy-light); }
::selection{ background: var(--gold); color: var(--navy-dark); }

/* focus visibility */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible{
  outline: 2px solid var(--gold-dark);
  outline-offset: 2px;
}

/* scrollbars */
::-webkit-scrollbar{ height:10px; width:10px; }
::-webkit-scrollbar-track{ background: transparent; }
::-webkit-scrollbar-thumb{ background: #C9C4B5; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover{ background: #B5AF9C; }

.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0; }

/* =============== LOGIN / ACESSO RESTRITO =============== */
.login-overlay{
  position:fixed; inset:0; z-index:5000; display:flex; align-items:center; justify-content:center;
  background: radial-gradient(1200px 800px at 20% 10%, var(--navy-light) 0%, var(--navy) 45%, var(--navy-dark) 100%);
  padding:20px;
}
.login-box{
  width:100%; max-width:380px; background: rgba(255,255,255,0.98); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-lg); padding: 32px 28px 26px; text-align:center;
}
.login-logo{ width:64px; height:64px; object-fit:contain; margin:0 auto 14px; display:block;
  filter: drop-shadow(0 2px 3px rgba(16,42,67,0.35)); background: var(--navy); border-radius:14px; padding:8px; }
.login-title{ font-size:16px; font-weight:800; color: var(--navy); }
.login-sub{ font-size:11.5px; color: var(--text-muted); margin-top:3px; margin-bottom:20px; }
.login-field{ text-align:left; margin-bottom:12px; }
.login-field label{ display:block; font-size:10.8px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px; color: var(--text-soft); margin-bottom:5px; }
.login-field input{ width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:8px; font-size:13.5px; font-family:inherit; background: var(--surface-alt); color:var(--text); }
.pw-wrap{ position:relative; }
.pw-wrap input{ padding-right:38px !important; }
.pw-toggle{ position:absolute; right:6px; top:50%; transform:translateY(-50%); background:transparent; border:none; cursor:pointer; font-size:15px; padding:6px; line-height:1; color: var(--text-soft); border-radius:6px; }
.pw-toggle:hover{ color: var(--navy); background: var(--border); }
.capslock-warning{ font-size:11px; font-weight:700; color: var(--yellow); margin-top:6px; text-align:left; }
.login-field input:focus{ outline:2px solid var(--gold-dark); outline-offset:1px; }
.login-error{ background: var(--red-bg); color: var(--red); font-size:11.8px; font-weight:600; padding:8px 10px; border-radius:7px; margin-bottom:12px; text-align:left; }
.login-submit{ width:100%; padding:11px; font-size:13.5px; margin-top:4px; }
.login-hint{ font-size:10.5px; color: var(--text-soft); margin-top:16px; line-height:1.5; }

/* =============== HEADER =============== */
.app-header{
  position: sticky; top:0; z-index: 200;
  background: linear-gradient(180deg, var(--navy) 0%, var(--navy-dark) 100%);
  color:#fff;
  box-shadow: var(--shadow);
}
.header-inner{
  max-width: 1440px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  padding: 10px 20px; gap: 16px;
}
.brand{ display:flex; align-items:center; gap:12px; min-width:0; }
.brand-badge{
  width:42px; height:42px; flex-shrink:0; object-fit:contain; display:block;
  filter: drop-shadow(0 1px 2px rgba(0,0,0,0.25));
}
.brand-text{ min-width:0; }
.brand-kicker{ font-size:10.5px; letter-spacing:1.5px; color: var(--gold); font-weight:700; text-transform:uppercase; }
.brand-title{ font-size:17px; font-weight:800; color:#fff; line-height:1.25; }
.brand-sub{ font-size:11.5px; color:#C7D2DE; margin-top:1px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.main-nav{ display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.nav-btn{
  background:transparent; border:1px solid transparent; color:#D8E0EA;
  padding:9px 13px; border-radius: 8px; font-size:12.8px; font-weight:600;
  cursor:pointer; transition: all .15s ease; white-space:nowrap;
  display:flex; align-items:center; gap:6px;
}
.nav-btn:hover{ background: rgba(255,255,255,0.08); color:#fff; }
.nav-btn.active{ background: rgba(200,169,81,0.18); color:#fff; border-color: rgba(200,169,81,0.5); }
.nav-btn .dot{ width:5px; height:5px; border-radius:50%; background: var(--red); display:none; }
.nav-btn.has-alert .dot{ display:inline-block; }
#logoutBtn{ margin-left:6px; border-left:1px solid rgba(255,255,255,0.15); border-radius:0 8px 8px 0; padding-left:14px; }

.menu-toggle{
  display:none; background: rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.15);
  color:#fff; width:38px; height:38px; border-radius:8px; cursor:pointer; flex-shrink:0;
  align-items:center; justify-content:center; font-size:18px;
}

/* =============== LAYOUT =============== */
.app-main{ max-width: 1440px; margin:0 auto; padding: 20px; }
.tab-panel{ display:none; animation: fadeIn .18s ease; }
.tab-panel.active{ display:block; }
@keyframes fadeIn{ from{opacity:0; transform:translateY(4px);} to{opacity:1; transform:translateY(0);} }

.section-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:16px; flex-wrap:wrap; }
.section-head h2{ font-size:20px; }
.section-head .muted{ color: var(--text-muted); font-size:12.5px; margin-top:2px; }
.head-actions{ display:flex; gap:8px; flex-wrap:wrap; }

/* =============== BUTTONS =============== */
.btn{
  display:inline-flex; align-items:center; gap:7px; justify-content:center;
  padding: 9px 14px; border-radius: 8px; font-size:12.8px; font-weight:600;
  border:1px solid var(--border); background: var(--surface); color: var(--text);
  cursor:pointer; transition: all .15s ease; line-height:1.2; white-space:nowrap;
}
.btn:hover{ border-color: var(--navy-light); box-shadow: var(--shadow-sm); transform: translateY(-1px); }
.btn:active{ transform: translateY(0); }
.btn-primary{ background: var(--navy); border-color: var(--navy); color:#fff; }
.btn-primary:hover{ background: var(--navy-light); }
.btn-gold{ background: var(--gold); border-color: var(--gold); color: var(--navy-dark); }
.btn-gold:hover{ background: var(--gold-dark); color:#fff; }
.btn-ghost{ background:transparent; border-color:transparent; }
.btn-ghost:hover{ background: var(--surface-alt); border-color: var(--border); }
.btn-danger{ color: var(--red); }
.btn-danger:hover{ border-color: var(--red); background: var(--red-bg); }
.btn-sm{ padding:6px 10px; font-size:12px; border-radius:7px; }
.btn-icon{ width:34px; height:34px; padding:0; flex-shrink:0; }
.btn:disabled{ opacity:.45; cursor:not-allowed; transform:none; box-shadow:none; }

/* =============== CARDS / KPIs =============== */
.kpi-grid{ display:grid; grid-template-columns: repeat(auto-fit, minmax(150px,1fr)); gap:12px; margin-bottom:20px; }
.kpi-card{
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius);
  padding: 14px 16px; box-shadow: var(--shadow-sm); position:relative; overflow:hidden;
}
.kpi-card::before{ content:''; position:absolute; left:0; top:0; bottom:0; width:4px; background: var(--navy); }
.kpi-card.c-green::before{ background: var(--green); }
.kpi-card.c-yellow::before{ background: var(--yellow); }
.kpi-card.c-orange::before{ background: var(--orange); }
.kpi-card.c-red::before{ background: var(--red); }
.kpi-card.c-gray::before{ background: var(--gray); }
.kpi-card.c-blue::before{ background: var(--blue); }
.kpi-label{ font-size:11px; text-transform:uppercase; letter-spacing:0.6px; color: var(--text-muted); font-weight:700; margin-left:8px; }
.kpi-value{ font-size:26px; font-weight:800; color: var(--navy); margin-top:4px; margin-left:8px; }
.kpi-sub{ font-size:11.5px; color: var(--text-soft); margin-top:2px; margin-left:8px; }

.card{
  background: var(--surface); border:1px solid var(--border); border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm); padding: 18px;
}
.card + .card{ margin-top:14px; }
.card-title{ font-size:14.5px; font-weight:700; color: var(--navy); margin-bottom:10px; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.card-title small{ font-weight:600; color: var(--text-soft); font-size:11.5px; }

.dash-grid{ display:grid; grid-template-columns: 1.3fr 1fr; gap:14px; align-items:start; }
.dash-grid-3{ display:grid; grid-template-columns: repeat(3, 1fr); gap:14px; margin-top:14px; }
.dash-grid > *, .dash-grid-3 > *{ min-width:0; }
.card{ min-width:0; }
.mini-row{ min-width:0; }

/* progress bar */
.progress-track{ height:10px; border-radius:6px; background: var(--gray-bg); overflow:hidden; }
.progress-fill{ height:100%; background: linear-gradient(90deg, var(--navy) 0%, var(--navy-light) 100%); border-radius:6px; transition: width .4s ease; }
.progress-fill.gold{ background: linear-gradient(90deg, var(--gold-dark), var(--gold)); }
.progress-row{ display:flex; align-items:center; gap:10px; margin:7px 0; }
.progress-row .plabel{ flex:0 0 190px; font-size:12px; color: var(--text-muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.progress-row .ptrack{ flex:1; }
.progress-row .pval{ flex:0 0 40px; text-align:right; font-size:12px; font-weight:700; color: var(--navy); }

/* =============== DONUT — STATUS GERAL DO PLANO DE AÇÃO =============== */
.donut-card{ margin-bottom:20px; }
.donut-wrap{ display:flex; align-items:center; gap:32px; flex-wrap:wrap; }
.donut-chart-holder{ flex:0 0 auto; width:220px; max-width:100%; }
.donut-svg{ width:100%; height:auto; display:block; }
.donut-center-num{ font-size:44px; font-weight:800; fill: var(--navy); font-family: 'Georgia','Times New Roman',serif; }
.donut-center-label{ font-size:10.5px; font-weight:700; letter-spacing:0.6px; fill: var(--text-muted); text-transform:uppercase; }
.donut-legend{ flex:1 1 320px; min-width:260px; display:flex; flex-direction:column; gap:10px; }
.donut-legend-row{ display:flex; align-items:flex-start; gap:12px; background: var(--surface-alt); border:1px solid var(--border); border-radius: var(--radius); padding:12px 14px; }
.donut-dot{ flex:0 0 6px; width:6px; align-self:stretch; border-radius:4px; min-height:38px; }
.donut-legend-text{ flex:1; min-width:0; }
.donut-legend-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.donut-legend-top strong{ font-size:13.5px; color: var(--navy); }
.donut-legend-value{ font-size:21px; font-weight:800; }
.donut-legend-desc{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; font-size:11.8px; color: var(--text-muted); margin-top:2px; }
.donut-legend-pct{ font-weight:700; color: var(--text-soft); white-space:nowrap; }
.donut-banner{ margin-top:16px; background: var(--navy); color:#fff; font-weight:700; font-size:13px; text-align:center; padding:12px 16px; border-radius: var(--radius); }
@media (max-width: 640px){
  .donut-wrap{ flex-direction:column; align-items:stretch; }
  .donut-chart-holder{ margin:0 auto; }
}

/* list rows (prazos / atrasados / marcos) */
.mini-list{ display:flex; flex-direction:column; gap:8px; }
.mini-row{
  display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:8px;
  background: var(--surface-alt); border:1px solid var(--border);
}
.mini-row .mr-main{ flex:1; min-width:0; }
.mini-row .mr-title{ font-size:12.6px; font-weight:600; color: var(--text); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mini-row .mr-sub{ font-size:11px; color: var(--text-soft); margin-top:1px; }
.mini-row .mr-date{ font-size:11.5px; font-weight:700; color: var(--navy); flex-shrink:0; white-space:nowrap; }
.empty-note{ color: var(--text-soft); font-size:12.5px; padding:10px 2px; font-style:italic; }

/* =============== BADGES / CHIPS =============== */
.badge{ display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:20px; font-size:11px; font-weight:700; white-space:nowrap; line-height:1.6; }
.badge::before{ content:''; width:6px; height:6px; border-radius:50%; background:currentColor; }
.b-green{ background: var(--green-bg); color: var(--green); }
.b-yellow{ background: var(--yellow-bg); color: var(--yellow); }
.b-orange{ background: var(--orange-bg); color: var(--orange); }
.b-red{ background: var(--red-bg); color: var(--red); }
.b-gray{ background: var(--gray-bg); color: var(--gray); }
.b-blue{ background: var(--blue-bg); color: var(--blue); }

.chip{ display:inline-flex; align-items:center; gap:5px; padding:4px 10px; border-radius:20px; font-size:11.5px; font-weight:600; background: var(--surface-alt); border:1px solid var(--border); color: var(--text-muted); }
.chip-remove{ cursor:pointer; font-weight:800; opacity:.6; }
.chip-remove:hover{ opacity:1; }

.tag-seg{ display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:6px; font-size:11px; font-weight:700; color:#fff; }

/* =============== TABLE =============== */
.table-wrap{ overflow-x:auto; border:1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
table.data-table{ border-collapse:collapse; width:100%; min-width: 980px; font-size:12.6px; }
table.data-table thead th{
  position: sticky; top:0; z-index:5; background: var(--navy); color:#fff;
  text-align:left; padding:11px 12px; font-size:11px; text-transform:uppercase; letter-spacing:0.4px;
  font-weight:700; white-space:nowrap; border-right: 1px solid rgba(255,255,255,0.08);
}
table.data-table tbody td{ padding:9px 12px; border-bottom:1px solid var(--border); vertical-align:top; color: var(--text); }
table.data-table tbody tr:hover{ background: var(--surface-alt); }
table.data-table tbody tr:last-child td{ border-bottom:none; }
.cell-editable{ cursor:text; border-radius:5px; padding:4px 6px; margin:-4px -6px; transition: background .12s; min-width:60px; }
.cell-editable:hover{ background: var(--gold-bg,#FBF3D9); }
.cell-editable:focus{ outline:2px solid var(--gold-dark); background:#fff; }
.cell-desc{ max-width: 340px; }
.col-id{ width:44px; color: var(--text-soft); font-weight:700; }
.row-select{ cursor:pointer; }

/* =============== PERMISSÕES DE ACESSO (visualização / edição / exclusão) =============== */
/* body recebe .access-view-only quando o usuário logado não pode criar/editar,
   e .access-no-delete quando não pode excluir — ver applyAccessUI() em block_auth.js */
body.access-view-only .edit-only{ display:none !important; }
body.access-no-delete .delete-only{ display:none !important; }
body.access-view-only .cell-editable,
body.access-view-only input.field-editable,
body.access-view-only .meeting-body-grid input,
body.access-view-only .meeting-body-grid select,
body.access-view-only .meeting-body textarea,
body.access-view-only .segment-name,
body.access-view-only .segment-obs textarea,
body.access-view-only .pauta-desc,
body.access-view-only .pauta-meta input,
body.access-view-only .color-swatch,
body.access-view-only .status-pill{
  pointer-events:none !important;
  opacity:.72;
}
body.access-view-only .cell-editable:hover{ background:transparent; }
.access-badge{ display:inline-block; font-size:10.5px; font-weight:700; letter-spacing:.02em; padding:2px 8px; border-radius:20px; margin-left:8px; vertical-align:middle; }
.access-badge.view{ background:#EDEDED; color:#555; }
.access-badge.edit{ background:#E4F0FB; color:#1B5E9E; }
.access-badge.full{ background:#E9F6EC; color:#1E7A34; }

/* =============== FILTER BAR =============== */
.filter-bar{
  display:flex; flex-wrap:wrap; gap:8px; align-items:center; background: var(--surface);
  border:1px solid var(--border); border-radius: var(--radius); padding:12px; margin-bottom:14px; box-shadow: var(--shadow-sm);
}
.filter-bar select, .filter-bar input[type=text], .filter-bar input[type=date], .filter-bar input[type=search]{
  padding:8px 10px; border:1px solid var(--border); border-radius:7px; font-size:12.5px; background: var(--surface-alt); color: var(--text);
  font-family:inherit;
}
.filter-bar .search-wrap{ position:relative; flex:1; min-width:180px; }
.filter-bar .search-wrap input{ width:100%; padding-left:30px; }
.filter-bar .search-wrap::before{ content:'🔎'; position:absolute; left:9px; top:50%; transform:translateY(-50%); font-size:12px; opacity:.6; }
.view-toggle{ display:flex; border:1px solid var(--border); border-radius:8px; overflow:hidden; margin-left:auto; }
.view-toggle button{ border:none; background: var(--surface); padding:8px 12px; font-size:12px; font-weight:600; cursor:pointer; color: var(--text-muted); }
.view-toggle button.active{ background: var(--navy); color:#fff; }

/* =============== LEGEND =============== */
/* defensive: prevent grid/flex items from growing beyond their track due to unbreakable content */
.kpi-grid > *, .phase-cards > *, .form-grid > *, .settings-grid > *, .meeting-body-grid > *{ min-width:0; }
.kanban-card-title{ min-width:0; overflow-wrap:anywhere; }
.mr-title, .kanban-card-title, .segment-name, .pauta-desc{ overflow-wrap:anywhere; }

.legend-row{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; font-size:11.8px; color: var(--text-muted); margin-bottom:12px; }
.legend-item{ display:flex; align-items:center; gap:6px; }
.legend-dot{ width:10px; height:10px; border-radius:50%; }

/* =============== KANBAN =============== */
.kanban{ display:grid; grid-template-columns: repeat(5, minmax(220px,1fr)); gap:12px; overflow-x:auto; padding-bottom:6px; }
.kanban-col{ background: var(--surface-alt); border:1px solid var(--border); border-radius: var(--radius); padding:10px; min-height:120px; }
.kanban-col-head{ display:flex; align-items:center; justify-content:space-between; padding:4px 4px 10px; font-size:12px; font-weight:700; color: var(--navy); }
.kanban-count{ background:#fff; border:1px solid var(--border); border-radius:20px; padding:1px 8px; font-size:11px; color: var(--text-muted); font-weight:700; }
.kanban-card{ background:#fff; border:1px solid var(--border); border-radius:9px; padding:10px; margin-bottom:8px; cursor:pointer; box-shadow: var(--shadow-sm); transition: all .12s; }
.kanban-card:hover{ box-shadow: var(--shadow); transform: translateY(-1px); border-color: var(--navy-light); }
.kanban-card-title{ font-size:12.2px; font-weight:600; color: var(--text); line-height:1.35; margin-bottom:6px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.kanban-card-meta{ display:flex; justify-content:space-between; align-items:center; font-size:10.8px; color: var(--text-soft); gap:6px; }

/* =============== MEETINGS (ATAS) =============== */
.meeting-card{ background: var(--surface); border:1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); margin-bottom:14px; overflow:hidden; }
.meeting-head{ display:flex; align-items:center; gap:12px; padding:14px 16px; cursor:pointer; }
.meeting-head:hover{ background: var(--surface-alt); }
.meeting-toggle-icon{ width:26px; height:26px; border-radius:50%; background: var(--surface-alt); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; font-size:12px; color: var(--navy); flex-shrink:0; transition: transform .18s; }
.meeting-card.open .meeting-toggle-icon{ transform: rotate(90deg); }
.meeting-head-main{ flex:1; min-width:0; }
.meeting-title-row{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.meeting-title{ font-size:14.5px; font-weight:700; color: var(--navy); }
.meeting-meta{ font-size:11.5px; color: var(--text-muted); margin-top:3px; display:flex; gap:10px; flex-wrap:wrap; }
.meeting-actions{ display:flex; gap:6px; flex-shrink:0; }
.meeting-body{ display:none; padding: 0 16px 18px; border-top:1px solid var(--border); }
.meeting-card.open .meeting-body{ display:block; }
.meeting-body-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:12px; margin: 14px 0; }
.field-block label{ display:block; font-size:10.8px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px; color: var(--text-soft); margin-bottom:5px; }
.field-block input, .field-block select, .field-block textarea{
  width:100%; padding:8px 10px; border:1px solid var(--border); border-radius:7px; font-size:12.8px; font-family:inherit; background: var(--surface-alt); color:var(--text);
}
.field-block textarea{ resize:vertical; min-height:56px; }

.segment-block{ border:1px solid var(--border); border-radius: var(--radius); margin-top:12px; overflow:hidden; }
.segment-head{ display:flex; align-items:center; gap:10px; padding:10px 12px; background: var(--surface-alt); }
.segment-color-dot{ width:12px; height:12px; border-radius:4px; flex-shrink:0; }
.segment-name{ font-weight:700; font-size:12.8px; flex:1; }
.segment-obs{ font-size:11.3px; color: var(--text-muted); padding: 8px 12px 0; }
.pauta-list{ padding: 8px 12px 12px; display:flex; flex-direction:column; gap:8px; }
.pauta-row{ border:1px solid var(--border); border-radius:8px; padding:9px 10px; background:#fff; }
.pauta-top{ display:flex; align-items:flex-start; gap:8px; justify-content:space-between; }
.pauta-desc{ font-size:12.6px; font-weight:600; flex:1; }
.pauta-meta{ display:flex; flex-wrap:wrap; gap:10px; font-size:11.2px; color: var(--text-muted); margin-top:6px; }
.pauta-actions{ display:flex; gap:5px; flex-shrink:0; }
.status-pill{ cursor:pointer; border:none; user-select:none; }

/* =============== TIMELINE / CRONOGRAMA =============== */
.timeline-wrap{ overflow-x:auto; padding: 26px 10px 10px; }
.timeline-track{ position:relative; display:flex; min-width: 1100px; padding: 0 20px; }
.timeline-line{ position:absolute; top:19px; left:0; right:0; height:3px; background: var(--border); z-index:1; }
.timeline-node-wrap{ flex:1; position:relative; z-index:2; display:flex; flex-direction:column; align-items:center; cursor:pointer; }
.timeline-dot{ width:38px; height:38px; border-radius:50%; background:#fff; border:3px solid var(--navy-light); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:11px; color: var(--navy); transition: all .15s; }
.timeline-node-wrap:hover .timeline-dot{ transform: scale(1.08); box-shadow: var(--shadow); }
.timeline-dot.done{ border-color: var(--green); background: var(--green-bg); color: var(--green); }
.timeline-dot.late{ border-color: var(--red); background: var(--red-bg); color: var(--red); }
.timeline-code{ font-size:12px; font-weight:800; color: var(--navy); margin-top:9px; }
.timeline-name{ font-size:10.8px; color: var(--text-muted); text-align:center; margin-top:2px; max-width:130px; line-height:1.3; }
.timeline-date{ font-size:10.5px; font-weight:700; color: var(--gold-dark); margin-top:3px; }
.timeline-pct{ font-size:10px; color:var(--text-soft); margin-top:2px; }

.phase-cards{ display:grid; grid-template-columns: 1fr 1fr; gap:14px; margin-top:18px; }
.phase-card{ border-radius: var(--radius-lg); padding:18px; color:#fff; }
.phase-card.p1{ background: linear-gradient(145deg, var(--navy) 0%, var(--navy-light) 100%); }
.phase-card.p2{ background: var(--surface); color: var(--text); border:1px solid var(--border); }
.phase-card h3{ color:#fff; font-size:15px; }
.phase-card.p2 h3{ color: var(--navy); }
.phase-card .period{ font-size:11.5px; color: var(--gold); font-weight:700; margin: 4px 0 12px; }
.phase-card.p2 .period{ color: var(--gold-dark); }
.phase-card ul{ margin:0; padding-left:18px; font-size:12.3px; line-height:1.85; }
.phase-card.p1 ul{ color:#E3EAF2; }
.phase-card .reuniao-tag{ margin-top:14px; padding:8px 12px; border-radius:8px; background: rgba(255,255,255,0.12); font-size:11.5px; font-weight:600; }
.phase-card.p2 .reuniao-tag{ background: var(--gold-bg,#FBF3D9); color: var(--gold-dark); }

/* =============== CHECKLIST progress by category =============== */
.cat-progress-list{ display:flex; flex-direction:column; gap:10px; }
.cat-progress-item .cpi-top{ display:flex; justify-content:space-between; font-size:12px; margin-bottom:5px; }
.cat-progress-item .cpi-top .name{ font-weight:600; color: var(--text); }
.cat-progress-item .cpi-top .pct{ font-weight:700; color: var(--navy); }

/* =============== MODAL =============== */
.modal-overlay{ position:fixed; inset:0; background: rgba(16,26,38,0.55); z-index:1000; display:none; align-items:flex-start; justify-content:center; padding: 4vh 16px; overflow-y:auto; backdrop-filter: blur(1px); }
.modal-overlay.show{ display:flex; }
.modal-box{ background: var(--surface); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); width:100%; max-width:600px; margin:auto; animation: modalIn .16s ease; }
.modal-box.wide{ max-width: 780px; }
@keyframes modalIn{ from{ opacity:0; transform: translateY(-10px) scale(.98);} to{opacity:1; transform:translateY(0) scale(1);} }
.modal-header{ display:flex; align-items:center; justify-content:space-between; padding:16px 20px; border-bottom:1px solid var(--border); }
.modal-header h3{ font-size:15.5px; }
.modal-close{ background:transparent; border:none; font-size:20px; cursor:pointer; color: var(--text-soft); width:30px; height:30px; border-radius:7px; }
.modal-close:hover{ background: var(--surface-alt); color: var(--text); }
.modal-body{ padding:18px 20px; max-height:64vh; overflow-y:auto; }
.modal-footer{ display:flex; justify-content:flex-end; gap:8px; padding:14px 20px; border-top:1px solid var(--border); }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.form-grid .full{ grid-column: 1 / -1; }
.form-field label{ display:block; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.4px; color: var(--text-soft); margin-bottom:5px; }
.form-field input, .form-field select, .form-field textarea{
  width:100%; padding:9px 11px; border:1px solid var(--border); border-radius:8px; font-size:13px; font-family:inherit; background: var(--surface-alt); color:var(--text);
}
.form-field textarea{ resize:vertical; min-height:70px; }
.form-field + .form-field{ margin-top:0; }
.form-field{ margin-bottom:2px; }
.color-swatch-row{ display:flex; gap:8px; flex-wrap:wrap; }
.color-swatch{ width:26px; height:26px; border-radius:50%; cursor:pointer; border:2px solid transparent; }
.color-swatch.selected{ border-color: var(--navy); box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--navy); }
.confirm-icon{ width:46px; height:46px; border-radius:50%; background: var(--red-bg); color: var(--red); display:flex; align-items:center; justify-content:center; font-size:22px; margin-bottom:12px; }

/* =============== TOAST =============== */
#toast-stack{ position:fixed; bottom:20px; right:20px; z-index:2000; display:flex; flex-direction:column; gap:8px; max-width:340px; }
.toast{ background: var(--navy-dark); color:#fff; padding:11px 16px; border-radius:9px; font-size:12.5px; box-shadow: var(--shadow-lg); display:flex; align-items:center; gap:9px; animation: toastIn .2s ease; }
.toast.success{ background: #164A32; }
.toast.error{ background: #6B1F1F; }
@keyframes toastIn{ from{opacity:0; transform:translateX(30px);} to{opacity:1; transform:translateX(0);} }

/* =============== TOOLTIP =============== */
[data-tip]{ position:relative; }
[data-tip]:hover::after{
  content: attr(data-tip); position:absolute; bottom:calc(100% + 6px); left:50%; transform:translateX(-50%);
  background: var(--navy-dark); color:#fff; font-size:11px; padding:5px 9px; border-radius:6px; white-space:nowrap; z-index:50; pointer-events:none;
  box-shadow: var(--shadow);
}

/* =============== FOOTER =============== */
.app-footer{ text-align:center; padding:24px; color: var(--text-soft); font-size:11px; }

/* =============== SETTINGS =============== */
.settings-grid{ display:grid; grid-template-columns: 1fr 1fr; gap:14px; }
.settings-item{ display:flex; align-items:center; justify-content:space-between; padding:12px 0; border-bottom:1px solid var(--border); gap:12px; }
.settings-item:last-child{ border-bottom:none; }
.settings-item .si-text strong{ display:block; font-size:13px; color: var(--text); }
.settings-item .si-text span{ font-size:11.5px; color: var(--text-muted); }
.auth-level-select{ display:block; margin-top:6px; font-size:11.5px; padding:4px 8px; border-radius:6px; border:1px solid var(--border); background:var(--surface); color:var(--text); }
.history-list{ max-height:360px; overflow-y:auto; display:flex; flex-direction:column; gap:6px; }
.history-item{ font-size:11.8px; padding:8px 10px; border-radius:7px; background: var(--surface-alt); border:1px solid var(--border); }
.history-item b{ color: var(--navy); }

/* =============== PRINT =============== */
@media print{
  .app-header, .filter-bar, .head-actions, .btn, .meeting-actions, .pauta-actions,
  .menu-toggle, .view-toggle, #toast-stack, .modal-overlay, .login-overlay, .no-print{ display:none !important; }
  body{ background:#fff; font-size:11px; }
  .app-main{ padding:0; max-width:100%; }
  .tab-panel{ display:none !important; }
  .tab-panel.printing{ display:block !important; }
  .print-header{ display:block !important; margin-bottom:16px; border-bottom:2px solid #102A43; padding-bottom:10px; }
  .card, .table-wrap{ box-shadow:none; border:1px solid #ccc; }
  table.data-table thead th{ background:#102A43 !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; color:#fff !important; }
}
.print-header{ display:none; }
.print-header h1{ font-size:18px; }
.print-header .p-sub{ font-size:11px; color:#555; margin-top:4px; }

/* =============== RESPONSIVE =============== */
@media (max-width: 980px){
  .dash-grid{ grid-template-columns: 1fr; }
  .dash-grid-3{ grid-template-columns: 1fr; }
  .phase-cards{ grid-template-columns: 1fr; }
  .form-grid{ grid-template-columns: 1fr; }
  .meeting-body-grid{ grid-template-columns: 1fr; }
  .settings-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 760px){
  .menu-toggle{ display:flex; }
  .main-nav{
    position:fixed; top:64px; right:12px; left:12px; background: var(--navy-dark); border-radius: 12px;
    flex-direction:column; align-items:stretch; padding:8px; box-shadow: var(--shadow-lg);
    display:none; border: 1px solid rgba(255,255,255,0.1);
  }
  .main-nav.open{ display:flex; }
  .nav-btn{ width:100%; justify-content:flex-start; padding:11px 12px; }
  .brand-sub{ display:none; }
  .kpi-grid{ grid-template-columns: repeat(2,1fr); }
  .kanban{ grid-template-columns: 1fr; }
}