/* ============================================================
   OdontoClin — Visual ERPLUS
   Sidebar escura · Header empresa · Tabelas douradas
   Todas as funcionalidades originais preservadas
============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --blue:        #0078d4;
  --blue-light:  #e8f4fd;
  --blue-dark:   #005fa3;
  --green:       #16783a;
  --green-light: #dcfce7;
  --red:         #b91c1c;
  --red-light:   #fee2e2;
  --amber:       #9a6000;
  --amber-light: #fef3c7;
  --gold:        #f0c060;
  --dark:        #0f0f1e;
  --dark2:       #1a1a2e;
  --dark3:       #252542;
  --gray-50:     #f0f2f5;
  --gray-100:    #e9ecef;
  --gray-200:    #dde1e7;
  --gray-400:    #9ca3af;
  --gray-600:    #6b7280;
  --gray-800:    #1f2937;
  --gray-900:    #111827;
  --sidebar-w:   220px;
  --radius:      6px;
  --radius-md:   8px;
  --radius-lg:   10px;
  --border:      1px solid var(--gray-200);
  --shadow-sm:   0 1px 3px rgba(0,0,0,0.06);
  --shadow:      0 2px 6px rgba(0,0,0,0.08);
}

html { font-size: 14px; }
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  font-size: 13.5px; line-height: 1.55;
  background: var(--gray-50);
  color: var(--gray-900);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

/* ── LAYOUT ─────────────────────────────────────────── */
#app { display: flex; min-height: 100vh; }

/* ── SIDEBAR ERPLUS (escura) ─────────────────────────── */
aside {
  width: var(--sidebar-w);
  background: var(--dark2);
  border-right: none;
  display: flex; flex-direction: column;
  position: fixed; top: 0; left: 0; bottom: 0;
  z-index: 20; overflow-y: auto;
}

.logo {
  display: flex; align-items: center; gap: 10px;
  padding: 16px 16px;
  border-bottom: 1px solid rgba(255,255,255,.07);
  flex-shrink: 0;
}
.logo-mark { width: 32px; height: 32px; flex-shrink: 0; }
.logo-name { display: block; font-size: 14px; font-weight: 700; color: #fff; letter-spacing: -.2px; }
.logo-sub  { display: block; font-size: 10px; color: #7777aa; letter-spacing: .2px; margin-top: 1px; }

nav { flex: 1; padding: 10px 8px; overflow-y: auto; }

.nav-label {
  font-size: 9px; font-weight: 700;
  color: #4444aa;
  text-transform: uppercase; letter-spacing: .7px;
  padding: 0 8px;
  margin: 10px 0 3px;
}

.nav-item {
  display: flex; align-items: center; gap: 9px;
  width: 100%; padding: 8px 10px;
  border: none; background: none;
  border-radius: var(--radius);
  font-family: inherit; font-size: 13px;
  color: #8888bb;
  cursor: pointer; transition: all .15s;
  border-left: 3px solid transparent;
  text-align: left;
}
.nav-item:hover { background: rgba(255,255,255,.06); color: #ccccee; }
.nav-item.active {
  background: rgba(0,120,212,.18);
  color: #4fa3e3;
  border-left-color: var(--blue);
  font-weight: 500;
}
.nav-icon { width: 17px; height: 17px; flex-shrink: 0; opacity: .8; }
.nav-item.active .nav-icon { opacity: 1; }

/* Botão de atendimento destaque */
.nav-item.atendimento-btn {
  background: var(--blue); color: #fff;
  border-radius: 7px; margin-bottom: 10px;
  font-weight: 600; font-size: 13px;
  border-left: none;
  justify-content: center;
}
.nav-item.atendimento-btn:hover { background: var(--blue-dark); }

.sidebar-footer {
  padding: 12px 12px;
  border-top: 1px solid rgba(255,255,255,.07);
  flex-shrink: 0;
}
.user-chip { display: flex; align-items: center; gap: 9px; }
.user-avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--blue); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 11px; font-weight: 700; flex-shrink: 0;
}
.user-name { display: block; font-size: 12px; font-weight: 500; color: #ccccee; }
.user-role { display: block; font-size: 10.5px; color: #6666aa; }

/* ── TOPBAR ERPLUS ───────────────────────────────────── */
main {
  margin-left: var(--sidebar-w);
  flex: 1; display: flex; flex-direction: column;
  min-height: 100vh; background: var(--gray-50);
}
.erp-topbar {
  background: #fff; border-bottom: 1px solid var(--gray-200);
  height: 52px; padding: 0 20px;
  display: flex; align-items: center; justify-content: space-between;
  position: sticky; top: 0; z-index: 10;
}
.erp-topbar-left { display: flex; align-items: center; gap: 10px; }
.erp-topbar-icon {
  width: 32px; height: 32px; border-radius: 7px;
  background: var(--blue-light); color: var(--blue);
  display: flex; align-items: center; justify-content: center;
}
.erp-topbar-title { font-size: 15px; font-weight: 700; color: var(--gray-900); }
.erp-topbar-right { display: flex; align-items: center; gap: 10px; }
.company-pill {
  background: var(--gray-50); border: 1px solid var(--gray-200);
  border-radius: 7px; padding: 5px 12px; font-size: 12px;
}
.company-pill .cn { font-weight: 600; color: var(--gray-900); }
.company-pill .cj { font-size: 10px; color: var(--gray-400); }

.main-content { padding: 18px 20px; flex: 1; }

/* ── PÁGINA ──────────────────────────────────────────── */
.page { display: none; }
.page.active { display: flex; flex-direction: column; gap: 16px; }

.page-header {
  display: flex; align-items: flex-start; justify-content: space-between;
}
.page-title { font-size: 17px; font-weight: 700; color: var(--gray-900); margin-bottom: 2px; }
.page-sub   { font-size: 13px; color: var(--gray-600); }
.header-actions { display: flex; gap: 8px; align-items: center; flex-shrink: 0; }

/* ── MÉTRICAS ────────────────────────────────────────── */
.metrics-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.metric {
  background: #fff; border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg); padding: 14px 16px;
}
.metric-label { font-size: 11px; color: var(--gray-600); font-weight: 500; text-transform: uppercase; letter-spacing: .3px; margin-bottom: 6px; }
.metric-value { font-size: 22px; font-weight: 700; color: var(--gray-900); }
.metric-value.accent  { color: var(--blue); }
.metric-value.success { color: var(--green); }
.metric-value.warning { color: var(--amber); }
.metric-value.danger  { color: var(--red); }

/* ── CARDS ───────────────────────────────────────────── */
.card {
  background: #fff; border: 1px solid var(--gray-200);
  border-radius: var(--radius-lg); padding: 16px;
}
.card-section-title { font-size: 13px; font-weight: 700; color: var(--gray-900); margin-bottom: 12px; }
.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }

/* ── TABELAS ERPLUS ──────────────────────────────────── */
.card > table, .card > div > table {
  width: 100%; border-collapse: collapse; table-layout: auto;
}
thead tr { background: var(--dark2); }
thead th {
  padding: 10px 14px;
  text-align: left; font-size: 11px; font-weight: 700;
  color: var(--gold); border-right: 1px solid rgba(255,255,255,.06);
  white-space: nowrap; letter-spacing: .3px;
}
thead th:last-child { border-right: none; }
tbody tr { border-bottom: 1px solid var(--gray-100); transition: background .1s; }
tbody tr:last-child { border-bottom: none; }
tbody tr:hover { background: #f7f9fc; }
tbody td { padding: 10px 14px; font-size: 13px; vertical-align: middle; }
.empty-row { text-align: center; padding: 28px; color: var(--gray-400); }

/* ── TABLE TOOLBAR ────────────────────────────────────── */
.table-toolbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 0 12px;
  gap: 8px; flex-wrap: wrap;
}
.search-wrap { display: flex; align-items: center; gap: 7px; background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: 7px; padding: 6px 10px; }
.search-svg { width: 14px; height: 14px; flex-shrink: 0; color: var(--gray-400); }
.search-input { border: none; background: transparent; font-size: 13px; outline: none; width: 200px; color: var(--gray-900); font-family: inherit; }
.filter-select-full { border: 1px solid var(--gray-200); border-radius: 7px; padding: 7px 10px; font-size: 13px; background: #fff; font-family: inherit; color: var(--gray-900); }

/* ── BADGES ──────────────────────────────────────────── */
.badge { display: inline-block; padding: 2px 9px; border-radius: 12px; font-size: 11px; font-weight: 600; }
.badge-green  { background: var(--green-light); color: #14532d; }
.badge-amber  { background: var(--amber-light); color: #78350f; }
.badge-red    { background: var(--red-light);   color: #7f1d1d; }
.badge-blue   { background: var(--blue-light);  color: #1e40af; }
.badge-gray   { background: var(--gray-100);    color: var(--gray-600); }

/* td helpers */
.td-name { font-weight: 500; color: var(--gray-900); }
.td-sub  { font-size: 11.5px; color: var(--gray-400); margin-top: 1px; }
.avatar { width: 30px; height: 30px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; flex-shrink: 0; }
.av-a { background: var(--blue-light); color: var(--blue-dark); }
.av-b { background: var(--green-light); color: var(--green); }

/* ── BOTÕES ──────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; gap: 5px; padding: 7px 14px; border-radius: 7px; font-size: 13px; font-weight: 500; cursor: pointer; transition: all .15s; border: 1px solid var(--gray-200); font-family: inherit; text-decoration: none; }
.btn-primary { background: var(--blue); color: #fff; border-color: var(--blue); }
.btn-primary:hover { background: var(--blue-dark); }
.btn-success { background: var(--green); color: #fff; border-color: var(--green); }
.btn-success:hover { background: #125c2e; }
.btn-ghost { background: #fff; color: var(--gray-900); }
.btn-ghost:hover { background: var(--gray-50); }
.btn-danger { background: var(--red); color: #fff; border-color: var(--red); }
.btn-pdf { background: #fff; color: var(--red); border-color: #f0c0c0; }
.btn-pdf:hover { background: var(--red-light); }
.btn-sm { padding: 5px 11px; font-size: 12px; }
.btn-icon { padding: 6px 8px; }
.btn-icon svg { width: 14px; height: 14px; }
.btn-group { display: flex; gap: 4px; }
.btn-link { background: none; border: none; color: var(--blue); cursor: pointer; font-family: inherit; font-size: 13px; padding: 0; }
.btn-link-muted { background: none; border: none; color: var(--gray-400); cursor: pointer; font-family: inherit; font-size: 12px; padding: 0; }

/* ── MODAIS ──────────────────────────────────────────── */
.modal-bg {
  display: none; position: fixed; inset: 0; z-index: 100;
  background: rgba(0,0,0,.45); padding: 20px;
  align-items: center; justify-content: center;
  overflow-y: auto;
}
.modal-bg.open { display: flex; }
.modal {
  background: #fff; border-radius: var(--radius-lg); padding: 24px;
  width: 100%; max-width: 540px; max-height: 90vh; overflow-y: auto;
}
.modal-lg { max-width: 680px; }
.modal-wz { max-width: 680px; }
.modal-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 18px; }
.modal-title { font-size: 16px; font-weight: 700; color: var(--gray-900); }
.modal-sub   { font-size: 13px; color: var(--gray-600); margin-top: 2px; }
.modal-footer { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; padding-top: 16px; border-top: var(--border); }
.close-btn { background: none; border: none; cursor: pointer; color: var(--gray-400); padding: 4px; border-radius: 5px; display: flex; }
.close-btn svg { width: 16px; height: 16px; }

/* ── FORMULÁRIOS ─────────────────────────────────────── */
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.form-group { display: flex; flex-direction: column; gap: 5px; margin-bottom: 12px; }
.form-group label { font-size: 11.5px; font-weight: 600; color: var(--gray-600); text-transform: uppercase; letter-spacing: .3px; }
.form-group input,
.form-group select,
.form-group textarea {
  border: 1.5px solid var(--gray-200); border-radius: 7px;
  padding: 8px 11px; font-size: 13px; font-family: inherit;
  color: var(--gray-900); background: #fff;
  outline: none; transition: border .18s;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color: var(--blue); }
.form-group textarea { resize: vertical; }
.field-label { font-size: 11px; font-weight: 600; color: var(--gray-600); text-transform: uppercase; letter-spacing: .3px; margin-bottom: 5px; }
.field-hint { font-size: 11px; color: var(--gray-400); margin-top: 4px; }

/* ── WIZARD DE ATENDIMENTO (ERPLUS) ──────────────────── */
.wz-steps {
  display: flex; align-items: center;
  background: var(--dark2);
  border-radius: 8px; padding: 16px 20px;
  margin-bottom: 20px; gap: 0;
}
.wz-step-dot {
  display: flex; align-items: center; gap: 7px; flex: 1;
}
.wz-dot-num {
  width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700;
  background: rgba(255,255,255,.1); color: #8888bb;
  flex-shrink: 0;
}
.wz-step-dot.done .wz-dot-num  { background: var(--green); color: #fff; }
.wz-step-dot.active .wz-dot-num { background: var(--blue); color: #fff; outline: 3px solid rgba(0,120,212,.3); outline-offset: 1px; }
.wz-dot-lbl { font-size: 11px; font-weight: 600; color: #5555aa; white-space: nowrap; }
.wz-step-dot.done .wz-dot-lbl  { color: var(--green); }
.wz-step-dot.active .wz-dot-lbl { color: #4fa3e3; }
.wz-step-line { flex: 1; height: 2px; background: rgba(255,255,255,.08); margin: 0 6px; max-width: 50px; }
.wz-step-line.done { background: var(--blue); }

.wz-etapa { display: flex; flex-direction: column; gap: 16px; }
.wz-etapa-header { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; background: var(--blue-light); border-radius: 8px; }
.wz-etapa-icon { font-size: 24px; flex-shrink: 0; line-height: 1; }
.wz-etapa-titulo { font-size: 15px; font-weight: 700; color: var(--gray-900); margin-bottom: 2px; }
.wz-etapa-sub { font-size: 13px; color: var(--gray-600); }
.wz-footer { display: flex; justify-content: space-between; align-items: center; padding-top: 12px; border-top: var(--border); margin-top: 4px; gap: 8px; }
.wz-label { font-size: 11.5px; font-weight: 600; color: var(--gray-600); text-transform: uppercase; letter-spacing: .3px; margin-bottom: 5px; display: block; }
.wz-input { border: 1.5px solid var(--gray-200); border-radius: 7px; padding: 8px 11px; font-size: 13px; font-family: inherit; color: var(--gray-900); background: #fff; outline: none; }
.wz-input:focus { border-color: var(--blue); }
.wz-form { display: flex; flex-direction: column; gap: 0; }
.wz-search-pac { display: flex; gap: 8px; align-items: center; }
.wz-search-pac .search-wrap { flex: 1; }
.wz-pac-lista { display: flex; flex-direction: column; gap: 4px; max-height: 220px; overflow-y: auto; }
.wz-pac-item { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--gray-200); border-radius: 7px; cursor: pointer; transition: background .12s; }
.wz-pac-item:hover { background: var(--blue-light); border-color: var(--blue); }
.wz-pac-item-nome { font-size: 13px; font-weight: 500; }
.wz-pac-item-sub { font-size: 11px; color: var(--gray-400); }
.wz-pac-card { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; background: var(--blue-light); border: 1.5px solid var(--blue); border-radius: 8px; }
.wz-pac-info { display: flex; align-items: center; gap: 10px; }
.wz-pac-vazio { padding: 12px; font-size: 13px; color: var(--gray-400); text-align: center; }
.wz-data-sel { display: flex; flex-direction: column; gap: 6px; }
.wz-resumo-dia { display: flex; gap: 20px; padding: 12px 16px; background: var(--gray-50); border-radius: 8px; }
.wz-resumo-item { display: flex; flex-direction: column; align-items: center; gap: 2px; }
.wz-resumo-num { font-size: 20px; font-weight: 700; color: var(--gray-900); }
.wz-resumo-num.verde { color: var(--green); }
.wz-resumo-num.azul  { color: var(--blue); }
.wz-resumo-lbl { font-size: 11px; color: var(--gray-400); }
.wz-vagas-label { font-size: 11.5px; font-weight: 600; color: var(--gray-600); text-transform: uppercase; letter-spacing: .3px; }
.wz-vagas-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(90px,1fr)); gap: 6px; max-height: 220px; overflow-y: auto; }
.wz-vaga { display: flex; flex-direction: column; align-items: center; padding: 8px 4px; border-radius: 7px; font-size: 12px; font-weight: 500; border: 1.5px solid var(--gray-200); background: var(--gray-50); gap: 2px; }
.wz-vaga-hora { font-size: 13px; font-weight: 700; }
.wz-vaga-status { font-size: 10px; }
.wz-vaga.livre { cursor: pointer; transition: all .12s; }
.wz-vaga.livre:hover { border-color: var(--blue); background: var(--blue-light); color: var(--blue); }
.wz-vaga.livre.selecionado { border-color: var(--blue); background: var(--blue); color: #fff; }
.wz-vaga.ocupada { background: var(--red-light); border-color: #f0c0c0; color: var(--red); cursor: not-allowed; }
.wz-sem-vagas { text-align: center; padding: 20px; color: var(--gray-400); font-size: 13px; }
.wz-pgto-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; }
.wz-pgto-card { border: 1.5px solid var(--gray-200); border-radius: 9px; padding: 12px 8px; text-align: center; cursor: pointer; transition: all .12s; background: var(--gray-50); }
.wz-pgto-card:hover { border-color: var(--blue); background: var(--blue-light); }
.wz-pgto-card.selecionado { border-color: var(--blue); background: var(--blue); }
.wz-pgto-card.selecionado .wz-pgto-label { color: #fff; }
.wz-pgto-icon { font-size: 22px; margin-bottom: 5px; }
.wz-pgto-label { font-size: 11px; font-weight: 600; color: var(--gray-800); }
.wz-pgto-resumo { margin-top: 4px; }
.wz-res-row { display: flex; justify-content: space-between; font-size: 13px; padding: 6px 0; border-bottom: 1px solid var(--gray-100); }
.wz-res-row:last-child { border-bottom: none; }
.wz-status-pgto { margin-top: 4px; }
.wz-status-btns { display: flex; gap: 8px; margin-top: 6px; }
.wz-status-btn { padding: 8px 18px; border-radius: 7px; font-size: 13px; font-weight: 500; cursor: pointer; border: 1.5px solid var(--gray-200); background: var(--gray-50); font-family: inherit; transition: all .15s; }
.wz-status-btn.pago.active    { background: var(--green-light); border-color: var(--green); color: var(--green); }
.wz-status-btn.pendente.active { background: var(--amber-light); border-color: var(--amber); color: var(--amber); }

/* ── AGENDA CALENDÁRIO ────────────────────────────────── */
.agenda-cal-wrap { padding: 0; overflow: hidden; }
.agenda-grid { display: grid; grid-template-columns: repeat(7,1fr); }
.ag-header { padding: 10px 4px; text-align: center; font-size: 11px; font-weight: 700; color: var(--gold); background: var(--dark2); border-right: 1px solid rgba(255,255,255,.06); }
.ag-header:last-child { border-right: none; }
.ag-day { min-height: 80px; padding: 8px 6px; border-right: 1px solid var(--gray-100); border-bottom: 1px solid var(--gray-100); cursor: pointer; transition: background .12s; position: relative; }
.ag-day:nth-child(7n) { border-right: none; }
.ag-day:hover { background: var(--blue-light); }
.ag-day.hoje { background: var(--blue-light); }
.ag-day.outro-mes .ag-day-num { color: var(--gray-200); }
.ag-day-num { font-size: 12px; font-weight: 600; color: var(--gray-900); margin-bottom: 4px; }
.ag-day.hoje .ag-day-num { background: var(--blue); color: #fff; width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.ag-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--blue); display: inline-block; margin-right: 2px; }
.ag-dot.conf { background: var(--green); }
.ag-dot.canc { background: var(--red); }
.ag-chips { display: flex; flex-wrap: wrap; gap: 2px; }
.ag-chip { font-size: 10px; padding: 1px 5px; border-radius: 3px; background: var(--blue-light); color: var(--blue-dark); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }

/* Painel do dia */
.dia-painel { display: none; background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 18px; }
.dia-painel.aberto { display: block; }
.dia-painel-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 14px; }
.dia-painel-info { display: flex; align-items: flex-start; gap: 16px; flex-wrap: wrap; }
.dia-painel-badge { background: var(--blue-light); border-radius: 8px; padding: 8px 14px; }
.dia-painel-badge span { font-size: 11px; color: var(--blue); display: block; }
.dia-painel-badge strong { font-size: 16px; font-weight: 700; color: var(--gray-900); }
.dia-painel-stats { display: flex; gap: 20px; flex-wrap: wrap; }
.dp-stat { display: flex; flex-direction: column; align-items: center; }
.dp-stat-num { font-size: 18px; font-weight: 700; color: var(--gray-900); }
.dp-stat-num.green { color: var(--green); }
.dp-stat-num.blue  { color: var(--blue); }
.dp-stat-num.accent { color: var(--blue); }
.dp-stat-lbl { font-size: 10.5px; color: var(--gray-400); }
.dia-painel-fechar { background: none; border: none; cursor: pointer; color: var(--gray-400); padding: 4px; }
.dp-resumo { display: flex; gap: 0; border: 1px solid var(--gray-200); border-radius: 8px; overflow: hidden; margin-bottom: 14px; }
.dp-resumo-item { flex: 1; padding: 10px 14px; text-align: center; border-right: 1px solid var(--gray-200); }
.dp-resumo-item:last-child { border-right: none; }
.dp-resumo-lbl { font-size: 11px; color: var(--gray-400); display: block; }
.dp-resumo-val { font-size: 14px; font-weight: 700; display: block; color: var(--gray-900); }
.dp-resumo-val.azul  { color: var(--blue); }
.dp-resumo-val.ouro  { color: var(--amber); }
.dp-resumo-val.verde { color: var(--green); }
.dp-grade-wrap { overflow-x: auto; }
.dp-grade { display: flex; flex-direction: column; gap: 4px; min-width: 360px; }
.dp-slot { display: flex; align-items: center; gap: 10px; padding: 6px 10px; border-radius: 6px; background: var(--gray-50); }
.dp-slot.ocupado { background: var(--blue-light); border-left: 3px solid var(--blue); }
.dp-slot-hora { font-size: 12px; font-weight: 700; width: 42px; flex-shrink: 0; }
.dp-slot-content { flex: 1; }
.dp-slot-pac { font-size: 13px; font-weight: 500; }
.dp-slot-proc { font-size: 11px; color: var(--gray-400); }
.dp-slot-badge { flex-shrink: 0; }
.dp-livre { color: var(--gray-400); font-size: 12px; }
.dp-loading { padding: 24px; text-align: center; color: var(--gray-400); font-size: 13px; }

/* ── AGENDA DO DIA ────────────────────────────────────── */
.ad-seletor-wrap { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 16px; }
.ad-seletor-card { display: flex; align-items: center; gap: 14px; }
.ad-seletor-icone { width: 40px; height: 40px; background: var(--blue-light); border-radius: 8px; display: flex; align-items: center; justify-content: center; color: var(--blue); flex-shrink: 0; }
.ad-seletor-icone svg { width: 20px; height: 20px; }
.ad-seletor-campo { flex: 1; }
.ad-seletor-label { font-size: 10.5px; font-weight: 600; color: var(--gray-400); text-transform: uppercase; letter-spacing: .3px; display: block; margin-bottom: 3px; }
.ad-input-data { border: 1.5px solid var(--gray-200); border-radius: 7px; padding: 7px 11px; font-size: 13px; font-family: inherit; background: #fff; color: var(--gray-900); outline: none; }
.ad-input-data:focus { border-color: var(--blue); }
.ad-nav-btns { display: flex; gap: 4px; align-items: center; }
.ad-nav-btn { background: none; border: 1px solid var(--gray-200); border-radius: 6px; padding: 6px 8px; cursor: pointer; display: flex; align-items: center; font-family: inherit; font-size: 12px; font-weight: 500; }
.ad-nav-btn svg { width: 14px; height: 14px; }
.ad-nav-btn.hoje-btn { padding: 6px 12px; }
.ad-resumo-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.ad-resumo-card { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 14px; display: flex; align-items: center; gap: 12px; }
.ad-resumo-icone { width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ad-resumo-card.azul    .ad-resumo-icone { background: var(--blue-light); color: var(--blue); }
.ad-resumo-card.verde   .ad-resumo-icone { background: var(--green-light); color: var(--green); }
.ad-resumo-card.cinza   .ad-resumo-icone { background: var(--gray-100); color: var(--gray-600); }
.ad-resumo-card.dourado .ad-resumo-icone { background: var(--amber-light); color: var(--amber); }
.ad-resumo-card.roxo    .ad-resumo-icone { background: #f3e8ff; color: #7c3aed; }
.ad-resumo-card.laranja .ad-resumo-icone { background: #fff7ed; color: #c2410c; }
.ad-resumo-icone svg { width: 18px; height: 18px; }
.ad-resumo-num { font-size: 20px; font-weight: 700; }
.ad-resumo-lbl { font-size: 11px; color: var(--gray-400); }
.ad-grade-wrap { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); overflow: hidden; }
.ad-lista { display: flex; flex-direction: column; }
.ad-slot { display: flex; align-items: stretch; border-bottom: 1px solid var(--gray-100); }
.ad-slot:last-child { border-bottom: none; }
.ad-slot-hora { width: 64px; padding: 10px 12px; font-size: 12px; font-weight: 700; color: var(--gray-400); background: var(--gray-50); border-right: 1px solid var(--gray-100); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.ad-slot-conteudo { flex: 1; padding: 8px 14px; display: flex; align-items: center; }
.ad-slot.livre .ad-slot-conteudo { color: var(--gray-300); font-size: 12px; }
.ad-slot.ocupado { background: var(--blue-light); }
.ad-slot.ocupado .ad-slot-hora { background: var(--blue); color: #fff; border-right-color: rgba(255,255,255,.2); }
.ad-slot-pac { font-size: 13px; font-weight: 500; }
.ad-slot-proc { font-size: 11.5px; color: var(--gray-600); }
.ad-slot-med { font-size: 11px; color: var(--gray-400); }
.ad-slot-right { margin-left: auto; display: flex; align-items: center; gap: 6px; }
.ad-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 48px; color: var(--gray-400); font-size: 13px; }

/* ── PRONTUÁRIO / ODONTOGRAMA ─────────────────────────── */
.tooth-map { display: flex; flex-wrap: wrap; gap: 4px; }
.tooth { width: 30px; height: 30px; border-radius: 5px; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: 600; cursor: pointer; transition: all .12s; border: 1.5px solid var(--gray-200); background: var(--gray-50); }
.tooth:hover { border-color: var(--blue); background: var(--blue-light); }
.tooth.normal   { background: var(--gray-50); border-color: var(--gray-200); }
.tooth.treated  { background: var(--green-light); border-color: var(--green); color: var(--green); }
.tooth.problem  { background: var(--amber-light); border-color: var(--amber); color: var(--amber); }
.tooth-legend { display: flex; gap: 12px; margin-top: 10px; flex-wrap: wrap; }
.tooth-leg { font-size: 11px; display: flex; align-items: center; gap: 5px; }
.tooth-leg::before { content: ''; width: 10px; height: 10px; border-radius: 3px; display: inline-block; }
.tooth-leg.normal::before  { background: var(--gray-50); border: 1.5px solid var(--gray-200); }
.tooth-leg.treated::before { background: var(--green-light); border: 1.5px solid var(--green); }
.tooth-leg.problem::before { background: var(--amber-light); border: 1.5px solid var(--amber); }

/* ── ORÇAMENTOS / FILTROS ─────────────────────────────── */
.filter-panel { background: #fff; border: 1px solid var(--gray-200); border-radius: var(--radius-lg); padding: 14px; }
.filter-panel-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.filter-panel-title { font-size: 12px; font-weight: 600; color: var(--gray-600); display: flex; align-items: center; gap: 5px; }
.filter-panel-body { display: flex; flex-direction: column; gap: 12px; }
.filter-group { display: flex; flex-direction: column; gap: 6px; }
.filter-group-label { font-size: 11px; font-weight: 600; color: var(--gray-600); text-transform: uppercase; letter-spacing: .3px; }
.filter-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 12px; }
.status-chips { display: flex; gap: 5px; flex-wrap: wrap; }
.chip { padding: 4px 11px; border-radius: 12px; font-size: 11.5px; font-weight: 500; cursor: pointer; border: 1px solid var(--gray-200); background: #fff; font-family: inherit; transition: all .12s; }
.chip:hover { border-color: var(--gray-400); }
.chip-all.active     { background: var(--gray-800); color: #fff; border-color: var(--gray-800); }
.chip-analise.active { background: var(--blue-light); color: var(--blue-dark); border-color: var(--blue); }
.chip-aprovado.active{ background: var(--green-light); color: var(--green); border-color: var(--green); }
.chip-pendente.active{ background: var(--amber-light); color: var(--amber); border-color: var(--amber); }
.chip-recusado.active{ background: var(--red-light); color: var(--red); border-color: var(--red); }
.valor-range-wrap { display: flex; align-items: center; gap: 6px; }
.valor-field { display: flex; align-items: center; border: 1.5px solid var(--gray-200); border-radius: 7px; overflow: hidden; }
.valor-prefix { padding: 0 8px; font-size: 11px; color: var(--gray-400); background: var(--gray-50); border-right: 1px solid var(--gray-200); align-self: stretch; display: flex; align-items: center; }
.valor-field input { border: none; padding: 7px 8px; font-size: 13px; font-family: inherit; outline: none; width: 90px; }
.valor-dash { color: var(--gray-400); font-size: 13px; }
.result-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.filter-result { font-size: 12px; color: var(--gray-400); }
.active-tags { display: flex; gap: 5px; flex-wrap: wrap; }
.active-tag { background: var(--blue-light); color: var(--blue-dark); border-radius: 10px; padding: 2px 8px; font-size: 11px; display: flex; align-items: center; gap: 4px; }
.active-tag button { background: none; border: none; cursor: pointer; color: var(--blue); font-size: 12px; padding: 0; line-height: 1; }

/* ── CHECKBOX LIST ────────────────────────────────────── */
.checkbox-list { display: flex; flex-direction: column; gap: 5px; max-height: 120px; overflow-y: auto; background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: 7px; padding: 8px; }
.checkbox-item { display: flex; align-items: center; gap: 7px; font-size: 13px; cursor: pointer; }
.checkbox-item input { accent-color: var(--blue); }

/* ── DATALIST SERVIÇOS ────────────────────────────────── */
#servicos-datalist { display: none; }

/* ── RELATÓRIOS ──────────────────────────────────────────*/
.rel-chart { display: flex; flex-direction: column; gap: 8px; }
.rel-bar-item { display: flex; flex-direction: column; gap: 3px; }
.rel-bar-lbl { display: flex; justify-content: space-between; font-size: 12px; color: var(--gray-600); }
.rel-bar-track { background: var(--gray-100); border-radius: 4px; height: 7px; overflow: hidden; }
.rel-bar-fill { height: 7px; border-radius: 4px; transition: width .4s; }

/* ── TOAST ──────────────────────────────────────────────── */
.toast-container { position: fixed; bottom: 20px; right: 20px; z-index: 999; display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
.toast { padding: 11px 18px; border-radius: 8px; font-size: 13px; font-weight: 500; color: #fff; pointer-events: all; box-shadow: var(--shadow); max-width: 320px; animation: toastIn .2s ease; }
.toast.ok  { background: var(--green); }
.toast.err { background: var(--red); }
@keyframes toastIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* ── SCROLLBAR ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--gray-200); border-radius: 3px; }

/* ── RESPONSIVE ──────────────────────────────────────────── */
@media (max-width: 900px) {
  aside { transform: translateX(-100%); transition: transform .2s; }
  aside.open { transform: translateX(0); }
  main { margin-left: 0; }
  .metrics-grid { grid-template-columns: repeat(2,1fr); }
  .grid-2, .filter-row-3 { grid-template-columns: 1fr; }
  .ad-resumo-grid { grid-template-columns: 1fr 1fr; }
  .wz-pgto-grid { grid-template-columns: repeat(3,1fr); }
}
@media (max-width: 600px) {
  .main-content { padding: 12px; }
  .metrics-grid { grid-template-columns: 1fr 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .wz-pgto-grid { grid-template-columns: repeat(2,1fr); }
}