/*
  File        : public/css/custom.css
  Purpose     : Overrides do tema + componentes específicos da app
  Theme       : Blue
*/

/* ==================== Tokens de tema (overrides finais) ==================== */
:root{
  --primary:#050337;
  --primary-600:#04022C;

  --danger:#7a1f2a;
  --danger-700:#5e1721;

  --ring:rgba(5,3,55,.18); /* foco azul coerente */
}

/* ==================== Botões (força o tema azul) ==================== */
.btn,
a.btn,
button.btn,
.btn-primary{
  background:var(--primary) !important;
  border-color:var(--primary) !important;
  color:#fff !important;
}
.btn:hover,
a.btn:hover,
button.btn:hover,
.btn-primary:hover{
  background:var(--primary-600) !important;
  border-color:var(--primary-600) !important;
}

/* Secondary & Danger em bordeaux */
.btn.btn-secondary, a.btn.btn-secondary, button.btn.btn-secondary{
  background:var(--danger) !important; color:#fff !important; border-color:var(--danger) !important;
}
.btn.btn-secondary:hover{ background:var(--danger-700) !important; border-color:var(--danger-700) !important }
.btn-danger, a.btn-danger, button.btn-danger, .btn.btn-danger{
  background:var(--danger) !important; border-color:var(--danger) !important; color:#fff !important;
}
.btn-danger:hover{ background:var(--danger-700) !important; border-color:var(--danger-700) !important }

/* ==================== Form fields (UX) ==================== */
input[type=text], input[type=email], input[type=password],
input[type=number], select, textarea{
  appearance:none; -webkit-appearance:none;
  width:min(520px,90%);
  padding:10px 12px;
  border:1px solid #d1d5db;
  border-radius:12px;
  font-size:16px; line-height:1.35;
  transition:border-color .15s ease, box-shadow .15s ease;
  background:#fff;
}
input:focus, select:focus, textarea:focus{
  outline:0; border-color:var(--primary);
  box-shadow:0 0 0 4px var(--ring);
}
form .form-row{ margin:14px 0 }
form label{ display:block; margin:0 0 6px 2px; font-weight:600 }

/* Alta especificidade para formularios dentro do .content */
.content form input[type=text],
.content form input[type=email],
.content form input[type=password],
.content form input[type=number],
.content form select,
.content form textarea{
  appearance:none; -webkit-appearance:none;
  width:min(520px,90%);
  padding:10px 12px;
  border:1px solid #d1d5db;
  border-radius:12px;
  font-size:16px; line-height:1.35;
  transition:border-color .15s ease, box-shadow .15s ease;
  background:#fff;
}
.content form input:focus,
.content form select:focus,
.content form textarea:focus{
  outline:0; border-color:var(--primary);
  box-shadow:0 0 0 4px var(--ring);
}

/* Barra de ações genérica */
.form-actions, .action-bar{ display:flex; gap:12px; justify-content:flex-end; margin-top:18px }

/* ==================== Chips (Users/Edit) ==================== */
.chips{ display:flex; flex-wrap:wrap; gap:10px; margin-top:8px }
.chips .chk{ position:relative; display:inline-block }
.chips .chk input{
  position:absolute; inset:0; width:100%; height:100%;
  opacity:0; pointer-events:none;
}
.chips .chk span{
  display:inline-flex; align-items:center;
  padding:8px 14px; border-radius:999px;
  background:#f8fafc; color:#111827; border:1px solid #e5e7eb; font-weight:600;
  cursor:pointer; user-select:none;
  transition:background .15s, border-color .15s, color .15s, box-shadow .15s, transform .02s;
}
.chips .chk input:checked + span{
  background:var(--primary); border-color:var(--primary); color:#fff;
}
.chips .chk input:focus-visible + span{ box-shadow:0 0 0 4px var(--ring) }
.chips .chk span:active{ transform:translateY(1px) }
.chips .chk input:disabled + span{ opacity:.55; cursor:not-allowed }

/* ==================== Perfis: grupos de permissões ==================== */
.perm-group{
  background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  padding:14px 16px; margin:14px 0;
}
.perm-group .group-header{
  display:flex; align-items:center; justify-content:flex-start; gap:14px; flex-wrap:wrap;
  margin-bottom:10px;
}
.perm-group .group-title{ font-weight:700; font-size:16px }
.perm-group .select-all{ display:inline-flex; align-items:center; gap:8px; color:#374151; font-weight:500; user-select:none }

.perm-group .checkgrid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 18px;
}
@media (max-width:920px){ .perm-group .checkgrid{ grid-template-columns:1fr } }

.perm-group .chk{
  display:flex; align-items:center; gap:12px;
  padding:6px 8px; border-radius:8px;
}

/* Checkboxes modernos */
.perm-group input[type=checkbox],
.perm-group .select-all input[type=checkbox]{
  appearance:none; -webkit-appearance:none;
  width:18px; height:18px; border:2px solid #cbd5e1; border-radius:6px;
  background:#fff; display:inline-grid; place-content:center;
  vertical-align:-3px; cursor:pointer; transition:border-color .15s, background .15s, box-shadow .15s;
}
.perm-group input[type=checkbox]::after,
.perm-group .select-all input[type=checkbox]::after{
  content:""; width:10px; height:6px; border:2px solid #fff; border-top:0; border-left:0;
  transform:scale(0) rotate(45deg); transition:transform .12s ease-out;
}
.perm-group input[type=checkbox]:checked,
.perm-group .select-all input[type=checkbox]:checked{ background:var(--primary); border-color:var(--primary) }
.perm-group input[type=checkbox]:checked::after,
.perm-group .select-all input[type=checkbox]:checked::after{ transform:scale(1) rotate(45deg) }
.perm-group input[type=checkbox]:focus-visible,
.perm-group .select-all input[type=checkbox]:focus-visible{ outline:0; box-shadow:0 0 0 4px var(--ring) }
.perm-group input[type=checkbox]:disabled{ opacity:.55; cursor:not-allowed }

/* ==================== Tabelas de listagens (Diárias, etc.) ==================== */
:root{ --card-bg:#fff; --head:#111827 }
.table-wrapper{ overflow:auto }
.table-wrapper table{
  width:100%; border-collapse:separate; border-spacing:0; min-width:900px;
}
.table-wrapper th, .table-wrapper td{
  padding:10px 12px; border-bottom:1px solid #e5e7eb; vertical-align:middle; white-space:nowrap;
}
.table-wrapper thead th{
  position:sticky; top:0; background:#f9fafb; color:#111827; font-weight:600; border-bottom:1px solid #d1d5db;
}
.table-wrapper tbody tr:nth-child(even){ background:#fafafa }
.text-right{ text-align:right }
.mt-3{ margin-top:16px }

/* === ANTOTERRAS UI FIX (2025-10) ===================================== */
/* Sidebar em azul + nav */
.side{background:#050337 !important;color:#e5e7ff !important;}
.nav a{color:#e5e7ff !important;}
.nav a:hover{background:rgba(5,3,55,.22) !important;}

/* Paleta primária e danger (mantém variáveis globais) */
:root{
  --primary:#050337;       /* Azul principal */
  --primary-600:#04022C;   /* Azul hover */
  --danger:#7a1f2a;        /* Bordeaux */
  --danger-700:#5e1721;    /* Bordeaux hover */
  --ring:rgba(14,91,87,.18);
}

/* Botão primário azul */
.btn, a.btn, button.btn, .btn-primary{
  background:var(--primary) !important;
  border-color:var(--primary) !important;
  color:#fff !important;
}
.btn:hover, a.btn:hover, button.btn:hover, .btn-primary:hover{
  background:var(--primary-600) !important;
  border-color:var(--primary-600) !important;
}

/* Secondary & Danger a bordeaux (visualmente distintos do primário) */
.btn.btn-secondary, a.btn.btn-secondary, button.btn.btn-secondary{
  background:var(--danger) !important; color:#fff !important; border-color:var(--danger) !important;
}
.btn.btn-secondary:hover{ background:var(--danger-700) !important; border-color:var(--danger-700) !important; }

.btn-danger, a.btn-danger, button.btn-danger, .btn.btn-danger{
  background:var(--danger) !important; border-color:var(--danger) !important; color:#fff !important;
}
.btn-danger:hover{ background:var(--danger-700) !important; border-color:var(--danger-700) !important; }

/* Inputs coerentes */
.content form input[type=text],
.content form input[type=email],
.content form input[type=password],
.content form input[type=number],
.content form select,
.content form textarea{
  appearance:none;-webkit-appearance:none;
  width:min(520px,90%);
  padding:10px 12px;
  border:1px solid #d1d5db;
  border-radius:12px;
  font-size:16px; line-height:1.35;
  transition:border-color .15s ease, box-shadow .15s ease;
  background:#fff;
}
.content form input:focus,
.content form select:focus,
.content form textarea:focus{
  outline:0; border-color:var(--primary);
  box-shadow:0 0 0 4px var(--ring);
}

/* Tabelas (listagens) */
.table-wrapper{overflow:auto}
.table-wrapper table{width:100%;border-collapse:separate;border-spacing:0;min-width:900px}
.table-wrapper th,.table-wrapper td{padding:10px 12px;border-bottom:1px solid #e5e7eb;vertical-align:middle;white-space:nowrap}
.table-wrapper thead th{position:sticky;top:0;background:#f9fafb;color:#111827;font-weight:600;border-bottom:1px solid #d1d5db}
.table-wrapper tbody tr:nth-child(even){background:#fafafa}
/* ===================================================================== */

/* ===== Roles: switch "Selecionar tudo" + input do nome (escopo seguro) ===== */
.content .perm-group{ position:relative; }
.content .perm-group .select-all{
  position:absolute; right:14px; top:12px;
  display:flex; align-items:center; gap:10px;
  font-weight:600; color:#6b7280; user-select:none;
}

/* Switch bonito (só no select-all de Roles) */
.content .perm-group .select-all input[type=checkbox]{
  appearance:none; -webkit-appearance:none;
  width:38px; height:22px; border-radius:999px;
  background:#e5e7eb; border:1px solid #d1d5db;
  position:relative; cursor:pointer; outline:0;
  transition:background .15s ease, border-color .15s ease;
}
.content .perm-group .select-all input[type=checkbox]::after{
  content:""; position:absolute; top:2px; left:2px;
  width:18px; height:18px; border-radius:50%;
  background:#fff; box-shadow:0 1px 2px rgba(16,24,40,.2);
  transition:transform .15s ease;
}
.content .perm-group .select-all input[type=checkbox]:checked{
  background:var(--primary); border-color:var(--primary);
}
.content .perm-group .select-all input[type=checkbox]:checked::after{
  transform:translateX(16px);
}
.content .perm-group .select-all input[type=checkbox]:focus-visible{
  box-shadow:0 0 0 4px var(--ring);
}

/* Campo "Nome do perfil" mais moderno (altura + focus ring) */
.content input[name="name"]{
  width:min(520px,100%);
  height:44px;
  padding:10px 12px;
  border:1px solid #d1d5db; border-radius:12px;
  background:#fff; font-size:16px; line-height:1.35;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.content input[name="name"]:focus{
  outline:0; border-color:var(--primary);
  box-shadow:0 0 0 4px var(--ring);
}

/* ===== Login/Auth – retoques de tema (sem tocar noutro lado) ===== */
:root{
  --bg:#f6f7f9;
  --primary:#050337;
  --primary-600:#04022C;
  --ring:rgba(5,3,55,.18);
}
.auth-card input[type=email],
.auth-card input[type=password]{
  appearance:none; -webkit-appearance:none;
  width:100%; padding:12px 14px;
  border:1px solid #e5e7eb; border-radius:10px;
  font-size:15px; background:#fff;
  transition:border-color .15s, box-shadow .15s;
}
.auth-card input[type=email]:focus,
.auth-card input[type=password]:focus{
  outline:0; border-color:var(--primary);
  box-shadow:0 0 0 4px var(--ring);
}
.auth-btn{
  width:100%; padding:12px 14px; border:0; border-radius:10px;
  background:var(--primary); color:#fff; cursor:pointer; font-weight:600;
}
.auth-btn:hover{ filter:brightness(.96) }

/* Sidebar (sem bullets + item ativo) */
.side .nav ul { list-style: none !important; margin: 0; padding: 0; }
.side .nav li { list-style: none !important; margin: 4px 0; }
.side .nav a {
  display: block;
  padding: 10px 14px;
  border-radius: 12px;
  color: #e8ecff;
  text-decoration: none;
  opacity: .9;
  transition: background .15s ease, opacity .15s ease, color .15s ease;
}
.side .nav a:hover { background: rgba(255,255,255,.09); opacity: 1; }
.side .nav a.is-active {
  background: #fff;
  color: #0b1a55;
  font-weight: 700;
}

/* Sidebar: cor do item ativo */
.side .nav a.is-active { 
  color: #050337 !important;
}

/* Sidebar: não perder destaque no hover do item ativo */
.side .nav a.is-active,
.side .nav a.is-active:hover {
  background: #fff !important;
  color: #050337 !important;
  opacity: 1 !important;
}