/* AgendaOn administration: visual layer over the existing forms and behavior. */
.admin-page,
.admin-login-page {
  --color-primary: #4f46e5;
  --color-primary-hover: #3730a3;
  --color-secondary: #5551a8;
  --color-bg: #f8f9ff;
  --color-surface: #fff;
  --color-text: #17233b;
  --color-text-muted: #56657c;
  --color-border: #cbd5e1;
  --color-border-soft: #e2e8f0;
  --color-focus: #4f46e5;
  --color-success: #047857;
  --color-success-bg: #ecfdf5;
  --color-warning: #92400e;
  --color-warning-bg: #fffbeb;
  --color-error: #be123c;
  --color-error-bg: #fff1f2;
  --font-display: 'Plus Jakarta Sans', 'Segoe UI', ui-sans-serif, system-ui, sans-serif;
  --font-body: Inter, 'Segoe UI', ui-sans-serif, system-ui, sans-serif;
  --text-xs: .8125rem;
  --text-sm: .875rem;
  --space-xs: .5rem;
  --space-sm: 1rem;
  --space-md: 1.5rem;
  --space-lg: 2.5rem;
  --radius-md: 10px;
  --radius-lg: 14px;
  background: var(--color-bg);
  color: var(--color-text);
}
html:has(.admin-page.admin-menu-open), html:has(.admin-page .admin-drawer[open]) { overflow: hidden; }

.admin-page h1, .admin-page h2, .admin-page h3,
.admin-login-page h1, .admin-login-page h2 { letter-spacing: -.035em; }
.admin-page .btn, .admin-login-page .btn { min-height: 42px; font-size: .875rem; }
.admin-page .btn--sm { min-height: 40px; }
.admin-page .btn--outline { border-color: #d4dce8; color: #273449; box-shadow: 0 1px 2px rgba(15,23,42,.04); }
.admin-page .btn--outline:hover { background: #f5f7fc; border-color: #aab8cc; }
.admin-page :focus-visible, .admin-login-page :focus-visible { outline-color: var(--color-focus); outline-offset: 2px; }

/* Login: the existing credential form sits beside a branded introduction. */
.admin-login { display: grid; grid-template-columns: minmax(0, 49%) minmax(0, 51%); min-height: 100dvh; }
.admin-login__brand { position: relative; overflow: hidden; color: #fff; background: radial-gradient(circle at 90% 85%, #263b76 0, transparent 37%), linear-gradient(145deg, #0c1938, #06122d 70%); }
.admin-login__brand::after { content: ''; position: absolute; width: 25rem; height: 25rem; right: -12rem; bottom: -12rem; border: 1px solid rgba(255,255,255,.10); border-radius: 50%; box-shadow: 0 0 0 5rem rgba(255,255,255,.025), 0 0 0 10rem rgba(255,255,255,.018); pointer-events: none; }
.admin-login__brand-inner { position: relative; z-index: 1; display: flex; flex-direction: column; min-height: 100%; max-width: 48rem; margin: auto; padding: clamp(2rem, 5vw, 5rem); }
.admin-login__logo, .admin-login__mobile-logo { display: inline-flex; align-items: center; gap: .75rem; font: 700 1.5rem/1 var(--font-display); letter-spacing: -.04em; }
.admin-login__logo img, .admin-login__mobile-logo img { object-fit: contain; flex: none; }
.admin-login__intro { margin: auto 0; max-width: 35rem; padding-block: 4rem; }
.admin-login__eyebrow { display: block; margin-bottom: 1rem; color: #aaa8ff; font: 700 .7rem/1.4 var(--font-body); letter-spacing: .14em; }
.admin-login__intro h2 { margin: 0 0 1.25rem; color: #fff; font-size: clamp(2.5rem, 4.2vw, 4.5rem); line-height: 1.08; }
.admin-login__intro p { max-width: 31rem; margin: 0; color: #d0d9ed; font-size: 1.0625rem; line-height: 1.65; }
.admin-login__brand-footer { margin: 0; color: #aab8d3; font-size: .8125rem; }
.admin-login__main { display: grid; place-items: center; padding: 3rem clamp(1.5rem, 6vw, 6rem); background: #fff; }
.admin-login__card { width: min(100%, 27rem); }
.admin-login__card > .admin-login__eyebrow { color: #4f46e5; }
.admin-login__card h1 { margin: 0 0 .6rem; font-size: clamp(1.75rem, 2.2vw, 2.2rem); }
.admin-login__card > p { margin: 0 0 2rem; color: var(--color-text-muted); font-size: .9375rem; }
.admin-login__card .form-field + .form-field { margin-top: 1.2rem; }
.admin-login__card .form-field label { margin-bottom: .15rem; font-weight: 600; }
.admin-login__card .form-field input { min-height: 50px; border-color: #cbd5e1; font-size: .9375rem; }
.admin-login__card .form-field input:focus { border-color: #4f46e5; outline: 2px solid #4f46e5; outline-offset: 1px; }
.admin-login__card form > .btn { width: 100%; min-height: 50px; margin-top: 1.75rem; }
.admin-login__card .alert { margin-bottom: 1.25rem; }
.admin-login__mobile-logo { display: none; }

/* Shell and navigation. All existing destinations remain in place. */
.admin-sidebar { width: 260px; overflow: hidden; padding: 1.25rem .85rem; background: #0c1938; color: #d4dded; border-right: 1px solid rgba(255,255,255,.06); }
.admin-brand { margin: 0 .5rem 1.4rem; padding: .3rem .35rem; }
.admin-brand__lockup { gap: .65rem; }
.admin-brand__lockup strong { font-size: 1.35rem; letter-spacing: -.04em; }
.admin-organization { min-width: 0; display: flex; align-items: center; gap: .7rem; margin: 0 .5rem 1.3rem; padding: .7rem; border: 1px solid rgba(255,255,255,.11); border-radius: 11px; background: rgba(255,255,255,.055); }
.admin-organization__avatar { flex: none; display: grid; place-items: center; width: 2.2rem; height: 2.2rem; border-radius: 9px; background: #4f46e5; color: #fff; font-size: .9rem; font-weight: 700; }
.admin-organization > span:last-child { min-width: 0; display: grid; gap: .1rem; }
.admin-organization small { color: #9faecb; font-size: .625rem; font-weight: 700; letter-spacing: .1em; }
.admin-organization strong { overflow: hidden; color: #fff; font-size: .8125rem; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.admin-nav { min-height: 0; flex: 1; align-content: start; gap: .12rem; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #526287 transparent; }
.admin-nav__group { padding: 1rem .8rem .4rem; color: #8ea1c2; font-size: .625rem; font-weight: 700; letter-spacing: .12em; }
.admin-nav a { display: flex; align-items: center; gap: .8rem; min-height: 40px; padding: .55rem .8rem; color: #bfcee3; border-radius: 8px; font-size: .8375rem; font-weight: 500; }
.admin-nav a:hover { color: #fff; background: rgba(255,255,255,.075); }
.admin-nav a.is-active { color: #fff; background: #373c87; box-shadow: inset 3px 0 0 #a9a4ff; font-weight: 650; }
.admin-nav__icon { width: 17px; height: 17px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.admin-sidebar__footer { flex: none; align-items: center; margin: .75rem .5rem 0; padding: .7rem .35rem .2rem; border-top: 1px solid rgba(255,255,255,.12); }
.admin-sidebar__footer > span { overflow-wrap: anywhere; font-size: .8125rem; color: #fff; }
.admin-sidebar__footer button { color: #bfcee3; font-size: .75rem; text-align: right; }
.admin-sidebar__footer button:hover { color: #fff; text-decoration: underline; }
.admin-mobile-header { min-height: 64px; padding: .65rem 1rem; background: #0c1938; }
.admin-menu-button { display: inline-flex; align-items: center; gap: .5rem; min-height: 42px; padding: .4rem .75rem; border: 1px solid #647393; border-radius: 9px; background: transparent; color: #fff; font: 600 .875rem var(--font-body); }
.admin-menu-button span:first-child { font-size: 1.25rem; line-height: 1; }
.admin-menu-button:hover { background: rgba(255,255,255,.1); }
.admin-content { padding: 1.5rem; }
.admin-content__header { margin: -1.5rem -1.5rem 1.5rem; padding: 1.4rem 1.5rem; border-bottom: 1px solid #e2e8f0; background: #fff; }
.admin-content__header .section__supertitle { margin: 0 0 .3rem; color: #64748b; font-size: .6875rem; }
.admin-content__header h1 { font-size: clamp(1.5rem, 2.5vw, 1.9rem); }
.admin-content__header .btn { white-space: nowrap; }
.admin-page .panel, .admin-page .metric-card, .admin-page .table-wrap { border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; box-shadow: 0 1px 3px rgba(15,23,42,.045); }
.admin-page .table-wrap { position: relative; }
.admin-page .panel { padding: 1.35rem; }
.admin-page .metric-card strong { color: #252f60; font-size: 1.8rem; font-variant-numeric: tabular-nums; }
.admin-page .metric-card span { font-size: .8rem; }

/* Lists, controls and status. */
.admin-page .list-toolbar { padding: .9rem 1rem; border: 1px solid #e2e8f0; border-radius: 12px; background: #fff; box-shadow: 0 1px 3px rgba(15,23,42,.035); }
.admin-page .list-toolbar .filter-bar { gap: .7rem; }
.admin-page .list-toolbar .filter-bar label { color: #475569; font-size: .8125rem; font-weight: 600; }
.admin-page .form-field label, .admin-page .form-label { color: #334155; font-size: .8125rem; font-weight: 600; }
.admin-page .form-field input, .admin-page .form-field select, .admin-page .form-field textarea,
.admin-page .filter-bar input, .admin-page .filter-bar select, .admin-page .admin-table input, .admin-page .admin-table select { min-height: 43px; border-color: #cbd5e1; border-radius: 9px; font-size: .875rem; }
.admin-page .form-field input:focus, .admin-page .form-field select:focus, .admin-page .form-field textarea:focus { border-color: #4f46e5; outline: 2px solid #4f46e5; outline-offset: 1px; }
.admin-page .admin-table { font-size: .8375rem; }
.admin-page .admin-table th { height: 44px; padding: .7rem 1rem; border-color: #edf1f6; background: #f8fafc; color: #5d6a80; font-size: .6875rem; font-weight: 700; letter-spacing: .065em; text-transform: uppercase; vertical-align: middle; }
.admin-page .admin-table td { padding: .82rem 1rem; border-color: #edf1f6; vertical-align: middle; }
.admin-page .admin-table tbody tr:hover { background: #fafbff; }
.admin-page .admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-page .admin-table a { color: #4338ca; }
.admin-page .services-list__header h2 { font-size: 1.15rem; }
.admin-page .services-list__count { background: #eef0ff; color: #4338ca; font-weight: 600; }
.admin-page .services-table__description { color: #64748b; }
.admin-page .services-table-scroll-hint { display: none; margin: 0 0 .5rem; color: #64748b; font-size: .8125rem; }
.admin-page .status-badge { padding: .25rem .65rem; font-size: .72rem; font-weight: 650; }
.admin-page .status-badge--warning { background: #fffbeb; color: #92400e; }
.admin-page .status-badge--error { background: #fff1f2; color: #be123c; }
.admin-page .row-actions__trigger { width: 36px; height: 36px; border-color: #d9e1eb; border-radius: 8px; color: #475569; box-shadow: none; }
.admin-page .row-actions__trigger:hover, .admin-page .row-actions__trigger[aria-expanded="true"] { background: #f0f1ff; border-color: #a5a0ec; color: #3730a3; }
.admin-page .row-actions__menu { border-color: #dce3ed; border-radius: 10px; box-shadow: 0 14px 28px rgba(15,23,42,.13); }
.admin-page .row-actions__menu a:hover, .admin-page .row-actions__menu button:hover { background: #f4f5ff; }
.admin-page .settings-tabs a { border-color: #dce3ed; border-radius: 9px; font-size: .8125rem; font-weight: 600; }
.admin-page .settings-tabs a.is-active { background: #4f46e5; border-color: #4f46e5; }

/* Existing drawers and confirmation dialogs retain their keyboard and closing behavior. */
.admin-page:has(.admin-drawer[open]) { overflow: hidden; }
.admin-page .admin-drawer { width: min(100%, 42rem); border-radius: 16px 0 0 16px; box-shadow: -24px 0 65px rgba(12,25,56,.22); }
.admin-page .admin-drawer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.admin-page .admin-drawer::backdrop, .admin-page .admin-confirm::backdrop { background: rgba(12,25,56,.48); }
.admin-page .admin-drawer__header { min-height: 76px; padding: 1.1rem 1.6rem; border-color: #e2e8f0; background: #fff; }
.admin-page .admin-drawer__header h2 { font-size: 1.3rem; }
.admin-page .admin-drawer__close { width: 40px; height: 40px; border-color: #dce3ed; border-radius: 9px; color: #475569; }
.admin-page .admin-drawer__form { height: auto; min-height: 0; padding: 1.5rem 1.6rem 0; scrollbar-gutter: stable; }
.admin-page #booking-drawer .booking-slots { margin: 1rem 0 1.25rem; padding: 1rem; border: 1px solid #dce3ed; border-radius: 12px; background: #f8faff; }
.admin-page #booking-drawer .booking-slots h3 { margin: 0 0 .45rem; font-size: 1rem; color: #172b49; }
.admin-page #booking-drawer .booking-slots .loading-text { margin: 0 0 .65rem; }
.admin-page #booking-drawer .booking-slots .slot-grid:empty { display: none; }
.admin-page #booking-drawer .booking-slots a { font-weight: 600; }
.admin-page .booking-detail-drawer__body { padding-bottom: 1.75rem; }
.admin-page .booking-detail-section + .booking-detail-section { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #e2e8f0; }
.admin-page .booking-detail-section h3 { margin: 0 0 1rem; color: #17233b; font-size: 1rem; }
.admin-page .booking-detail-section .summary-list { gap: .55rem; }
.admin-page .booking-detail-section .summary-row { align-items: baseline; gap: 1rem; padding-bottom: .55rem; font-size: .875rem; }
.admin-page .booking-detail-section .summary-row span:first-child { flex: 0 0 34%; }
.admin-page .booking-detail-series { margin: 0; padding-left: 1.25rem; }
.admin-page .booking-detail-series li + li { margin-top: .4rem; }
.admin-page .booking-detail-series-list { margin: 1rem 0; }
.admin-page .booking-detail-series-list summary { cursor: pointer; color: #1e3a8a; font-weight: 600; }
.admin-page .booking-detail-series-list .booking-detail-series { max-height: 15rem; overflow: auto; margin-top: .75rem; }
.admin-page .booking-detail-series-edit-panel { margin-top: 1.5rem; }
.admin-page .booking-detail-series-edit-panel > summary { cursor: pointer; color: #17233b; font-weight: 650; }
.admin-page .booking-detail-series-edit-panel > .booking-detail-series-edit { margin-top: 1rem; }
.admin-page .booking-detail-section h4 { margin: 1.5rem 0 .75rem; color: #17233b; font-size: .94rem; }
.admin-page .booking-detail-series-edit .form-grid { margin-bottom: 1rem; }
.admin-page .booking-detail-series-edit .provider-services { margin: 1rem 0; }
.admin-page .booking-detail-reschedule { margin-top: 1.5rem; padding-top: 1.5rem; border-top: 1px solid #e2e8f0; }
.admin-page .booking-detail-reschedule .slot-grid { margin: .75rem 0 1rem; }
.admin-page .admin-drawer__form .form-actions { position: sticky; bottom: 0; z-index: 2; justify-content: flex-end; margin: 1.5rem -1.6rem 0; padding: 1rem 1.6rem; border-top: 1px solid #e2e8f0; background: #fff; box-shadow: 0 -8px 20px rgba(15,23,42,.035); }
.admin-page #holiday-drawer .form-actions { position: static; justify-content: flex-start; margin: .75rem 0; padding: 0; border: 0; box-shadow: none; }
.admin-page #holiday-drawer .provider-services { max-height: 45vh; overflow-y: auto; }
.admin-page .admin-confirm { border-color: #dce3ed; border-radius: 14px; }
.admin-page .admin-confirm__icon { background: #eef0ff; color: #4338ca; }
.admin-page .admin-confirm--danger .admin-confirm__icon { background: #fff1f2; color: #be123c; }

.admin-page .admin-drawer[open] { animation: admin-drawer-enter 280ms cubic-bezier(.2,.8,.2,1) both; }
.admin-page .admin-drawer[open]::backdrop { animation: admin-backdrop-enter 280ms ease-out both; }
.admin-page .admin-drawer[open].is-closing { animation: admin-drawer-exit 220ms ease-in both; }
.admin-page .admin-drawer[open].is-closing::backdrop { animation: admin-backdrop-exit 220ms ease-in both; }
.admin-page .admin-confirm[open] { animation: admin-confirm-enter 220ms cubic-bezier(.2,.8,.2,1) both; }
.admin-page .admin-confirm[open]::backdrop { animation: admin-backdrop-enter 220ms ease-out both; }
.admin-page .admin-confirm[open].is-closing { animation: admin-confirm-exit 180ms ease-in both; }
.admin-page .admin-confirm[open].is-closing::backdrop { animation: admin-backdrop-exit 180ms ease-in both; }

@keyframes admin-drawer-enter { from { opacity: .7; transform: translateX(2rem); } to { opacity: 1; transform: translateX(0); } }
@keyframes admin-drawer-exit { from { opacity: 1; transform: translateX(0); } to { opacity: .7; transform: translateX(2rem); } }
@keyframes admin-confirm-enter { from { opacity: 0; transform: translateY(.5rem) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes admin-confirm-exit { from { opacity: 1; transform: translateY(0) scale(1); } to { opacity: 0; transform: translateY(.4rem) scale(.98); } }
@keyframes admin-backdrop-enter { from { background: rgba(12,25,56,0); } to { background: rgba(12,25,56,.48); } }
@keyframes admin-backdrop-exit { from { background: rgba(12,25,56,.48); } to { background: rgba(12,25,56,0); } }

@media (prefers-reduced-motion: reduce) {
  .admin-page .admin-drawer[open], .admin-page .admin-drawer[open]::backdrop,
  .admin-page .admin-confirm[open], .admin-page .admin-confirm[open]::backdrop { animation: none; }
}

@media (min-width: 900px) {
  .admin-page .admin-content { margin-left: 260px; padding: 1.75rem 2rem 3rem; }
  .admin-page .admin-content__header { margin: -1.75rem -2rem 1.75rem; padding: 1.5rem 2rem; }
}
@media (max-width: 899px) {
  .admin-page.admin-menu-open::before { background: rgba(12,25,56,.55); }
  .admin-page .admin-sidebar { width: min(280px, calc(100vw - 3rem)); box-shadow: 16px 0 40px rgba(12,25,56,.18); }
}
@media (min-width: 721px) and (max-width: 1400px) {
  .admin-page .services-table-scroll-hint { display: block; }
  .admin-page .services-table th:last-child,
  .admin-page .services-table td:last-child { position: sticky; right: 0; z-index: 1; background: #fff; box-shadow: -1px 0 0 #e2e8f0, -10px 0 16px -14px rgba(15,23,42,.35); }
  .admin-page .services-table th:last-child { z-index: 2; background: #f8fafc; }
}
@media (max-width: 720px) {
  .admin-login { display: block; min-height: 100dvh; }
  .admin-login__brand { display: none; }
  .admin-login__main { min-height: 100dvh; align-items: center; padding: 2rem 1.25rem; }
  .admin-login__mobile-logo { display: inline-flex; margin-bottom: 3.5rem; color: #0c1938; }
  .admin-page .admin-content { padding: 1rem; }
  .admin-page .admin-content__header { margin: -1rem -1rem 1.25rem; padding: 1.15rem 1rem; align-items: flex-start; }
  .admin-page .admin-content__header h1 { font-size: 1.45rem; }
  .admin-page .admin-content__header .btn { font-size: .75rem; }
  .admin-page .admin-table--cards tbody tr, .admin-page .services-table tbody tr { border-color: #e2e8f0; box-shadow: 0 1px 3px rgba(15,23,42,.04); }
  .admin-page .admin-table--cards tbody tr:hover, .admin-page .services-table tbody tr:hover { background: #fff; }
  .admin-page .admin-table--cards td, .admin-page .services-table td { border-color: #edf1f6; }
  .admin-page .list-toolbar { align-items: stretch; }
  .admin-page .admin-drawer { border-radius: 0; }
  .admin-page .admin-drawer__header { min-height: 68px; padding: 1rem; }
  .admin-page .admin-drawer__form { padding: 1rem 1rem 0; }
  .admin-page .admin-drawer__form .form-actions { margin-inline: -1rem; padding: 1rem; }
}
@media (max-width: 440px) {
  .admin-page .admin-content__header { flex-wrap: wrap; }
  .admin-page .admin-content__header .btn { width: 100%; }
  .admin-page .admin-drawer__form .form-actions .btn { flex: 1; }
}