/* ============================================
   SCHEDULE — Fantasy Illuminated Manuscript
   A proclamation-style layout with enchanted
   botanical archway centerpiece. No scrolling.
   All font sizes ≥ 0.85rem minimum.
   ============================================ */

/* Disable scroll on Schedule page */
.book-page[data-page-index="2"] .book-page-content {
    overflow: hidden;
}

/* --- Scene container --- */
.schedule-content {
    position: relative;
    overflow: hidden;
}

.book-frame .schedule-content.book-page-section-content {
    padding: 2.5rem 1.2rem 2rem;
    overflow: hidden;
}

/* Warm overlay */
.schedule-content::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(250, 240, 225, 0.18) 0%,
        rgba(250, 240, 225, 0.06) 40%,
        rgba(250, 240, 225, 0.06) 60%,
        rgba(250, 240, 225, 0.22) 100%
    );
    pointer-events: none;
    z-index: 0;
}

/* Aged vignette */
.schedule-content::after {
    content: '';
    position: absolute;
    inset: 0;
    box-shadow: inset 0 0 100px rgba(44, 26, 14, 0.2),
                inset 0 0 40px rgba(44, 26, 14, 0.08);
    pointer-events: none;
    z-index: 0;
}

/* ============================================
   Border Frame
   ============================================ */

.schedule-border-frame {
    position: absolute;
    inset: 6px;
    pointer-events: none;
    z-index: 0;
}

.schedule-border-corner {
    position: absolute;
    width: 60px;
    height: 60px;
    color: var(--color-sage);
    opacity: 0.6;
}

.schedule-border-corner--tl { top: 0; left: 0; }
.schedule-border-corner--tr { top: 0; right: 0; }
.schedule-border-corner--bl { bottom: 0; left: 0; }
.schedule-border-corner--br { bottom: 0; right: 0; }

/* ============================================
   Margin Illustrations
   ============================================ */

.schedule-marginalia {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
}

.schedule-margin-icon {
    position: absolute;
}

/* Shire margin icons */
.schedule-margin-icon--acorn {
    width: 20px;
    height: 24px;
    left: 8px;
    top: 6%;
    color: #8b6b47;
}

.schedule-margin-icon--pipe {
    width: 22px;
    height: 30px;
    right: 8px;
    top: 6%;
    color: #8b6b47;
}

.schedule-margin-icon--pipe .shire-smoke {
    animation: shire-smoke-drift 4s ease-in-out infinite;
    transform-origin: center bottom;
}

.schedule-margin-icon--books {
    width: 18px;
    height: 24px;
    left: 8px;
    top: 42%;
    color: #8b6b47;
}

.schedule-margin-icon--teapot {
    width: 22px;
    height: 20px;
    right: 8px;
    top: 42%;
    color: #7a9e7e;
}

.schedule-margin-icon--wildflowers {
    width: 24px;
    height: 22px;
    left: 8px;
    bottom: 8%;
    color: #7a9e7e;
}

.schedule-margin-icon--lantern-post {
    width: 16px;
    height: 30px;
    right: 10px;
    bottom: 8%;
    color: #8b6b47;
}

/* ============================================
   Title + Ornaments + Subheading
   ============================================ */

.schedule-title {
    font-family: var(--font-script);
    font-size: 2.6rem;
    color: #1c1209;
    text-align: center;
    margin: 0 0 0.2rem;
    font-weight: 400;
    line-height: 1.15;
    text-shadow:
        1px 1px 2px rgba(28, 18, 9, 0.25),
        0 0 8px rgba(250, 240, 225, 0.6),
        0 0 20px rgba(232, 196, 188, 0.15),
        0 0 1px rgba(28, 18, 9, 0.15);
    position: relative;
    z-index: 1;
}

/* Illuminated header band beneath title */
.schedule-header-band {
    text-align: center;
    margin: 0.15rem 0;
    position: relative;
    z-index: 1;
}

.schedule-header-band svg {
    width: 90%;
    max-width: 360px;
    height: 18px;
}

/* Decorative heading ornament */
.schedule-title-ornament {
    text-align: center;
    margin: 0.1rem 0 0.15rem;
    position: relative;
    z-index: 1;
}

.schedule-title-ornament svg {
    width: 100px;
    height: 20px;
    color: #7a9e7e;
}

.schedule-subheading {
    font-family: var(--font-manuscript-heading);
    font-variant: small-caps;
    font-size: 0.85rem;
    color: #c17c74;
    text-align: center;
    letter-spacing: 0.18em;
    margin: 0 0 0.8rem;
    position: relative;
    z-index: 1;
    font-feature-settings: "liga" 1, "kern" 1;
    text-shadow: 0 0 1px rgba(28, 18, 9, 0.15);
}

/* ============================================
   Schedule Events — Proclamation Style
   ============================================ */

.schedule-events {
    max-width: 420px;
    margin: 0 auto 0.2rem;
    text-align: center;
    position: relative;
    z-index: 1;
    padding: 0.3rem 0.5rem;
}

.schedule-event {
    margin-bottom: 0.15rem;
    animation: schedule-entry-appear 0.5s ease-out both;
}

.schedule-event:nth-child(2) {
    animation-delay: 0.15s;
}

.schedule-event:nth-child(4) {
    animation-delay: 0.3s;
}

.schedule-event-time {
    font-family: var(--font-manuscript-heading);
    font-variant: small-caps;
    font-weight: 400;
    font-size: 1.15rem;
    letter-spacing: 0.14em;
    color: #c17c74;
    display: block;
    margin-bottom: 0;
    font-feature-settings: "liga" 1, "kern" 1;
    text-shadow: 0 0 8px rgba(193, 124, 116, 0.3);
}

.schedule-event-name {
    font-family: var(--font-manuscript-heading);
    font-size: 1.7rem;
    font-weight: 400;
    color: #1c1209;
    margin: 0;
    text-shadow: 1px 1px 2px rgba(28, 18, 9, 0.25),
                 0 0 1px rgba(28, 18, 9, 0.15);
    font-feature-settings: "liga" 1, "kern" 1;
}

/* Rubricated initial capital — first letter in dusty rose */
.schedule-event-initial {
    font-size: 1.3em;
    color: #c17c74;
    text-shadow: 0 0 6px rgba(193, 124, 116, 0.25);
}

.schedule-event-desc {
    font-family: var(--font-manuscript-body);
    font-size: 0.95rem;
    font-style: italic;
    color: #2c1a0e;
    line-height: 1.7;
    letter-spacing: 0.02em;
    margin: 0;
    font-feature-settings: "liga" 1, "kern" 1;
    text-shadow: 0 0 1px rgba(28, 18, 9, 0.2);
}

/* Decorative divider between entries */
.schedule-event-divider {
    text-align: center;
    margin: 0.15rem 0;
    line-height: 1;
}

.schedule-event-divider svg {
    width: 80px;
    height: 12px;
    color: var(--color-dusty-rose);
    opacity: 0.6;
}

/* ============================================
   Fantasy Botanical Archway Centerpiece
   ============================================ */

.schedule-archway {
    text-align: center;
    margin: 0.8rem auto;
    position: relative;
    z-index: 1;
}

.schedule-archway svg {
    width: clamp(160px, 35vw, 240px);
    max-height: 220px;
    height: auto;
}

/* ============================================
   Botanical Divider (before footer)
   ============================================ */

.schedule-divider {
    text-align: center;
    margin: 0.6rem 0;
    position: relative;
    z-index: 1;
}

.schedule-divider-svg {
    width: 160px;
    height: 24px;
    color: var(--color-sage);
}

/* ============================================
   Footer (Venue + Dress Code)
   ============================================ */

.schedule-footer {
    display: flex;
    justify-content: center;
    gap: 1.2rem;
    max-width: 440px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.schedule-footer-item {
    text-align: center;
    flex: 1;
}

.schedule-footer-label {
    font-family: var(--font-manuscript-heading);
    font-variant: small-caps;
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    color: #7a9e7e;
    display: block;
    margin-bottom: 0.1rem;
    font-feature-settings: "liga" 1, "kern" 1;
}

.schedule-footer-value {
    font-family: var(--font-manuscript-heading);
    font-size: 1.2rem;
    color: #1c1209;
    display: block;
    margin-bottom: 0.05rem;
    text-shadow: 1px 1px 2px rgba(28, 18, 9, 0.2),
                 0 0 1px rgba(28, 18, 9, 0.12);
}

.schedule-footer-detail {
    font-family: var(--font-manuscript-body);
    font-size: 0.875rem;
    color: #3b2a1a;
    line-height: 1.4;
    display: block;
    margin-bottom: 0.05rem;
    text-shadow: 0 0 1px rgba(28, 18, 9, 0.15);
}

/* Clickable venue link */
.schedule-venue-link {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    text-decoration: none;
    color: #1c1209;
    transition: color 0.3s ease;
}

.schedule-venue-link:hover {
    color: #c17c74;
}

.schedule-venue-link:hover .schedule-footer-value {
    color: #c17c74;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-color: rgba(193, 124, 116, 0.4);
}

.schedule-venue-icon {
    width: 16px;
    height: 16px;
    color: #7a9e7e;
    opacity: 0.8;
    flex-shrink: 0;
}

.schedule-venue-icon svg {
    width: 100%;
    height: 100%;
}

/* Footer link (if shown separately) */
.schedule-footer-link {
    font-family: var(--font-manuscript-body);
    font-size: 0.875rem;
    font-style: italic;
    color: #c17c74;
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-color: rgba(193, 124, 116, 0.4);
    transition: color 0.3s ease;
}

/* ============================================
   Sparkle Stars
   ============================================ */

.schedule-sparkles {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 2;
}

.schedule-sparkle {
    position: absolute;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(193, 124, 116, 0.5);
    box-shadow: 0 0 4px rgba(193, 124, 116, 0.25);
    animation: schedule-sparkle-twinkle 4s ease-in-out infinite;
}

.schedule-sparkle--2,
.schedule-sparkle--4,
.schedule-sparkle--6 {
    background: rgba(155, 137, 180, 0.5);
    box-shadow: 0 0 4px rgba(155, 137, 180, 0.25);
}

.schedule-sparkle--1 { top: 6%; right: 18%; animation-delay: 0s; }
.schedule-sparkle--2 { top: 22%; left: 12%; animation-delay: 1s; width: 2px; height: 2px; }
.schedule-sparkle--3 { top: 42%; right: 10%; animation-delay: 2s; }
.schedule-sparkle--4 { top: 58%; left: 15%; animation-delay: 0.5s; width: 2px; height: 2px; }
.schedule-sparkle--5 { bottom: 20%; right: 22%; animation-delay: 1.5s; }
.schedule-sparkle--6 { top: 35%; left: 22%; animation-delay: 2.5s; width: 2px; height: 2px; }
.schedule-sparkle--7 { bottom: 32%; right: 15%; animation-delay: 3s; }

/* Firefly glow dots within archway */
.schedule-firefly {
    position: absolute;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: rgba(232, 196, 160, 0.5);
    box-shadow: 0 0 6px rgba(232, 196, 160, 0.3);
    animation: schedule-firefly-pulse 2s ease-in-out infinite;
}

/* ============================================
   Decorative Animations
   ============================================ */

.schedule-leaves {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.schedule-leaf {
    position: absolute;
    width: 18px;
    height: 18px;
    background: radial-gradient(ellipse, rgba(181, 196, 177, 0.3), transparent 70%);
    border-radius: 50% 0 50% 0;
    animation: schedule-leaf-drift 18s ease-in-out infinite;
}

.schedule-leaf--1 { top: 15%; left: 8%; animation-delay: 0s; animation-duration: 20s; }
.schedule-leaf--2 { top: 55%; right: 12%; animation-delay: 6s; animation-duration: 22s; width: 14px; height: 14px; }
.schedule-leaf--3 { bottom: 20%; left: 18%; animation-delay: 12s; animation-duration: 17s; width: 16px; height: 16px; }

.schedule-fairy-lights {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
}

.fairy-light {
    position: absolute;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: rgba(193, 124, 116, 0.4);
    box-shadow: 0 0 8px rgba(193, 124, 116, 0.25);
    animation: fairy-twinkle 3s ease-in-out infinite;
}

.fairy-light--1 { top: 10%; left: 15%; animation-delay: 0s; }
.fairy-light--2 { top: 25%; right: 20%; animation-delay: 0.7s; }
.fairy-light--3 { top: 50%; left: 5%; animation-delay: 1.4s; }
.fairy-light--4 { top: 70%; right: 10%; animation-delay: 2.1s; }
.fairy-light--5 { bottom: 15%; left: 40%; animation-delay: 0.35s; }

.schedule-mist {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30%;
    pointer-events: none;
    overflow: hidden;
    z-index: 0;
}

.schedule-mist-wisp {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 30px;
    background: linear-gradient(0deg, rgba(255, 255, 255, 0.05), transparent);
    filter: blur(6px);
    animation: schedule-mist-rise 15s ease-in-out infinite;
}

.schedule-mist-wisp--1 { animation-delay: 0s; }
.schedule-mist-wisp--2 { animation-delay: 7.5s; opacity: 0.7; }

/* Shire horizon silhouette at page bottom */
.schedule-horizon {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 30px;
    pointer-events: none;
    z-index: 0;
}

.schedule-horizon svg {
    width: 100%;
    height: 100%;
}

/* Falling oak leaves */
.schedule-falling-leaves {
    position: absolute;
    inset: 0;
    pointer-events: none;
    overflow: hidden;
    z-index: 1;
}

.schedule-oak-leaf {
    position: absolute;
    width: 10px;
    height: 8px;
    top: -10px;
    animation: shire-leaf-fall 9s ease-in-out infinite;
}

.schedule-oak-leaf--1 { left: 20%; animation-delay: 0s; animation-duration: 8s; }
.schedule-oak-leaf--2 { left: 55%; animation-delay: 3s; animation-duration: 10s; width: 8px; height: 6px; }
.schedule-oak-leaf--3 { left: 80%; animation-delay: 6s; animation-duration: 9s; }

/* Paper grain overlay */
.schedule-events::before {
    content: '';
    position: absolute;
    inset: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='200' height='200' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 0;
    opacity: 0.3;
}

/* ============================================
   Keyframe Animations
   ============================================ */

@keyframes schedule-butterfly-float {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-5px); }
}

@keyframes schedule-leaf-drift {
    0%, 100% { transform: translate(0, 0) rotate(0deg); opacity: 0.3; }
    25% { transform: translate(12px, -15px) rotate(25deg); opacity: 0.5; }
    50% { transform: translate(-8px, -30px) rotate(-15deg); opacity: 0.4; }
    75% { transform: translate(15px, -10px) rotate(20deg); opacity: 0.5; }
}

@keyframes fairy-twinkle {
    0%, 100% { opacity: 0.2; transform: scale(0.8); }
    50% { opacity: 0.7; transform: scale(1.2); }
}

@keyframes schedule-mist-rise {
    0% { transform: translateY(0); opacity: 0.05; }
    50% { transform: translateY(-30px); opacity: 0.03; }
    100% { transform: translateY(0); opacity: 0.05; }
}

@keyframes schedule-entry-appear {
    0% { opacity: 0; transform: translateY(6px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes schedule-sparkle-twinkle {
    0%, 100% { opacity: 0; transform: scale(0.5); }
    50% { opacity: 0.8; transform: scale(1.3); }
}

@keyframes schedule-firefly-pulse {
    0%, 100% { opacity: 0.2; transform: scale(0.8); }
    50% { opacity: 0.8; transform: scale(1.4); }
}

@keyframes shire-smoke-drift {
    0% { opacity: 0.15; transform: translateY(0) scaleX(1); }
    25% { opacity: 0.25; transform: translateY(-4px) scaleX(1.1); }
    50% { opacity: 0.2; transform: translateY(-8px) scaleX(0.9); }
    75% { opacity: 0.1; transform: translateY(-12px) scaleX(1.05); }
    100% { opacity: 0; transform: translateY(-16px) scaleX(0.8); }
}

@keyframes shire-leaf-fall {
    0% { opacity: 0; transform: translateY(0) rotate(0deg) translateX(0); }
    10% { opacity: 0.5; }
    50% { opacity: 0.4; transform: translateY(45vh) rotate(120deg) translateX(15px); }
    80% { opacity: 0.2; }
    100% { opacity: 0; transform: translateY(90vh) rotate(240deg) translateX(-10px); }
}

/* ============================================
   Responsive
   ============================================ */

@media (max-width: 768px) {
    .schedule-content.book-page-section-content,
    .book-frame .schedule-content.book-page-section-content {
        padding: 1.8rem 0.8rem 1.5rem;
    }

    .schedule-title {
        font-size: 2.2rem;
    }

    .schedule-subheading {
        font-size: 0.85rem;
    }

    .schedule-event-name {
        font-size: 1.4rem;
    }

    .schedule-event-time {
        font-size: 1.05rem;
    }

    .schedule-event-desc {
        font-size: 0.9rem;
    }

    .schedule-footer-value {
        font-size: 1.1rem;
    }

    .schedule-footer-detail {
        font-size: 0.85rem;
    }

    .schedule-marginalia {
        display: none;
    }

    .schedule-border-corner {
        width: 40px;
        height: 40px;
    }

    .schedule-archway svg {
        width: 160px;
    }

    .schedule-header-band svg {
        width: 85%;
    }
}

@media (max-width: 375px) {
    .schedule-content.book-page-section-content,
    .book-frame .schedule-content.book-page-section-content {
        padding: 1.2rem 0.6rem 1rem;
    }

    .schedule-title {
        font-size: 1.8rem;
    }

    .schedule-event-name {
        font-size: 1.2rem;
    }

    .schedule-footer {
        flex-direction: column;
        gap: 0.3rem;
    }

    .schedule-footer-value {
        font-size: 1rem;
    }

    .schedule-border-frame {
        display: none;
    }

    .schedule-archway svg {
        width: 140px;
    }
}