/* ============================================================
   Elivre Agendamento — Painel da Coordenação
   Mesma paleta do front dos pais: paper #F6F3EA · ink #1C2541
   gold #E8A33D (ações principais) · teal #2F7A6B (confirmado)
   brick #C6543F (cancelar/recusar)
   ============================================================ */

:root {
  --cp-paper: #F6F3EA;
  --cp-card: #FFFFFF;
  --cp-ink: #1C2541;
  --cp-ink-soft: #5B6480;
  --cp-gold: #E8A33D;
  --cp-gold-deep: #C9862A;
  --cp-teal: #2F7A6B;
  --cp-brick: #C6543F;
  --cp-line: #DED7C4;
}

* { box-sizing: border-box; }

body.cp {
  margin: 0;
  background: var(--cp-paper);
  color: var(--cp-ink);
  font-family: 'Inter', system-ui, sans-serif;
  min-height: 100vh;
}

.cp-topbar {
  background: var(--cp-ink);
  color: var(--cp-paper);
  padding: 14px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
}
.cp-topbar a.cp-brand { color: #fff; text-decoration: none; font-weight: 700; letter-spacing: 0.01em; }
.cp-nav { display: flex; gap: 18px; font-size: 0.9rem; flex-wrap: wrap; }
.cp-nav a { color: #C7CEDB; text-decoration: none; white-space: nowrap; }
.cp-nav a:hover, .cp-nav a.is-active { color: #fff; text-decoration: underline; }
.cp-nav a.cp-sair { color: var(--cp-gold); }

.cp-wrap { max-width: 1000px; margin: 0 auto; padding: 28px 20px 60px; }

.cp-eyebrow { font-family: 'IBM Plex Mono', monospace; font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--cp-gold-deep); margin: 0 0 4px; }
h1.cp-title { font-size: 1.6rem; font-weight: 700; margin: 0 0 4px; color: var(--cp-ink); }
p.cp-sub { color: var(--cp-ink-soft); margin: 0 0 24px; font-size: 0.95rem; }

.cp-card { background: var(--cp-card); border: 1px solid var(--cp-line); border-radius: 12px; padding: 22px; box-shadow: 0 1px 2px rgba(28,37,65,0.05); }

/* Alertas */
.cp-alert { padding: 12px 16px; border-radius: 10px; margin: 0 auto 18px; font-size: 0.92rem; font-weight: 500; max-width: 480px; text-align: center; }
.cp-alert-aviso { text-align: left; max-width: none; }
.cp-alert-erro { background: #FBE7E2; color: var(--cp-brick); border: 1px solid #EFC3B7; }
.cp-alert-sucesso { background: #E6F0EC; color: var(--cp-teal); border: 1px solid #BFDBD1; }
.cp-alert-aviso { background: #FBF0DC; color: var(--cp-gold-deep); border: 1px solid #EAD3A0; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }

/* Login */
.cp-auth-wrap { max-width: 380px; margin: 10vh auto; padding: 0 20px; }
.cp-field { margin-bottom: 16px; min-width: 0; }
.cp-field label { display: block; font-size: 0.85rem; font-weight: 600; color: var(--cp-ink-soft); margin-bottom: 6px; }
.cp-field input, .cp-field select {
  width: 100%; padding: 11px 13px; border: 1.5px solid var(--cp-line); border-radius: 8px;
  font-size: 0.95rem; background: #fff; color: var(--cp-ink); font-family: inherit;
}
.cp-field input:focus, .cp-field select:focus { outline: none; border-color: var(--cp-gold-deep); }

.cp-btn {
  display: inline-block; padding: 10px 18px; border: none; border-radius: 8px;
  background: var(--cp-ink); color: #fff; font-weight: 600; font-size: 0.92rem; cursor: pointer;
  text-decoration: none; text-align: center; white-space: nowrap; flex-shrink: 0;
}
.cp-btn:hover { background: #10182c; }
.cp-btn-gold { background: var(--cp-gold); color: var(--cp-ink); } .cp-btn-gold:hover { background: var(--cp-gold-deep); }
.cp-btn-teal { background: var(--cp-teal); } .cp-btn-teal:hover { background: #256153; }
.cp-btn-brick { background: transparent; border: 1.5px solid var(--cp-brick); color: var(--cp-brick); }
.cp-btn-brick:hover { background: var(--cp-brick); color: #fff; }
.cp-btn-sm { padding: 6px 12px; font-size: 0.82rem; }
.cp-btn-block { display: block; width: 100%; }

/* Filtros - flex-wrap com min-width seguro para nunca sobrepor */
.cp-filtros {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: end;
  margin-bottom: 22px;
}
.cp-filtros .cp-field {
  margin-bottom: 0;
  flex: 1 1 170px;
  min-width: 150px;
}
.cp-filtros .cp-field-btn {
  flex: 0 0 auto;
  margin-bottom: 0;
}

/* Toggle Lista / Por dia */
.cp-view-toggle { display: inline-flex; border: 1.5px solid var(--cp-line); border-radius: 8px; overflow: hidden; margin-bottom: 18px; }
.cp-view-toggle button {
  border: none; background: #fff; padding: 8px 16px; font-size: 0.85rem; font-weight: 600;
  color: var(--cp-ink-soft); cursor: pointer;
}
.cp-view-toggle button.is-active { background: var(--cp-ink); color: #fff; }

/* Visão por dia */
.cp-day-section { margin-bottom: 22px; }
.cp-day-header {
  font-family: 'IBM Plex Mono', monospace; font-size: 0.82rem; font-weight: 600;
  color: var(--cp-ink); text-transform: uppercase; letter-spacing: 0.04em;
  padding-bottom: 6px; margin-bottom: 10px; border-bottom: 2px solid var(--cp-line);
}
.cp-chip-row { display: flex; flex-wrap: wrap; gap: 8px; }
.cp-chip {
  font-family: 'IBM Plex Mono', monospace; font-size: 0.85rem; font-weight: 600;
  padding: 8px 14px; border-radius: 8px; border: 1.5px solid transparent; cursor: pointer;
  display: inline-block;
}
.cp-chip-livre { background: #E6F0EC; color: var(--cp-teal); border-color: #BFDBD1; }
.cp-chip-travado { background: #EFEBE3; color: var(--cp-ink-soft); border-color: var(--cp-line); }
.cp-chip-pendente { background: #FBF0DC; color: var(--cp-gold-deep); border-color: #EAD3A0; }
.cp-chip-agendado { background: var(--cp-ink); color: #fff; }

/* Tabela (visão lista) */
.cp-table-wrap { overflow-x: auto; }
table.cp-table { width: 100%; border-collapse: collapse; background: #fff; border-radius: 12px; overflow: hidden; border: 1px solid var(--cp-line); min-width: 560px; }
table.cp-table th { text-align: left; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.05em; color: var(--cp-ink-soft); background: #FAF8F2; padding: 10px 14px; white-space: nowrap; }
table.cp-table td { padding: 10px 14px; border-top: 1px solid #EFEAE0; font-size: 0.92rem; }

.cp-badge { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: 0.75rem; font-weight: 600; white-space: nowrap; }
.cp-badge-livre { background: #E6F0EC; color: var(--cp-teal); }
.cp-badge-travado { background: #EFEBE3; color: var(--cp-ink-soft); }
.cp-badge-pendente { background: #FBF0DC; color: var(--cp-gold-deep); }
.cp-badge-agendado { background: #E1E6F0; color: var(--cp-ink); }
.cp-badge-confirmado { background: #E1E6F0; color: var(--cp-ink); }
.cp-badge-cancelado { background: #EFEBE3; color: var(--cp-ink-soft); }

.cp-empty { color: var(--cp-ink-soft); font-style: italic; text-align: center; padding: 30px 0; }

@media (max-width: 600px) {
  .cp-filtros { flex-direction: column; align-items: stretch; }
  .cp-filtros .cp-field-btn { width: 100%; }
  .cp-filtros .cp-field-btn .cp-btn { width: 100%; }
}
