/* AloraHazel C22.5 Visual Skin
   Targets real C22.5 SaaS shell / nav / page-map / utility classes
*/

:root {
  --ah-bg: #fff8f7;
  --ah-bg-soft: #fffdfc;
  --ah-surface: #ffffff;
  --ah-surface-soft: rgba(255, 255, 255, 0.82);
  --ah-border: #efdde1;
  --ah-border-strong: #d9ab9d;
  --ah-text: #3f2d2a;
  --ah-text-soft: #77645d;
  --ah-muted: #8b7168;
  --ah-accent: #9f675b;
  --ah-accent-soft: #f7e3dc;
  --ah-accent-soft-2: #f8e5de;
  --ah-radius-lg: 28px;
  --ah-radius-md: 22px;
  --ah-radius-sm: 18px;
  --ah-shadow: 0 10px 28px rgba(74, 51, 49, 0.05);
  --ah-shadow-soft: 0 8px 24px rgba(74, 51, 49, 0.03);
  --ah-serif: Georgia, "Times New Roman", serif;
  --ah-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ------------------------------------------------------------------
   Top-level shells
------------------------------------------------------------------ */
.abp-c195-auto-portal-shell,
.abp-c196-smart-shell,
.abp-c197-smart-day-shell,
.abp-c198-live-day-shell,
.abp-c200-customer-journey-shell,
.abp-c203-mobile-shell,
.abp-c204-dispatch-shell,
.abp-c205-route-shell,
.abp-c206-command-shell,
.abp-c207-mobile-shell,
.abp-c207-unified-shell,
.abp-c208-booking-shell,
.abp-c209-shell,
.abp-c210-assist-shell,
.abp-c211-health-shell,
.abp-c212-smart-dispatch-shell,
.abp-c213-escalation-shell,
.abp-c214-optimization-shell,
.abp-c220-network-shell,
.abp-c221-franchise-shell,
.abp-c222-regional-shell,
.abp-c223-enterprise-shell,
.abp-c224-owner-shell,
.abp-c225-final-shell,
.abp-portal-shell,
.abp-booking-shell,
.abp-calendar-shell,
.abp-success-shell,
.abp10-auth-shell,
.abp11-shell,
.abp4-beta-shell,
.abp4-builder-shell,
.abp4-drag-shell,
.abp4-ds-shell,
.abp4-lane-shell,
.abp4-timegrid-super-shell,
.abpbb-shell {
  background:
    radial-gradient(circle at top left, rgba(242, 206, 216, 0.18), transparent 28%),
    linear-gradient(180deg, var(--ah-bg-soft) 0%, var(--ah-bg) 100%);
  border: 1px solid var(--ah-border);
  border-radius: 32px;
  box-shadow: var(--ah-shadow);
  color: var(--ah-text);
  font-family: var(--ah-sans);
}

/* ------------------------------------------------------------------
   Navigation / header / page-map
------------------------------------------------------------------ */
.abp-c225-nav,
.abp-c225-nav-grid,
.abp-c207-mobile-nav,
.abp-cal-nav,
.abp-booking-stepnav,
.abp-step-nav,
.abp4-beta-navbtn,
.abp4-lane-navbtn,
.abp-c225-page-map,
.abp-c207-saas-header {
  color: var(--ah-text);
  font-family: var(--ah-sans);
}

.abp-c225-nav,
.abp-c225-page-map,
.abp-c194-utility-bar,
.abp-c195-auto-utility-wrap,
.abp-c207-saas-header {
  background: var(--ah-surface-soft);
  border: 1px solid var(--ah-border);
  border-radius: var(--ah-radius-lg);
  box-shadow: var(--ah-shadow-soft);
  backdrop-filter: blur(10px);
}

.abp-c225-nav a,
.abp-c225-nav button,
.abp-c225-page-map a,
.abp-c225-page-map button,
.abp-c207-mobile-nav a,
.abp-c207-mobile-nav button,
.abp-booking-stepnav button,
.abp-step-nav button,
.abp-cal-nav button {
  border-radius: 999px;
  color: var(--ah-text-soft);
  transition: all 160ms ease;
}

.abp-c225-nav a:hover,
.abp-c225-nav button:hover,
.abp-c225-page-map a:hover,
.abp-c225-page-map button:hover,
.abp-c207-mobile-nav a:hover,
.abp-c207-mobile-nav button:hover,
.abp-booking-stepnav button:hover,
.abp-step-nav button:hover,
.abp-cal-nav button:hover,
.abp4-beta-navbtn:hover,
.abp4-lane-navbtn:hover {
  background: var(--ah-accent-soft-2);
  color: var(--ah-text);
}

.abp-c207-saas-header,
.abp-c225-nav,
.abp-c225-page-map {
  padding: 18px;
}

.abp-c207-saas-header h1,
.abp-c207-saas-header h2,
.abp-c225-final-shell h1,
.abp-c225-final-shell h2,
.abp-c195-auto-portal-shell h1,
.abp-c196-smart-shell h1,
.abp-c207-unified-shell h1,
.abp-c208-booking-shell h1,
.abp-c224-owner-shell h1 {
  font-family: var(--ah-serif);
  color: var(--ah-text);
  letter-spacing: -0.03em;
}

/* ------------------------------------------------------------------
   Cards / modules / panels
------------------------------------------------------------------ */
.abp-portal-card,
.abp-booking-card,
.abp-booking-panel,
.abp-c162-task,
.abp-c197-task,
.abp-c197-task-grid > *,
.abp-c193-portal-clock,
.abp-c194-utility-bar > *,
.abp-c195-auto-utility-wrap > *,
.abp-c121-portal,
.abp-c121-portal-stats > *,
.abp-c123-live-card,
.abp-c124-card,
.abp-c1241-card,
.abp-c126-card,
.abp-c127-card,
.abp-c13-card,
.abp-c13-front-card,
.abp-c121-card,
.abp-c122-card,
.abp-c123-card,
.abp-c1241-selector-card,
.abp-c1241-side-note,
.abp-c126-performance-widget,
.abp-c127-rank-row,
.abp-c204-dispatch-shell > *,
.abp-c206-command-shell > *,
.abp-c214-optimization-shell > *,
.abp-c220-network-shell > *,
.abp-c223-enterprise-shell > *,
.abp-c224-owner-shell > *,
.abp-c225-page-map > * {
  background: var(--ah-surface);
  border: 1px solid var(--ah-border);
  border-radius: var(--ah-radius-md);
  box-shadow: var(--ah-shadow-soft);
  color: var(--ah-text);
}

.abp-c121-portal-hero,
.abp-c1215-portal-hero,
.abp-c122-hero,
.abp-c123-hero,
.abp-c124-hero,
.abp-c1241-hero,
.abp-c126-hero,
.abp-c127-hero,
.abp-c13-hero,
.abp-c188-shell-hero {
  background:
    radial-gradient(circle at top left, rgba(242, 206, 216, 0.32), transparent 30%),
    linear-gradient(180deg, #fff9f8 0%, #fff4f6 100%);
  border: 1px solid var(--ah-border);
  border-radius: 32px;
  box-shadow: var(--ah-shadow);
  color: var(--ah-text);
}

.abp-c121-portal-hero h1,
.abp-c1215-portal-hero h1,
.abp-c122-hero h1,
.abp-c123-hero h1,
.abp-c124-hero h1,
.abp-c1241-hero h1,
.abp-c126-hero h1,
.abp-c127-hero h1,
.abp-c13-hero h1,
.abp-c188-shell-hero h1 {
  font-family: var(--ah-serif);
  color: var(--ah-text);
}

.abp-c121-pill,
.abp-c123-pill,
.abp-c124-status,
.abp-c1241-employee-pill,
.abp-c13-meta,
.abp-c13-inline {
  display: inline-flex;
  align-items: center;
  min-height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  background: var(--ah-accent-soft);
  border: 1px solid var(--ah-border);
  color: var(--ah-accent);
}

/* ------------------------------------------------------------------
   Buttons / CTAs
------------------------------------------------------------------ */
.abp-booking-btn,
.abp-booking-btn-secondary,
.abp-c12-btn-primary,
.abp-c12-btn-soft,
.abp-c121-primary,
.abp-c122-primary,
.abp-c123-primary,
.abp-c1241-primary,
.abp-c126-btn,
.abp-c127-primary,
.abp-c13-outline-btn,
.abp-c13-soft-btn,
.abp-c13-submit,
.abp-c123-submit {
  min-height: 46px;
  padding: 0 18px;
  border-radius: 999px;
  font-family: var(--ah-sans);
  transition: all 160ms ease;
}

.abp-booking-btn,
.abp-c12-btn-primary,
.abp-c121-primary,
.abp-c122-primary,
.abp-c123-primary,
.abp-c1241-primary,
.abp-c126-btn,
.abp-c127-primary,
.abp-c123-submit,
.abp-c13-submit {
  background: linear-gradient(180deg, #5d4340 0%, #473230 100%);
  color: #fffaf9;
  border: 1px solid rgba(93, 67, 64, 0.35);
  box-shadow: 0 14px 24px rgba(74, 51, 49, 0.12);
}

.abp-booking-btn-secondary,
.abp-c12-btn-soft,
.abp-c13-outline-btn,
.abp-c13-soft-btn {
  background: var(--ah-accent-soft);
  color: var(--ah-accent);
  border: 1px solid var(--ah-border);
}

.abp-booking-btn:hover,
.abp-booking-btn-secondary:hover,
.abp-c12-btn-primary:hover,
.abp-c12-btn-soft:hover,
.abp-c121-primary:hover,
.abp-c122-primary:hover,
.abp-c123-primary:hover,
.abp-c1241-primary:hover,
.abp-c126-btn:hover,
.abp-c127-primary:hover,
.abp-c13-outline-btn:hover,
.abp-c13-soft-btn:hover,
.abp-c13-submit:hover,
.abp-c123-submit:hover {
  transform: translateY(-1px);
}

/* ------------------------------------------------------------------
   Forms / fields / notices
------------------------------------------------------------------ */
.abp-auth-field,
.abp-booking-field,
.abp-c12-field,
.abp-c13-form-grid input,
.abp-c13-form-grid select,
.abp-c13-form-grid textarea,
.abp-c123-employee-form input,
.abp-c123-employee-form select,
.abp-c123-employee-form textarea,
.abp-c1241-form input,
.abp-c1241-form select,
.abp-c1241-form textarea {
  min-height: 48px;
  border: 1px solid var(--ah-border);
  border-radius: 16px;
  background: #fff;
  color: var(--ah-text);
}

.abp-auth-notice,
.abp-c12-notice,
.abp-c121-notice,
.abp-c122-notice,
.abp-c123-notice,
.abp-c124-note,
.abp-c124-success,
.abp-c125-front-notice,
.abp-c127-notice,
.abp-c13-notice,
.abp-access-denied {
  border-radius: 18px;
  border: 1px solid var(--ah-border);
  background: #fff8f9;
  color: var(--ah-text);
}

/* ------------------------------------------------------------------
   Booking shell specifics
------------------------------------------------------------------ */
.abp-booking-wrap,
.abp-booking-main,
.abp-booking-sidebar,
.abp-booking-sidefooter,
.abp-booking-top,
.abp-booking-body {
  color: var(--ah-text);
}

.abp-booking-sidebar {
  background: rgba(255,255,255,0.72);
  border: 1px solid var(--ah-border);
  border-radius: var(--ah-radius-lg);
}

.abp-booking-brand {
  font-family: var(--ah-serif);
  color: var(--ah-text);
}

/* ------------------------------------------------------------------
   Mobile shells
------------------------------------------------------------------ */
.abp-c203-mobile-shell,
.abp-c207-mobile-shell,
.abp-c207-mobile-nav,
.abp-c207-saas-header {
  border-radius: 24px;
}

/* ------------------------------------------------------------------
   General typography smoothing for plugin UI
------------------------------------------------------------------ */
[class*="abp-"],
[class*="abp_"],
[class*="alora-"],
[class*="alora_"] {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

[class*="abp-"] h1,
[class*="abp-"] h2,
[class*="abp-"] h3,
[class*="abp_"] h1,
[class*="abp_"] h2,
[class*="abp_"] h3 {
  color: var(--ah-text);
}

/* ------------------------------------------------------------------
   Responsive
------------------------------------------------------------------ */
@media (max-width: 1024px) {
  .abp-c225-nav-grid,
  .abp-booking-grid,
  .abp-auth-grid,
  .abp-c12-grid-2,
  .abp-c12-grid-3,
  .abp-c121-grid,
  .abp-c122-grid-small,
  .abp-c123-grid,
  .abp-c1241-bottom-grid,
  .abp-c126-grid,
  .abp-c127-grid,
  .abp-c13-grid-main {
    grid-template-columns: 1fr !important;
  }
}

@media (max-width: 768px) {
  .abp-c225-nav,
  .abp-c225-page-map,
  .abp-c207-saas-header,
  .abp-c194-utility-bar {
    padding: 14px;
  }

  .abp-c121-portal-hero,
  .abp-c1215-portal-hero,
  .abp-c122-hero,
  .abp-c123-hero,
  .abp-c124-hero,
  .abp-c1241-hero,
  .abp-c126-hero,
  .abp-c127-hero,
  .abp-c13-hero,
  .abp-c188-shell-hero {
    border-radius: 24px;
  }
}