:root{
  --primary: #000000;
  --secondary: #111111;
  --gold: #d4af37;
}
body { -webkit-font-smoothing: antialiased; background:#000; color:#fff; }
.banner{ height:180px; background-size:cover; background-position:center; }
.service-item{ transition: background-color .2s; }
.service-item:hover{ background-color: #111; }
.card{ background:#111; color:#fff; border-color:#333; }
.list-group-item{ background:#111; color:#fff; border-color:#333; }
.modal-content{ background:#111; color:#fff; border-color:#333; }
.modal-header, .modal-footer{ border-color: rgba(255,255,255,.12); }
.form-control, .form-select{ background:#0d0d0d; color:#fff; border-color:#333; }
.form-control, .form-select{ color-scheme: dark; }
.form-control::placeholder{ color:#bbb; }
.btn-outline-success{ color:var(--secondary); border-color:var(--secondary); }
.btn-outline-success:hover{ background:var(--secondary); color:#000; }
.btn-outline-primary{ color:var(--primary); border-color:var(--primary); }
.btn-outline-primary:hover{ background:var(--primary); color:#fff; }
.navbar-dark .navbar-brand, .navbar-dark .nav-link{ color:#fff; }
.app-topbar a{ color:#fff; }
.app-topbar .btn-outline-light{ border-color: var(--gold); color: var(--gold); padding:.45rem .65rem; border-width:2px; }
/* Home carousel sizing */
.home-carousel .carousel-item img{ width:100%; height:300px; object-fit: cover; }
/* Avoid bottom nav overlap */
@media (max-width: 576px){
  body{ padding-bottom: 60px; }
  h2{ font-size:1.4rem; }
  .banner{ height:120px; }
  .home-carousel .carousel-item img{ height:160px; }
}

/* Topbar circular logo */
.topbar-logo{
  width:120px !important; height:120px !important; border-radius:50%;
  object-fit:cover; display:inline-block; aspect-ratio:1/1;
  border:2px solid #fff; box-shadow:0 2px 8px rgba(255,255,255,.12);
}

/* Smaller location text under logo */
.app-topbar .small-location{ font-size:.75rem; color:#ccc; }

/* Offcanvas (sidebar) dark styling */
.offcanvas.text-bg-dark{ background:#000; }
.offcanvas.text-bg-dark .offcanvas-header{ border-bottom:1px solid rgba(255,255,255,.1); }
.offcanvas.text-bg-dark a{ color:#fff; }
.offcanvas.text-bg-dark a:hover{ color:#ddd; }

/* Menu styling: black background, golden icons, barber font */
.offcanvas.text-bg-dark .menu-link{ color:#fff; font-family: var(--font-heading); display:flex; align-items:center; gap:.5rem; }
.offcanvas.text-bg-dark .menu-link .menu-icon{ color: var(--gold); }
.offcanvas.text-bg-dark .menu-link:hover{ color:#fff; text-decoration:none; }

/* Util: texto dourado */
.text-gold{ color: var(--gold) !important; }

/* Footer mobile nav: golden icons and barber font */
.mobile-bottom-nav .footer-link{ font-family: var(--font-heading); }
.mobile-bottom-nav .footer-icon{ color: var(--gold); font-size:1.2rem; line-height:1; }
.mobile-bottom-nav .footer-text{ font-size:.8rem; }
.mobile-bottom-nav a:hover .footer-icon{ filter: brightness(1.1); }

/* Barber style: fonts and animated cards */
:root{ --font-heading: 'Oswald', sans-serif; --font-body: 'Barlow', system-ui, -apple-system, Segoe UI, Roboto, sans-serif; }
body{ font-family: var(--font-body); }
.section-title{ font-family: var(--font-heading); letter-spacing:.5px; text-transform: uppercase; }
.barber-title{ font-family: var(--font-heading); letter-spacing:.5px; text-transform: uppercase; }
.barber-card{ border:2px solid var(--secondary); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; box-shadow:0 6px 14px rgba(0,0,0,.08); }
.barber-card:hover{ transform: translateY(-4px); box-shadow:0 10px 24px rgba(0,0,0,.16); }
.barber-card .card-footer{ border-top:2px solid var(--secondary); }
@keyframes fadeUp{ from{ opacity:0; transform: translateY(10px) scale(.98); } to{ opacity:1; transform: translateY(0) scale(1); } }
.animate-card{ opacity:0; transform: translateY(10px) scale(.98); }
.animate-card.in-view{ animation: fadeUp .45s ease-out forwards; }

/* Carrossel de profissionais */
.barber-carousel{ -webkit-overflow-scrolling: touch; }
.barber-avatar{ width:56px; height:56px; background:#222; border:2px solid var(--gold); color:#fff; object-fit:cover; }
.barber-item{ min-width:72px; cursor:pointer; }
.barber-item.active .barber-avatar{ border-color:#fff; box-shadow:0 0 0 2px var(--gold); }

/* Calendário mensal */
.calendar-grid{ display:grid; grid-template-columns: repeat(7, 1fr); gap:.5rem; }
.calendar-cell{ background:#222; color:#eee; border:1px solid rgba(255,255,255,.1); padding:.5rem; border-radius:.5rem; }
.calendar-cell.empty{ visibility:hidden; }
.calendar-cell.today{ border-color: var(--gold); }
.calendar-cell.selected{ background:#0f5132; border-color:#198754; }

/* Avatar nos cards de confirmação */
.confirm-avatar{ width:32px; height:32px; border-radius:50%; object-fit:cover; border:1px solid var(--gold); background:#1b1b1b; color:#fff; }
/* Grade de agenda (admin dia) */
.slot-cell{ min-height:42px; cursor:pointer; background:#121212; }
.slot-cell .slot-hint{ color:#888; font-size:.8rem; }
.slot-cell .slot-label{ font-size:.82rem; }
.slot-free{ background:#198754; color:#fff; }
.slot-occupied{ background: #6c757d; color:#fff; }
.slot-blocked{ background: #dc3545; color:#fff; }
.slot-out{ background:#2a2a2a; color:#999; }
.slot-out{ pointer-events: none; }
/* Continuidade visual para combos (2+ slots) */
.slot-continued{ opacity:.85; border-top:0; }
/* Filtro: esconder não livres */
#adminDayGrid.hide-non-free td.slot-cell:not(.slot-free){ display:none; }
#adminWeekGrid.hide-non-free td.slot-cell:not(.slot-free){ display:none; }
/* Ajuste de altura variável via CSS var */
:root{ --slot-height: 44px; }
.slot-cell{ min-height: var(--slot-height, 42px); }

/* Espaçamento entre colunas de profissionais (admin dia e semana) */
#adminDayGrid{ border-collapse: separate; border-spacing: 6px 0; }
#adminWeekGrid{ border-collapse: separate; border-spacing: 6px 0; }

/* Linhas por horário com borda fina e contraste sutil */
#adminDayGrid tbody tr, #adminWeekGrid tbody tr{ border-top: 1px solid rgba(255,255,255,0.15); }
#adminDayGrid thead th, #adminWeekGrid thead th{ border-color: rgba(255,255,255,0.2); }
#adminDayGrid td.slot-cell, #adminWeekGrid td.slot-cell{ border: 1px solid rgba(255,255,255,0.12); }
#adminDayGrid td.slot-cell, #adminWeekGrid td.slot-cell{ position: relative; z-index: 0; }
#adminDayGrid tbody tr:nth-child(odd), #adminWeekGrid tbody tr:nth-child(odd){ background-color: rgba(255,255,255,0.02); }
#adminDayGrid td.slot-cell:hover, #adminWeekGrid td.slot-cell:hover{ outline: 1px solid rgba(255,255,255,0.18); }
/* Cores de status preenchendo célula inteira (maior especificidade) */
#adminDayGrid td.slot-cell.slot-free, #adminWeekGrid td.slot-cell.slot-free{ background:#198754 !important; color:#fff !important; }
#adminDayGrid td.slot-cell.slot-occupied, #adminWeekGrid td.slot-cell.slot-occupied{ background:#6c757d !important; color:#fff !important; }
#adminDayGrid td.slot-cell.slot-blocked, #adminWeekGrid td.slot-cell.slot-blocked{ background:#dc3545 !important; color:#fff !important; }
#adminDayGrid td.slot-cell.slot-out, #adminWeekGrid td.slot-cell.slot-out{ background:#2a2a2a !important; color:#999 !important; }
.slot-occupied .slot-label, .slot-blocked .slot-label, .slot-free .slot-label{ color:#fff; font-weight:600; }

/* Ajuste visual para inputs de horário em tema escuro */
input[type="time"].form-control{ background:#111; color:#fff; }
input[type="time"].form-control::-webkit-datetime-edit,
input[type="time"].form-control::-webkit-datetime-edit-fields-wrapper,
input[type="time"].form-control::-webkit-datetime-edit-hour-field,
input[type="time"].form-control::-webkit-datetime-edit-minute-field,
input[type="time"].form-control::-webkit-datetime-edit-ampm-field{ color:#fff; }
input[type="time"].form-control::-webkit-calendar-picker-indicator{ filter: invert(1); }

/* Menu de contexto nas células */
.slot-context-menu{ position:fixed; z-index:1055; background:#1a1a1a; color:#eee; border:1px solid #333; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.35); display:none; min-width:200px; overflow:hidden; }
.slot-context-menu .item{ padding:10px 12px; cursor:pointer; white-space:nowrap; }
.slot-context-menu .item:hover{ background:#2a2a2a; }
.slot-context-menu .item.danger:hover{ background:#3b1f1f; }

/* Layout admin: topbar fixo e sidebar fixa em lg+ */
:root{ --navbar-height: 64px; --admin-toolbar-height: 52px; --admin-sidebar-width: 280px; }
@media (min-width: 992px){
  body{ padding-top: var(--navbar-height); }
}
.admin-toolbar{ background:#000; color:#fff; border-bottom:1px solid rgba(255,255,255,.1); }
@media (min-width: 992px){
  .admin-toolbar{ position: sticky; top: var(--navbar-height); z-index: 1030; }
}
.admin-sidebar{ background:#000; color:#fff; border-right:1px solid rgba(255,255,255,.1); }
@media (min-width: 992px){
  /* Sem sidebar fixa: não aplicar margem lateral */
  main.container{ max-width: 100% !important; }
}
.admin-sidebar .sidebar-section{ padding:12px 14px; }
.admin-sidebar .sidebar-title{ font-weight:600; color:#ddd; margin-bottom:8px; }
.admin-sidebar .form-label{ color:#bbb; }
.admin-sidebar .small-help{ color:#888; }