/**
 * ElitePulse Booking - Canvas Layout v5.0
 * 对标 Calendly/LatePoint - 画布式无边界布局
 */

/* ========================================
   1️⃣ CSS 变量系统
   ======================================== */

:root,
[data-theme="elite-blue"] {
    --primary: #D4AF37;
    --primary-hover: #B8860B;
    --primary-light: rgba(212, 175, 55, 0.08);
    --bg-body: #f5f5f7;
    /* Apple Style Light Gray */
    --surface: #ffffff;
    --text-main: #1d1d1f;
    /* Apple Style Black */
    --text-secondary: #86868b;
    --ep-canvas-bg: #f8f5ee;
    --ep-canvas-accent: rgba(212, 175, 55, 0.12);
    --ep-calendar-shell-bg: linear-gradient(180deg, rgba(255,250,242,0.92), rgba(255,255,255,0.88));
    --ep-calendar-shell-border: rgba(212, 175, 55, 0.18);
    --ep-calendar-shell-shadow: 0 18px 42px rgba(143, 110, 41, 0.08);
    --ep-calendar-card-bg: linear-gradient(180deg, rgba(255,255,255,0.99), rgba(253,249,240,0.97));
    --ep-calendar-card-border: rgba(226, 201, 143, 0.86);
    --ep-calendar-card-shadow: 0 28px 58px rgba(143, 110, 41, 0.12);
    --ep-calendar-heading: #8a6d3b;
    --ep-calendar-subtle: #a28d63;
    --ep-calendar-nav-bg: rgba(255,251,243,0.96);
    --ep-calendar-nav-border: rgba(226, 201, 143, 0.84);
    --ep-calendar-nav-color: #b38728;
    --ep-calendar-nav-hover-bg: rgba(212, 175, 55, 0.12);
    --ep-calendar-nav-hover-border: rgba(212, 175, 55, 0.3);
    --ep-calendar-nav-hover-color: #8a6d3b;
    --ep-delivery-active-bg: linear-gradient(180deg, rgba(255,253,247,0.98), rgba(249,240,219,0.95));
    --ep-delivery-active-border: rgba(212, 175, 55, 0.46);
    --ep-delivery-active-shadow: 0 18px 36px rgba(184, 151, 126, 0.14);
    --ep-slot-panel-bg: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(253,248,238,0.96));
    --ep-slot-panel-border: rgba(226, 201, 143, 0.72);
    --ep-slot-panel-shadow: 0 22px 42px rgba(143, 110, 41, 0.1);
    --ep-slot-bg: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(253,249,242,0.96));
    --ep-slot-border: rgba(226, 201, 143, 0.76);
    --ep-slot-shadow: 0 10px 24px rgba(184, 151, 126, 0.1);
    --ep-slot-text: #8a6d3b;
    --ep-slot-selected-bg: linear-gradient(180deg, #fff9ec 0%, #f7edd2 100%);
    --ep-slot-selected-border: rgba(197, 160, 89, 0.88);
    --ep-slot-selected-text: #7d6430;
    --ep-slot-selected-shadow: 0 20px 38px rgba(197, 160, 89, 0.18);
    --ep-description-fade: linear-gradient(to bottom, rgba(248,245,238,0), rgba(248,245,238,0.96) 72%);
    --ep-sidebar-card-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(248,250,252,0.94));
    --ep-sidebar-card-border: rgba(226, 232, 240, 0.95);
    --ep-sidebar-card-shadow: 0 18px 38px rgba(15, 23, 42, 0.06);
    --ep-sidebar-soft-bg: linear-gradient(180deg, rgba(248,250,252,0.95), rgba(255,255,255,0.96));
    --ep-sidebar-strong-bg: linear-gradient(180deg, #fffdf8 0%, #f7f1e3 100%);
    --ep-sidebar-strong-border: rgba(212,175,55,0.28);
    --ep-sidebar-strong-shadow: 0 10px 24px rgba(15,23,42,0.06), inset 0 1px 0 rgba(255,255,255,0.88);
    --ep-sidebar-accent-gradient: linear-gradient(180deg, #d4af37 0%, #b8977e 100%);
    --ep-sidebar-title: #1e293b;
    --ep-sidebar-muted: #64748b;
    --ep-sidebar-body: #374151;
    --ep-sidebar-pill-bg: rgba(212, 175, 55, 0.12);
    --ep-sidebar-pill-color: #8a6700;
    --ep-confirm-card-bg: linear-gradient(145deg, #0f172a 0%, #1a2744 100%);
    --ep-confirm-card-border-strong: rgba(251, 191, 36, 0.45);
    --ep-confirm-card-border-soft: rgba(251, 191, 36, 0.1);
    --ep-confirm-card-border-bottom: rgba(255, 255, 255, 0.05);
    --ep-confirm-card-shadow: 0 16px 40px rgba(15, 23, 42, 0.45), 0 1px 0 rgba(255, 255, 255, 0.05) inset, 0 -1px 0 rgba(251, 191, 36, 0.08) inset;
    --ep-confirm-card-text: #ffffff;
    --ep-confirm-card-body: rgba(255, 255, 255, 0.88);
    --ep-confirm-card-muted: rgba(255, 255, 255, 0.68);
    --ep-confirm-card-pill-bg: rgba(251, 191, 36, 0.12);
    --ep-confirm-card-pill-color: #fcd34d;
    --ep-confirm-card-inner-bg: rgba(15, 23, 42, 0.55);
    --ep-sidebar-profile-bg: transparent;
    --ep-sidebar-profile-border: transparent;
    --ep-sidebar-profile-shadow: none;
    --ep-sidebar-profile-radius: 0;
    --ep-sidebar-bio-bg: var(--ep-sidebar-soft-bg);
    --ep-sidebar-bio-border: rgba(226, 232, 240, 0.9);
    --ep-sidebar-bio-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
    --ep-sidebar-bio-radius: 14px;
    --ep-sidebar-description-bg: var(--ep-sidebar-card-bg);
    --ep-sidebar-description-border: var(--ep-sidebar-card-border);
    --ep-sidebar-description-shadow: var(--ep-sidebar-card-shadow);
    --ep-sidebar-description-radius: 16px;
    --ep-sidebar-title-bg: transparent;
    --ep-sidebar-title-border-width: 0;
    --ep-sidebar-title-border-color: transparent;
    --ep-sidebar-title-shadow: none;
    --ep-sidebar-title-padding: 0;
    --ep-sidebar-title-radius: 0;
    --ep-sidebar-duration-bg: transparent;
    --ep-sidebar-duration-border-width: 0;
    --ep-sidebar-duration-border-color: transparent;
    --ep-sidebar-duration-shadow: none;
    --ep-sidebar-duration-padding: 0;
    --ep-sidebar-duration-radius: 0;
    --ep-mobile-duration-bg: transparent;
    --ep-mobile-duration-border-width: 0;
    --ep-mobile-duration-border-color: transparent;
    --ep-mobile-duration-shadow: none;
    --ep-mobile-duration-padding: 0;
    --ep-mobile-duration-radius: 0;
}

[data-theme="midnight-black"] {
    --primary: #60a5fa;
    --primary-hover: #3b82f6;
    --primary-light: rgba(96, 165, 250, 0.15);
    --bg-body: #0f172a;
    --surface: #1e293b;
    --text-main: #f1f5f9;
    --text-secondary: #cbd5e1;
    --text-muted: #9ca3af;
    --border: #334155;
    --ep-canvas-bg: #08111f;
    --ep-canvas-accent: rgba(56, 189, 248, 0.16);
    --ep-calendar-shell-bg: linear-gradient(180deg, rgba(8,17,31,0.9), rgba(10,18,34,0.82));
    --ep-calendar-shell-border: rgba(56, 189, 248, 0.14);
    --ep-calendar-shell-shadow: 0 20px 48px rgba(2, 6, 23, 0.36);
    --ep-calendar-card-bg: linear-gradient(180deg, rgba(10,18,34,0.98), rgba(17,24,39,0.96));
    --ep-calendar-card-border: rgba(51, 65, 85, 0.92);
    --ep-calendar-card-shadow: 0 30px 64px rgba(2, 6, 23, 0.42);
    --ep-calendar-heading: #f8fbff;
    --ep-calendar-subtle: #93a6bf;
    --ep-calendar-nav-bg: rgba(15,23,42,0.82);
    --ep-calendar-nav-border: rgba(71, 85, 105, 0.86);
    --ep-calendar-nav-color: #c7d7eb;
    --ep-calendar-nav-hover-bg: rgba(37, 99, 235, 0.22);
    --ep-calendar-nav-hover-border: rgba(96, 165, 250, 0.28);
    --ep-calendar-nav-hover-color: #dbeafe;
    --ep-delivery-active-bg: linear-gradient(180deg, rgba(15,23,42,0.98), rgba(23,37,84,0.94));
    --ep-delivery-active-border: rgba(96, 165, 250, 0.48);
    --ep-delivery-active-shadow: 0 22px 42px rgba(8, 47, 73, 0.22);
    --ep-slot-panel-bg: linear-gradient(180deg, rgba(10,18,34,0.98), rgba(17,24,39,0.96));
    --ep-slot-panel-border: rgba(51, 65, 85, 0.92);
    --ep-slot-panel-shadow: 0 26px 48px rgba(2, 8, 23, 0.28);
    --ep-slot-bg: linear-gradient(180deg, rgba(15,23,42,0.98), rgba(17,24,39,0.94));
    --ep-slot-border: rgba(51, 65, 85, 0.92);
    --ep-slot-shadow: 0 12px 26px rgba(2, 8, 23, 0.22);
    --ep-slot-text: #e5eefc;
    --ep-slot-selected-bg: linear-gradient(180deg, rgba(14,35,67,0.98), rgba(20,53,112,0.92));
    --ep-slot-selected-border: rgba(96, 165, 250, 0.76);
    --ep-slot-selected-text: #f8fbff;
    --ep-slot-selected-shadow: 0 20px 40px rgba(37, 99, 235, 0.2);
    --ep-description-fade: linear-gradient(to bottom, rgba(8,17,31,0), rgba(8,17,31,0.96) 72%);
    --ep-sidebar-card-bg: linear-gradient(135deg, rgba(15,23,42,0.94), rgba(30,41,59,0.94));
    --ep-sidebar-card-border: rgba(71, 85, 105, 0.92);
    --ep-sidebar-card-shadow: 0 18px 38px rgba(2, 8, 23, 0.3);
    --ep-sidebar-soft-bg: linear-gradient(180deg, rgba(17,24,39,0.94), rgba(30,41,59,0.96));
    --ep-sidebar-strong-bg: linear-gradient(180deg, #111827 0%, #172554 100%);
    --ep-sidebar-strong-border: rgba(96,165,250,0.26);
    --ep-sidebar-strong-shadow: 0 14px 32px rgba(2,8,23,0.34), inset 0 1px 0 rgba(148,163,184,0.08);
    --ep-sidebar-accent-gradient: linear-gradient(180deg, #38bdf8 0%, #2563eb 100%);
    --ep-sidebar-title: #e2e8f0;
    --ep-sidebar-muted: #cbd5e1;
    --ep-sidebar-body: #dbe4f0;
    --ep-sidebar-pill-bg: rgba(96, 165, 250, 0.14);
    --ep-sidebar-pill-color: #bae6fd;
    --ep-confirm-card-bg: linear-gradient(145deg, #08111f 0%, #10213f 100%);
    --ep-confirm-card-border-strong: rgba(96, 165, 250, 0.42);
    --ep-confirm-card-border-soft: rgba(96, 165, 250, 0.12);
    --ep-confirm-card-border-bottom: rgba(148, 163, 184, 0.08);
    --ep-confirm-card-shadow: 0 18px 44px rgba(2, 8, 23, 0.5), 0 1px 0 rgba(148, 163, 184, 0.06) inset, 0 -1px 0 rgba(96, 165, 250, 0.1) inset;
    --ep-confirm-card-text: #f8fbff;
    --ep-confirm-card-body: rgba(226, 232, 240, 0.9);
    --ep-confirm-card-muted: rgba(203, 213, 225, 0.74);
    --ep-confirm-card-pill-bg: rgba(56, 189, 248, 0.14);
    --ep-confirm-card-pill-color: #bae6fd;
    --ep-confirm-card-inner-bg: rgba(15, 23, 42, 0.72);
}

[data-theme="zen-earth"] {
    --primary: #059669;
    --primary-hover: #047857;
    --primary-light: rgba(5, 150, 105, 0.1);
    --bg-body: #fdfbf7;
    --surface: #ffffff;
    --text-main: #374151;
    --text-secondary: #6b7280;
    --text-muted: #a39e98;
    --border: #e5e7eb;
    --ep-canvas-bg: #f8f4eb;
    --ep-canvas-accent: rgba(16, 185, 129, 0.1);
    --ep-calendar-shell-bg: linear-gradient(180deg, rgba(248,244,235,0.92), rgba(255,252,247,0.88));
    --ep-calendar-shell-border: rgba(196, 181, 157, 0.18);
    --ep-calendar-shell-shadow: 0 18px 40px rgba(92, 124, 104, 0.08);
    --ep-calendar-card-bg: linear-gradient(180deg, rgba(255,252,247,0.98), rgba(248,244,235,0.96));
    --ep-calendar-card-border: rgba(196, 181, 157, 0.52);
    --ep-calendar-card-shadow: 0 24px 48px rgba(92, 124, 104, 0.12);
    --ep-calendar-heading: #3f4a2f;
    --ep-calendar-subtle: #8b7d68;
    --ep-calendar-nav-bg: rgba(255,252,247,0.92);
    --ep-calendar-nav-border: rgba(196, 181, 157, 0.56);
    --ep-calendar-nav-color: #5b6a4d;
    --ep-calendar-nav-hover-bg: rgba(16, 185, 129, 0.12);
    --ep-calendar-nav-hover-border: rgba(16, 185, 129, 0.24);
    --ep-calendar-nav-hover-color: #166534;
    --ep-delivery-active-bg: linear-gradient(180deg, rgba(255,252,247,0.98), rgba(236,245,236,0.96));
    --ep-delivery-active-border: rgba(16, 185, 129, 0.34);
    --ep-delivery-active-shadow: 0 16px 34px rgba(5, 80, 55, 0.12);
    --ep-slot-panel-bg: linear-gradient(180deg, rgba(255,252,247,0.98), rgba(248,244,235,0.96));
    --ep-slot-panel-border: rgba(196, 181, 157, 0.52);
    --ep-slot-panel-shadow: 0 22px 44px rgba(92, 124, 104, 0.1);
    --ep-slot-bg: linear-gradient(180deg, rgba(255,252,247,0.98), rgba(250,247,240,0.96));
    --ep-slot-border: rgba(196, 181, 157, 0.54);
    --ep-slot-shadow: 0 10px 24px rgba(92, 124, 104, 0.1);
    --ep-slot-text: #46533a;
    --ep-slot-selected-bg: linear-gradient(180deg, rgba(240,249,241,0.98), rgba(227,243,232,0.96));
    --ep-slot-selected-border: rgba(16, 185, 129, 0.56);
    --ep-slot-selected-text: #1f4d3c;
    --ep-slot-selected-shadow: 0 20px 38px rgba(5, 80, 55, 0.14);
    --ep-description-fade: linear-gradient(to bottom, rgba(248,244,235,0), rgba(248,244,235,0.96) 72%);
    --ep-sidebar-card-bg: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(244,251,246,0.96));
    --ep-sidebar-card-border: rgba(209, 232, 219, 0.96);
    --ep-sidebar-card-shadow: 0 16px 34px rgba(5, 80, 55, 0.08);
    --ep-sidebar-soft-bg: linear-gradient(180deg, rgba(244,251,246,0.98), rgba(255,255,255,0.96));
    --ep-sidebar-strong-bg: linear-gradient(180deg, #f4fbf6 0%, #e8f7ee 100%);
    --ep-sidebar-strong-border: rgba(16,185,129,0.24);
    --ep-sidebar-strong-shadow: 0 12px 28px rgba(5,80,55,0.08), inset 0 1px 0 rgba(255,255,255,0.86);
    --ep-sidebar-accent-gradient: linear-gradient(180deg, #10b981 0%, #047857 100%);
    --ep-sidebar-title: #1f3f34;
    --ep-sidebar-muted: #557667;
    --ep-sidebar-body: #365246;
    --ep-sidebar-pill-bg: rgba(16, 185, 129, 0.12);
    --ep-sidebar-pill-color: #065f46;
    --ep-confirm-card-bg: linear-gradient(145deg, #1d332b 0%, #26463b 100%);
    --ep-confirm-card-border-strong: rgba(16, 185, 129, 0.36);
    --ep-confirm-card-border-soft: rgba(16, 185, 129, 0.12);
    --ep-confirm-card-border-bottom: rgba(220, 252, 231, 0.08);
    --ep-confirm-card-shadow: 0 16px 40px rgba(5, 80, 55, 0.32), 0 1px 0 rgba(220, 252, 231, 0.04) inset, 0 -1px 0 rgba(16, 185, 129, 0.08) inset;
    --ep-confirm-card-text: #f3fbf6;
    --ep-confirm-card-body: rgba(228, 247, 236, 0.9);
    --ep-confirm-card-muted: rgba(194, 225, 208, 0.72);
    --ep-confirm-card-pill-bg: rgba(16, 185, 129, 0.16);
    --ep-confirm-card-pill-color: #b7f7d4;
    --ep-confirm-card-inner-bg: rgba(23, 52, 43, 0.66);
}

[data-sidebar-mode="hybrid"] {
    --ep-sidebar-profile-bg: var(--ep-sidebar-card-bg);
    --ep-sidebar-profile-border: var(--ep-sidebar-card-border);
    --ep-sidebar-profile-shadow: var(--ep-sidebar-card-shadow);
    --ep-sidebar-bio-bg: var(--ep-sidebar-soft-bg);
    --ep-sidebar-bio-border: var(--ep-sidebar-card-border);
    --ep-sidebar-bio-shadow: inset 0 1px 0 rgba(255,255,255,0.7);
    --ep-sidebar-description-bg: var(--ep-sidebar-card-bg);
    --ep-sidebar-description-border: var(--ep-sidebar-card-border);
    --ep-sidebar-description-shadow: var(--ep-sidebar-card-shadow);
}

[data-sidebar-mode="soft-card"] {
    --ep-sidebar-profile-bg: transparent;
    --ep-sidebar-profile-border: transparent;
    --ep-sidebar-profile-shadow: none;
    --ep-sidebar-profile-radius: 0;
    --ep-sidebar-bio-bg: transparent;
    --ep-sidebar-bio-border: transparent;
    --ep-sidebar-bio-shadow: none;
    --ep-sidebar-bio-radius: 0;
    --ep-sidebar-description-bg: transparent;
    --ep-sidebar-description-border: transparent;
    --ep-sidebar-description-shadow: none;
    --ep-sidebar-description-radius: 0;
    --ep-sidebar-title-bg: transparent;
    --ep-sidebar-title-border-width: 0;
    --ep-sidebar-title-border-color: transparent;
    --ep-sidebar-title-shadow: none;
    --ep-sidebar-title-padding: 0;
    --ep-sidebar-title-radius: 0;
    --ep-sidebar-duration-bg: rgba(255,255,255,0.62);
    --ep-sidebar-duration-border-width: 1px;
    --ep-sidebar-duration-border-color: rgba(226,232,240,0.54);
    --ep-sidebar-duration-shadow: 0 10px 18px rgba(15, 23, 42, 0.05);
    --ep-sidebar-duration-padding: 0.62rem 0.88rem;
    --ep-sidebar-duration-radius: 999px;
    --ep-mobile-duration-bg: var(--ep-sidebar-duration-bg);
    --ep-mobile-duration-border-width: var(--ep-sidebar-duration-border-width);
    --ep-mobile-duration-border-color: var(--ep-sidebar-duration-border-color);
    --ep-mobile-duration-shadow: var(--ep-sidebar-duration-shadow);
    --ep-mobile-duration-padding: var(--ep-sidebar-duration-padding);
    --ep-mobile-duration-radius: 999px;
}

[data-sidebar-mode="editorial"] {
    --ep-sidebar-profile-bg: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,250,252,0.98));
    --ep-sidebar-profile-border: color-mix(in srgb, var(--ep-sidebar-card-border) 86%, var(--ep-sidebar-title) 14%);
    --ep-sidebar-profile-shadow: 0 18px 34px rgba(15, 23, 42, 0.07);
    --ep-sidebar-profile-radius: 22px;
    --ep-sidebar-bio-bg: transparent;
    --ep-sidebar-bio-border: color-mix(in srgb, var(--ep-sidebar-card-border) 45%, transparent 55%);
    --ep-sidebar-bio-shadow: none;
    --ep-sidebar-bio-radius: 0;
    --ep-sidebar-description-bg: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(249,250,251,0.98));
    --ep-sidebar-description-border: color-mix(in srgb, var(--ep-sidebar-card-border) 84%, var(--ep-sidebar-title) 16%);
    --ep-sidebar-description-shadow: 0 18px 32px rgba(15, 23, 42, 0.06);
    --ep-sidebar-description-radius: 18px;
    --ep-sidebar-title-bg: linear-gradient(180deg, rgba(255,255,255,0.88), rgba(248,250,252,0.82));
    --ep-sidebar-title-border-width: 1px;
    --ep-sidebar-title-border-color: color-mix(in srgb, var(--ep-sidebar-card-border) 84%, var(--ep-sidebar-title) 16%);
    --ep-sidebar-title-shadow: none;
    --ep-sidebar-title-padding: 0.88rem 0.92rem;
    --ep-sidebar-title-radius: 18px;
    --ep-sidebar-duration-bg: transparent;
    --ep-sidebar-duration-border-width: 0;
    --ep-sidebar-duration-border-color: transparent;
    --ep-sidebar-duration-shadow: inset 0 1px 0 color-mix(in srgb, var(--ep-sidebar-card-border) 76%, transparent 24%);
    --ep-sidebar-duration-padding: 0.72rem 0 0;
    --ep-sidebar-duration-radius: 0;
    --ep-mobile-duration-bg: transparent;
    --ep-mobile-duration-border-width: 1px;
    --ep-mobile-duration-border-color: color-mix(in srgb, var(--ep-sidebar-card-border) 76%, transparent 24%);
    --ep-mobile-duration-shadow: none;
    --ep-mobile-duration-padding: 0.56rem 0.78rem;
    --ep-mobile-duration-radius: 999px;
}

.ep-sidebar-profile {
    background: var(--ep-sidebar-profile-bg) !important;
    border-color: var(--ep-sidebar-profile-border) !important;
    box-shadow: var(--ep-sidebar-profile-shadow) !important;
    border-radius: var(--ep-sidebar-profile-radius) !important;
}

.ep-sidebar-instructor-bio {
    background: var(--ep-sidebar-bio-bg) !important;
    border-color: var(--ep-sidebar-bio-border) !important;
    box-shadow: var(--ep-sidebar-bio-shadow) !important;
    border: 1.5px solid var(--ep-calendar-shell-border) !important;
}

.ep-sidebar-event-description,
.ep-mobile-event-description {
    background: var(--ep-sidebar-description-bg) !important;
    border-color: var(--ep-sidebar-description-border) !important;
    border: 1.5px solid var(--ep-calendar-card-border) !important;
    border-radius: var(--ep-sidebar-description-radius) !important;
}

.ep-sidebar-price-block,
.ep-mobile-price-block {
    background: var(--ep-sidebar-strong-bg) !important;
    border: 1.5px solid var(--ep-slot-panel-border) !important;
    box-shadow: var(--ep-sidebar-strong-shadow) !important;
}

.ep-sidebar-price-block::before,
.ep-mobile-price-block::before {
    background: var(--ep-sidebar-accent-gradient) !important;
}

.ep-sidebar-Instructor-label,
.ep-sidebar-event-title,
.ep-mobile-currency-sheet__title,
.ep-sidebar-price-current,
.ep-sidebar-price-current * {
    color: var(--ep-sidebar-title) !important;
}

.ep-sidebar-duration,
.ep-mobile-duration,
.ep-mobile-Instructor-name,
.ep-sidebar-instructor-bio,
.ep-mobile-instructor-bio,
.ep-sidebar-event-description,
.ep-mobile-event-description {
    color: var(--ep-sidebar-body) !important;
}

.ep-sidebar-price-label,
.ep-sidebar-price-badge,
.ep-booking-currency-switcher__section-title,
.ep-mobile-currency-sheet__title {
    background: var(--ep-sidebar-pill-bg);
    color: var(--ep-sidebar-pill-color) !important;
}

.ep-sidebar-price-label,
.ep-sidebar-price-badge {
    border-radius: 999px;
}

[data-sidebar-mode="soft-card"] .ep-sidebar-profile,
[data-sidebar-mode="soft-card"] .ep-sidebar-instructor-bio,
[data-sidebar-mode="soft-card"] .ep-sidebar-event-description,
[data-sidebar-mode="soft-card"] .ep-mobile-event-description,
[data-sidebar-mode="soft-card"] .ep-booking-event-description {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    border-radius: 0 !important;
}

[data-sidebar-mode="soft-card"] .ep-sidebar-event-title {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    border-radius: 0 !important;
}

.ep-sidebar-price-code-pill,
.ep-mobile-price-block .ep-sidebar-price-code-pill {
    background: var(--ep-sidebar-accent-gradient) !important;
    color: #ffffff !important;
}

.ep-sidebar-price-compare,
.ep-sidebar-price-saving,
.ep-sidebar-duration,
.ep-mobile-duration {
    color: var(--ep-sidebar-muted) !important;
}

/* ========================================
   2️⃣ 全局基础（已收窄作用域，避免影响 WP 主题菜单）
   ======================================== */

/* 仅在预约组件根节点内重置 box-sizing */
#ep-booking-calendar-app * {
    box-sizing: border-box;
}

#ep-booking-calendar-app {
    background-color: var(--bg-body) !important;
    padding: 0 !important;
    min-height: 100vh;
    overflow-x: hidden !important;
}

.ep-tz-label {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px;
    line-height: 1.55;
}

.ep-tz-globe {
    opacity: 0.65;
    font-size: 0.92em;
}

.ep-tz-city {
    color: #D4AF37;
    font-weight: 700;
    letter-spacing: 0.01em;
}

.ep-tz-season {
    font-size: 0.9em;
}

.ep-tz-name {
    color: #475569;
}

.ep-tz-code {
    color: #94A3B8;
    font-size: 0.94em;
    font-variant-numeric: tabular-nums;
}

/* ========================================
   3️⃣ Canvas 布局：去框化
   ======================================== */

.ep-responsive-container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: var(--surface, #ffffff) !important;
    border: none !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

/* ========================================
   4️⃣ 桌面端：Flex 三栏布局 - 精简无冗余
   ======================================== */

@media (min-width: 1024px) {

    /* 全局 box-sizing */
    .ep-responsive-container,
    .ep-responsive-container * {
        box-sizing: border-box !important;
    }

    /* 🔓 摘除父级“紧箍咒”：允许平铺展开至 1120px */
    .ep-booking,
    .ep-booking__container {
        width: 100% !important;
        max-width: 1280px !important;
        margin: 0 auto !important;
        overflow: visible !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
        -webkit-font-smoothing: antialiased !important;
    }

    /* 🎯 顶级容器 - 1120px 黄金空间 (去框降维版) */
    .ep-responsive-container {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        max-width: 1280px !important;
        margin: 0 auto !important;
        min-height: 100vh !important;
        gap: 40px !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
        background: transparent !important;
        /* 与大背景融合 */
        box-shadow: none !important;
        /* 去掉显性大阴影 */
        border: none !important;
        /* 去掉重边框 */
        border-radius: 0 !important;
        font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    }

    /* 🏰 左侧栏 - 动态缩放 Sidebar (邀请函风格) */
    .ep-sidebar {
        flex: 0 0 360px !important;
        /* 锁死 360px，显得大气 */
        width: 360px !important;
        min-width: 360px !important;
        background: transparent !important;
        border: none !important;
        /* 移除物理分界线，改用留白 */
        padding: 60px 24px 60px 0 !important;
        overflow-y: auto !important;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
        position: sticky !important;
        /* 锚定详情栏：始终跟随视线 */
        top: 20px !important;
        z-index: 100 !important;
    }

    .ep-responsive-container:not(.has-selected-date)[data-sidebar-mode="soft-card"] {
        overflow: visible !important;
    }

    .ep-responsive-container:not(.has-selected-date)[data-sidebar-mode="soft-card"] .ep-sidebar {
        overflow: visible !important;
    }

    .has-selected-date .ep-sidebar {
        flex: 0 0 280px !important;
        /* 三栏开启时收至 280px，保护双徽章横排不折行 */
        width: 280px !important;
        min-width: 280px !important;
        padding: 40px 20px !important;
    }

    /* 头像与教练信息 */
    .ep-sidebar-profile {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        /* 居中对齐 */
        text-align: center !important;
        margin-bottom: 30px !important;
    }

    .ep-sidebar-avatar {
        width: 64px !important;
        height: 64px !important;
        border-radius: 50% !important;
        object-fit: cover !important;
        border: 2px solid white !important;
        box-shadow: 0 0 0 3px #D4AF37, 0 0 0 6px rgba(212, 175, 55, 0.15), 0 4px 12px rgba(0, 0, 0, 0.1) !important;
        margin-bottom: 12px !important;
    }

    .ep-sidebar-instructor-label {
        font-size: 15px !important;
        font-weight: 700 !important;
        color: var(--text-main) !important;
        letter-spacing: -0.01em !important;
    }

    /* 事件标题 - Dominant Style (邀请函排版优化) */
    .ep-sidebar-event-title,
    .ep-service-name {
        font-size: 22px !important;
        font-weight: 600 !important;
        color: #1a1a1a !important;
        letter-spacing: -0.5px !important;
        margin-bottom: 12px !important;
        text-align: center !important;
        line-height: 1.3 !important;
    }

    .has-selected-date .ep-sidebar-event-title {
        font-size: 20px !important;
    }

    /* 时长展示 */
    .ep-sidebar-duration {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        color: var(--text-secondary) !important;
        margin-bottom: 32px !important;
    }

    .ep-sidebar-duration svg {
        color: #94a3b8 !important;
    }

    /* 描述区域 (邀请函正文优化) */
    .ep-sidebar-description {
        font-size: 15px !important;
        line-height: 1.7 !important;
        color: #4a4a4a !important;
        border-top: none !important;
        /* 去掉顶部边框 */
        padding-top: 0 !important;
        text-align: left !important;
    }

    .ep-sidebar-description p {
        margin-bottom: 24px !important;
    }

    /* 列表极致优化 (List Magic) */
    .ep-sidebar-description ul {
        list-style: none !important;
        padding-left: 0 !important;
    }

    .ep-sidebar-description li {
        padding-left: 1.2em !important;
        position: relative !important;
        margin-bottom: 14px !important;
        font-size: 14px !important;
        color: #555 !important;
        line-height: 1.6 !important;
    }

    .ep-sidebar-description li:before {
        content: '●' !important;
        /* 金色圆点 */
        position: absolute !important;
        left: 0 !important;
        color: #D4AF37 !important;
        font-size: 10px !important;
        top: 2px !important;
    }

    /* 价格与高亮文字 */
    .ep-sidebar-description strong,
    .ep-sidebar-description b {
        font-weight: 700 !important;
        color: #b8860b !important;
    }

    /* 链接优化 */
    .ep-sidebar-description a {
        text-decoration: none !important;
        color: #D4AF37 !important;
        border-bottom: 1px solid rgba(212, 175, 55, 0.3) !important;
        transition: all 0.3s ease !important;
        display: inline-block !important;
    }

    .ep-sidebar-description a:hover {
        border-bottom-color: #D4AF37 !important;
        transform: translateY(-1px) !important;
    }

    /* 中间主内容区 - 留白自然区分 */
    .ep-main-content {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        background: transparent !important;
        border: none !important;
        padding: 40px !important;
        box-shadow: none !important;
        overflow: visible !important;
        margin: 0 !important;
    }


    /* ============================================================
   🚫 顶级拦截器：Barrier UI
   ============================================================ */

    .ep-booking__barrier-section {
        margin: 20px 0 40px 0 !important;
        width: 100% !important;
    }

    .ep-barrier-notice {
        display: flex !important;
        align-items: center !important;
        padding: 24px !important;
        border-radius: 20px !important;
        border: 1px solid transparent !important;
        gap: 16px !important;
        transition: all 0.3s ease !important;
    }

    /* 登录拦截：深邃蓝灰 */
    .ep-barrier-notice.login {
        background: #f8fafc !important;
        border-color: #e2e8f0 !important;
    }

    /* 额度拦截：警告红/橘 */
    .ep-barrier-notice.quota {
        background: #fff5f5 !important;
        border-color: #feb2b2 !important;
    }

    .ep-barrier-icon {
        font-size: 32px !important;
    }

    .ep-barrier-body {
        flex: 1 !important;
    }

    .ep-barrier-body h3 {
        margin: 0 0 4px 0 !important;
        font-size: 1.1rem !important;
        font-weight: 700 !important;
        color: #1e293b !important;
    }

    .ep-barrier-body p {
        margin: 0 !important;
        font-size: 0.9rem !important;
        color: #64748b !important;
        line-height: 1.5 !important;
    }

    .ep-barrier-btn {
        padding: 10px 20px !important;
        border-radius: 10px !important;
        font-weight: 700 !important;
        font-size: 14px !important;
        text-decoration: none !important;
        white-space: nowrap !important;
        transition: transform 0.2s !important;
    }

    .ep-barrier-notice.login .ep-barrier-btn {
        background: #1e293b !important;
        color: #ffffff !important;
    }

    .ep-barrier-notice.quota .ep-barrier-btn.gold {
        background: linear-gradient(135deg, #D4AF37 0%, #B8860B 100%) !important;
        color: #ffffff !important;
        box-shadow: 0 4px 12px rgba(184, 134, 11, 0.2) !important;
    }

    /* 移动端适配 */
    @media (max-width: 768px) {
        .ep-barrier-notice {
            flex-direction: column !important;
            text-align: center !important;
        }

        .ep-barrier-btn {
            width: 100% !important;
            text-align: center !important;
        }
    }

    /* 额度不足：高级金橙配色 */
    .ep-barrier-notice.quota {
        background: #fffcf0 !important;
        /* 极浅金黄 */
        border: 1.5px solid #fde68a !important;
        /* 金色边框 */
        box-shadow: 0 4px 15px rgba(212, 175, 55, 0.05) !important;
    }

    .ep-barrier-notice.quota .ep-barrier-icon {
        filter: drop-shadow(0 2px 4px rgba(184, 134, 11, 0.2)) !important;
    }

    .ep-barrier-notice.quota h3 {
        color: #854d0e !important;
        /* 深褐色文字 */
    }

    .ep-barrier-notice.quota p {
        color: #a16207 !important;
    }

    /* 购买按钮：品牌金渐变 */
    .ep-barrier-btn.gold {
        background: linear-gradient(135deg, #D4AF37 0%, #B8860B 100%) !important;
        color: #ffffff !important;
        border: none !important;
        box-shadow: 0 4px 12px rgba(184, 134, 11, 0.2) !important;
    }

    .ep-barrier-btn.gold:hover {
        transform: translateY(-2px) !important;
        box-shadow: 0 6px 15px rgba(184, 134, 11, 0.3) !important;
    }


    /* ============================================================
   👑 预约清单卡片：尊爵金风格增强
   ============================================================ */

    /* 1. 卡片主体：改用更细腻的边框和背景 */
    .ep-booking__event-card {
        background: #ffffff !important;
        border: 1px solid #e2e8f0 !important;
        /* 基础边框淡化 */
        box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05) !important;
    }

    /* 悬停效果：边框变为金色，卡片浮起 */
    .ep-booking__event-card:hover {
        border-color: #D4AF37 !important;
        /* 品牌金 */
        transform: translateY(-5px) !important;
        box-shadow: 0 20px 25px -5px rgba(212, 175, 55, 0.1), 0 10px 10px -5px rgba(212, 175, 55, 0.04) !important;
    }

    /* 2. 标题：深邃蓝，展现稳重感 */
    .ep-booking__event-card>div>div:first-child {
        color: #1a365d !important;
        /* 保持深蓝色标题 */
        font-size: 1.25rem !important;
        letter-spacing: -0.01em !important;
    }

    /* 3. 标签：统一改为金色系 */
    .price-tag.gold {
        background: #fffcf0 !important;
        color: #854d0e !important;
        border: 1px solid #fef08a !important;
    }

    .price-tag.blue {
        background: #f1f5f9 !important;
        /* 免费项改用低调的灰蓝 */
        color: #475569 !important;
    }



    /* 4. 底部“立即预约”：改为金色高亮 */
    .ep-booking__event-card>div:last-child {
        border-top: 1px solid #f1f5f9 !important;
        color: #b8860b !important;
        /* 橄榄金 */
        background: linear-gradient(to right, #ffffff, #fffdf5) !important;
        border-radius: 0 0 12px 12px !important;
    }

    /* 悬停时箭头动效 */
    .ep-booking__event-card:hover>div:last-child {
        color: #D4AF37 !important;
    }

    /* 5. 文字描述：保持整洁 */
    .ep-booking__event-card div[style*="font-size: 0.875rem"] {
        color: #64748b !important;
        line-height: 1.7 !important;
    }

    /* 6. 热门项目标题增强 */
    .ep-booking__title {
        font-size: 1.75rem !important;
        font-weight: 800 !important;
        color: #1a365d !important;
        position: relative !important;
        padding-bottom: 12px !important;
    }

    .ep-booking__title::after {
        content: "" !important;
        position: absolute !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 60px !important;
        height: 4px !important;
        background: #D4AF37 !important;
        /* 标题下方的小金条 */
        border-radius: 2px !important;
    }

    /* ============================================================
   📱 移动端专项：尊爵金风格适配
   ============================================================ */

    @media (max-width: 768px) {

        /* 1. 容器间距：防止卡片贴边，增加呼吸感 */
        .ep-booking__events-section {
            padding: 0 15px !important;
            margin-bottom: 2rem !important;
        }

        /* 2. 网格调整：强制一行一个，并微调高度 */
        .ep-booking__events-grid {
            grid-template-columns: 1fr !important;
            gap: 1.2rem !important;
        }

        /* 3. 卡片优化：在手机上边框稍微减薄，让视觉更轻盈 */
        .ep-booking__event-card {
            padding: 1.2rem !important;
            border-width: 1.5px !important;
            border-radius: 16px !important;
        }

        /* 4. 标题与文字：手机端字号微调，防止折行太碎 */
        .ep-booking__event-card>div>div:first-child {
            font-size: 1.15rem !important;
            margin-bottom: 0.4rem !important;
        }

        /* 5. 描述文字：手机端显示2行即可，保持页面长度可控 */
        .ep-booking__event-card div[style*="font-size: 0.875rem"] {
            -webkit-line-clamp: 2 !important;
            line-clamp: 2 !important;
            line-height: 1.5 !important;
            margin-bottom: 0.8rem !important;
        }

        /* 6. 底部“立即预约”：手机端加高点击区域，符合人体工学 */
        .ep-booking__event-card>div:last-child {
            padding-top: 1.2rem !important;
            padding-bottom: 0.5rem !important;
            font-size: 0.95rem !important;
        }

        /* 7. 拦截器适配：手机端图标居中，按钮全宽 */
        .ep-barrier-notice {
            flex-direction: column !important;
            text-align: center !important;
            padding: 20px !important;
        }

        .ep-barrier-icon {
            margin-bottom: 10px !important;
        }

        .ep-barrier-btn {
            width: 100% !important;
            margin-top: 15px !important;
            text-align: center !important;
        }
    }

    /* 标题样式强化 */
    .ep-event-title {
        font-size: 1.4rem !important;
        font-weight: 800 !important;
        color: #1a365d !important;
        margin-bottom: 12px !important;
    }

    /* 标签通用样式 */
    .ep-booking__event-meta {
        display: flex !important;
        gap: 8px !important;
        margin-bottom: 15px !important;
        flex-wrap: wrap !important;
    }

    .ep-booking__event-duration {
        background: #f1f5f9 !important;
        color: #475569 !important;
        padding: 3px 10px !important;
        border-radius: 6px !important;
        font-size: 0.8rem !important;
        font-weight: 600 !important;
    }

    /* 三种状态的颜色 */
    .price-tag {
        padding: 3px 10px !important;
        border-radius: 6px !important;
        font-size: 0.8rem !important;
        font-weight: 600 !important;
    }

    .price-tag.gold {
        background: #fffcf0 !important;
        color: #b45309 !important;
        border: 1px solid #fef08a !important;
    }

    .price-tag.orange {
        background: #fff7ed !important;
        color: #c2410c !important;
        border: 1px solid #ffedd5 !important;
    }

    .price-tag.blue {
        background: #eff6ff !important;
        color: #2563eb !important;
        border: 1px solid #dbeafe !important;
    }

    /* 描述文字限制行数，对齐卡片 */
    .ep-event-description {
        font-size: 0.9rem !important;
        color: #64748b !important;
        line-height: 1.6 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2 !important;
        line-clamp: 2 !important;
        -webkit-box-orient: vertical !important;
        overflow: hidden !important;
        margin-bottom: 20px !important;
    }

    /* 底部行动条 */
    .ep-event-action-bar {
        margin-top: auto !important;
        padding-top: 15px !important;
        border-top: 1px solid #f1f5f9 !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        color: #3b82f6 !important;
        font-weight: 700 !important;
    }

    .ep-arrow {
        font-size: 1.2rem !important;
        transition: transform 0.3s !important;
    }

    .ep-booking__event-card:hover .ep-arrow {
        transform: translateX(5px) !important;
    }

    /* 红色警告标签（用于额度不足） */
    .price-tag.red {
        background: #fff1f2 !important;
        color: #e11d48 !important;
        border: 1px solid #fecdd3 !important;
    }

    /* 橙色标签（用于付费项目） */
    .price-tag.orange {
        background: #fff7ed !important;
        color: #c2410c !important;
        border: 1px solid #ffedd5 !important;
    }

    /* 锁定状态卡片：视觉弱化 */
    .ep-booking__event-card.is-locked {
        border-color: #f1f5f9 !important;
        background: #fafafa !important;
    }

    .ep-booking__event-card.is-locked .action-text {
        color: #94a3b8 !important;
    }

    /* 列表与拦截框的间距优化 */
    .ep-booking__barrier-section {
        margin-top: -1rem !important;
        /* 紧贴列表下方 */
    }


    /* 🔥 日历与时间段容器 - 核心 Flex 布局 */
    .ep-calendar-layout-wrapper {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 16px !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        min-height: 500px !important;
        justify-content: center !important;
        /* Center the calendar container */
        /* Adjusted gap for balanced spacing */
    }

    /* 🏛️ 日历主体 - 核心弹性 Calendar */
    .ep-calendar-box {
        flex: 1 1 500px !important;
        /* 优先占据空间 */
        max-width: 600px !important;
        min-width: 440px !important;
        background: white !important;
        border: none !important;
        border-radius: 20px !important;
        box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06) !important;
        padding: 0 20px !important;
        margin: 0 auto !important;
        overflow: visible !important;
        box-sizing: border-box !important;
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    /* 日历头部 - 月份切换 */
    .ep-calendar-header,
    .ep-booking__header,
    .ep-month-selector {
        font-size: 18px !important;
        font-weight: 700 !important;
        color: var(--text-main) !important;
        margin-bottom: 24px !important;
    }

    /* 🌐 时区页脚 - 精准对齐 */
    .ep-timezone-footer {
        margin-top: 48px !important;
        padding: 0 10px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 12px !important;
    }

    .ep-timezone-label {
        font-size: 13px !important;
        font-weight: 700 !important;
        color: #0f172a !important;
        text-transform: uppercase !important;
        letter-spacing: 0.5px !important;
    }

    .ep-timezone-control {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        cursor: pointer !important;
    }

    .ep-globe-icon {
        font-size: 16px !important;
        color: #64748b !important;
    }

    select.ep-timezone-select-link {
        all: unset !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        color: #2563eb !important;
        padding: 6px 12px 6px 0 !important;
        transition: all 0.2s ease !important;
        cursor: pointer !important;
        border-radius: 4px !important;
    }

    select.ep-timezone-select-link:hover {
        background: rgba(37, 99, 235, 0.05) !important;
        padding-left: 8px !important;
    }

    select.ep-timezone-select-link option {
        background: white !important;
        color: #0f172a !important;
        padding: 10px !important;
    }

    .ep-booking__weekdays {
        display: grid !important;
        grid-template-columns: repeat(7, 1fr) !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 0 16px 0 !important;
        list-style: none !important;
        text-align: center !important;
    }

    .ep-booking__weekday {
        font-size: 13px !important;
        font-weight: 600 !important;
        color: #A0A0A0 !important;
        /* 调淡周标题 */
        padding: 0 !important;
        margin: 0 !important;
        text-indent: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* 日期网格 - 7列等宽且满宽 (Strict Alignment) */
    .ep-booking__days-grid {
        display: grid !important;
        grid-template-columns: repeat(7, 1fr) !important;
        gap: 0 !important;
        /* 移除间隙确保网格线贯穿 */
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        margin: 0 auto !important;
        /* Center grid within the container */
    }

    /* 日期单元格 (Cell Centering) */
    .ep-booking__day {
        aspect-ratio: 1 / 1 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: relative !important;
        font-family: 'Inter', 'PingFang SC', -apple-system, sans-serif !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        /* 增加权重 */
        color: #334155 !important;
        cursor: pointer !important;
        background: transparent !important;
        border: none !important;
        transition: all 0.2s ease !important;
    }

    /* 悬停反馈 */
    .ep-booking__day:hover:not(.ep-booking__day--empty):not(.ep-booking__day--past):not(.ep-booking__day--selected):not(.ep-booking__day--unavailable) {
        background: rgba(212, 175, 55, 0.1) !important;
        color: #D4AF37 !important;
        transform: scale(1.05);
    }

    /* 选中态：视觉仪式感 - 金色渐变 + 呼吸光晕 */
    /* 选中态：36px 绝对居中黄金圈 */
    .ep-booking__day--selected {
        background: transparent !important;
        color: white !important;
        font-weight: 700 !important;
        z-index: 5 !important;
    }

    .ep-booking__day--selected::before {
        content: "" !important;
        position: absolute !important;
        top: 50% !important;
        left: 50% !important;
        transform: translate(-50%, -50%) !important;
        width: 36px !important;
        height: 36px !important;
        background: linear-gradient(135deg, #D4AF37 0%, #B8860B 100%) !important;
        border-radius: 50% !important;
        z-index: -1 !important;
        box-shadow: 0 4px 12px rgba(184, 134, 11, 0.3) !important;
        animation: epSelectedPulse 2s infinite ease-in-out !important;
    }

    @keyframes epSelectedPulse {

        0%,
        100% {
            box-shadow: 0 0 15px rgba(212, 175, 55, 0.4);
        }

        50% {
            box-shadow: 0 0 25px rgba(212, 175, 55, 0.8);
        }
    }

    /* “今天”标识：只有可约时才显示金色小点 */
    .ep-booking__day--today:not(.ep-booking__day--unavailable)::after {
        content: "" !important;
        display: block !important;
        width: 7px !important;
        height: 7px !important;
        background: #D4AF37 !important;
        border-radius: 50% !important;
        position: absolute !important;
        bottom: 7px !important;
        left: 50% !important;
        transform: translateX(-50%) !important;
        box-shadow: 0 0 6px rgba(212, 175, 55, 0.6) !important;
        transition: all 0.3s ease !important;
    }

    /* 选中今天时，小点变白以保持清晰度 */
    .ep-booking__day--selected.ep-booking__day--today::after {
        background: white !important;
        bottom: 6px !important;
    }

    /* 不可约/过往日期：调优至 0.85 透明度以提高可见性 */
    .ep-booking__day--past,
    .ep-booking__day--unavailable {
        opacity: 0.85 !important;
        cursor: not-allowed !important;
        pointer-events: none !important;
        /* 彻底禁止反馈 */
    }

    .ep-booking__day--empty {
        opacity: 0 !important;
        visibility: hidden !important;
        cursor: default !important;
    }


    /* 右侧时间slots. 激活状态：当选中日期后，日历盒子联动收缩 */
    .ep-responsive-container.has-selected-date .ep-calendar-box {
        flex: 1 1 auto;
        max-width: 620px;
        min-width: 440px;
        display: flex;
        flex-direction: column;
        align-items: center;
        transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }

    /* 确保周数/日期网格宽度一致，防止偏移 */
    .ep-responsive-container.has-selected-date .ep-booking__calendar-wrapper {
        width: 100%;
        box-sizing: border-box;
    }

    /* 3. 激活状态：时间轴展开 */
    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        flex: 0 0 280px;
        /* 稍微加宽到 280px，给按钮和文字留呼吸感 */
        width: 280px;
        opacity: 1;
        visibility: visible;
        padding: 0 10px 0 20px;
        /* 右侧少一点，左侧多一点，形成视觉呼吸 */
        display: flex;
        /* 改用 Flex 布局以便固定标题 */
        flex-direction: column;
        height: 100%;
        /* 确保与日历盒子等高 */
    }

    /* --- 标题区域：固定置顶 + 布局容器 --- */
    .ep-booking__inline-slots-header {
        /* 1. 核心固定逻辑 */
        position: sticky !important;
        top: 0 !important;
        z-index: 100 !important;
        background: #ffffff !important;
        /* 必须纯白遮挡滚动内容 */

        /* 2. 布局逻辑 */
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        /* 改为居中，配合你的设计 */
        padding: 10px 0 15px 0 !important;
        margin-bottom: 10px !important;
        border-bottom: none !important;
    }

    /* --- 日期文本（主标题）：醒目 + 交互 --- */
    .ep-booking__inline-slots-header .date-range.ep-timeslot-header {
        font-size: 18px !important;
        font-weight: 700 !important;
        color: #1a1a1a !important;
        /* 或你的 var(--text-main) */
        cursor: pointer !important;
        user-select: none !important;
        white-space: nowrap !important;
        transition: opacity 160ms ease-in-out !important;
        outline: none !important;
        -webkit-tap-highlight-color: transparent;
    }

    /* 悬停微动，增加点击感 */
    .ep-booking__inline-slots-header .date-range.ep-timeslot-header:hover {
        opacity: 0.8;
    }

    /* --- 时区提示（次标题）：透明 + 纤细 --- */
    .ep-timezone-local-hint,
    .ep-booking__inline-slots-header .date-sub {
        font-size: 11px !important;
        font-weight: 500 !important;
        color: #94a3b8 !important;
        /* 优雅的灰蓝色 */
        margin-top: 4px !important;
        text-align: center !important;
    }

    /* 1. 隐藏右侧时间列表容器的滚动条 */
    .ep-booking__inline-time-slots {
        flex: 1;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding-right: 5px;
        /* 留出一点右边距，防止按钮贴边 */

        /* 隐藏滚动条标准写法 */
        scrollbar-width: none !important;
        /* Firefox */
        -ms-overflow-style: none !important;
        /* IE/Edge */
    }

    /* Chrome, Safari, Edge 专用 */
    .ep-booking__inline-time-slots::-webkit-scrollbar {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
    }

    .ep-booking__inline-time-slots::-webkit-scrollbar {
        display: none;
        /* Chrome/Safari */
    }

    /* 6. 时间显示格式与时区提示优化 */
    .ep-timeslot-header {
        font-size: 18px;
        font-weight: 700;
        color: #1a1a1a;
        cursor: pointer;
    }

    .ep-timezone-local-hint {
        font-size: 11px;
        color: #a0a0a0;
        margin-top: 4px;
    }

    .ep-responsive-container.has-selected-date .ep-booking__days-grid {
        width: 100% !important;
    }

    /* 强制恢复原始比例 */
    .ep-responsive-container.has-selected-date .ep-booking__day {
        font-size: 16px !important;
        transform: none !important;
    }

    /* 侧边栏收缩时防止溢出 */
    .ep-responsive-container.has-selected-date .ep-sidebar {
        overflow: hidden !important;
    }

    .ep-booking__inline-time-slots {
        display: flex !important;
        flex-direction: column !important;
        gap: 8px !important;
    }

    /* 📦 时间段容器 - 极简透明 */
    .ep-booking__inline-slots {
        margin-top: 12px !important;
        padding: 0 !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
    }




    .ep-mobile-header {
        display: none !important;
    }
}



.ep-summary-strip .ep-date-text.ep-format-toggle:focus,
.ep-summary-strip .ep-date-text.ep-format-toggle:active {
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* 🖥️ 响应式降级策略：1100px 以下自动折叠 */
@media (max-width: 1099px) and (min-width: 1024px) {
    .ep-responsive-container {
        flex-direction: column !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    .ep-sidebar {
        width: 100% !important;
        flex: 0 0 auto !important;
        border-right: none !important;
        border-bottom: 1px solid #f1f5f9 !important;
        padding: 40px !important;
    }

    .ep-calendar-box {
        flex: 0 0 auto !important;
        width: 100% !important;
        max-width: 580px !important;
        margin: 0 auto !important;
        border-radius: 20px !important;
        box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06) !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        width: 100% !important;
        max-width: 580px !important;
        margin: 20px auto !important;
        flex: 0 0 auto !important;
    }
}

/* ========================================
   5️⃣ 移动端：纵向堆叠 + 抽屉时间段
   ======================================== */

@media (max-width: 1023px) {

    /* 1. 强制最外层容器取消高度限制，允许自然滚动 */
    .ep-booking__container,
    .ep-responsive-container {
        display: block !important;
        height: auto !important;
        position: relative !important;
        overflow-x: hidden !important;
        overflow-y: visible !important;
    }

    /* 1. 总容器：确保内部所有元素垂直排队 */
    .ep-mobile-header,
    .ep-mobile-instructor-info {
        display: flex !important;
        flex-direction: column !important;
        /* 强制垂直排列：头像在上，名字在下 */
        align-items: center !important;
        /* 核心居中 */
        justify-content: center !important;
        text-align: center !important;
        width: 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    /* 2. 头像校准：彻底清除左右偏移 */
    .ep-mobile-instructor-info img,
    .ep-mobile-header img,
    .ep-sidebar-avatar {
        display: block !important;
        float: none !important;
        /* 彻底干掉左浮动 */
        margin: 0 auto 12px auto !important;
        /* 左右 auto 保证绝对水平居中 */
        width: 80px !important;
        /* 建议固定一个移动端尺寸，更高级 */
        height: 80px !important;
        border-radius: 50% !important;
        position: static !important;
        /* 排除绝对定位干扰 */
        box-shadow: 0 0 0 3px #D4AF37, 0 0 0 6px rgba(212, 175, 55, 0.15), 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    }

    .ep-mobile-event-description img,
    .ep-sidebar-description img,
    .ep-sidebar-event-description img,
    .ep-booking-event-description img {
        display: block !important;
        float: none !important;
        width: auto !important;
        max-width: 100% !important;
        height: auto !important;
        margin: 14px auto !important;
        border-radius: 16px !important;
        object-fit: contain !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* 3. 教练名字/文字区域：确保不偏不倚 */
    .ep-mobile-instructor-info span,
    .ep-mobile-instructor-info div,
    .ep-mobile-event-name {
        display: block !important;
        /* 占满整行，自然落到头像下方 */
        width: 100% !important;
        text-align: center !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 0 !important;
        line-height: 1.4 !important;
    }

    /* 4. 移除由于左右布局可能残留的内边距 */
    .ep-mobile-instructor-info::before,
    .ep-mobile-instructor-info::after {
        display: none !important;
        /* 移除可能的清除浮动占位 */
    }
}

/* 3. 详情文字：限制 5 行，居中 */
.ep-course-description {
    display: -webkit-box;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    margin: 15px auto !important;
    max-width: 90%;
    line-height: 1.6;
    text-align: center;
}

/* 4. 按钮：轻量化，居中 */
.ep-show-more-btn {
    display: inline-block !important;
    background: transparent !important;
    color: #2563eb !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 20px !important;
    padding: 6px 20px !important;
    font-size: 13px !important;
    margin: 0 auto 20px !important;
    box-shadow: none !important;
}

/* 5. 日历区：紧跟在按钮下方，绝不重叠 */
.ep-main-content {
    position: relative !important;
    width: 100% !important;
    margin-top: 0 !important;
    padding: 0 10px !important;
    display: block !important;
    z-index: 1 !important;
}




/* 1. 日历布局容器 - 移除 max-width 限制 */
.ep-calendar-layout-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 32px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    justify-content: center !important;
    /* 移除 900px 限制 */
    align-items: flex-start !important;
}

/* 2. 日历盒子 - 固定最小宽度，允许收缩 */
.ep-calendar-box {
    flex: 1 1 400px !important;
    /* 基础 400px，可伸缩 */
    min-width: 380px !important;
    max-width: 500px !important;
    padding: 20px !important;
    box-sizing: border-box !important;
}


/* 4. 日期网格 - 强制 7 列等宽 */
.ep-booking__days-grid {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 6px !important;
    width: 100% !important;
}

/* 🎭 半透明遮罩层 - iPhone 风格 */
.ep-responsive-container::before {
    display: none !important;
}

.ep-responsive-container.has-selected-date::before {
    display: none !important;
}

/* 🎯 移动端抽屉 - 带完整背景 */
.ep-time-slots-box {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    height: 70vh !important;
    z-index: 1000 !important;
    background: transparent !important;
    border-radius: 24px 24px 0 0 !important;
    padding: 20px !important;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15) !important;
    transform: translateY(100%) !important;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow-y: auto !important;
    display: block !important;
}

/* 抽屉只在 .is-open 时打开，避免 has-selected-date 单独触发（返回修改场景会残留 selectedDate 导致抽屉遮挡日历） */
.ep-responsive-container.has-selected-date .ep-time-slots-box.is-open {
    transform: translateY(0) !important;
}



.ep-mobile-header img {
    width: 80px !important;
    height: 80px !important;
    border-radius: 50% !important;
    margin-right: 12px !important;
    flex-shrink: 0 !important;
    box-shadow: 0 0 0 3px #D4AF37, 0 0 0 6px rgba(212, 175, 55, 0.15), 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.ep-mobile-header-content {
    flex: 1 !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    min-width: 0 !important;
}

.ep-mobile-header-content h1 {
    font-size: 17px !important;
    font-weight: 700 !important;
    margin-bottom: 2px !important;
    line-height: 1.3 !important;
    transition: all 0.3s ease !important;
}

.ep-mobile-header-content p {
    font-size: 13px !important;
    color: var(--text-secondary) !important;
    line-height: 1.4 !important;
    transition: all 0.3s ease !important;
    margin: 0 !important;
}

/* Sticky Header 滚动状态 - 头像缩小至50px */
.ep-mobile-header.scrolled {
    position: sticky !important;
    top: 0 !important;
    padding: 10px 20px !important;
    box-shadow: none !important;
}

.ep-mobile-header.scrolled img {
    width: 50px !important;
    height: 50px !important;
    margin-right: 10px !important;
}

.ep-mobile-header.scrolled .ep-mobile-header-content h1 {
    font-size: 15px !important;
    margin-bottom: 0 !important;
}

.ep-mobile-header.scrolled .ep-mobile-header-content p {
    display: none !important;
}

.ep-main-content {
    padding: 16px !important;
    background: #ffffff !important;
    min-height: calc(100vh - 120px) !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* 🔥 关键：强制纵向堆叠布局 */
.ep-calendar-layout-wrapper {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
}

/* 日历 - 全宽显示 */
.ep-calendar-box {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
    box-sizing: border-box !important;
    margin-bottom: 120px !important;
    /* 为底部抽屉留空间 */
    border-radius: 16px !important;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06) !important;
}

/* 时间段抽屉化：Fixed定位 + Transform隐藏 */
.ep-time-slots-box {
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: auto !important;
    max-width: 100vw !important;
    flex: none !important;
    z-index: 999 !important;
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)) !important;
    gap: 8px !important;
    padding: 20px !important;
    padding-bottom: calc(20px + env(safe-area-inset-bottom)) !important;
    background: transparent !important;
    border-radius: 24px 24px 0 0 !important;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15) !important;
    max-height: 65vh !important;
    overflow-y: auto !important;
    box-sizing: border-box !important;
    transform: translateY(100%) !important;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 抽屉打开状态（通过.is-open类控制） */
.ep-time-slots-box.is-open {
    transform: translateY(0) !important;
}

/* 空状态不显示 */
.ep-time-slots-box:empty {
    display: none !important;
}


/* 抽屉遮罩（可选） */
@media (max-width: 768px) {
    .ep-drawer-backdrop {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        width: 100% !important;
        height: 100% !important;
        background: rgba(0, 0, 0, 0.3) !important;
        z-index: 998 !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition: opacity 0.3s ease !important;
    }

    .ep-drawer-backdrop.is-visible {
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /* 📱 移动端Service Info折叠面板 */
    .ep-mobile-service-info {
        background: var(--surface) !important;
        border-radius: 12px !important;
        margin-bottom: 16px !important;
        overflow: hidden !important;
        border: 1px solid var(--border) !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .ep-mobile-service-header {
        padding: 16px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        cursor: pointer !important;
        user-select: none !important;
        transition: background 0.2s ease !important;
    }

    .ep-mobile-service-header:active {
        background: #f8fafc !important;
    }

    .ep-mobile-service-title {
        font-size: 15px !important;
        font-weight: 600 !important;
        color: #0f172a !important;
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
    }

    .ep-mobile-service-icon {
        font-size: 18px !important;
    }

    .ep-mobile-service-toggle {
        width: 20px !important;
        height: 20px !important;
        color: #64748b !important;
        transition: transform 0.3s ease !important;
    }

    .ep-mobile-service-toggle.expanded {
        transform: rotate(180deg) !important;
    }

    .ep-mobile-service-content {
        max-height: 0 !important;
        overflow: hidden !important;
        transition: max-height 0.3s ease !important;
    }

    .ep-mobile-service-content.expanded {
        max-height: 500px !important;
    }

    .ep-mobile-service-body {
        padding: 0 16px 16px !important;
        font-size: 14px !important;
        line-height: 1.6 !important;
        color: #64748b !important;
    }
}

/* ===== 小屏优化 (480px - 767px) ===== */
@media (max-width: 767px) and (min-width: 481px) {

    /* 日期圆圈增大至44px（优化触摸靶向） */
    .ep-booking__day,
    .ep-calendar-date {
        width: 44px !important;
        height: 44px !important;
        font-size: 16px !important;
    }

    /* 日期网格间距调整 */
    .ep-booking__days-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(7, 1fr) !important;
        gap: 2px !important;
        padding: 0 !important;
    }

    /* 时间段按钮优化 */
    .ep-time-slot {
        padding: 10px 12px !important;
        font-size: 15px !important;
        min-height: 56px !important;
    }

    /* 时间槽两行布局 - 移动端 */
    .ep-time-slot .slot-content {
        gap: 3px !important;
    }

    .ep-time-slot .slot-time {
        font-size: 17px !important;
    }

    .ep-time-slot .cross-day-badge {
        font-size: 12px !important;
    }

    /* 日历容器内边距 */
    .ep-calendar-layout-wrapper {
        padding: 12px !important;
    }

    /* 表单输入框 */
    .ep-unified-input,
    input:not([type="checkbox"]):not([type="radio"]),
    select,
    textarea {
        height: 52px !important;
        font-size: 16px !important;
        border-radius: 10px !important;
    }

    /* 移动端头部调整 */
    .ep-mobile-header {
        padding: 20px 16px !important;
    }

    .ep-mobile-header img {
        width: 60px !important;
        height: 60px !important;
    }

    .ep-mobile-header-content h1 {
        font-size: 17px !important;
    }
}

/* ===== 超小屏手机 (< 480px) ===== */
@media (max-width: 480px) {

    /* 极限压缩内边距 */
    .ep-main-content {
        padding: 12px !important;
    }

    .ep-mobile-header {
        padding: 16px 12px !important;
    }

    .ep-mobile-header.scrolled {
        padding: 10px 12px !important;
    }

    /* 日期网格进一步优化 */
    .ep-booking__days-grid {
        width: 100% !important;
        display: grid !important;
        grid-template-columns: repeat(7, 1fr) !important;
        gap: 2px !important;
        padding: 0 !important;
    }

    .ep-booking__day,
    .ep-calendar-date {
        width: auto !important;
        min-width: 0 !important;
        height: 38px !important;
        font-size: 14px !important;
    }

    /* 星期头字体调整 */
    .ep-booking__weekdays {
        font-size: 13px !important;
        margin-bottom: 8px !important;
    }

    /* 时间段网格 - 小屏固定2列 */
    .ep-time-slots-box,
    .ep-time-slots-container {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 10px !important;
        padding: 16px !important;
    }

    .ep-time-slot {
        padding: 10px 10px !important;
        font-size: 15px !important;
        min-height: 54px !important;
    }

    /* 时间槽两行布局 - 超小屏 */
    .ep-time-slot .slot-content {
        gap: 2px !important;
    }

    .ep-time-slot .slot-time {
        font-size: 16px !important;
    }

    .ep-time-slot .cross-day-badge {
        font-size: 11px !important;
    }

    /* 按钮和输入框 */
    button,
    .ep-btn {
        padding: 12px 20px !important;
        font-size: 15px !important;
    }

    .ep-unified-input,
    input,
    select {
        height: 48px !important;
        padding: 12px 14px !important;
        font-size: 15px !important;
    }

    textarea {
        min-height: 120px !important;
    }
}

/* ========================================
   6️⃣ 日历组件 - 整合自 booking.css
   ======================================== */

/* 星期头 */
.ep-booking__weekdays {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    text-align: center !important;
    font-weight: 600 !important;
    color: var(--text-secondary) !important;
    margin-bottom: 12px !important;
    font-size: 16px !important;
    padding: 0 4px !important;
}

/* 日期网格 */
.ep-booking__days-grid {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 8px !important;
    padding: 4px !important;
}

/* 日期圆圈基础样式 */
.ep-booking__day,
.ep-calendar-date {
    width: 38px !important;
    height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    cursor: pointer !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    background: transparent !important;
    border: none !important;
}

/* Hover状态 */
.ep-booking__day:hover:not(.ep-booking__day--empty):not(.ep-booking__day--past),
.ep-calendar-date:hover:not(.disabled):not(.selected) {
    background: var(--primary-light) !important;
    color: var(--primary) !important;
    transform: scale(1.08) !important;
}

/* 选中状态 */
.ep-booking__day--selected,
.ep-calendar-date.selected {
    background: var(--primary) !important;
    color: white !important;
    transform: scale(1.1) !important;
    box-shadow: 0 4px 12px var(--primary-light) !important;
    font-weight: 600 !important;
}

/* 过去日期 */
.ep-booking__day--past,
.ep-calendar-date.disabled {
    opacity: 0.3 !important;
    cursor: not-allowed !important;
}

/* 今日标记 */
.ep-booking__day--today {
    font-weight: 700 !important;
    position: relative !important;
}

.ep-booking__day--today:not(.ep-booking__day--unavailable)::after {
    content: '' !important;
    position: absolute !important;
    bottom: 7px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 7px !important;
    height: 7px !important;
    background: #D4AF37 !important;
    border-radius: 50% !important;
    box-shadow: 0 0 6px rgba(212, 175, 55, 0.6) !important;
}

/* 空白日期 */
.ep-booking__day--empty {
    cursor: default !important;
    opacity: 0 !important;
}

/* ========================================
   7️⃣ 时间段按钮 - 网格化布局（Calendly 风格）
   ======================================== */

/* 时间段容器 */
.ep-time-slots-box,
.ep-time-slots-container {
    display: flex !important;
    flex-direction: column !important;
    /* 强制单列，防止挤压 */
    gap: 12px !important;
    padding: 24px !important;
}

/* 时间段包装器 */
.ep-time-slot-wrapper {
    width: 100% !important;
}

/* 时间段按钮 */
.ep-time-slot {
    width: 100% !important;
    padding: 0 16px !important;
    /* 调整内边距，配合 min-height 使用 */
    background: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 12px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    font-variant-numeric: tabular-nums !important;
    -webkit-font-smoothing: antialiased !important;
    color: var(--primary) !important;
    cursor: pointer !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04) !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    min-height: 52px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    /* 默认居中显示时间 */
    gap: 10px !important;
    position: relative !important;
    margin: 6px 0 !important;
    overflow: visible !important;
    /* 严禁裁剪内容 */
    box-sizing: border-box !important;
}

.ep-time-slot:hover:not(.selected):not(.disabled):not(.confirming) {
    background: var(--primary-light) !important;
    border-color: var(--primary) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 4px 12px rgba(212, 175, 55, 0.15) !important;
}

/* 第一阶段：待确认状态 (对标参考图) */
.ep-time-slot.confirming {
    background: var(--primary-light) !important;
    border-color: var(--primary) !important;
    color: var(--primary) !important;
    justify-content: space-between !important;
}

/* 第二阶段：确认标签 (对标参考图：深蓝色高亮按钮) */
.confirm-label {
    background: var(--primary) !important;
    color: white !important;
    padding: 6px 14px !important;
    /* 增加填充，使其更具点击感 */
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    animation: epFadeInRight 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    white-space: nowrap !important;
    box-shadow: 0 4px 8px rgba(37, 99, 235, 0.2) !important;
    /* 增加微弱投影 */
}

@keyframes epFadeInRight {
    from {
        opacity: 0;
        transform: translateX(10px);
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.ep-time-slot.selected {
    background: var(--primary) !important;
    color: white !important;
    border-color: var(--primary) !important;
}

.ep-time-slot.disabled {
    opacity: 0.3 !important;
    cursor: not-allowed !important;
}

/* ========================================
   8️⃣ 表单统一（.ep-unified-input）
   ======================================== */

.ep-unified-input,
.ep-input,
.ep-select,
.ep-textarea,
.ep-booking__form-input,
#ep-booking-calendar-app input:not([type="checkbox"]):not([type="radio"]),
#ep-booking-calendar-app select,
#ep-booking-calendar-app textarea {
    width: 100% !important;
    height: 52px !important;
    padding: 12px 2px !important;
    background: #ffffff !important;
    border: none !important;
    border-bottom: 1.5px solid #ececec !important;
    border-radius: 0 !important;
    font-size: 16px !important;
    font-family: inherit !important;
    color: var(--text-main) !important;
    transition: all 0.3s ease-in-out !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    box-sizing: border-box !important;
}

/* Select 自定义箭头 */
#ep-booking-calendar-app select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 9L1 4h10z'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 16px center !important;
    padding-right: 40px !important;
}

#ep-booking-calendar-app textarea {
    height: auto !important;
    min-height: 140px !important;
    resize: vertical !important;
    line-height: 1.6 !important;
}

.ep-unified-input:focus,
#ep-booking-calendar-app input:focus,
#ep-booking-calendar-app select:focus,
#ep-booking-calendar-app textarea:focus {
    background: #ffffff !important;
    border-bottom: 2px solid #D4AF37 !important;
    /* 仅在 Focus 时强化底部金色边框 */
    box-shadow: none !important;
    outline: none !important;
    transform: none !important;
}

/* Checkbox 自定义样式 */
input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 24px !important;
    height: 24px !important;
    border: 2px solid #e2e8f0 !important;
    border-radius: 6px !important;
    background: #f8fafc !important;
    cursor: pointer !important;
    position: relative !important;
    transition: all 0.2s ease !important;
    flex-shrink: 0 !important;
}

input[type="checkbox"]:checked {
    background: var(--primary) !important;
    border-color: var(--primary) !important;
}

input[type="checkbox"]:checked::after {
    content: '' !important;
    position: absolute !important;
    left: 7px !important;
    top: 3px !important;
    width: 6px !important;
    height: 10px !important;
    border: solid white !important;
    border-width: 0 2px 2px 0 !important;
    transform: rotate(45deg) !important;
}

/* ========================================
   9️⃣ 按钮样式
   ======================================== */

#ep-booking-calendar-app button,
.ep-btn,
.ep-btn-primary {
    background: var(--primary) !important;
    color: white !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 14px 24px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

#ep-booking-calendar-app button:hover,
.ep-btn:hover,
.ep-btn-primary:hover {
    background: var(--primary-hover) !important;
    transform: translateY(-1px) !important;
}

#ep-booking-calendar-app button:active {
    transform: scale(0.98) !important;
}

/* ========================================
   🔟 滚动条美化
   ======================================== */

.ep-time-slots-box::-webkit-scrollbar {
    width: 4px !important;
}

.ep-time-slots-box::-webkit-scrollbar-track {
    background: transparent !important;
}

.ep-time-slots-box::-webkit-scrollbar-thumb {
    background: var(--border) !important;
    border-radius: 2px !important;
}

/* ========================================
   1️⃣1️⃣ 移动端表单优化
   ======================================== */

@media (max-width: 1023px) {

    .ep-booking__form-label,
    label {
        display: block !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        color: var(--text-main) !important;
        margin-bottom: 8px !important;
    }

    .ep-booking__form-group {
        margin-bottom: 20px !important;
    }
}

/* ========================================
   1️⃣2️⃣ 辅助类
   ======================================== */

.ep-section-title {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--text-main) !important;
    margin-bottom: 24px !important;
}

/* ========================================
   1️⃣3️⃣ 强制优先级
   ======================================== */

.ep-booking__time-slot--selected {
    background: white !important;
    color: var(--primary) !important;
    border-color: var(--primary) !important;
}

/* ========================================
   🎯 桌面端终极布局 - 完全分离移动端
   ======================================== */

@media (min-width: 1024px) {
    .ep-responsive-container {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        box-sizing: border-box !important;
    }

    .ep-responsive-container .ep-sidebar {
        flex: 0 0 320px !important;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    .ep-responsive-container.has-selected-date .ep-sidebar {
        flex: 0 0 280px !important;
    }

    .ep-responsive-container .ep-calendar-layout-wrapper {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
    }

    .ep-responsive-container .ep-calendar-box {
        flex: 1 1 auto !important;
        min-width: 0 !important;
    }

    .ep-responsive-container .ep-booking__days-grid {
        display: grid !important;
        grid-template-columns: repeat(7, 1fr) !important;
    }

    .ep-responsive-container .ep-time-slots-box {
        flex: 0 0 0px !important;
        width: 0px !important;
        overflow: hidden !important;
        opacity: 0 !important;
        visibility: hidden !important;
        display: none !important;
        position: static !important;
        transform: none !important;
        transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1) !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        flex: 0 0 220px !important;
        width: 220px !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        background: transparent !important;
        border: none !important;
        padding: 20px 15px 20px 20px !important;
        /* 修正：增加 20px 上下边距与 15px 右边距，彻底杜绝遮挡 */
        overflow-y: auto !important;
        overflow-x: visible !important;
        /* 允许横向溢出以防万一 */
        position: static !important;
        transform: none !important;
        bottom: auto !important;
        left: auto !important;
        z-index: auto !important;
    }
}

@media (max-width: 1023px) {
    .ep-responsive-container {
        display: flex !important;
        flex-direction: column !important;
        position: relative !important;
    }

    .ep-responsive-container .ep-sidebar {
        display: none !important;
    }

    .ep-responsive-container .ep-calendar-layout-wrapper {
        display: block !important;
    }

    .ep-responsive-container .ep-calendar-box {
        display: block !important;
        width: 100% !important;
        flex: none !important;
        position: static !important;
    }

    .ep-responsive-container::before {
        display: none !important;
    }

    .ep-responsive-container.has-selected-date::before {
        display: none !important;
    }

    .ep-responsive-container .ep-time-slots-box {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        max-width: 100vw !important;
        height: 75vh !important;
        z-index: 1001 !important;
        background: var(--ep-slot-panel-bg) !important;
        border: 1px solid var(--ep-slot-panel-border) !important;
        border-radius: 24px 24px 0 0 !important;
        padding: 22px 18px 28px !important;
        box-shadow: 0 -12px 36px rgba(15, 23, 42, 0.18), var(--ep-slot-panel-shadow) !important;
        backdrop-filter: blur(16px) !important;
        overflow-y: auto !important;
        transform: translateY(100%) !important;
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        flex: none !important;
        border-left: none !important;
    }

    .ep-responsive-container .ep-time-slots-box .ep-booking__inline-slots {
        margin-top: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: none !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    .ep-responsive-container .ep-time-slots-box .ep-booking__inline-slots-header {
        position: sticky !important;
        top: 0 !important;
        z-index: 1002 !important;
        margin: -10px -2px 12px !important;
        padding: 10px 6px 16px !important;
        background: linear-gradient(180deg, rgba(255, 252, 246, 0.94), rgba(255, 252, 246, 0.72)) !important;
        border-bottom: 1px solid var(--ep-slot-panel-border) !important;
        backdrop-filter: blur(14px) !important;
    }

    [data-theme="midnight-black"] .ep-responsive-container .ep-time-slots-box .ep-booking__inline-slots-header {
        background: linear-gradient(180deg, rgba(8, 17, 31, 0.94), rgba(8, 17, 31, 0.74)) !important;
    }

    /* 抽屉只在 .is-open 时滑入，避免 has-selected-date 单独触发 */
    .ep-responsive-container.has-selected-date .ep-time-slots-box.is-open {
        transform: translateY(0) !important;
    }
}

/* ========================================
   📱 移动端抽屉手柄 - iPhone 风格
   ======================================== */

@media (max-width: 1023px) {

    /* 抽屉顶部手柄线 */
    .ep-time-slots-box::before {
        content: '';
        position: absolute;
        top: 12px;
        left: 50%;
        transform: translateX(-50%);
        width: 40px;
        height: 4px;
        background: #cbd5e1;
        border-radius: 2px;
        opacity: 0.6;
    }
}

/* 摘要条布局 */
/* 🏰 预约摘要卡片 - 扁平化轻量版 */
.ep-summary-strip {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: #fcfcfc !important;
    /* 更干净的米白 */
    /* 背景色块模式 */
    border: none !important;
    /* 去掉物理边框 */
    border-radius: 16px !important;
    padding: 20px 24px !important;
    margin-bottom: 24px !important;
    gap: 20px !important;
    box-shadow: none !important;
    /* 去掉投影 */
    position: relative !important;
    overflow: hidden !important;
}

.ep-summary-strip::before {
    content: '' !important;
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    height: 100% !important;
    width: 1px !important;
    /* 品牌色竖向标识线 */
    background: var(--primary) !important;
}

.ep-summary-info {
    display: flex !important;
    align-items: center !important;
    gap: 16px !important;
    color: #1e293b !important;
}

/* 信息区：左侧图标与文字 */
.ep-summary-info .ep-icon {
    background: #FDFCF0 !important;
    /* 钛金浅底色 */
    color: #C5A059 !important;
    /* 钛金图标色 */
    border-radius: 50% !important;
    /* 改为圆形，平衡药丸按钮 */
}

.ep-summary-info .ep-text {
    display: flex !important;
    flex-direction: column !important;
    /* 纵向排布：日期在上，时间在下 */
    gap: 4px !important;
}

.ep-summary-info .ep-date-text {
    font-size: 14px !important;
    color: #94a3b8 !important;
    text-transform: uppercase;
}

.ep-booking__summary-value.ep-format-toggle {
    white-space: nowrap !important;
    cursor: pointer !important;
    user-select: none !important;
    transition: opacity 160ms ease-in-out !important;
    -webkit-tap-highlight-color: transparent;
}

.ep-booking__summary-value.ep-format-toggle:focus,
.ep-booking__summary-value.ep-format-toggle:active {
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* 🆕 摘要条内的修改按钮 (药丸状) */
.ep-summary-edit-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    background: #ffffff !important;
    border: 1.2px solid #e2e8f0 !important;
    padding: 8px 18px !important;
    border-radius: 100px !important;
    /* 药丸状 */
    color: #64748b !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.23, 1, 0.32, 1) !important;
}

/* 右侧对齐容器 */
.ep-summary-actions {
    margin-left: auto !important;
    display: flex !important;
    align-items: center !important;
}

.ep-summary-edit-btn:hover {
    background: white !important;
    color: var(--primary) !important;
    border-color: var(--primary) !important;
    box-shadow: 0 4px 12px rgba(197, 160, 89, 0.12) !important;
}

.ep-summary-edit-btn svg {
    opacity: 0.7 !important;
}

.edit-hint {
    letter-spacing: 0.5px !important;
}

/* 次日/前日小标签：苹果胶囊风格 */
.cross-day-badge {
    font-size: 11px !important;
    background: #f1f5f9 !important;
    color: #64748b !important;
    padding: 2px 6px !important;
    border-radius: 4px !important;
    margin-left: 6px !important;
    vertical-align: middle !important;
    font-weight: 500 !important;
}

/* 预约时间高亮突出 (Chip 风格) */
.ep-blue-time.prominent {
    color: var(--primary) !important;
    font-size: 24px !important;
    /* 继续放大，极具张力 */
    font-weight: 900 !important;
    letter-spacing: -0.5px !important;
    margin: 0 !important;
}

/* 🌐 可切换时区组件 - 更加精致化 (药丸状) */
.ep-timezone-switcher.pill-mode {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: #f1f5f9 !important;
    border: 1px solid transparent !important;
    padding: 4px 12px !important;
    border-radius: 100px !important;
    /* 药丸状 */
    transition: all 0.3s ease !important;
    margin-top: 6px !important;
    /* 放到时间下方 */
    width: fit-content !important;
}

.ep-timezone-switcher.pill-mode:hover {
    background: #e2e8f0 !important;
    border-color: #cbd5e1 !important;
}

select.ep-summary-timezone-select {
    all: unset !important;
    font-size: 12px !important;
    /* 字体缩小 */
    color: #64748b !important;
    font-weight: 500 !important;
    cursor: pointer !important;
}

.ep-timezone-switcher.pill-mode .ep-icon {
    font-size: 12px !important;
    opacity: 0.7 !important;
}

/* 按钮颜色优化：去尖锐化，更柔和的品牌蓝 */
:root {
    --primary: #335eea !important;
    /* 调整为更高级的中性蓝 */
    --primary-hover: #2143d1 !important;
}

.ep-booking__button--primary {
    box-shadow: 0 4px 14px rgba(51, 94, 234, 0.25) !important;
}

/* 移除旧的绝对定位箭头 */
.ep-minimal-back-arrow {
    display: none !important;
}

/* 场景 A：首屏大日历 - 使用高端金 */
.tp-context-hero-booking {
    --primary: #B8977E !important;
    --primary-soft: rgba(184, 151, 126, 0.1) !important;
    --calendar-shadow: rgba(184, 151, 126, 0.4) !important;
}

/* 场景 B：侧边栏小插件 - 使用简约蓝 */
.tp-context-sidebar-widget {
    --primary: #2563eb !important;
    --primary-soft: rgba(37, 99, 235, 0.1) !important;
    --calendar-shadow: rgba(37, 99, 235, 0.2) !important;
}

/* 场景 C：用户中心 - 使用低调灰 */
.tp-context-user-profile {
    --primary: #64748b !important;
    --primary-soft: rgba(100, 116, 139, 0.1) !important;
    --calendar-shadow: rgba(100, 116, 139, 0.2) !important;
}


/* --- 强力视觉重置 (Force Reset) --- */

/* 1. 彻底清除翻页按钮的蓝色背景 */
div.ep-booking__calendar button.ep-booking__nav-btn,
div.ep-booking__calendar button.ep-calendar-nav-button {
    background: transparent !important;
    background-color: transparent !important;
    border: 1px solid #e2e8f0 !important;
    color: #64748b !important;
    box-shadow: none !important;
    border-radius: 10px !important;
}

/* 2. 将选中日期从深蓝强制转为金色 */
div.ep-booking__calendar .ep-booking__day.selected {
    background-color: #B8977E !important;
    color: #ffffff !important;
    box-shadow: 0 4px 12px rgba(184, 151, 126, 0.4) !important;
}

/* 3. 彻底消灭『今天』下方的蓝色圆点 */
div.ep-booking__calendar .ep-booking__day.today::after {
    content: none !important;
    display: none !important;
}

div.ep-booking__calendar .ep-booking__day.today {
    color: #B8977E !important;
    font-weight: 800 !important;
}

/* 4. 底部时区条：从蓝色大块变为透明文字 */
div.ep-booking-footer,
.ep-timezone-switcher,
#ep-booking-calendar-app [class*="footer"],
#ep-booking-calendar-app [class*="timezone"] {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #94a3b8 !important;
}

/* 强制更改图标颜色 */
#ep-booking-calendar-app svg,
#ep-booking-calendar-app .ep-globe-icon {
    color: #94a3b8 !important;
}

/* ============================================================
   🏆 预约表单全域视觉终极版 (合并精简)
   ============================================================ */

/* 1. 统一标签样式 (全方位捕捉：硬编码/自定义字段) */
[class*="ep-booking"] label,
[class*="ep-booking"] .ep-label,
.ep-booking__form-label {
    display: block !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #1d1d1f !important;
    margin-top: 24px !important;
    margin-bottom: 12px !important;
    text-align: left !important;
}

/* 2. 统一输入框基调 (单行、邮箱、电话、日期、数字、下拉) */
.ep-unified-input,
.ep-booking__form-input,
[class*="ep-booking"] input[type="text"],
[class*="ep-booking"] input[type="email"],
[class*="ep-booking"] input[type="tel"],
[class*="ep-booking"] input[type="date"],
[class*="ep-booking"] input[type="number"],
[class*="ep-booking"] textarea,
[class*="ep-booking"] select {
    width: 100% !important;
    min-height: 48px !important;
    /* 统一高度感 */
    padding: 12px 16px !important;
    border: 1px solid #d2d2d7 !important;
    border-radius: 12px !important;
    background-color: #ffffff !important;
    font-size: 16px !important;
    color: #1d1d1f !important;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-sizing: border-box !important;
    appearance: none !important;
    outline: none !important;
    box-shadow: none !important;
}

/* 3. 统一金色焦点态 (Focus) - 消除金色不统一 */
[class*="ep-booking"] input:focus,
[class*="ep-booking"] textarea:focus,
[class*="ep-booking"] select:focus,
.ep-unified-input:focus {
    border-color: #D4AF37 !important;
    background-color: #ffffff !important;
    box-shadow: 0 0 0 4px rgba(212, 175, 55, 0.15) !important;
}

/* 4. 下拉框特化（轻奢金色） */
select.ep-select,
[class*="ep-booking"] select {
    color-scheme: light !important;
    cursor: pointer !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    border-color: #e6dcc7 !important;
    background-color: #fffdf8 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 18px !important;
    padding-right: 40px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.92), 0 2px 8px rgba(15,23,42,0.04) !important;
}

select.ep-select:hover,
[class*="ep-booking"] select:hover {
    border-color: rgba(212, 175, 55, 0.72) !important;
    box-shadow: 0 8px 20px rgba(212, 175, 55, 0.10) !important;
}

select.ep-select option,
[class*="ep-booking"] select option {
    color: #1f2937 !important;
    background: #fffdf8 !important;
    font-size: 15px !important;
}

select.ep-select option:checked,
[class*="ep-booking"] select option:checked {
    background: #f5e7b8 !important;
    color: #111827 !important;
}

select.ep-select:required:invalid,
[class*="ep-booking"] select:required:invalid {
    color: #9ca3af !important;
    font-weight: 500 !important;
}

/* 5. 多行文本框 (textarea) 特化 */
[class*="ep-booking"] textarea {
    min-height: 140px !important;
    height: auto !important;
    line-height: 1.6 !important;
    resize: vertical !important;
    /* 允许垂直拉伸 */
}

/* 6. 单选/多选胶囊化设计 (高级感核心) */
.ep-checkbox-group,
.ep-radio-group {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 10px;
}

.ep-checkbox-item,
.ep-radio-item {
    display: inline-flex !important;
    align-items: center;
    background: #f5f5f7 !important;
    padding: 10px 16px !important;
    border-radius: 10px !important;
    cursor: pointer;
    transition: all 0.2s ease !important;
    border: 1px solid transparent !important;
}

.ep-checkbox-item:has(input:checked),
.ep-radio-item:has(input:checked) {
    background: #fff !important;
    border-color: #D4AF37 !important;
    box-shadow: 0 2px 8px rgba(212, 175, 55, 0.1) !important;
}

.ep-checkbox-item input,
.ep-radio-item input {
    accent-color: #D4AF37 !important;
    width: 18px !important;
    height: 18px !important;
    margin-right: 10px !important;
}

/* 7. 日期选择器图标金色化 */
input[type="date"]::-webkit-calendar-picker-indicator {
    filter: invert(72%) sepia(17%) saturate(1001%) hue-rotate(1deg) brightness(95%) contrast(89%);
    cursor: pointer;
}

/* 8. 清理多余间距 */
.ep-booking__form-group,
.ep-field-wrapper,
.ep-form-row {
    margin-bottom: 0 !important;
}




/* ========================================
   Forms: spacing, dropdown, checkbox and selected-color unified styles
   - 增加字段间距至 24px
   - Dropdown 与 Input 对齐并使用细线箭头图标
   - 移动端 Checkbox 垂直排列，扩大点击热区
   - 所有选中态使用品牌金 #B8977E，未选中使用高级灰
*/




/* 细线箭头（统一金色 + 强制浅色下拉面板） */
#ep-booking-calendar-app select {
    color-scheme: light !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23B8977E' stroke-width='1.35' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    padding-right: 40px !important;
    /* 为箭头留空间 */
}

#ep-booking-calendar-app select option,
#ep-booking-calendar-app select optgroup {
    color-scheme: light !important;
    background: #fffdf8 !important;
    color: #1f2937 !important;
}

/* 3) Checkbox / Radio：卡片式布局，减少空白并强化选中反馈 */
.ep-checkbox-group,
.ep-checkboxes,
.ep-form-checkboxes,
.ep-booking__checkboxes,
.ep-booking__form-group--checkbox,
.ep-radio-group {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
    gap: 12px !important;
    margin-top: 10px !important;
}

.ep-checkbox-item,
.ep-radio-item,
.ep-checkboxes label,
.ep-form-checkboxes label,
.ep-booking__checkboxes label {
    position: relative !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 10px !important;
    width: 100% !important;
    min-height: 58px !important;
    margin: 0 !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
    border: 1px solid #e5e7eb !important;
    background: linear-gradient(180deg, #fbfbfc 0%, #f3f4f6 100%) !important;
    cursor: pointer !important;
    user-select: none !important;
    box-sizing: border-box !important;
    transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease !important;
}

.ep-checkbox-item:hover,
.ep-radio-item:hover,
.ep-checkboxes label:hover,
.ep-form-checkboxes label:hover,
.ep-booking__checkboxes label:hover {
    transform: translateY(-1px);
    border-color: rgba(184, 151, 126, 0.45) !important;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06) !important;
}

.ep-checkbox-item.is-selected,
.ep-radio-item.is-selected,
.ep-checkbox-item:has(input:checked),
.ep-radio-item:has(input:checked) {
    background: linear-gradient(180deg, #fffdf7 0%, #fff8eb 100%) !important;
    border-color: #D4AF37 !important;
    box-shadow: 0 8px 18px rgba(212, 175, 55, 0.16) !important;
}

.ep-checkbox-item__text,
.ep-radio-item__text,
.ep-checkboxes label span,
.ep-form-checkboxes label span,
.ep-booking__checkboxes label span {
    display: block !important;
    flex: 1 1 auto !important;
    font-size: 15px !important;
    line-height: 1.55 !important;
    color: #1f2937 !important;
    font-weight: 700 !important;
}

.ep-checkbox-item input[type="checkbox"],
.ep-radio-item input[type="radio"],
input[type="checkbox"] {
    width: 20px !important;
    height: 20px !important;
    flex-shrink: 0 !important;
    margin: 1px 0 0 0 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    border: 2px solid #cfd6dc !important;
    border-radius: 6px !important;
    background: #ffffff !important;
    display: inline-block !important;
    position: relative !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

.ep-radio-item input[type="radio"] {
    border-radius: 999px !important;
}

.ep-checkbox-item input[type="checkbox"]:checked,
.ep-radio-item input[type="radio"]:checked,
input[type="checkbox"]:checked {
    background: linear-gradient(135deg, #D4AF37 0%, #B8977E 100%) !important;
    border-color: #D4AF37 !important;
}

.ep-checkbox-item input[type="checkbox"]:checked::after,
input[type="checkbox"]:checked::after {
    content: '' !important;
    position: absolute !important;
    left: 5px !important;
    top: 2px !important;
    width: 6px !important;
    height: 10px !important;
    border: solid white !important;
    border-width: 0 2px 2px 0 !important;
    transform: rotate(45deg) !important;
}

.ep-radio-item input[type="radio"]:checked::after {
    content: '' !important;
    position: absolute !important;
    inset: 4px !important;
    border-radius: 999px !important;
    background: #ffffff !important;
}

@media (max-width: 1023px) {
    .ep-checkbox-group,
    .ep-checkboxes,
    .ep-form-checkboxes,
    .ep-booking__checkboxes,
    .ep-radio-group {
        grid-template-columns: 1fr !important;
    }
}

/* 4) 全局选中态统一品牌金（时间按钮、日期、确认标签等） */

.ep-booking__day--selected,
.ep-calendar-date.selected {
    background: transparent !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

.ep-booking__day,
.ep-calendar-date {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    max-width: 42px !important;
    min-height: 42px !important;
    max-height: 42px !important;
    aspect-ratio: 1 / 1 !important;
    justify-self: center !important;
    align-self: center !important;
    padding: 0 !important;
    border-radius: 999px !important;
    box-sizing: border-box !important;
}

.ep-booking__day:hover:not(.ep-booking__day--empty):not(.ep-booking__day--past):not(.ep-booking__day--selected):not(.ep-booking__day--unavailable),
.ep-calendar-date:hover:not(.disabled):not(.selected) {
    border-radius: 999px !important;
    transform: scale(1.04) !important;
}

.ep-booking__day--selected,
.ep-calendar-date.selected {
    transform: none !important;
    border-radius: 999px !important;
    background: transparent !important;
    box-shadow: none !important;
    isolation: isolate !important;
}

.ep-booking__day--selected::before {
    content: '' !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    transform: translate(-50%, -50%) !important;
    width: 42px !important;
    height: 42px !important;
    border-radius: 999px !important;
    background: linear-gradient(135deg, #D4AF37 0%, #B8860B 100%) !important;
    box-shadow: 0 4px 12px rgba(184, 151, 126, 0.26) !important;
    z-index: -1 !important;
}

.ep-booking__day--selected::after,
.ep-booking__day--selected.ep-booking__day--today::after {
    display: none !important;
}

.ep-booking__day--today:not(.ep-booking__day--selected) {
    color: #8a6d3b !important;
    background: linear-gradient(180deg, rgba(255, 251, 242, 0.96), rgba(255, 255, 255, 0.98)) !important;
    box-shadow: inset 0 0 0 1.5px rgba(212, 175, 55, 0.52), 0 0 0 4px rgba(212, 175, 55, 0.12) !important;
}

.ep-booking__day--today:not(.ep-booking__day--selected)::after {
    width: 8px !important;
    height: 8px !important;
    box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.96), 0 0 10px rgba(212, 175, 55, 0.62) !important;
}



/* 5) 移动端增强：确保 checkbox 垂直排列在移动断点 */
@media (max-width: 1023px) {

    .ep-checkbox-group,
    .ep-checkboxes,
    .ep-form-checkboxes,
    .ep-booking__checkboxes {
        flex-direction: column !important;
    }

    /* 更宽的点击区域以便拇指点击 */
    .ep-checkboxes label,
    .ep-form-checkboxes label,
    .ep-booking__checkboxes label {
        padding: 12px 8px !important;
    }
}



/* --- 左右导航箭头颜色修改 --- */
.ep-calendar-nav__prev,
.ep-calendar-nav__next,
.ep-calendar-header button,
.ep-prev-month,
.ep-next-month {
    color: #B8977E !important;
    /* 箭头颜色 */
    background: rgba(184, 151, 126, 0.05) !important;
    /* 极浅的金色背景 */
    border: 1px solid rgba(184, 151, 126, 0.2) !important;
    transition: all 0.2s ease !important;
}

.ep-calendar-nav__prev:hover,
.ep-calendar-nav__next:hover {
    background: #B8977E !important;
    color: white !important;
}

/* --- 时区 (Timezone) 颜色修改 --- */
.ep-timezone-container,
.ep-timezone-picker,
.ep-booking__timezone {
    color: #475569 !important;
    /* 文字保持高级灰 */
    font-size: 13px !important;
}

/* 时区图标或下拉框高亮 */
.ep-timezone-picker i,
.ep-timezone-icon,
.ep-timezone-picker select {
    color: #B8977E !important;
    /* 图标或文字高亮使用品牌金 */
}

/* 如果时区是一个链接或按钮 */
.ep-timezone-link {
    color: #B8977E !important;
    text-decoration: none !important;
    font-weight: 500 !important;
}

/* ========================================
   Desktop: Title / Description Color Overrides
   ========================================
   不要使用纯黑；桌面端主标题与详情正文分别使用更柔和的深色
*/
@media (min-width: 1024px) {

    /* 主标题 - 提高对比但避免纯黑 */
    .ep-sidebar-event-title,
    .ep-booking__header,
    .ep-booking__title,
    .ep-mobile-header-content h1,
    .ep-summary-strip .ep-date-text {
        color: #1A1A1A !important;
    }

    /* 详情正文 - 主体文本 */
    .ep-sidebar-description,
    .ep-sidebar-description p,
    .ep-main-content,
    .ep-main-content p,
    .ep-summary-info .ep-text,
    .ep-booking__description,
    .ep-booking__form-label {
        color: #333333 !important;
    }
}

/* ========================================
   🌍 时区选择器视觉优化 (Task 1138)
   ======================================== */

/* 1. 容器居中与瘦身：去除背景色，增加呼吸感间距 */
#calendar-timezone-picker,
.ep-calendar-timezone-picker {
    background: transparent !important;
    margin-top: 0 !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    border: none !important;
    box-shadow: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

#summary-timezone-picker,
.ep-timezone-footer {
    background: transparent !important;
    margin-top: 15px !important;
    padding: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    border: none !important;
    box-shadow: none !important;
}

/* 2. 触发器按钮：极简卡片风格 */
.ep-tz-trigger {
    all: unset !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    /* 图标与文字保持 8px 间距 */
    padding: 6px 14px !important;
    background: var(--ep-sidebar-card-bg) !important;
    border: 1px solid var(--ep-sidebar-card-border) !important;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
    backdrop-filter: blur(12px) !important;
    border-radius: 20px !important;
    /* 圆润包边 */
    cursor: pointer !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease !important;
    font-family: inherit !important;
    box-sizing: border-box !important;
    white-space: nowrap !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    max-width: none !important;
    writing-mode: horizontal-tb !important;
}

.ep-tz-trigger:hover {
    background: var(--ep-sidebar-strong-bg) !important;
    border-color: var(--ep-sidebar-strong-border) !important;
    box-shadow: 0 16px 30px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.84) !important;
    transform: translateY(-1px);
}

/* 3. 图标属性：缩小并改为深灰色 */
.ep-tz-trigger>span:nth-child(1)>span:nth-child(1) {
    font-size: 14px !important;
    color: var(--ep-sidebar-muted) !important;
    display: flex !important;
    align-items: center !important;
    opacity: 0.8;
}

/* 4. 文字精简：移除冗余的“时区”二字 */
.ep-tz-trigger>span:nth-child(1)>span:nth-child(2) {
    display: none !important;
}

/* 5. 时区名称文字对齐与调色 */
.ep-tz-trigger>span:nth-child(2) {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
}

.ep-tz-trigger>span:nth-child(2)>span:nth-child(1) {
    font-size: 13px !important;
    font-weight: 500 !important;
    color: var(--ep-sidebar-title) !important;
}

/* 6. 下拉箭头：弱化视觉重量 */
.ep-tz-trigger>span:nth-child(2)>span:nth-child(2) {
    font-size: 10px !important;
    color: var(--ep-sidebar-muted) !important;
}

#calendar-timezone-picker .ep-tz-picker-wrapper,
.ep-calendar-timezone-picker .ep-tz-picker-wrapper {
    width: auto !important;
    display: inline-block !important;
}

#calendar-timezone-picker .ep-tz-trigger,
.ep-calendar-timezone-picker .ep-tz-trigger {
    padding: 6px 14px !important;
    font-size: 13px !important;
    max-width: none !important;
    width: auto !important;
    justify-content: center !important;
    color: var(--ep-sidebar-title) !important;
    align-items: center !important;
}

#calendar-timezone-picker .ep-tz-trigger > span,
.ep-calendar-timezone-picker .ep-tz-trigger > span {
    min-width: 0 !important;
    white-space: nowrap !important;
    word-break: normal !important;
}

/* nth-child(2) = the flex-column text wrapper */
#calendar-timezone-picker .ep-tz-trigger > span:nth-child(2),
.ep-calendar-timezone-picker .ep-tz-trigger > span:nth-child(2) {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    max-width: none !important;
    white-space: nowrap !important;
    word-break: normal !important;
    line-height: 1.3 !important;
    text-align: left !important;
    font-weight: normal !important;
    color: inherit !important;
}

#calendar-timezone-picker .ep-tz-trigger > span:nth-child(1),
#calendar-timezone-picker .ep-tz-trigger > span:nth-child(3),
.ep-calendar-timezone-picker .ep-tz-trigger > span:nth-child(1),
.ep-calendar-timezone-picker .ep-tz-trigger > span:nth-child(3) {
    flex: 0 0 auto !important;
}

/* ========================================
   🎯 时区选择器弹窗列表优化 (Task 1227)
   ======================================== */

/* 1. 列表容器：12px 圆角与纯净悬浮卡片阴影 */
.ep-tz-dropdown-content {
    background: #ffffff !important;
    border-radius: 16px !important;
    /* 更开合 */
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08), 0 4px 12px rgba(0, 0, 0, 0.03) !important;
    border: 1px solid #F0F0F0 !important;
    /* 浅灰色细边框 */
    overflow: visible !important;
    z-index: 2000 !important;
}

/* 2. 搜索框区域：极简药丸化设计 */
.ep-tz-dropdown-content>div:nth-child(1) {
    background: #ffffff !important;
    border-bottom: 1px solid #F0F0F0 !important;
    padding: 12px 14px !important;
}

/* 确认页专属 Trigger 强化 */
#summary-timezone-picker .ep-tz-trigger {
    background: var(--ep-sidebar-strong-bg) !important;
    border: 1px solid var(--ep-sidebar-strong-border) !important;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
    padding: 8px 16px !important;
    border-radius: 12px !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, background 0.3s ease !important;
}

#summary-timezone-picker .ep-tz-trigger:hover {
    border-color: var(--ep-sidebar-strong-border) !important;
    box-shadow: 0 18px 34px rgba(15, 23, 42, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.9) !important;
}

.ep-tz-search {
    all: unset !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 10px 16px !important;
    background: #f5f5f5 !important;
    /* 极淡灰色底色 */
    border: 1px solid transparent !important;
    /* 移除非必要边框 */
    border-radius: 20px !important;
    /* 药丸型圆角 */
    font-size: 13px !important;
    color: #475569 !important;
    transition: all 0.2s ease !important;
}

.ep-tz-search::placeholder {
    color: #94a3b8 !important;
    text-indent: 0 !important;
}

/* 3. 搜索框 Focus 状态 */
.ep-tz-search:focus {
    background: #ffffff !important;
    border-color: #D4AF37 !important;
    /* 品牌金边框 */
    box-shadow: 0 0 0 3px rgba(212, 175, 55, 0.1) !important;
}

/* 4. 下方列表间距修正：防止内容顶起搜索框 */
.ep-tz-list {
    margin-top: 2px !important;
}

/* 5. 分组标题精减：移除背景渐变和蓝色左边框 */
.ep-tz-group>div:nth-child(1) {
    background: transparent !important;
    border-left: none !important;
    color: #94a3b8 !important;
    /* 浅灰色小字 */
    padding: 12px 14px 4px 14px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
}

/* 4. 列表选项通用样式：增大间距，更具呼吸感 */
.ep-tz-option {
    background: transparent !important;
    margin-bottom: 2px !important;
    padding: 10px 14px !important;
    border-radius: 8px !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

/* 设置列表容器内距 */
.ep-tz-list {
    padding: 8px !important;
}

/* 5. 选项内部文字颜色控制 */
.ep-tz-option div[style*="font-weight"] {
    color: #475569 !important;
    /* 标准灰色文字 */
}

/* 地点图标与描述文字 */
.ep-tz-option div[style*="font-size: 12px"] {
    color: #94a3b8 !important;
    opacity: 0.8;
}

/* 时间偏移量：移除背景色与阴影，改为浅灰小字 */
.ep-tz-option div[style*="font-family"] {
    background: transparent !important;
    box-shadow: none !important;
    padding: 0 !important;
    font-size: 12px !important;
    color: #94a3b8 !important;
    font-weight: 500 !important;
}

/* 6. 交互状态优化 */

/* 悬停态：极轻微灰色反馈 */
.ep-tz-option:hover {
    background: #f9fafb !important;
}

/* 选中态：极淡暖金背景 */
.ep-tz-option[style*="background: linear-gradient"] {
    background: rgba(212,175,55,0.07) !important;
}

/* 选中态左侧装饰条：品牌金 */
.ep-tz-option div[style*="position: absolute"] {
    background: #D4AF37 !important;
    width: 3px !important;
    border-radius: 0 4px 4px 0 !important;
}

/* 选中态城市名加深 */
.ep-tz-option[style*="background: linear-gradient"] div[style*="font-weight"] {
    color: #7a5800 !important;
    font-weight: 700 !important;
}

/* 选中态下方小字（地区/城市）加深 */
.ep-tz-option[style*="background: linear-gradient"] div[style*="font-size: 12px"] {
    color: #a08040 !important;
    opacity: 1 !important;
}

/* ========================================
   📅 预约日历头部与导航优化 (Task 1274)
   ======================================== */

/* 1. 头部容器：弹性布局并增大垂直间距 */
.ep-booking__calendar-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 24px !important;
    padding: 0 8px !important;
    gap: 10px !important;
    overflow: visible !important;
}

.ep-booking__calendar-header .ep-calendar-nav {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* 2. 当前月份显示：实现年份与月份的阶梯层级 */
.ep-booking__current-month {
    flex: 1 !important;
    text-align: center !important;
    display: inline-flex !important;
    flex-direction: column-reverse !important;
    /* 月份在上，年份在下（视觉顺序） */
    align-items: center !important;
    line-height: 1.2 !important;
}

/* 月份：加粗加大 */
.ep-header-month {
    font-size: 20px !important;
    font-weight: 800 !important;
    color: #1a202c !important;
    letter-spacing: -0.5px !important;
}

/* 年份：变细变灰 */
.ep-header-year {
    font-size: 14px !important;
    font-weight: 400 !important;
    color: #94a3b8 !important;
    margin-top: 2px !important;
}

/* 3. 导航按钮：SVG 风格极简设计 */
.ep-booking__nav-btn {
    all: unset !important;
    width: 38px !important;
    height: 38px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    color: #64748b !important;
    border-radius: 50% !important;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
    border: 1px solid transparent !important;
    font-size: 0 !important;
    /* 隐藏原有的 < > 字符 */
}

/* 🚀 咨询方式去框优化 */
.ep-booking__delivery-option {
    border: none !important;
    background: #f8fafb !important;
    box-shadow: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.ep-booking__delivery-option:hover {
    background: #f1f5f9 !important;
    transform: translateY(-2px) !important;
}

.ep-booking__delivery-option--active {
    background: #ffffff !important;
    border: 2px solid #D4AF37 !important;
    /* 激活时金色渐变感边框 */
    box-shadow: 0 10px 25px rgba(212, 175, 55, 0.1) !important;
}

.ep-booking__nav-btn:hover {
    background: rgba(212, 175, 55, 0.05) !important;
    color: #D4AF37 !important;
    border-color: rgba(212, 175, 55, 0.15) !important;
    transform: scale(1.05);
}

/* 使用伪元素构造类似 SVG 的轻量箭头 */
.ep-booking__nav-btn::before {
    content: "" !important;
    width: 8px !important;
    height: 8px !important;
    border-top: 1.5px solid currentColor !important;
    border-right: 1.5px solid currentColor !important;
    display: block !important;
}

/* 左箭头 */
.ep-booking__nav-btn:nth-child(1)::before {
    transform: rotate(-135deg) !important;
    margin-left: 2px !important;
}

/* 右箭头 */
.ep-booking__nav-btn:nth-child(3)::before {
    transform: rotate(45deg) !important;
    margin-right: 2px !important;
}

/* 4. 星期表头轻量化：缩小字号，增加间距 */
.ep-booking__weekdays {
    display: grid !important;
    grid-template-columns: repeat(7, 1fr) !important;
    margin-bottom: 12px !important;
    padding: 0 4px !important;
}

.ep-booking__weekdays span {
    font-size: 12px !important;
    font-weight: 600 !important;
    color: #94a3b8 !important;
    /* 优雅的浅灰 */
    text-transform: uppercase !important;
    letter-spacing: 1.5px !important;
    /* 增加字间距 */
    text-align: center !important;
}

/* ========================================
   ElitePulse 侧边栏排版 3.0 终极精修版
   目标：紧凑、精致、逻辑清晰
   ======================================== */

/* 1. 核心描述区：恢复自然层级 */
.ep-sidebar .ep-sidebar-description,
.ep-sidebar .ep-booking-event-description {
    white-space: normal !important;
    /* 源内容本身是 HTML，避免把编辑器里的空白/缩进渲染成大间距 */
    line-height: 1.6 !important;
    /* 标准黄金行高 */
    color: #444 !important;
    font-size: 15px !important;
}

/* 2. 彻底收紧段落间距 */
.ep-sidebar p {
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    /* 显著减小段落间距，防止鸿沟 */
}

/* 3. 列表专项优化：解决 image_fa8e81 中的“距离感” */
.ep-sidebar ul {
    padding-left: 0 !important;
    /* 取消左侧默认缩进 */
    margin: 12px 0 !important;
    /* 整个列表上下留白 */
    list-style: none !important;
}

.ep-sidebar li {
    position: relative;
    margin-bottom: 6px !important;
    /* 极窄的项目间距，确保紧凑感 */
    line-height: 1.5 !important;
    padding-left: 22px !important;
    /* 为金色圆点留出位置 */
    color: #555 !important;
    display: block !important;
}

/* 金色小圆点：保持精致小巧 */
.ep-sidebar li::before {
    content: "●";
    /* 使用实心圆点 */
    font-size: 8px;
    /* 缩小尺寸 */
    color: #D4AF37;
    position: absolute;
    left: 4px;
    /* 调整圆点位置 */
    top: 4px;
    /* 圆点对齐首行文字 */
}

/* 4. 标题加粗：取消块级显示，恢复自然行内加粗 */
.ep-sidebar strong,
.ep-sidebar b {
    display: inline !important;
    /* 严禁强制换行 */
    color: #111 !important;
    font-weight: 700 !important;
}

/* 5. 左侧简介区：保留自然换行，形成高端咨询页节奏 */
.ep-sidebar br {
    display: block !important;
    content: '';
    line-height: 0 !important;
    margin: 0 0 0.46rem !important;
}

/* 6. 左侧教练 / 事件信息排版精修 */
.ep-sidebar .ep-sidebar-profile {
    margin-bottom: 10px !important;
    gap: 4px !important;
}

.ep-sidebar .ep-sidebar-avatar {
    margin-bottom: 6px !important;
}

.ep-sidebar .ep-sidebar-Instructor-info {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 2px !important;
    margin: 0 !important;
}

.ep-sidebar .ep-sidebar-Instructor-label {
    font-size: 15px !important;
    line-height: 1.34 !important;
    letter-spacing: 0.01em !important;
    color: #1f2937 !important;
    margin: 0 !important;
}

.ep-sidebar .ep-sidebar-instructor-bio {
    font-size: 12.8px !important;
    line-height: 1.85 !important;
    color: #5b6472 !important;
    margin: 0 0 10px !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    text-wrap: pretty;
}

.ep-sidebar .ep-sidebar-duration {
    font-size: 13px !important;
    color: #6b7280 !important;
    margin: 0.2rem 0 0.9rem 0 !important;
}

.ep-sidebar .ep-sidebar-event-title {
    font-size: clamp(20px, 1.6vw, 26px) !important;
    line-height: 1.26 !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
    color: #0f172a !important;
    margin: 10px 0 12px 0 !important;
    text-wrap: balance;
}

.ep-sidebar .ep-sidebar-description,
.ep-sidebar .ep-booking-event-description {
    white-space: normal !important;
    font-size: 14px !important;
    line-height: 1.72 !important;
    color: #475569 !important;
    letter-spacing: 0.004em !important;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    overflow-wrap: anywhere;
    text-wrap: pretty;
}

.ep-sidebar .ep-sidebar-description p,
.ep-sidebar .ep-sidebar-description div,
.ep-sidebar .ep-sidebar-description blockquote,
.ep-sidebar .ep-booking-event-description p,
.ep-sidebar .ep-booking-event-description div,
.ep-sidebar .ep-booking-event-description blockquote {
    margin: 0 0 8px !important;
    line-height: inherit !important;
    white-space: normal !important;
}

.ep-sidebar .ep-sidebar-description h1,
.ep-sidebar .ep-sidebar-description h2,
.ep-sidebar .ep-sidebar-description h3,
.ep-sidebar .ep-sidebar-description h4,
.ep-sidebar .ep-booking-event-description h1,
.ep-sidebar .ep-booking-event-description h2,
.ep-sidebar .ep-booking-event-description h3,
.ep-sidebar .ep-booking-event-description h4 {
    margin: 10px 0 6px !important;
    line-height: 1.32 !important;
}

.ep-sidebar .ep-sidebar-description ul,
.ep-sidebar .ep-sidebar-description ol,
.ep-sidebar .ep-booking-event-description ul,
.ep-sidebar .ep-booking-event-description ol {
    list-style: none !important;
    padding-left: 0 !important;
    margin: 2px 0 4px !important;
    display: grid !important;
    gap: 2px !important;
}

.ep-sidebar .ep-sidebar-description li,
.ep-sidebar .ep-booking-event-description li {
    position: relative !important;
    display: block !important;
    margin: 0 !important;
    padding-left: 18px !important;
    line-height: 1.48 !important;
    color: #4b5563 !important;
    white-space: normal !important;
}

.ep-sidebar .ep-sidebar-description li::before,
.ep-sidebar .ep-booking-event-description li::before {
    content: '●' !important;
    position: absolute !important;
    left: 2px !important;
    top: 0.38em !important;
    font-size: 8px !important;
    color: #D4AF37 !important;
}

.ep-sidebar .ep-sidebar-description strong,
.ep-sidebar .ep-sidebar-description b,
.ep-sidebar .ep-booking-event-description strong,
.ep-sidebar .ep-booking-event-description b {
    color: #111827 !important;
    font-weight: 800 !important;
}

.ep-sidebar p {
    margin-bottom: 7px !important;
}

/* ========================================
   Back-to-back 推荐样式
   ======================================== */
.ep-slot-item.recommended-back-to-back,
.ep-slot-capsule.recommended-back-to-back,
.slot.recommended-back-to-back {
    border: 2px solid #10b981 !important;
    background-color: rgba(16, 185, 129, 0.08) !important;
}

.ep-slot-item.recommended-back-to-back .ep-back-to-back-badge,
.ep-slot-capsule.recommended-back-to-back .ep-back-to-back-badge,
.slot.recommended-back-to-back .ep-back-to-back-badge {
    display: inline-block;
    font-size: 10px;
    padding: 2px 6px;
    background: #10b981;
    color: white;
    border-radius: 3px;
    margin-left: 5px;
}

.ep-slot-item.recommended-back-to-back:hover,
.ep-slot-capsule.recommended-back-to-back:hover,
.slot.recommended-back-to-back:hover {
    background-color: rgba(16, 185, 129, 0.12) !important;
}



/* --- 右侧盒子整体：去边框、去阴影、透明化 --- */
/* 1. 物理消失术：干掉右侧区域所有的边框、阴影、背景 */
.ep-time-slots-box,
.ep-time-slots-box *,
.ep-booking__inline-slots,
.ep-booking__inline-slots * {
    border: none !important;
    border-left: none !important;
    border-right: none !important;
    box-shadow: none !important;
}

/* 2. 深度隐藏滚动条：扫描右侧所有可能产生滚动的容器 */
.ep-time-slots-box,
.ep-booking__inline-slots,
.ep-booking__inline-time-slots {
    scrollbar-width: none !important;
    /* Firefox */
    -ms-overflow-style: none !important;
    /* IE/Edge */
}

/* 针对 Webkit 内核的暴力隐藏 */
.ep-time-slots-box::-webkit-scrollbar,
.ep-booking__inline-slots::-webkit-scrollbar,
.ep-booking__inline-time-slots::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    background: transparent !important;
}

/* 3. 修正 Sticky：确保它能盖住滚上来的东西 */
.ep-booking__inline-slots-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 999 !important;
    /* 提到最高 */
    background: #ffffff !important;
    padding: 15px 0 !important;
    margin: 0 0 10px 0 !important;
}

/* 4. 左侧日历边缘清理：防止边框是左边给的 */
.ep-calendar-box {
    border-right: none !important;
}

/* --- 修复按钮左侧遮挡与消失的边框 --- */
.ep-booking__inline-time-slots {
    /* 1. 增加左右内边距，给按钮圆角留出呼吸空间 */
    padding: 10px 16px !important;

    /* 2. 确保容器宽度足够且不裁剪边框 */
    width: 100% !important;
    box-sizing: border-box !important;

    /* 3. 布局微调 */
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
}

/* --- 强化按钮边框，防止被“消失术”杀掉 --- */
.ep-time-slot {
    /* 显式声明边框，解决图片中边框看不见的问题 */
    border: 1px solid #e5e7eb !important;
    background: #ffffff !important;
    margin-left: 2px !important;
    /* 微调：向右挪一点点，彻底避开遮挡 */
    width: calc(100% - 4px) !important;
    /* 配合位移缩小宽度 */
}

/* =============================================
   🍏 装修部分：苹果风“钛金”按钮 (放在物理消失术后面)
   ============================================= */

/* 1. 基础卡片 - 重新声明边框，夺回被消失术杀掉的边框 */
.ep-time-slot {
    width: 100% !important;
    min-height: 56px !important;
    background: #ffffff !important;
    border: 1.2px solid #d1d5db !important;
    /* 加深默认边框颜色 */
    padding: 14px 16px !important;
    /* 增加高度让按钮更饱满 */
    /* 强制拉回边框 */
    border-radius: 14px !important;
    margin-bottom: 12px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
    /* 增加微小投影提升立体感 */
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    transition: all 0.4s cubic-bezier(0.23, 1, 0.32, 1) !important;
    position: relative !important;
    overflow: hidden !important;
    opacity: 0;
    transform: translateY(8px);
    animation: epFadeInUp 0.6s cubic-bezier(0.23, 1, 0.32, 1) forwards;
}

/* 2. 选中态：钛金视觉 (优先级最高) */
.ep-time-slot.selected {
    background: #FDFCF0 !important;
    border: 1.5px solid #C5A059 !important;
    color: #8A6D3B !important;
    transform: scale(1.03) translateY(-1px) !important;
    box-shadow: 0 4px 15px rgba(197, 160, 89, 0.15) !important;
    z-index: 10 !important;
}

/* 2. 字体核心优化：变大、变粗、加深颜色 */
.ep-time-slot .slot-time {
    font-size: 17px !important;
    /* 从 15px 提升到 17px */
    font-weight: 600 !important;
    /* 使用 600 粗体，比 700 优雅但比 500 清晰 */
    color: #111827 !important;
    /* 使用接近纯黑的深灰色，确保高对比度 */
    letter-spacing: 0.5px !important;
    /* 微调字间距，更有质感 */
}

/* 3. 选中态强化：让选中后的数字更跳跃 */
.ep-time-slot.selected .slot-time {
    font-size: 18px !important;
    /* 选中时微增大小 */
    color: #8A6D3B !important;
    /* 匹配钛金深琥珀色 */
    font-weight: 700 !important;
}

/* 3. 钛金光掠影动画 */
.ep-time-slot.selected::after {
    content: "" !important;
    position: absolute !important;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0 !important;
    background: linear-gradient(110deg,
            rgba(255, 255, 255, 0) 35%,
            rgba(255, 255, 255, 0.45) 50%,
            rgba(255, 255, 255, 0) 65%) !important;
    background-size: 200% 100% !important;
    animation: apple-glint 3.5s infinite linear !important;
}

/* 4. 瀑布流进场延迟 (智能公式版) */
.ep-time-slot:nth-child(1) {
    animation-delay: 0.05s !important;
}

.ep-time-slot:nth-child(2) {
    animation-delay: 0.10s !important;
}

.ep-time-slot:nth-child(3) {
    animation-delay: 0.15s !important;
}

.ep-time-slot:nth-child(4) {
    animation-delay: 0.20s !important;
}

.ep-time-slot:nth-child(5) {
    animation-delay: 0.25s !important;
}

.ep-time-slot:nth-child(6) {
    animation-delay: 0.30s !important;
}

@keyframes apple-glint {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

@keyframes epFadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* 1. 彻底停用旧的抽屉/遮罩逻辑（防止背景变黑或点击失效） */
.ep-booking-drawer,
.ep-slot-overlay,
.ep-drawer-backdrop {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

/* 2. 确保容器在“推开”时，布局不会被强行截断 */
.ep-responsive-container {
    overflow: visible !important;
    /* 允许三栏溢出容器边缘（如果需要） */
}

@media (min-width: 1024px) {
    .ep-responsive-container.has-selected-date .ep-sidebar {
        flex: 0 0 280px !important;
        width: 280px !important;
        min-width: 280px !important;
        padding: 32px 12px 36px 0 !important;
        gap: 12px !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-profile {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        text-align: left !important;
        gap: 12px !important;
        margin-bottom: 12px !important;
        padding: 12px 10px !important;
        border-radius: 18px !important;
        border: 1px solid rgba(226, 232, 240, 0.94) !important;
        background: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(248,250,252,0.95)) !important;
        box-shadow: 0 14px 28px rgba(15, 23, 42, 0.06) !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-avatar {
        width: 56px !important;
        height: 56px !important;
        margin-bottom: 0 !important;
        flex-shrink: 0 !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-Instructor-info {
        align-items: flex-start !important;
        text-align: left !important;
        gap: 4px !important;
        min-width: 0 !important;
        flex: 1 1 auto !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-Instructor-label {
        font-size: 16px !important;
        line-height: 1.22 !important;
        text-align: left !important;
        width: 100% !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-coach-badge-line {
        width: 100% !important;
        margin: 1px 0 0 !important;
        padding-bottom: 6px !important;
        text-align: left !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-instructor-bio {
        margin: 0 0 12px !important;
        padding: 10px 10px !important;
        border-radius: 14px !important;
        border: 1px solid rgba(226, 232, 240, 0.92) !important;
        background: linear-gradient(180deg, rgba(248,250,252,0.94), rgba(255,255,255,0.97)) !important;
        font-size: 12.8px !important;
        line-height: 1.76 !important;
        color: #5b6472 !important;
        text-align: left !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-duration {
        margin: 0 0 12px !important;
        font-size: 13px !important;
        line-height: 1.35 !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-event-title {
        margin: 8px 0 10px !important;
        font-size: 21px !important;
        line-height: 1.24 !important;
        text-align: left !important;
        text-wrap: pretty !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-price-block {
        margin: 10px 0 14px !important;
        padding: 12px 10px 14px !important;
        overflow: visible !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description {
        margin-top: 4px !important;
        padding: 16px 10px 12px !important;
        font-size: 13.5px !important;
        line-height: 1.8 !important;
        color: #475569 !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
        text-wrap: pretty !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description p,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description div,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description blockquote,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description p,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description div,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description blockquote {
        margin: 0 0 12px !important;
        line-height: inherit !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description h1,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description h2,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description h3,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description h4,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description h1,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description h2,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description h3,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description h4 {
        margin: 12px 0 8px !important;
        line-height: 1.3 !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description ul,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description ol,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description ul,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description ol {
        padding-left: 18px !important;
        margin: 4px 0 10px !important;
        list-style: disc !important;
        display: block !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description ol,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description ol {
        list-style: decimal !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description li,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description li {
        padding-left: 0 !important;
        margin: 0 0 6px !important;
        line-height: 1.55 !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-description li::before,
    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-booking-event-description li::before {
        content: none !important;
    }

    .ep-responsive-container.has-selected-date:not([data-sidebar-mode="soft-card"]) .ep-sidebar .ep-sidebar-toggle-btn {
        margin-top: 8px !important;
        align-self: flex-start !important;
    }
}

/* 3. 平板优化（769-1023px）：取消抽屉，改为日历下方顺序展示；移动端(<769px)保留原有抽屉逻辑 */
@media (min-width: 769px) and (max-width: 1023px) {
    /* 未选日期：完全隐藏 slot box，避免空状态撑破布局 */
    .ep-responsive-container .ep-time-slots-box {
        display: none !important;
        position: relative !important;
        height: auto !important;
        transform: none !important;
        z-index: auto !important;
    }

    /* 选择日期后：以 inline 流显示（取消 fixed 抽屉）*/
    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        display: block !important;
        position: relative !important;
        top: auto !important;
        right: auto !important;
        bottom: auto !important;
        left: auto !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        overflow: visible !important;
        box-shadow: none !important;
        z-index: auto !important;
        padding: 0 !important;
        margin-top: 12px !important;
        background: transparent !important;
    }
}

@media (min-width: 1024px) {
    .ep-responsive-container.has-selected-date {
        gap: 20px !important;
        align-items: flex-start !important;
        overflow-x: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-sidebar {
        overflow: visible !important;
        padding-right: 0 !important;
        margin-right: 0 !important;
        align-self: flex-start !important;
        z-index: 8 !important;
    }

    .ep-responsive-container.has-selected-date .ep-main-content {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: none !important;
        padding: 24px 8px 24px 0 !important;
        overflow: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-calendar-layout-wrapper {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 248px !important;
        gap: 18px !important;
        align-items: start !important;
        justify-content: stretch !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 760px !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-calendar-box {
        flex: 1 1 auto !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 12px !important;
        align-self: start !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__calendar-wrapper,
    .ep-responsive-container.has-selected-date .ep-booking__weekdays,
    .ep-responsive-container.has-selected-date .ep-booking__days-grid {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__weekdays {
        gap: 8px !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__days-grid {
        gap: 4px 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__day {
        min-height: 52px !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        flex: 0 0 248px !important;
        width: 248px !important;
        min-width: 248px !important;
        padding: 0 4px 0 10px !important;
        margin: 0 !important;
        height: auto !important;
        min-height: 760px !important;
        overflow: visible !important;
        align-self: start !important;
    }

    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-profile {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        text-align: center !important;
        gap: 8px !important;
        margin-bottom: 0 !important;
        padding: 4px 0 6px !important;
        border: 0 !important;
        border-color: transparent !important;
        border-radius: 0 !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    .ep-responsive-container.is-step-4.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-profile {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;
        margin-bottom: 0 !important;
        padding: 4px 0 6px !important;
        border: 0 !important;
        border-color: transparent !important;
        border-radius: 0 !important;
        background: transparent !important;
        background-image: none !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
        text-align: center !important;
    }

    .ep-responsive-container.is-step-4.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-Instructor-info {
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
    }

    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-Instructor-info {
        align-items: center !important;
        text-align: center !important;
        gap: 2px !important;
    }

    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-Instructor-label,
    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-coach-badge-line,
    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-event-title,
    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-instructor-bio {
        text-align: center !important;
        width: auto !important;
    }

    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-instructor-bio,
    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-description,
    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-booking-event-description {
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-price-block {
        margin: 10px 0 14px !important;
        padding: 16px 16px 18px 34px !important;
        overflow: visible !important;
        box-shadow: 0 20px 30px -22px rgba(15, 23, 42, 0.34), 0 10px 18px -20px rgba(15, 23, 42, 0.22), inset 0 1px 0 rgba(255,255,255,0.88) !important;
    }

    .ep-responsive-container.has-selected-date[data-sidebar-mode="soft-card"] .ep-sidebar .ep-sidebar-price-block::before {
        left: 16px !important;
        top: 14px !important;
        bottom: 14px !important;
        width: 3px !important;
        opacity: 0.88 !important;
    }
}



/* 必填圆点：品牌钛金色 */
.ep-required-dot {
    color: #C5A059 !important;
    font-size: 10px;
    margin-left: 4px;
    vertical-align: middle;
}

/* 可选标注：极简灰色 */
.ep-optional-label {
    font-size: 12px !important;
    color: #94a3b8 !important;
    font-weight: 400 !important;
    margin-left: 6px;
}

/* 错误提示容器 */
.ep-field-error-msg {
    color: #ef4444 !important;
    font-size: 12px !important;
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 4px;
    font-weight: 500;
}

/* 错误时的输入框变红 */
.ep-input-invalid {
    border-color: #ef4444 !important;
    background-color: #fffafb !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.08) !important;
}

/* 错误提示淡入动画 */
.ep-error-fade-enter-active {
    transition: all 0.3s ease-out;
}
.ep-error-fade-enter-from {
    opacity: 0;
    transform: translateY(-5px);
}

#ep-booking-app .ep-booking__form-group--error .ep-booking__form-input,
#ep-booking-calendar-app .ep-booking__form-group--error .ep-booking__form-input {
    border-color: #ef4444 !important;
    background: #fffafb !important;
    box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.08) !important;
}

#ep-booking-app .ep-error-text,
#ep-booking-calendar-app .ep-error-text {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin-top: 8px !important;
    color: #dc2626 !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    animation: ep-error-rise 0.22s ease-out !important;
}

#ep-booking-app .ep-error-text::before,
#ep-booking-calendar-app .ep-error-text::before {
    content: '•';
    font-size: 14px;
    line-height: 1;
}

#ep-booking-app .ep-field-wrapper.has-error .ep-choice-option-card,
#ep-booking-calendar-app .ep-field-wrapper.has-error .ep-choice-option-card {
    border-color: rgba(239, 68, 68, 0.28) !important;
    background: linear-gradient(180deg, #fffdfd 0%, #fff7f7 100%) !important;
}

#ep-booking-app .ep-submit-validation-note,
#ep-booking-calendar-app .ep-submit-validation-note {
    margin: 0 0 12px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(239, 68, 68, 0.16) !important;
    background: linear-gradient(180deg, rgba(254, 242, 242, 0.96) 0%, rgba(255, 251, 251, 0.96) 100%) !important;
    color: #b42318 !important;
    font-size: 13px !important;
    line-height: 1.5 !important;
    text-align: center !important;
    box-shadow: 0 6px 18px rgba(239, 68, 68, 0.06) !important;
}

#ep-booking-app .ep-file-upload-field,
#ep-booking-calendar-app .ep-file-upload-field {
    margin-top: 8px !important;
}

#ep-booking-app .ep-file-upload-dropzone,
#ep-booking-calendar-app .ep-file-upload-dropzone {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 16px 18px !important;
    border: 1px dashed rgba(201, 162, 39, 0.32) !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, rgba(255, 252, 246, 0.98) 0%, rgba(255, 255, 255, 0.98) 100%) !important;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.04) !important;
    cursor: pointer !important;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease !important;
}

#ep-booking-app .ep-file-upload-dropzone:hover,
#ep-booking-calendar-app .ep-file-upload-dropzone:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(201, 162, 39, 0.56) !important;
    box-shadow: 0 12px 26px rgba(201, 162, 39, 0.10) !important;
}

#ep-booking-app .ep-file-upload-dropzone.is-disabled,
#ep-booking-calendar-app .ep-file-upload-dropzone.is-disabled {
    opacity: 0.68 !important;
    cursor: not-allowed !important;
}

#ep-booking-app .ep-file-upload-dropzone.is-invalid,
#ep-booking-calendar-app .ep-file-upload-dropzone.is-invalid,
#ep-booking-app .ep-field-wrapper.has-error .ep-file-upload-dropzone,
#ep-booking-calendar-app .ep-field-wrapper.has-error .ep-file-upload-dropzone {
    border-color: rgba(239, 68, 68, 0.4) !important;
    background: linear-gradient(180deg, #fffdfd 0%, #fff7f7 100%) !important;
}

#ep-booking-app .ep-file-upload-input,
#ep-booking-calendar-app .ep-file-upload-input {
    position: absolute !important;
    inset: 0 !important;
    opacity: 0 !important;
    cursor: pointer !important;
}

#ep-booking-app .ep-file-upload-title,
#ep-booking-calendar-app .ep-file-upload-title {
    color: #5b4331 !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

#ep-booking-app .ep-file-upload-hint,
#ep-booking-calendar-app .ep-file-upload-hint {
    color: #7c6a58 !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
}

#ep-booking-app .ep-file-upload-list,
#ep-booking-calendar-app .ep-file-upload-list {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    margin-top: 10px !important;
}

#ep-booking-app .ep-file-upload-item,
#ep-booking-calendar-app .ep-file-upload-item {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
    border: 1px solid rgba(226, 232, 240, 0.92) !important;
    background: #ffffff !important;
}

#ep-booking-app .ep-file-upload-item.is-uploading,
#ep-booking-calendar-app .ep-file-upload-item.is-uploading {
    border-color: rgba(201, 162, 39, 0.28) !important;
    background: linear-gradient(180deg, #fffdf8 0%, #ffffff 100%) !important;
}

#ep-booking-app .ep-file-upload-item.is-error,
#ep-booking-calendar-app .ep-file-upload-item.is-error {
    border-color: rgba(239, 68, 68, 0.22) !important;
    background: linear-gradient(180deg, #fffafa 0%, #ffffff 100%) !important;
}

#ep-booking-app .ep-file-upload-item__meta,
#ep-booking-calendar-app .ep-file-upload-item__meta {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    min-width: 0 !important;
    flex: 1 1 auto !important;
}

#ep-booking-app .ep-file-upload-item__name,
#ep-booking-calendar-app .ep-file-upload-item__name {
    font-size: 14px !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

#ep-booking-app .ep-file-upload-item__detail,
#ep-booking-calendar-app .ep-file-upload-item__detail {
    font-size: 12px !important;
    color: #8a7a68 !important;
}

#ep-booking-app .ep-file-upload-item__remove,
#ep-booking-calendar-app .ep-file-upload-item__remove {
    border: 0 !important;
    border-radius: 999px !important;
    background: rgba(15, 23, 42, 0.06) !important;
    color: #5b4331 !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    padding: 7px 10px !important;
    cursor: pointer !important;
    transition: background 0.18s ease, color 0.18s ease !important;
}

#ep-booking-app .ep-file-upload-item__remove:hover,
#ep-booking-calendar-app .ep-file-upload-item__remove:hover {
    background: rgba(201, 162, 39, 0.14) !important;
    color: #3f2f22 !important;
}

#ep-booking-app .ep-submit-btn.style-gold.is-attention,
#ep-booking-calendar-app .ep-submit-btn.style-gold.is-attention {
    animation: ep-submit-soft-shake 0.42s ease both !important;
}

@keyframes ep-submit-soft-shake {
    0%, 100% {
        transform: translateX(0);
    }
    20% {
        transform: translateX(-3px);
    }
    40% {
        transform: translateX(3px);
    }
    60% {
        transform: translateX(-2px);
    }
    80% {
        transform: translateX(2px);
    }
}

@keyframes ep-error-rise {
    from {
        opacity: 0;
        transform: translateY(-4px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ===== 移动端日历修复：时区选择器移到导航行下方，防止日历撑出屏幕 ===== */
@media (max-width: 768px) {
    /* 最外层内容区：减少左右 padding，给日历更多宽度 */
    .ep-main-content {
        padding: 12px !important;
    }

    .ep-responsive-container .ep-booking__calendar-wrapper {
        padding: 12px !important;
        border-width: 1.5px !important;
        border-radius: 24px !important;
    }

    /* 日历头部：换行模式，时区选择器自动掉到第二行居中 */
    .ep-booking__calendar-header {
        flex-wrap: wrap !important;
        justify-content: center !important;
        gap: 4px 8px !important;
        overflow: visible !important;
        padding: 0 4px !important;
    }

    /* 日历盒子：全宽，取消 min-width 限制，减少内边距 */
    .ep-calendar-box {
        min-width: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        padding: 12px !important;
        border-width: 1.5px !important;
        border-radius: 20px !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    /* 日历网格和周标题：全宽，确保7列均匀分布 */
    .ep-booking__days-grid,
    .ep-booking__weekdays {
        width: 100% !important;
        box-sizing: border-box !important;
        padding: 0 !important;
    }

    /* 导航按钮和月份标题：占第一行 */
    .ep-booking__nav-btn,
    .ep-booking__current-month {
        flex-shrink: 0 !important;
    }

    /* 时区选择器：独占第二行，居中 */
    #calendar-timezone-picker,
    .ep-calendar-timezone-picker {
        flex-basis: 100% !important;
        display: flex !important;
        justify-content: center !important;
        margin-top: 4px !important;
    }

    /* 日历全宽，防止横向溢出 */
    .ep-booking__calendar {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    /* ── 时区触发按钮防溢出 ── */
    /* 1. 约束触发按钮总宽，overflow 必须保持 visible，
       否则 position:absolute 的下拉菜单会被裁剪不可见 */
    #calendar-timezone-picker .ep-tz-picker-wrapper,
    .ep-calendar-timezone-picker .ep-tz-picker-wrapper {
        max-width: calc(100vw - 32px) !important;
        overflow: visible !important;
    }

    /* 2. 触发按钮：允许内部溢出被截断 */
    #calendar-timezone-picker .ep-tz-trigger,
    .ep-calendar-timezone-picker .ep-tz-trigger {
        max-width: 100% !important;
        overflow: hidden !important;
    }

    /* 3. 城市名称 span（内容最长、最容易溢出） */
    #calendar-timezone-picker .ep-tz-trigger > span:nth-child(2) > span:nth-child(1),
    .ep-calendar-timezone-picker .ep-tz-trigger > span:nth-child(2) > span:nth-child(1) {
        max-width: 120px !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
        display: inline-block !important;
        vertical-align: bottom !important;
    }
}

/* =====================================================
   🔒 时间段抽屉：非 step-2 时强制隐藏
   修复：部分旧版 iOS Safari 中 position:fixed 子元素
   可能逃脱父级 display:none 的保护，导致抽屉在
   step-4（确认页）仍然遮挡内容并拦截滚动事件。
   ===================================================== */
@media (max-width: 1023px) {
    .ep-responsive-container:not(.is-step-2) .ep-time-slots-box {
        transform: translateY(100%) !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

/* =====================================================
   ✨ Custom fields refinement — second pass
   - lighter option cards with subtle breathing room
   - clearer hint spacing and Apple-style inputs
   - radio / checkbox icon and text stay on the same row
   ===================================================== */
#ep-booking-calendar-app .ep-field-wrapper + .ep-field-wrapper {
    margin-top: 8px !important;
}

#ep-booking-calendar-app .ep-field-wrapper {
    margin-bottom: 12px !important;
}

#ep-booking-calendar-app .ep-field-wrapper.is-choice-field {
    margin-bottom: 16px !important;
}

#ep-booking-calendar-app .ep-field-wrapper.is-choice-field .ep-label {
    margin-bottom: 4px !important;
}

#ep-booking-calendar-app .ep-label {
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
    color: #111827 !important;
    margin-top: 30px !important;
    margin-bottom: 8px !important;
}

#ep-booking-calendar-app .ep-label .ep-required,
#ep-booking-calendar-app .ep-required {
    color: #dc2626 !important;
    font-weight: 800 !important;
    margin-left: 2px !important;
}

#ep-booking-calendar-app .ep-field-helper {
    display: none !important;
}

#ep-booking-calendar-app .ep-unified-input,
#ep-booking-calendar-app .ep-select,
#ep-booking-calendar-app input[type="date"],
#ep-booking-calendar-app input[type="number"] {
    min-height: 48px !important;
    height: 48px !important;
    padding: 12px 16px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 12px !important;
    background: #ffffff !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
}

#ep-booking-calendar-app textarea.ep-unified-input {
    min-height: 120px !important;
    height: auto !important;
}

#ep-booking-calendar-app select.ep-unified-input,
#ep-booking-calendar-app select.ep-select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 14 14' fill='none'%3E%3Cpath d='M3 5.25L7 9.25L11 5.25' stroke='%239ca3af' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    background-size: 14px !important;
    padding-right: 42px !important;
}

#ep-booking-calendar-app .ep-checkbox-group,
#ep-booking-calendar-app .ep-radio-group {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)) !important;
    gap: 12px !important;
    margin-top: 8px !important;
}

#ep-booking-calendar-app .ep-checkbox-item,
#ep-booking-calendar-app .ep-radio-item,
#ep-booking-calendar-app .ep-field-option-item {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    min-height: 56px !important;
    margin: 0 !important;
    padding: 14px 16px !important;
    border-radius: 14px !important;
    border: 1px solid #ececec !important;
    background: #ffffff !important;
    box-shadow: none !important;
    transition: border-color 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease, transform 0.18s ease !important;
}

#ep-booking-calendar-app .ep-checkbox-item:hover,
#ep-booking-calendar-app .ep-radio-item:hover,
#ep-booking-calendar-app .ep-field-option-item:hover {
    transform: translateY(-1px) !important;
    border-color: rgba(212, 175, 55, 0.34) !important;
    box-shadow: 0 6px 18px rgba(212, 175, 55, 0.08) !important;
}

#ep-booking-calendar-app .ep-checkbox-item.is-selected,
#ep-booking-calendar-app .ep-radio-item.is-selected,
#ep-booking-calendar-app .ep-field-option-item.is-selected,
#ep-booking-calendar-app .ep-checkbox-item:has(input:checked),
#ep-booking-calendar-app .ep-radio-item:has(input:checked),
#ep-booking-calendar-app .ep-field-option-item:has(input:checked) {
    border-color: #d4af37 !important;
    background: linear-gradient(180deg, #fffdf7 0%, #fff8eb 100%) !important;
    box-shadow: 0 6px 16px rgba(212, 175, 55, 0.12) !important;
    transform: translateY(-1px) !important;
}

#ep-booking-calendar-app .ep-checkbox-item input[type="checkbox"],
#ep-booking-calendar-app .ep-radio-item input[type="radio"] {
    align-self: center !important;
    width: 20px !important;
    height: 20px !important;
    flex: 0 0 20px !important;
    margin: 0 !important;
}

#ep-booking-calendar-app .ep-checkbox-item__text,
#ep-booking-calendar-app .ep-radio-item__text {
    display: inline-block !important;
    min-width: 0 !important;
    margin: 0 !important;
    flex: 1 1 auto !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
    color: #1f2937 !important;
    font-weight: 600 !important;
    word-break: break-word !important;
    overflow-wrap: anywhere !important;
}

#ep-booking-app .ep-submit-section,
#ep-booking-calendar-app .ep-submit-section {
    margin-top: 1.5rem !important;
    padding-top: 1rem !important;
    border-top: 1px solid #f3f4f6 !important;
}

#ep-booking-app .ep-submit-btn.style-gold,
#ep-booking-calendar-app .ep-submit-btn.style-gold {
    position: relative !important;
    overflow: hidden !important;
    background: linear-gradient(180deg, #efe1bf 0%, #dcc086 100%) !important;
    color: #5c4330 !important;
    border: 1px solid rgba(201, 170, 104, 0.45) !important;
    border-radius: 14px !important;
    padding: 18px 36px !important;
    min-height: 56px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    cursor: pointer !important;
    box-shadow: 0 4px 15px rgba(214, 174, 123, 0.26) !important;
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.4s cubic-bezier(0.25, 1, 0.5, 1), filter 0.35s ease, background 0.35s ease, color 0.35s ease, border-color 0.35s ease !important;
    will-change: transform, box-shadow, filter !important;
}

#ep-booking-app .ep-submit-btn.style-gold::before,
#ep-booking-calendar-app .ep-submit-btn.style-gold::before {
    content: '' !important;
    position: absolute !important;
    top: -10% !important;
    left: -170% !important;
    width: 68% !important;
    height: 120% !important;
    background: linear-gradient(115deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.18) 24%, rgba(255,255,255,0.62) 46%, rgba(255,255,255,0.92) 50%, rgba(255,255,255,0.40) 56%, rgba(255,255,255,0.10) 72%, rgba(255,255,255,0) 100%) !important;
    transform: skewX(-22deg) !important;
    transition: left 0.82s cubic-bezier(0.22, 1, 0.36, 1), opacity 0.25s ease !important;
    opacity: 0.95 !important;
    pointer-events: none !important;
}

#ep-booking-app .ep-submit-btn.style-gold:hover,
#ep-booking-calendar-app .ep-submit-btn.style-gold:hover {
    background: linear-gradient(180deg, #f7ebcf 0%, #e6c98f 100%) !important;
    transform: translateY(-4px) scale(1.012) !important;
    box-shadow: 0 14px 32px rgba(214, 174, 123, 0.42) !important;
    border-color: #d2b06e !important;
    color: #4f3928 !important;
    filter: brightness(1.05) saturate(1.05) !important;
}

#ep-booking-app .ep-submit-btn.style-gold:hover::before,
#ep-booking-calendar-app .ep-submit-btn.style-gold:hover::before {
    left: 145% !important;
    opacity: 1 !important;
}

#ep-booking-app .ep-submit-btn.style-gold:active,
#ep-booking-calendar-app .ep-submit-btn.style-gold:active {
    transform: translateY(-1px) scale(0.985) !important;
    box-shadow: 0 5px 15px rgba(214, 174, 123, 0.3) !important;
    transition: all 0.1s ease !important;
}

#ep-booking-app .ep-booking__button--primary.ep-booking__button--full:disabled,
#ep-booking-calendar-app .ep-booking__button--primary.ep-booking__button--full:disabled {
    opacity: 0.72 !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08) !important;
    transform: none !important;
    filter: saturate(0.85) !important;
}

#ep-booking-app .ep-submit-btn.style-gold.is-loading,
#ep-booking-calendar-app .ep-submit-btn.style-gold.is-loading {
    cursor: progress !important;
}

#ep-booking-app .ep-submit-trust,
#ep-booking-calendar-app .ep-submit-trust {
    margin-top: 20px !important;
    color: #a1a1a6 !important;
    font-size: 12px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 5px !important;
    letter-spacing: 0.5px !important;
}

#ep-booking-app .ep-submit-btn.style-gold.is-loading::after,
#ep-booking-calendar-app .ep-submit-btn.style-gold.is-loading::after {
    content: '' !important;
    display: inline-block !important;
    width: 14px !important;
    height: 14px !important;
    margin-left: 8px !important;
    vertical-align: -2px !important;
    border-radius: 999px !important;
    border: 2px solid rgba(15, 23, 42, 0.22) !important;
    border-top-color: #0f172a !important;
    animation: ep-submit-spin 0.75s linear infinite !important;
}

@keyframes ep-submit-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 1023px) {
    #ep-booking-calendar-app .ep-checkbox-group,
    #ep-booking-calendar-app .ep-radio-group {
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    #ep-booking-calendar-app .ep-checkbox-item,
    #ep-booking-calendar-app .ep-radio-item {
        min-height: 50px !important;
        padding: 12px 14px !important;
    }
}

@media (max-width: 768px) {
    #ep-booking-app .ep-submit-btn.style-gold:hover,
    #ep-booking-calendar-app .ep-submit-btn.style-gold:hover {
        transform: none !important;
        box-shadow: 0 4px 15px rgba(214, 192, 160, 0.25) !important;
        filter: none !important;
    }

    #ep-booking-app .ep-submit-section,
    #ep-booking-calendar-app .ep-submit-section {
        position: sticky !important;
        bottom: 8px !important;
        z-index: 10 !important;
        padding: 12px 0 calc(12px + env(safe-area-inset-bottom)) !important;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ffffff 24%, #ffffff 100%) !important;
    }
}

/* ========================================
   Theme Differentiation Overrides
   ======================================== */

#ep-booking-calendar-app {
    background:
        radial-gradient(circle at top right, var(--ep-canvas-accent) 0%, transparent 36%),
        linear-gradient(180deg, var(--ep-canvas-bg) 0%, var(--bg-body) 100%) !important;
}

.ep-responsive-container .ep-booking__calendar-wrapper {
    background: var(--ep-calendar-shell-bg) !important;
    border: 1.5px solid var(--ep-calendar-shell-border) !important;
    box-shadow: var(--ep-calendar-shell-shadow) !important;
    border-radius: 30px !important;
    padding: 12px !important;
}

.ep-responsive-container .ep-calendar-box {
    background: var(--ep-calendar-card-bg) !important;
    border: 1.5px solid var(--ep-calendar-card-border) !important;
    box-shadow: var(--ep-calendar-card-shadow) !important;
    border-radius: 24px !important;
}

.ep-responsive-container .ep-time-slots-box {
    background: var(--ep-slot-panel-bg) !important;
    border: 1.5px solid var(--ep-slot-panel-border) !important;
    box-shadow: var(--ep-slot-panel-shadow) !important;
    border-radius: 24px !important;
}

.ep-responsive-container .ep-booking__current-month,
.ep-responsive-container .ep-header-month {
    color: var(--ep-calendar-heading) !important;
}

.ep-responsive-container .ep-header-year,
.ep-responsive-container .ep-booking__weekdays span {
    color: var(--ep-calendar-subtle) !important;
}

.ep-responsive-container .ep-booking__nav-btn {
    background: var(--ep-calendar-nav-bg) !important;
    border: 1px solid var(--ep-calendar-nav-border) !important;
    color: var(--ep-calendar-nav-color) !important;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.06) !important;
}

.ep-responsive-container .ep-booking__nav-btn:hover {
    background: var(--ep-calendar-nav-hover-bg) !important;
    border-color: var(--ep-calendar-nav-hover-border) !important;
    color: var(--ep-calendar-nav-hover-color) !important;
}

.ep-responsive-container .ep-booking__delivery-option {
    background: color-mix(in srgb, var(--ep-calendar-card-bg) 86%, var(--surface) 14%) !important;
    border: 1px solid color-mix(in srgb, var(--ep-calendar-card-border) 86%, var(--surface) 14%) !important;
}

.ep-responsive-container .ep-booking__delivery-option--active {
    background: var(--ep-delivery-active-bg) !important;
    border: 2px solid var(--ep-delivery-active-border) !important;
    box-shadow: var(--ep-delivery-active-shadow) !important;
}

.ep-responsive-container .ep-time-slot {
    background: var(--ep-slot-bg) !important;
    border-color: var(--ep-slot-border) !important;
    box-shadow: var(--ep-slot-shadow) !important;
    color: var(--ep-slot-text) !important;
}

.ep-responsive-container .ep-time-slot .slot-time,
.ep-responsive-container .ep-time-slot .slot-spots {
    color: inherit !important;
}

.ep-responsive-container .ep-time-slot .slot-time {
    font-weight: 850 !important;
    letter-spacing: -0.04em !important;
    line-height: 0.96 !important;
    text-align: center !important;
    text-rendering: geometricPrecision;
    -webkit-font-smoothing: antialiased;
    background: linear-gradient(180deg, #bc8b24 0%, #896113 58%, #68470d 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
}

.ep-responsive-container .ep-time-slot.selected {
    background: var(--ep-slot-selected-bg) !important;
    border-color: var(--ep-slot-selected-border) !important;
    color: var(--ep-slot-selected-text) !important;
    box-shadow: var(--ep-slot-selected-shadow) !important;
}

.ep-responsive-container .ep-time-slot.confirming {
    background: var(--ep-slot-selected-bg) !important;
    border-color: var(--ep-slot-selected-border) !important;
    color: var(--ep-slot-selected-text) !important;
    box-shadow: var(--ep-slot-selected-shadow) !important;
}

.ep-responsive-container .ep-time-slot.selected .slot-time,
.ep-responsive-container .ep-time-slot.confirming .slot-time,
.ep-responsive-container .ep-time-slot.selected .slot-spots,
.ep-responsive-container .ep-time-slot.confirming .slot-spots {
    color: var(--ep-slot-selected-text) !important;
}

.ep-responsive-container .ep-time-slot.selected .slot-time,
.ep-responsive-container .ep-time-slot.confirming .slot-time {
    background: linear-gradient(180deg, #7b550d 0%, #5b3d0a 100%) !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    color: transparent !important;
}

.ep-sidebar-description::after,
.ep-mobile-event-description::after {
    background: var(--ep-description-fade) !important;
}

@media (min-width: 1024px) {
    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
        padding: 0 0 16px !important;
        min-height: auto !important;
        height: auto !important;
        max-height: none !important;
        overflow: visible !important;
        position: static !important;
        top: auto !important;
        scrollbar-width: auto !important;
        scrollbar-color: auto !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__inline-slots {
        display: flex !important;
        flex-direction: column !important;
        min-height: auto !important;
        max-height: none !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__inline-slots-header {
        flex: 0 0 auto !important;
        position: static !important;
        top: auto !important;
        z-index: auto !important;
        background: transparent !important;
        padding: 0 0 12px !important;
        margin: 0 0 12px !important;
        border-bottom: 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__inline-time-slots {
        flex: 0 0 auto !important;
        min-height: auto !important;
        width: 100% !important;
        padding: 6px 0 20px !important;
        gap: 14px !important;
        overflow: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slot-wrapper {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slot {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        min-height: 72px !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slot:last-child,
    .ep-responsive-container.has-selected-date .ep-time-slot-wrapper:last-child {
        margin-bottom: 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-group-label {
        margin-top: 0.5rem !important;
    }

    .ep-responsive-container.has-selected-date {
        gap: 20px !important;
        align-items: flex-start !important;
        overflow-x: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-sidebar {
        overflow: visible !important;
        padding-right: 0 !important;
        margin-right: 0 !important;
        align-self: flex-start !important;
        z-index: 8 !important;
    }

    .ep-responsive-container.has-selected-date .ep-main-content {
        flex: 1 1 0 !important;
        min-width: 0 !important;
        width: auto !important;
        max-width: none !important;
        padding: 24px 8px 24px 0 !important;
        overflow: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-calendar-layout-wrapper {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) 248px !important;
        gap: 18px !important;
        align-items: start !important;
        justify-content: stretch !important;
        width: 100% !important;
        max-width: none !important;
        min-height: 760px !important;
        margin: 0 !important;
        overflow: visible !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__calendar-wrapper {
        padding: 10px !important;
    }

    .ep-responsive-container.has-selected-date .ep-calendar-box {
        flex: 1 1 auto !important;
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 10px !important;
        align-items: stretch !important;
        align-self: start !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__calendar-header,
    .ep-responsive-container.has-selected-date .ep-calendar-header,
    .ep-responsive-container.has-selected-date .ep-booking__header {
        margin-bottom: 16px !important;
        padding: 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__calendar-wrapper,
    .ep-responsive-container.has-selected-date .ep-booking__weekdays,
    .ep-responsive-container.has-selected-date .ep-booking__days-grid {
        width: 100% !important;
        max-width: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        justify-content: stretch !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__weekdays {
        gap: 8px !important;
        margin-bottom: 12px !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__days-grid {
        gap: 4px 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-booking__day {
        min-height: 52px !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        flex: 0 0 248px !important;
        width: 248px !important;
        min-width: 248px !important;
        padding: 0 4px 0 10px !important;
        margin: 0 !important;
        height: auto !important;
        min-height: 760px !important;
        overflow: visible !important;
        align-self: start !important;
    }
}

@media (min-width: 1024px) and (max-width: 1180px) {
    .ep-responsive-container.has-selected-date {
        gap: 16px !important;
    }

    .ep-responsive-container.has-selected-date .ep-sidebar {
        flex: 0 0 248px !important;
        width: 248px !important;
        min-width: 248px !important;
        padding: 28px 8px 32px 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-main-content {
        padding: 20px 0 !important;
    }

    .ep-responsive-container.has-selected-date .ep-calendar-layout-wrapper {
        grid-template-columns: minmax(0, 1fr) 220px !important;
        gap: 14px !important;
    }

    .ep-responsive-container.has-selected-date .ep-time-slots-box {
        flex: 0 0 220px !important;
        width: 220px !important;
        min-width: 220px !important;
        padding: 0 0 0 6px !important;
    }
}

@media (min-width: 769px) and (max-width: 1023px) {
    #ep-booking-calendar-app,
    .ep-responsive-container,
    .ep-time-slots-box,
    .ep-booking__inline-slots,
    .ep-booking__inline-time-slots {
        scrollbar-width: thin !important;
        scrollbar-color: rgba(197, 160, 89, 0.72) rgba(212, 175, 55, 0.08) !important;
    }

    #ep-booking-calendar-app::-webkit-scrollbar,
    .ep-responsive-container::-webkit-scrollbar,
    .ep-time-slots-box::-webkit-scrollbar,
    .ep-booking__inline-slots::-webkit-scrollbar,
    .ep-booking__inline-time-slots::-webkit-scrollbar {
        width: 10px !important;
        height: 10px !important;
        display: block !important;
        background: transparent !important;
    }

    #ep-booking-calendar-app::-webkit-scrollbar-track,
    .ep-responsive-container::-webkit-scrollbar-track,
    .ep-time-slots-box::-webkit-scrollbar-track,
    .ep-booking__inline-slots::-webkit-scrollbar-track,
    .ep-booking__inline-time-slots::-webkit-scrollbar-track {
        background: rgba(212, 175, 55, 0.08) !important;
        border-radius: 999px !important;
    }

    #ep-booking-calendar-app::-webkit-scrollbar-thumb,
    .ep-responsive-container::-webkit-scrollbar-thumb,
    .ep-time-slots-box::-webkit-scrollbar-thumb,
    .ep-booking__inline-slots::-webkit-scrollbar-thumb,
    .ep-booking__inline-time-slots::-webkit-scrollbar-thumb {
        background: linear-gradient(180deg, rgba(212, 175, 55, 0.88), rgba(184, 134, 11, 0.76)) !important;
        border-radius: 999px !important;
        border: 2px solid rgba(255, 252, 245, 0.95) !important;
    }
}

body.ep-theme-family-storefront.ep-has-booking-surface .ep-responsive-container,
body.ep-theme-family-storefront.ep-has-booking-surface #ep-booking-app {
    width: 100% !important;
    max-width: 1280px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Final guard: mobile calendar 7-column alignment (wins over previous dynamic !important rules). */
@media (max-width: 1023px) {
    .ep-responsive-container .ep-booking__calendar-wrapper,
    .ep-responsive-container.has-selected-date .ep-booking__calendar-wrapper {
        padding: 12px 6px !important;
    }

    .ep-responsive-container .ep-calendar-box,
    .ep-responsive-container.has-selected-date .ep-calendar-box {
        padding: 0 !important;
        overflow: visible !important;
    }

    .ep-responsive-container .ep-booking__weekdays,
    .ep-responsive-container .ep-booking__days-grid,
    .ep-responsive-container.has-selected-date .ep-booking__weekdays,
    .ep-responsive-container.has-selected-date .ep-booking__days-grid {
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
        gap: 2px !important;
        width: 100% !important;
    }

    .ep-responsive-container .ep-booking__day,
    .ep-responsive-container.has-selected-date .ep-booking__day {
        width: auto !important;
        max-width: none !important;
        min-height: 0 !important;
        min-width: 0 !important;
        aspect-ratio: unset !important;
        height: clamp(34px, 9vw, 44px) !important;
        max-height: none !important;
        font-size: clamp(0.82rem, 3.4vw, 0.95rem) !important;
        justify-self: stretch !important;
        align-self: stretch !important;
    }

    .ep-responsive-container .ep-booking__day::after,
    .ep-responsive-container.has-selected-date .ep-booking__day::after {
        bottom: 3px !important;
        width: 4px !important;
        height: 4px !important;
    }

    .ep-responsive-container .ep-booking__day--selected::before,
    .ep-responsive-container.has-selected-date .ep-booking__day--selected::before {
        width: calc(100% - 4px) !important;
        height: calc(100% - 4px) !important;
    }
}
