/* =====================================================================
   F A OLIVA — Sistema de Requisições
   app.css — design system no padrão SPFAO + shell com sidebar
   v3: formulários, autocomplete, avaliação por item, vínculos
   ===================================================================== */

:root {
  --primary: #D1003F;
  --primary-dark: #9B0A20;
  --primary-light: #E8344A;
  --accent: #1B2A4A;
  --bg: #F2F3F5;
  --bg-card: #FFFFFF;
  --bg-sidebar: #0F1923;
  --bg-sidebar-hover: #1A2D3F;
  --text: #242B39;
  --text-secondary: #5A6170;
  --text-muted: #656C7A;   /* era #8C92A0 (2,8:1 no fundo); agora 4,7:1 */
  --border: #E2E4EA;
  --border-light: #ECEEF2;
  --success: #16A34A;
  --warning: #D97706;
  --danger: #DC2626;
  --info: #2563EB;
  --purple: #7C3AED;
  --radius: 12px;
  --shadow: 0 1px 3px rgba(0,0,0,0.06), 0 4px 12px rgba(0,0,0,0.04);
  --shadow-lg: 0 4px 24px rgba(0,0,0,0.08);
  --transition: 0.2s cubic-bezier(0.4, 0, 0.2, 1);
}

* { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }
body {
  font-family:'DM Sans','Segoe UI',system-ui,-apple-system,sans-serif;
  background:var(--bg); color:var(--text); line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
input, select, textarea, button { font-family:inherit; }
a { text-decoration:none; color:inherit; }
::selection { background:var(--primary); color:#fff; }

/* foco visível para quem navega pelo teclado */
/* cor/espessura definidas fora do :focus-visible para o anel não "piscar" com as transições */
a, button, [tabindex] { outline-width:2px; outline-color:var(--primary); outline-offset:2px; }
.sidebar a, .sidebar button, .sidebar-toggle { outline-color:#fff; outline-offset:-2px; }
a:focus-visible, button:focus-visible, [tabindex]:focus-visible { outline-style:solid; }
::-webkit-scrollbar { width:6px; height:6px; }
::-webkit-scrollbar-track { background:transparent; }
::-webkit-scrollbar-thumb { background:#ccc; border-radius:3px; }

/* ── LAYOUT ──────────────────────────────────────────────────────── */
.app { display:flex; height:100vh; overflow:hidden; }

.sidebar { width:260px; background:var(--bg-sidebar); display:flex; flex-direction:column; flex-shrink:0; transition:var(--transition); }
.sidebar-header { padding:26px 22px 20px; border-bottom:1px solid rgba(255,255,255,0.07); }
.sidebar-header h1 { font-size:22px; font-weight:900; color:#fff; letter-spacing:5px; line-height:1; }
.sidebar-logo { display:block; width:140px; height:auto; }
.sidebar-rule { display:block; width:38px; height:3px; border-radius:2px; background:var(--primary); margin:12px 0 0; }
.sidebar-header p { font-size:10px; color:rgba(255,255,255,0.62); letter-spacing:2px; margin-top:10px; text-transform:uppercase; }

.sidebar-nav { flex:1; padding:14px 12px; overflow-y:auto; display:flex; flex-direction:column; gap:2px; }
.nav-section { font-size:10px; color:rgba(255,255,255,0.55); text-transform:uppercase; letter-spacing:1.5px; padding:16px 12px 6px; font-weight:700; }
.sidebar .nav-item {
  display:flex; align-items:center; gap:12px; padding:11px 14px; border-radius:10px;
  color:rgba(255,255,255,0.68); font-size:13px; font-weight:500;
  cursor:pointer; transition:var(--transition); border:none; background:none;
  width:100%; text-align:left;
}
.sidebar .nav-item:hover { background:var(--bg-sidebar-hover); color:#fff; }
.sidebar .nav-item.active { background:rgba(209,0,63,0.16); color:#fff; font-weight:700; box-shadow:inset 0 0 0 1.5px var(--primary); }
.sidebar .nav-item svg { width:18px; height:18px; flex-shrink:0; }

.sidebar-footer { padding:16px 18px; border-top:1px solid rgba(255,255,255,0.07); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.sidebar-user { display:flex; align-items:center; gap:10px; min-width:0; }
.sidebar-avatar { width:34px; height:34px; border-radius:9px; background:var(--primary); display:flex; align-items:center; justify-content:center; color:#fff; font-weight:700; font-size:13px; flex-shrink:0; }
.sidebar-user-info { min-width:0; }
.sidebar-user-info span { display:block; font-size:12.5px; color:#fff; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:130px; }
.sidebar-user-info small { font-size:10.5px; color:rgba(255,255,255,0.62); }
.btn-sair { background:none; border:none; cursor:pointer; padding:7px; border-radius:8px; color:rgba(255,255,255,0.5); display:flex; align-items:center; transition:var(--transition); }
.btn-sair:hover { background:rgba(255,255,255,0.08); color:#fff; }
.btn-sair svg { width:17px; height:17px; }

/* ── CONTEÚDO ────────────────────────────────────────────────────── */
.main { flex:1; overflow-y:auto; background:var(--bg); }
.main-header { padding:32px 36px 0; }
.page-title { font-size:26px; font-weight:700; margin-bottom:4px; }
.page-subtitle { font-size:13.5px; color:var(--text-muted); margin-bottom:28px; }
.main-content { padding:0 36px 40px; }

.section-title { font-size:12px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:1.2px; margin:32px 0 14px; }
.section-title:first-child { margin-top:0; }

.card { background:var(--bg-card); border-radius:var(--radius); box-shadow:var(--shadow); padding:24px; margin-bottom:20px; border:1px solid var(--border-light); }
.card-title { font-size:15px; font-weight:600; margin-bottom:18px; display:flex; align-items:center; gap:10px; }
.card-title svg { width:18px; height:18px; color:var(--primary); }

.toolbar { display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:18px; }

/* ── BOTÕES ──────────────────────────────────────────────────────── */
.btn, .btn-adicionar, .btn-salvar, .btn-editar, .btn-enviar,
.btn-excluir, .btn-devolver, .btn-rm, .btn-visualizar, .btn-visualizar-rm {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  border-radius:10px; font-size:14px; font-weight:600;
  cursor:pointer; transition:var(--transition); border:none; padding:12px 24px;
}
.btn-primary, .btn-adicionar, .btn-salvar, .btn-rm { background:var(--primary); color:#fff; }
.btn-primary:hover, .btn-adicionar:hover, .btn-salvar:hover, .btn-rm:hover {
  background:var(--primary-dark); transform:translateY(-1px); box-shadow:0 4px 12px rgba(209,0,63,0.3);
}
.btn-secondary, .btn-devolver { background:var(--bg); color:var(--text); border:2px solid var(--border); }
.btn-secondary:hover, .btn-devolver:hover { border-color:var(--text-muted); }
.btn-excluir { background:var(--danger); color:#fff; }
.btn-excluir:hover { filter:brightness(1.08); }
.btn-enviar { background:var(--success); color:#fff; }
.btn-enviar:hover { filter:brightness(1.08); }
.btn-editar { background:var(--info); color:#fff; }
.btn-editar:hover { filter:brightness(1.08); }
.btn-sm { padding:8px 14px; font-size:12px; border-radius:8px; }
.btn-block { width:100%; }

/* botões pequenos dentro de tabelas */
td .btn-visualizar, td .btn-visualizar-rm, td .btn-editar,
td .btn-enviar, td .btn-excluir {
  padding:7px 13px; font-size:12px; border-radius:8px; margin:2px 4px 2px 0;
}
.btn-visualizar { background:var(--primary); color:#fff; }
.btn-visualizar:hover { background:var(--primary-dark); }
.btn-visualizar-rm { background:var(--bg); color:var(--text); border:2px solid var(--border); }
.btn-visualizar-rm:hover { border-color:var(--text-muted); }

.btn-icon {
  width:34px; height:34px; padding:0; border-radius:8px; border:none;
  background:var(--bg); color:var(--text-secondary); cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:14px; margin-right:5px; transition:var(--transition);
}
.btn-icon:hover { background:var(--border); color:var(--text); }
.btn-icon.danger:hover { background:rgba(220,38,38,0.1); color:var(--danger); }

.modal-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }

/* ── FORMULÁRIOS ─────────────────────────────────────────────────── */
.form-label, form label { display:block; font-size:11px; font-weight:700; color:var(--text-muted); margin-bottom:6px; text-transform:uppercase; letter-spacing:0.6px; }
.form-input, .form-select, .form-textarea,
form input[type=text], form input[type=number], form input[type=date],
form input[type=email], form input[type=password], form select, form textarea {
  width:100%; padding:10px 13px; border:2px solid var(--border); border-radius:10px;
  font-size:13.5px; background:var(--bg); color:var(--text); transition:var(--transition);
}
.form-input:focus, .form-select:focus, .form-textarea:focus,
form input:focus, form select:focus, form textarea:focus {
  outline:none; border-color:var(--primary); background:#fff;
}
.form-select, form select {
  cursor:pointer; appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%235A6170' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 13px center; padding-right:34px;
}
.form-textarea, form textarea { resize:vertical; min-height:80px; }
.form-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:16px; }
.form-group { margin-bottom:0; }
.form-group.full { grid-column:1 / -1; }
.form-hint { font-size:11.5px; color:var(--text-muted); margin-top:6px; text-transform:none; letter-spacing:0; font-weight:400; }

/* checkbox alinhado com texto */
.check-line { display:flex; align-items:center; gap:10px; cursor:pointer; }
.check-line input[type=checkbox] { width:18px; height:18px; flex:0 0 auto; accent-color:var(--primary); margin:0; padding:0; }
.check-line span { font-size:13.5px; font-weight:500; color:var(--text); text-transform:none; letter-spacing:0; }

/* ── FILTROS ─────────────────────────────────────────────────────── */
.filtro-box { display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:14px; }
.filtro-box span { display:block; }

/* ── AUTOCOMPLETE DE INSUMOS ─────────────────────────────────────── */
.autocomplete-wrap { position:relative; }
.suggestions {
  position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:50;
  background:#fff; border:1px solid var(--border); border-radius:10px;
  box-shadow:var(--shadow-lg); max-height:260px; overflow-y:auto;
}
.suggestion-item { padding:10px 13px; font-size:13px; cursor:pointer; border-bottom:1px solid var(--border-light); }
.suggestion-item:last-child { border-bottom:none; }
.suggestion-item:hover { background:rgba(209,0,63,0.06); color:var(--primary); }

.unidade-options { display:flex; flex-wrap:wrap; gap:8px; }
.unidade-option { display:flex; align-items:center; gap:6px; padding:7px 12px; border:2px solid var(--border); border-radius:9px; background:var(--bg); cursor:pointer; }
.unidade-option input { width:auto; margin:0; accent-color:var(--primary); }
.unidade-option .unidade-label { margin:0; font-size:12.5px; font-weight:600; color:var(--text); text-transform:none; letter-spacing:0; cursor:pointer; }
.unidade-options:empty::after { content:'Selecione um insumo primeiro'; font-size:12px; color:var(--text-muted); }

/* ── PREVIEW DOS INSUMOS ─────────────────────────────────────────── */
#lista-preview:empty::after { content:'Nenhum insumo adicionado ainda.'; display:block; font-size:13px; color:var(--text-muted); padding:18px 0; }
.item-preview {
  display:flex; align-items:center; gap:12px;
  background:var(--bg); border:1px solid var(--border);
  border-radius:10px; padding:12px 14px; margin-bottom:10px;
}
.item-preview .item-texto { flex:1; font-size:13px; min-width:0; }
.item-preview .item-texto strong { display:block; font-weight:600; }
.item-preview .item-texto small { color:var(--text-muted); font-size:12px; }

/* ── TABELAS ─────────────────────────────────────────────────────── */
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:separate; border-spacing:0; }
th { padding:10px 14px; text-align:left; font-size:11px; font-weight:700; color:var(--text-muted); text-transform:uppercase; letter-spacing:0.6px; border-bottom:2px solid var(--border); background:var(--bg); }
td { padding:12px 14px; font-size:13px; border-bottom:1px solid var(--border-light); }
tbody tr:hover td { background:rgba(0,0,0,0.015); }
td.titulo { font-weight:600; }
.status-row td { background:var(--bg); padding:0 14px 8px; border-bottom:2px solid var(--border); }

/* ── LINHA DO TEMPO ──────────────────────────────────────────────── */
.status-track { display:flex; padding:18px 4px 12px; }
.status-track .step { flex:1; text-align:center; position:relative; min-width:86px; }
.status-track .step::before { content:''; position:absolute; top:16px; left:-50%; width:100%; height:2px; background:var(--border); z-index:0; }
.status-track .step:first-child::before { display:none; }
.status-track .step.complete::before { background:var(--primary); }
.status-track .step.partial::before { background:var(--warning); }
.status-track .circle {
  width:34px; height:34px; border-radius:50%; margin:0 auto;
  display:flex; align-items:center; justify-content:center;
  position:relative; z-index:1;
  background:#fff; border:2px solid var(--border); color:var(--text-muted);
  transition:var(--transition);
}
.status-track .circle svg { width:15px; height:15px; }
.status-track .step.complete .circle { background:var(--primary); border-color:var(--primary); color:#fff; }
.status-track .step.partial .circle { background:var(--warning); border-color:var(--warning); color:#fff; }
/* etapa devolvida pelo aprovador: decidida, mas não aprovada */
.status-track .step.devolvida .circle { background:var(--warning); border-color:var(--warning); color:#fff; }
.status-track .step.devolvida .step-label { color:var(--warning); }
.status-track .step-label { font-size:11.5px; font-weight:600; margin-top:8px; }
.status-track .date-label { font-size:10.5px; color:var(--text-muted); }
.status-track .date-label.sub { font-weight:600; color:var(--text-secondary); }

/* ── TAGS ────────────────────────────────────────────────────────── */
.tag { display:inline-block; padding:3px 10px; border-radius:20px; font-size:11px; font-weight:600; white-space:nowrap; }
.tag-primary { background:rgba(209,0,63,0.10); color:var(--primary); }
.tag-success { background:rgba(22,163,74,0.10); color:var(--success); }
.tag-danger  { background:rgba(220,38,38,0.10); color:var(--danger); }
.tag-warning { background:rgba(217,119,6,0.10); color:var(--warning); }
.tag-info    { background:rgba(37,99,235,0.10); color:var(--info); }
.tag-purple  { background:rgba(124,58,237,0.10); color:var(--purple); }
.tag-neutral { background:var(--bg); color:var(--text-secondary); }

/* ── MODAL ───────────────────────────────────────────────────────── */
#modal {
  display:none; position:fixed; inset:0; z-index:1000;
  background:rgba(15,25,35,0.6); backdrop-filter:blur(4px);
  align-items:center; justify-content:center; padding:20px;
  animation:fadeIn 0.2s;
}
#modal-content {
  background:#fff; border-radius:20px; width:100%; max-width:820px;
  max-height:86vh; overflow-y:auto; padding:28px;
  box-shadow:0 24px 64px rgba(0,0,0,0.2); position:relative;
  animation:slideUp 0.25s;
}
#modal-content h2 { font-size:20px; font-weight:700; margin-bottom:18px; padding-right:80px; }
#modal-content hr { border:none; border-top:1px solid var(--border-light); margin:16px 0; }
#modal-content p { font-size:13.5px; margin-bottom:6px; }
#modal-content p strong { color:var(--text-secondary); font-weight:600; }
.close-modal, .print-modal {
  position:absolute; top:20px; width:34px; height:34px; border-radius:9px;
  border:none; background:var(--bg); color:var(--text-secondary);
  display:flex; align-items:center; justify-content:center;
  font-size:19px; line-height:1; cursor:pointer; transition:var(--transition);
}
.close-modal { right:22px; }
.print-modal { right:64px; font-size:15px; }
.close-modal:hover, .print-modal:hover { background:var(--border); color:var(--text); }

@keyframes fadeIn { from{opacity:0} to{opacity:1} }
@keyframes slideUp { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }

/* ── TABELA DE INSUMOS (modal) ───────────────────────────────────── */
.tabela-insumos { width:100%; margin-top:10px; }
.tabela-insumos th { background:var(--bg); }
.tabela-insumos td { font-size:12.5px; }
.tabela-insumos td.obs { color:var(--text-muted); font-style:italic; }
.tabela-insumos th.col-avaliar, .tabela-insumos td.col-avaliar { width:74px; min-width:74px; text-align:center; white-space:nowrap; }

.checkboxes { display:inline-flex; gap:12px; justify-content:center; }
.checkboxes input[type=checkbox] { width:18px; height:18px; cursor:pointer; margin:0; }
.checkboxes .chk-ok { accent-color:var(--success); }
.checkboxes .chk-neg { accent-color:var(--danger); }
.obs-tec {
  display:none; width:100%; margin-top:6px; padding:6px 9px;
  border:2px solid rgba(220,38,38,0.45); border-radius:8px;
  font-size:12.5px; background:#fff;
}
.obs-tec.show { display:block; }

/* ── ITENS DA RM ─────────────────────────────────────────────────── */
.rm-scroll { max-height:400px; overflow:auto; border:1px solid var(--border); border-radius:10px; }
.rm-scroll th { position:sticky; top:0; z-index:1; }
.rm-table td { font-size:12.5px; }
.rm-table td.num { text-align:right; }
.rm-table td.center { text-align:center; }
.rm-card { border:1px solid var(--border); padding:12px 14px; margin-bottom:10px; border-radius:10px; background:var(--bg); font-size:13px; line-height:1.7; }
.rm-card strong { color:var(--text-secondary); }
.link-toggle { background:none; border:none; color:var(--primary); cursor:pointer; font-size:12.5px; font-weight:600; padding:6px 0; }
.link-toggle:hover { text-decoration:underline; }
.rm-toolbar { display:flex; justify-content:flex-end; margin-bottom:8px; }
.rm-erro { color:var(--danger); font-size:13.5px; }

/* ── VÍNCULO DE OBRAS ────────────────────────────────────────────── */
#obras-checkboxes { max-height:240px; overflow-y:auto; border:1px solid var(--border); border-radius:10px; padding:6px; }
.linha-obra { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:9px 12px; border-bottom:1px solid var(--border-light); }
.linha-obra:last-child { border-bottom:none; }
.nome-obra { font-size:13px; }
.checkbox-obra input { width:18px; height:18px; accent-color:var(--primary); cursor:pointer; margin:0; }

/* ── LOADING ─────────────────────────────────────────────────────── */
#loading.loading {
  position:fixed; inset:0; z-index:900;
  background:rgba(242,243,245,0.85); backdrop-filter:blur(2px);
  display:flex; align-items:center; justify-content:center;
}
#loading.hidden { display:none !important; }
.telaLoad { text-align:center; }
.telaLoad p { font-size:13.5px; color:var(--text-secondary); margin-top:14px; }
.spinner { width:38px; height:38px; margin:0 auto; border-radius:50%; border:3px solid var(--border); border-top-color:var(--primary); animation:girar 0.7s linear infinite; }
@keyframes girar { to { transform:rotate(360deg); } }

/* ── MENSAGENS ───────────────────────────────────────────────────── */
#mensagem, .mensagem, #mensagem-acessos { font-size:13.5px; font-weight:600; }
#mensagem:not(:empty), .mensagem:not(:empty), #mensagem-acessos:not(:empty) {
  padding:11px 14px; border-radius:10px; margin-top:14px;
}
#mensagem.error, .mensagem.error, #mensagem-acessos.error { background:#FEF2F2; color:var(--danger); }
#mensagem.success, .mensagem.success, #mensagem-acessos.success { background:#F0FDF4; color:var(--success); }

/* ── HOME (Início) ───────────────────────────────────────────────── */
.home-header .home-data { font-size:12.5px; font-weight:600; color:var(--text-muted); margin-bottom:4px; }
.home-header .page-title { font-size:30px; letter-spacing:-0.02em; }

/* resumo ao vivo */
.resumo { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0, 1fr); gap:14px; margin-bottom:8px; } /* uma coluna por bloco visível */
.resumo[hidden] { display:none; }
.resumo-item {
  display:flex; flex-direction:column; gap:2px;
  background:var(--bg-card); border:1px solid var(--border-light); border-radius:var(--radius);
  padding:16px 20px; box-shadow:var(--shadow); transition:var(--transition);
}
.resumo-item:hover { border-color:var(--border); box-shadow:var(--shadow-lg); }
.resumo-num { font-size:30px; font-weight:800; line-height:1.1; letter-spacing:-0.02em; font-variant-numeric:tabular-nums; color:var(--text); }
.resumo-rot { font-size:13px; color:var(--text-secondary); }
.resumo-item.destaque .resumo-num { color:var(--primary); }
.resumo-item.destaque { border-left:3px solid var(--primary); }
.resumo-item.zerado .resumo-num { color:var(--text-muted); }
.resumo.carregando .resumo-num { color:var(--border); }

/* atalhos: ação principal + grade de apoio */
.home-acoes { display:grid; grid-template-columns:minmax(260px, 1fr) 2fr; gap:16px; align-items:stretch; }
.acao-principal {
  position:relative; overflow:hidden;
  display:flex; flex-direction:column; justify-content:space-between; gap:28px;
  background:var(--primary); color:#fff; border-radius:16px; padding:26px 26px 24px;
  box-shadow:0 10px 28px rgba(209,0,63,0.25); transition:var(--transition); min-height:190px;
}
.acao-principal::after {
  content:''; position:absolute; right:-60px; bottom:-80px; width:220px; height:220px; border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,0.16), transparent 70%); pointer-events:none;
}
.acao-principal:hover { background:var(--primary-dark); transform:translateY(-2px); box-shadow:0 14px 32px rgba(209,0,63,0.32); }
.acao-principal { outline-color:var(--text); outline-width:3px; outline-offset:3px; }
.acao-principal-icon { width:48px; height:48px; border-radius:12px; background:rgba(255,255,255,0.18); display:flex; align-items:center; justify-content:center; }
.acao-principal-icon svg { width:24px; height:24px; }
.acao-principal-txt strong { display:block; font-size:20px; font-weight:700; margin-bottom:4px; letter-spacing:-0.01em; }
.acao-principal-txt span { font-size:13.5px; color:rgba(255,255,255,0.88); }
.acao-seta { position:absolute; top:26px; right:24px; width:22px; height:22px; transition:var(--transition); }
.acao-seta svg { width:22px; height:22px; }
.acao-principal:hover .acao-seta { transform:translateX(4px); }

.acoes-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:12px; align-content:start; }
.acao-card {
  display:flex; align-items:center; gap:14px;
  background:var(--bg-card); border-radius:var(--radius); padding:16px 18px;
  box-shadow:var(--shadow); border:1px solid var(--border-light); transition:var(--transition);
}
.acao-card:hover { transform:translateY(-1px); box-shadow:var(--shadow-lg); border-color:var(--border); }
.acao-icon { width:40px; height:40px; flex:0 0 40px; border-radius:10px; background:rgba(209,0,63,0.09); color:var(--primary); display:flex; align-items:center; justify-content:center; transition:var(--transition); }
.acao-icon svg { width:19px; height:19px; }
.acao-card:hover .acao-icon { background:var(--primary); color:#fff; }
.acao-txt { min-width:0; }
.acao-txt strong { display:block; font-size:14.5px; font-weight:700; line-height:1.3; }
.acao-txt span { display:block; font-size:12.5px; color:var(--text-muted); line-height:1.4; margin-top:2px; }

/* empreendimentos: faixa de fotos */
.obras-faixa { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:14px; }
.obra-foto { position:relative; margin:0; border-radius:var(--radius); overflow:hidden; aspect-ratio:4 / 5; background:var(--bg-sidebar); box-shadow:var(--shadow); }
.obra-foto img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 0.5s cubic-bezier(0.4, 0, 0.2, 1); }
.obra-foto::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg, transparent 45%, rgba(15,25,35,0.85) 100%); pointer-events:none; }
.obra-foto figcaption {
  position:absolute; left:16px; right:16px; bottom:14px; z-index:1;
  color:#fff; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:0.6px; line-height:1.3;
}
.obra-foto figcaption::before { content:''; display:block; width:24px; height:3px; border-radius:2px; background:var(--primary); margin-bottom:8px; }
.obra-foto:hover img { transform:scale(1.04); }

@media (max-width:1200px) {
  .home-acoes { grid-template-columns:1fr; }
  .acao-principal { min-height:0; flex-direction:row; align-items:center; gap:18px; padding:22px 24px; }
  .acao-seta { position:static; margin-left:auto; }
  .obras-faixa {
    grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(200px, 30%);
    overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px;
    scrollbar-width:thin;
  }
  .obra-foto { scroll-snap-align:start; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition:none !important; animation-duration:0.01ms !important; }
}

/* ── MOBILE ──────────────────────────────────────────────────────── */
.sidebar-toggle {
  display:none; position:fixed; top:12px; left:12px; z-index:200;
  width:40px; height:40px; border-radius:10px;
  background:var(--bg-sidebar); color:#fff; border:none; cursor:pointer;
  align-items:center; justify-content:center; font-size:19px;
}
.sidebar-backdrop { display:none; position:fixed; inset:0; background:rgba(0,0,0,0.45); z-index:99; }
.sidebar-backdrop.show { display:block; }

@media (max-width:1024px) {
  .sidebar { width:240px; }
  .main-header, .main-content { padding-left:24px; padding-right:24px; }
}

@media (max-width:768px) {
  .sidebar { position:fixed; left:-260px; z-index:100; height:100vh; }
  .sidebar.open { left:0; }
  .sidebar-toggle { display:flex; }
  .main-header { padding:64px 20px 0; }
  .main-content { padding:0 20px 32px; }
  .page-title { font-size:22px; }
  .acoes-grid, .filtro-box, .form-grid { grid-template-columns:1fr; }
  .home-header .page-title { font-size:24px; }
  .acao-principal { padding:18px 18px; }
  .acao-principal-txt strong { font-size:18px; }
  .obras-faixa { grid-auto-columns:62%; }
  .resumo { gap:8px; }
  .resumo-item { padding:12px 12px; }
  .resumo-num { font-size:24px; }
  .resumo-rot { font-size:12px; line-height:1.3; }
  .card { padding:16px; }
  .toolbar { flex-direction:column; align-items:stretch; }

  /* tabelas viram cartões, usando os data-label dos <td> */
  table.table-cards thead, #tabela-requisicoes thead { display:none; }
  table.table-cards tbody tr:not(.status-row),
  #tabela-requisicoes tbody tr:not(.status-row) {
    display:block; background:#fff; border:1px solid var(--border-light);
    border-radius:var(--radius); box-shadow:var(--shadow); border-bottom:none;
    margin-bottom:14px;
  }
  #tabela-requisicoes tbody tr:not(.status-row) { margin-bottom:0; }
  #tabela-requisicoes tbody tr.status-row {
    display:block; background:#fff; border:1px solid var(--border-light);
    border-top:none; border-radius:0 0 var(--radius) var(--radius); margin:-1px 0 14px;
  }
  table.table-cards td, #tabela-requisicoes td {
    display:flex; justify-content:space-between; align-items:center; gap:14px;
    padding:9px 14px; border-bottom:1px solid var(--border-light);
  }
  table.table-cards td[data-label]::before,
  #tabela-requisicoes td[data-label]::before {
    content:attr(data-label); font-size:10.5px; font-weight:700;
    color:var(--text-muted); text-transform:uppercase; letter-spacing:0.6px;
    flex-shrink:0;
  }
  table.table-cards td:last-child, #tabela-requisicoes td:last-child { border-bottom:none; }
  #tabela-requisicoes tr.status-row td { display:block; padding:4px 8px 8px; border-bottom:none; background:transparent; }

  .status-track { flex-wrap:wrap; gap:12px 0; padding:10px 0; }
  .status-track .step { flex:0 0 33.33%; min-width:0; }
  .status-track .step::before { display:none; }

  /* tabela de avaliação por item vira cartão */
  .tabela-insumos, .tabela-insumos tbody, .tabela-insumos tr, .tabela-insumos td { display:block; width:100%; }
  .tabela-insumos thead { display:none; }
  .tabela-insumos tr { border:1px solid var(--border); border-radius:10px; margin-bottom:12px; padding:10px 12px; background:#fff; }
  .tabela-insumos td { border:none; border-bottom:1px solid var(--border-light); padding:8px 0; font-size:13px; display:flex; align-items:baseline; }
  .tabela-insumos td:last-child { border-bottom:none; }
  .tabela-insumos td::before { content:attr(data-label); flex:0 0 90px; margin-right:10px; font-size:10.5px; font-weight:700; text-transform:uppercase; color:var(--text-muted); }
  .tabela-insumos td[data-label="Descrição"] { flex-direction:column; }
  .tabela-insumos td[data-label="Descrição"]::before { flex:none; margin-bottom:2px; }
  .tabela-insumos td.col-avaliar { width:auto; align-items:center; }
  .tabela-insumos td.col-avaliar::before { content:"Avaliar"; }

  #modal-content { padding:20px 16px; border-radius:16px; }
  #modal-content h2 { font-size:17px; padding-right:74px; }
  .close-modal, .print-modal { top:14px; }
  .close-modal { right:14px; }
  .print-modal { right:56px; }
  .modal-actions .btn, .modal-actions button { flex:1 1 100%; }
}

.hidden { display:none !important; }

/* ── PREVIEW: item avaliado (tela de edição) ─────────────────────── */
.item-preview.item-aprovado { background:#F0FDF4; border-color:#BBF7D0; border-left:3px solid var(--success); }
.item-preview.item-negado   { background:#FEF2F2; border-color:#FECACA; border-left:3px solid var(--danger); }
.item-preview .obs-tecnico  { display:block; margin-top:4px; color:var(--danger); font-weight:600; }

/* ── AVISO DE PRAZO DE SUPRIMENTOS ───────────────────────────────── */
.prazo-aviso {
  font-size: 12.5px; line-height: 1.5; margin-top: 10px;
  text-transform: none; letter-spacing: 0; font-weight: 400;
}
.prazo-aviso:empty { display: none; }
.prazo-aviso:not(:empty) {
  padding: 11px 14px; border-radius: 10px; border-left: 3px solid transparent;
}
.prazo-aviso.neutro  { background: var(--bg);  color: var(--text-secondary); border-left-color: var(--border); }
.prazo-aviso.ok      { background: #F0FDF4;    color: #166534; border-left-color: var(--success); }
.prazo-aviso.alerta  { background: #FFFBEB;    color: #92400E; border-left-color: var(--warning); }
.prazo-aviso.critico { background: #FEF2F2;    color: #991B1B; border-left-color: var(--danger); }
.prazo-aviso strong  { font-weight: 700; }
.prazo-nota { display: block; margin-top: 6px; font-size: 11.5px; opacity: 0.8; }
