/* Cakes a Laser - painel admin. Depende de tokens.css.
   Sidebar fixa no desktop (≥992px) e offcanvas no mobile (offcanvas-lg). */

body.admin { background: #f4f6f8; }

.admin-wrap { display: flex; min-height: 100vh; }
.admin-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.admin-conteudo { padding: 1.25rem; }
@media (min-width: 992px) { .admin-conteudo { padding: 1.5rem 2rem; } }

/* ── Sidebar ─────────────────────────────────────────────── */
.admin-sidebar {
  background: linear-gradient(180deg, var(--cal-azul) 0%, #163a47 100%);
  color: #e9eef1;
  width: 256px;
  border: none;
}
/* no desktop, o offcanvas-lg vira bloco normal - fixa a largura e a altura */
@media (min-width: 992px) {
  .admin-sidebar { flex: 0 0 256px; position: sticky; top: 0; height: 100vh; }
}
.admin-sidebar-inner { padding: 1.1rem .9rem; overflow-y: auto; }

/* Marca (logo + nome) */
.admin-marca {
  display: flex; align-items: center; gap: .65rem;
  color: #fff; font-weight: 800; font-size: 1.05rem; letter-spacing: -.01em;
  text-decoration: none; padding: .25rem .35rem;
}
.admin-marca:hover { color: #fff; opacity: .9; }
.admin-marca img {
  width: 42px; height: 42px; border-radius: 12px; object-fit: cover;
  box-shadow: 0 4px 12px rgba(0,0,0,.3); background: #fff; flex: none;
}

.admin-sidebar-rotulo {
  font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
  color: rgba(233,238,241,.45); margin: 1.25rem .5rem .5rem;
}

/* Itens do menu */
.admin-sidebar .nav-link {
  display: flex; align-items: center; gap: .7rem;
  color: #cdd9df; border-radius: .6rem; padding: .55rem .75rem;
  font-weight: 600; font-size: .92rem; position: relative;
  transition: background .12s, color .12s;
}
.admin-sidebar .nav-link i { width: 1.15rem; text-align: center; font-size: .95rem; opacity: .85; }
.admin-sidebar .nav-link:hover { background: rgba(255,255,255,.08); color: #fff; }
.admin-sidebar .nav-link.active {
  background: rgba(242,107,33,.18); color: #fff;
}
.admin-sidebar .nav-link.active::before {
  content: ""; position: absolute; left: -.9rem; top: 20%; bottom: 20%;
  width: 4px; border-radius: 0 4px 4px 0; background: var(--cal-laranja);
}
.admin-sidebar .nav-link.active i { color: var(--cal-laranja); opacity: 1; }
.admin-nav-extra { font-size: .7rem; opacity: .5; }

/* Usuário (rodapé da sidebar) */
.admin-usuario {
  display: flex; align-items: center; gap: .6rem;
  background: rgba(255,255,255,.07); border-radius: .8rem;
  padding: .6rem .7rem; margin-top: .75rem;
}
.admin-usuario-nome { font-weight: 700; font-size: .88rem; color: #fff; }
.admin-usuario-cargo { font-size: .72rem; color: rgba(233,238,241,.55); }
.admin-sair { color: rgba(233,238,241,.7); padding: .3rem .45rem; border-radius: .5rem; }
.admin-sair:hover { color: #fff; background: rgba(214,69,69,.35); }

.admin-avatar {
  width: 36px; height: 36px; flex: none; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--cal-laranja); color: #fff; font-weight: 800; font-size: .95rem;
}
.admin-avatar-sm { width: 28px; height: 28px; font-size: .8rem; }

/* ── Topbar ──────────────────────────────────────────────── */
.admin-topbar {
  display: flex; align-items: center; gap: .85rem;
  background: #fff; border-bottom: 1px solid rgba(0,0,0,.06);
  padding: .7rem 1.25rem; position: sticky; top: 0; z-index: 1010;
}
@media (min-width: 992px) { .admin-topbar { padding: .7rem 2rem; } }
.admin-titulo { font-size: 1.05rem; font-weight: 800; color: var(--cal-azul); margin: 0; flex-grow: 1; }
.admin-hamburger {
  border: 1px solid rgba(0,0,0,.12); background: #fff; color: var(--cal-azul);
  width: 38px; height: 38px; border-radius: 10px; flex: none;
}
.admin-hamburger:hover { background: var(--cal-creme); }
.admin-topbar-usuario {
  display: inline-flex; align-items: center; gap: .5rem;
  color: var(--cal-cinza); font-size: .85rem; font-weight: 600;
}

/* ── Dashboard ───────────────────────────────────────────── */
.dash-ico {
  width: 40px; height: 40px; border-radius: 12px; margin-bottom: .55rem;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff; font-size: 1rem;
}
.dash-ico.bg-laranja    { background: var(--cal-laranja); }
.dash-ico.bg-sucesso    { background: var(--cal-sucesso); }
.dash-ico.bg-azul       { background: var(--cal-azul); }
.dash-ico.bg-azul-claro { background: var(--cal-azul-claro); }
.dash-rank {
  width: 26px; height: 26px; flex: none; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(242,107,33,.12); color: var(--cal-laranja); font-weight: 800; font-size: .85rem;
}

/* Abas das páginas de configuração */
.config-tabs { display: flex; gap: .4rem; flex-wrap: wrap; margin-bottom: 1rem; }
.config-tabs a {
  padding: .45rem .9rem; border-radius: 999px; font-weight: 600; font-size: .88rem;
  color: var(--cal-cinza); background: #fff; border: 1px solid rgba(0,0,0,.08);
}
.config-tabs a:hover { color: var(--cal-azul); }
.config-tabs a.ativa { background: var(--cal-laranja); border-color: var(--cal-laranja); color: #fff; }

/* Editor de horários */
.hor-dia { border: 1px solid rgba(0,0,0,.08); border-radius: 12px; padding: .8rem 1rem; margin-bottom: .6rem; background: #fff; }
.hor-dia-nome { font-weight: 700; color: var(--cal-azul); min-width: 110px; }
.hor-turno { display: flex; align-items: center; gap: .4rem; }
.hor-badge-24 { font-size: .75rem; }

/* ── Componentes gerais do admin ─────────────────────────── */
.admin .card { border-radius: 14px; }
.admin .table > :not(caption) > * > * { padding: .7rem .75rem; }
.admin .btn-primary { font-weight: 600; }

/* Tela de login */
.login-wrap {
  min-height: 100vh;
  display: grid; place-items: center;
  background:
    radial-gradient(1200px 500px at 10% -10%, rgba(242,107,33,.35), transparent 60%),
    radial-gradient(1000px 500px at 110% 110%, rgba(61,169,224,.3), transparent 60%),
    linear-gradient(160deg, var(--cal-azul) 0%, #12303b 100%);
}
.login-card { max-width: 400px; width: 100%; border-radius: 18px; }
.login-logo {
  width: 76px; height: 76px; border-radius: 18px; object-fit: cover;
  box-shadow: 0 10px 30px rgba(0,0,0,.25); background: #fff;
}

/* Ver/esconder senha: mensagem de erro dentro de input-group precisa de d-block.
   O .invalid-feedback num input-group não é irmão imediato do .is-invalid, então
   o Bootstrap não o exibe sozinho — forçamos a exibição quando o grupo tem erro. */
.input-group:has(.is-invalid) .invalid-feedback { display: block; }
/* Mantém a mensagem ocupando a linha inteira abaixo do grupo. */
.input-group .invalid-feedback { width: 100%; flex-basis: 100%; }
/* Botão do olho alinhado à direita do campo. */
.btn-ver-senha { border-top-right-radius: var(--bs-border-radius); border-bottom-right-radius: var(--bs-border-radius); }