/* ============================================================
   New Booking – Warm stone Anthropic override
   Clean, typography-led, generous whitespace.
   ============================================================ */

/* ---- Page header ---- */
.nb-page-title {
    font-size: 1.5rem;
    font-weight: 700;
    color: #1c1917;
    letter-spacing: -0.025em;
}
.nb-page-subtitle {
    color: #78716c;
    font-size: 0.875rem;
}

/* ---- Form card: no box, just content ---- */
.nb-form-card {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
}

/* ---- Sections ---- */
.nb-section {
    margin-bottom: 2rem;
    padding-bottom: 0;
    border-bottom: none;
}
.nb-section:last-of-type {
    margin-bottom: 1.25rem;
}

/* ---- Section headers: simple text, no icons ---- */
.nb-section-header {
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: -0.01em;
    color: #1c1917;
    border-bottom: 1px solid #e7e5e4;
    padding-bottom: 0.625rem;
    margin-bottom: 1.25rem;
}

/* ---- Labels: sentence case, quieter ---- */
.nb-label {
    font-size: 0.8125rem;
    font-weight: 500;
    color: #57534e;
    text-transform: none;
    letter-spacing: 0;
    margin-bottom: 0.375rem;
}
.nb-required { color: #dc2626; }

/* ---- Inputs: white bg, subtle border, warm focus ---- */
.nb-input {
    height: 42px;
    background: #fff;
    border: 1px solid #d6d3d1;
    border-radius: 8px;
    font-size: 0.875rem;
    color: #1c1917;
}
.nb-input:focus {
    border-color: #1c1917 !important;
    box-shadow: 0 0 0 2.5px rgba(28, 25, 23, 0.08) !important;
    background: #fff !important;
}
.nb-input::placeholder {
    color: #a8a29e;
}

/* ---- Select dropdown ---- */
.nb-select {
    color: #1c1917;
}

/* ---- Grid spacing ---- */
.nb-grid-2 {
    gap: 1rem;
    margin-bottom: 1rem;
}

/* ---- Submit row ---- */
.nb-submit-row {
    padding-top: 1.5rem;
    border-top: 1px solid #e7e5e4;
    margin-top: 0.5rem;
}
.nb-submit-btn,
.nb-submit-btn.btn-primary {
    background: #1c1917 !important;
    color: #fff !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.875rem;
    height: 42px;
    padding: 0 1.5rem;
}
.nb-submit-btn:hover,
.nb-submit-btn.btn-primary:hover {
    background: #292524 !important;
}

/* ---- Cancel button ---- */
.nb-submit-row .btn-secondary {
    background: transparent;
    border: 1px solid #d6d3d1;
    color: #57534e;
    border-radius: 10px;
    font-weight: 500;
    font-size: 0.875rem;
    height: 42px;
}
.nb-submit-row .btn-secondary:hover {
    background: #faf8f5;
    border-color: #a8a29e;
}

/* ---- Preview card ---- */
.nb-preview-card {
    background: transparent !important;
    box-shadow: none !important;
    border: none !important;
}
.nb-preview-header {
    font-size: 0.6875rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: #a8a29e;
    margin-bottom: 0.75rem;
    border-bottom: none !important;
}

/* ---- Google Calendar event card ---- */
.nb-gcal-event {
    border: 1px solid #e7e5e4;
    box-shadow: 0 1px 3px rgba(0,0,0,0.04);
    border-radius: 10px;
}
.nb-gcal-stripe {
    background: #1c1917 !important;
}
.nb-gcal-title { color: #1c1917; }
.nb-gcal-time,
.nb-gcal-location { color: #57534e; }
.nb-gcal-time i,
.nb-gcal-location i { color: #a8a29e !important; }
.nb-gcal-details { border-top-color: #f2efe9; }
.nb-gcal-detail-label { color: #a8a29e; }
.nb-gcal-detail-value { color: #1c1917; }
.nb-gcal-footer {
    color: #a8a29e;
    border-top-color: #e7e5e4;
}

/* ---- Timeline ---- */
.nb-timeline-wrap {
    background: #faf8f5 !important;
    border: 1px solid #e7e5e4 !important;
    border-radius: 10px;
}
.nb-timeline-title { color: #1c1917 !important; }
.nb-timeline-title i { color: #57534e !important; }
.nb-timeline-date-label { color: #a8a29e !important; }

.nb-tl-block {
    background: linear-gradient(135deg, #1c1917 0%, #44403c 100%) !important;
    box-shadow: 0 1px 4px rgba(0,0,0,0.12) !important;
}
.nb-tl-list-item { border-left-color: #1c1917 !important; }
.nb-tl-list-time { color: #1c1917 !important; }
.nb-tl-list-job { color: #1c1917 !important; }
.nb-tl-list-name { color: #78716c !important; }

.nb-tl-badge-busy { background: #f5f5f4 !important; color: #1c1917 !important; }
.nb-tl-badge-empty { background: #f5f5f4 !important; color: #78716c !important; }
.nb-tl-legend-booked { background: #1c1917 !important; }

/* ---- Places autocomplete ---- */
.pac-matched { color: #1c1917 !important; }
.pac-item:hover { background: #faf8f5 !important; }

/* ---- Confirmation screen ---- */
.nb-confirmation {
    background: #fff !important;
    box-shadow: none !important;
    border: 1px solid #e7e5e4 !important;
    border-radius: 12px !important;
}
.nb-conf-title { color: #1c1917 !important; }
.nb-conf-subtitle { color: #78716c !important; }
.nb-conf-details {
    background: #faf8f5 !important;
    border-color: #e7e5e4 !important;
}
.nb-conf-actions .btn-primary {
    background: #1c1917 !important;
    color: #fff !important;
    border: none !important;
}
.nb-conf-actions .btn-primary:hover {
    background: #292524 !important;
}

/* ---- Calendar overrides within new-booking page ---- */
.new-booking-page .cal-fixed-cell.today {
    border-color: #1c1917 !important;
    background: #faf8f5 !important;
}
.new-booking-page .cal-day-number.is-today {
    background: #1c1917 !important;
}
.new-booking-page .cal-chip-time {
    color: #1c1917 !important;
}
.new-booking-page .cal-booking-chip:hover {
    background: #faf8f5 !important;
}
.new-booking-page .calendar-booking-item {
    border-left-color: #1c1917 !important;
}
.new-booking-page .calendar-booking-item:hover {
    background: #f5f5f5 !important;
    box-shadow: 0 2px 6px rgba(0,0,0,0.08) !important;
}
.new-booking-page .booking-list-item:hover {
    border-color: #111 !important;
}

/* ============================================================
   New Booking – Dark Mode overrides
   ============================================================ */

/* Page header */
[data-theme="dark-mode"] .nb-page-title { color: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-page-subtitle { color: #a8a29e !important; }

/* Form card */
[data-theme="dark-mode"] .nb-form-card {
    background: transparent !important;
}

/* Section headers */
[data-theme="dark-mode"] .nb-section-header {
    color: #faf8f5 !important;
    border-bottom-color: #44403c !important;
}

/* Labels */
[data-theme="dark-mode"] .nb-label {
    color: #a8a29e !important;
}

/* Inputs */
[data-theme="dark-mode"] .nb-input {
    background: #292524 !important;
    border-color: #44403c !important;
    color: #e7e5e4 !important;
}
[data-theme="dark-mode"] .nb-input:focus {
    border-color: #78716c !important;
    box-shadow: 0 0 0 2.5px rgba(255,255,255,0.06) !important;
    background: #292524 !important;
}
[data-theme="dark-mode"] .nb-input::placeholder {
    color: #78716c !important;
}

/* Select */
[data-theme="dark-mode"] .nb-select {
    background: #292524 !important;
    border-color: #44403c !important;
    color: #e7e5e4 !important;
}

/* Textarea (Notes) */
[data-theme="dark-mode"] .nb-form-card textarea,
[data-theme="dark-mode"] .nb-form-card textarea.nb-input {
    background: #292524 !important;
    border-color: #44403c !important;
    color: #e7e5e4 !important;
}

/* Submit row */
[data-theme="dark-mode"] .nb-submit-row {
    border-top-color: #44403c !important;
}
[data-theme="dark-mode"] .nb-submit-btn,
[data-theme="dark-mode"] .nb-submit-btn.btn-primary {
    background: #faf8f5 !important;
    color: #1c1917 !important;
}
[data-theme="dark-mode"] .nb-submit-btn:hover,
[data-theme="dark-mode"] .nb-submit-btn.btn-primary:hover {
    background: #e7e5e4 !important;
}
[data-theme="dark-mode"] .nb-submit-row .btn-secondary {
    background: transparent !important;
    border-color: #44403c !important;
    color: #a8a29e !important;
}
[data-theme="dark-mode"] .nb-submit-row .btn-secondary:hover {
    background: #292524 !important;
    border-color: #57534e !important;
}

/* Preview card */
[data-theme="dark-mode"] .nb-preview-card {
    background: transparent !important;
}
[data-theme="dark-mode"] .nb-preview-header {
    color: #78716c !important;
}

/* Google Calendar event card */
[data-theme="dark-mode"] .nb-gcal-event {
    background: #292524 !important;
    border-color: #44403c !important;
}
[data-theme="dark-mode"] .nb-gcal-stripe {
    background: #faf8f5 !important;
}
[data-theme="dark-mode"] .nb-gcal-title { color: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-gcal-time,
[data-theme="dark-mode"] .nb-gcal-location { color: #a8a29e !important; }
[data-theme="dark-mode"] .nb-gcal-time i,
[data-theme="dark-mode"] .nb-gcal-location i { color: #78716c !important; }
[data-theme="dark-mode"] .nb-gcal-details { border-top-color: #44403c !important; }
[data-theme="dark-mode"] .nb-gcal-detail-label { color: #78716c !important; }
[data-theme="dark-mode"] .nb-gcal-detail-value { color: #d6d3d1 !important; }
[data-theme="dark-mode"] .nb-gcal-footer {
    color: #78716c !important;
    border-top-color: #44403c !important;
}

/* Timeline */
[data-theme="dark-mode"] .nb-timeline-wrap {
    background: #292524 !important;
    border-color: #44403c !important;
}
[data-theme="dark-mode"] .nb-timeline-title { color: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-timeline-title i { color: #a8a29e !important; }
[data-theme="dark-mode"] .nb-timeline-date-label { color: #78716c !important; }
[data-theme="dark-mode"] .nb-tl-block {
    background: linear-gradient(135deg, #faf8f5 0%, #a8a29e 100%) !important;
}
[data-theme="dark-mode"] .nb-tl-list-item { border-left-color: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-tl-list-time { color: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-tl-list-job { color: #e7e5e4 !important; }
[data-theme="dark-mode"] .nb-tl-list-name { color: #a8a29e !important; }
[data-theme="dark-mode"] .nb-tl-badge-busy { background: #44403c !important; color: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-tl-badge-empty { background: #44403c !important; color: #a8a29e !important; }
[data-theme="dark-mode"] .nb-tl-legend-booked { background: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-tl-hint { color: #78716c !important; }

/* Timeline hour labels */
[data-theme="dark-mode"] .nb-tl-hour { color: #78716c !important; }
[data-theme="dark-mode"] .nb-tl-hour.is-now { color: #faf8f5 !important; }

/* Timeline grid cells */
[data-theme="dark-mode"] .nb-tl-cell {
    border-color: #44403c !important;
}
[data-theme="dark-mode"] .nb-tl-cell:hover {
    background: rgba(255,255,255,0.04) !important;
}
[data-theme="dark-mode"] .nb-tl-bar {
    background: #1c1917 !important;
    border-color: #44403c !important;
    box-shadow: inset 0 1px 4px rgba(0,0,0,0.2) !important;
}
[data-theme="dark-mode"] .nb-tl-gridline {
    background: #44403c !important;
}

/* Timeline legend text */
[data-theme="dark-mode"] .nb-tl-legend { color: #78716c !important; }
[data-theme="dark-mode"] .nb-tl-legend-new { background: #16a34a !important; }
[data-theme="dark-mode"] .nb-tl-legend-free { background: #44403c !important; }

/* Confirmation screen */
[data-theme="dark-mode"] .nb-confirmation {
    background: #292524 !important;
    border-color: #44403c !important;
}
[data-theme="dark-mode"] .nb-conf-title { color: #faf8f5 !important; }
[data-theme="dark-mode"] .nb-conf-subtitle { color: #a8a29e !important; }
[data-theme="dark-mode"] .nb-conf-details {
    background: #1c1917 !important;
    border-color: #44403c !important;
}
[data-theme="dark-mode"] .nb-conf-actions .btn-primary {
    background: #faf8f5 !important;
    color: #1c1917 !important;
}
[data-theme="dark-mode"] .nb-conf-actions .btn-primary:hover {
    background: #e7e5e4 !important;
}

/* Places autocomplete */
[data-theme="dark-mode"] .pac-container {
    background: #292524 !important;
    border-color: #44403c !important;
}
[data-theme="dark-mode"] .pac-item {
    color: #e7e5e4 !important;
    border-top-color: #44403c !important;
}
[data-theme="dark-mode"] .pac-item:hover {
    background: #1c1917 !important;
}
[data-theme="dark-mode"] .pac-matched {
    color: #faf8f5 !important;
}

/* Phone validation error */
[data-theme="dark-mode"] .nb-phone-error { color: #f87171 !important; }