/* ============================================
   暖色主題 (Warm / Coral-Orange)
   用於：開售日曆 calendar.html
   ============================================ */
.theme-warm {
    --warm-bg: #1a0f0a;
    --warm-bg-2: #241510;
    --warm-surface: #2e1c14;
    --warm-primary: #ff7a3d;
    --warm-primary-2: #ff5722;
    --warm-accent: #ffb627;
    --warm-pink: #ff6b81;
    --warm-text: #fff5ec;
    --warm-soft: #f0d5c2;
    --warm-mute: #c79a82;
    --warm-border: rgba(255, 122, 61, 0.25);
    --gradient-warm: linear-gradient(135deg, #ff7a3d 0%, #ffb627 55%, #ff6b81 100%);
    --gradient-warm-bg: radial-gradient(ellipse at top, #3d1e12 0%, #1a0f0a 60%);
    --shadow-warm: 0 0 40px rgba(255, 122, 61, 0.35);
}

.theme-warm body {
    background: var(--warm-bg);
    background-image: var(--gradient-warm-bg);
    background-attachment: fixed;
    color: var(--warm-text);
}
.theme-warm .site-header {
    background: rgba(26, 15, 10, 0.85);
    border-bottom-color: var(--warm-border);
}
.theme-warm .hero-warm { position: relative; overflow: hidden; padding: 110px 0 70px; text-align: center; }
.theme-warm .hero-warm::before {
    content: ""; position: absolute; inset: 0;
    background: radial-gradient(circle at 50% 40%, rgba(255,107,129,0.18), transparent 55%);
    pointer-events: none;
}
.theme-warm .highlight-warm {
    background: var(--gradient-warm);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
.theme-warm .badge-warm {
    display: inline-block; padding: 6px 18px; border-radius: 999px;
    background: rgba(255,122,61,0.12); border: 1px solid var(--warm-border);
    font-size: 0.85rem; color: var(--warm-soft); margin-bottom: 24px;
}
.theme-warm .btn-warm {
    display: inline-block; padding: 14px 32px; border-radius: 999px; font-weight: 700;
    background: var(--gradient-warm); color: #fff; box-shadow: var(--shadow-warm);
    transition: var(--transition); border: none; cursor: pointer;
}
.theme-warm .btn-warm:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 0 60px rgba(255,182,39,0.5); }
.theme-warm .btn-ghost-warm {
    display: inline-block; padding: 14px 32px; border-radius: 999px; font-weight: 700;
    background: transparent; color: var(--warm-text); border: 2px solid var(--warm-border);
    transition: var(--transition);
}
.theme-warm .btn-ghost-warm:hover { border-color: var(--warm-primary); color: var(--warm-primary); }

/* Filter bar */
.theme-warm .section-warm-filter { padding: 30px 0; }
.theme-warm .filter-bar { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.theme-warm .filter-btn {
    padding: 10px 26px; border-radius: 999px; font-weight: 600;
    background: var(--warm-surface); border: 1px solid var(--warm-border);
    color: var(--warm-soft); transition: var(--transition);
}
.theme-warm .filter-btn:hover { color: var(--warm-text); }
.theme-warm .filter-btn.active { background: var(--gradient-warm); color: #fff; border-color: transparent; box-shadow: var(--shadow-warm); }

/* Timeline */
.theme-warm .timeline { display: flex; flex-direction: column; gap: 24px; max-width: 820px; margin: 0 auto; }
.theme-warm .timeline-item { display: grid; grid-template-columns: 110px 1fr; gap: 24px; align-items: start; }
.theme-warm .timeline-date {
    background: var(--warm-surface); border: 1px solid var(--warm-border); border-radius: var(--radius);
    padding: 16px 8px; text-align: center; position: sticky; top: 90px;
}
.theme-warm .date-day { display: block; font-size: 2.4rem; font-weight: 900; line-height: 1; color: var(--warm-accent); }
.theme-warm .date-month { display: block; font-weight: 700; margin-top: 4px; color: var(--warm-text); }
.theme-warm .date-year { display: block; font-size: 0.8rem; color: var(--warm-mute); }
.theme-warm .timeline-card {
    background: var(--warm-surface); border: 1px solid var(--warm-border); border-radius: var(--radius);
    padding: 24px 28px; transition: var(--transition);
}
.theme-warm .timeline-card:hover { transform: translateY(-4px); border-color: var(--warm-primary); box-shadow: var(--shadow-warm); }
.theme-warm .tl-header { display: flex; gap: 12px; align-items: center; margin-bottom: 12px; flex-wrap: wrap; }
.theme-warm .tl-tag { padding: 4px 14px; border-radius: 999px; font-size: 0.8rem; font-weight: 700; }
.theme-warm .tag-sale { background: rgba(255,107,129,0.2); color: #ff8fa3; border: 1px solid rgba(255,107,129,0.4); }
.theme-warm .tag-onsale { background: rgba(39,174,96,0.2); color: #6dd5a0; border: 1px solid rgba(39,174,96,0.4); }
.theme-warm .tag-soldout { background: rgba(150,150,150,0.2); color: #c0c0c0; border: 1px solid rgba(150,150,150,0.4); }
.theme-warm .tl-platform { font-size: 0.85rem; color: var(--warm-soft); font-weight: 600; }
.theme-warm .timeline-card h3 { margin-bottom: 10px; font-size: 1.2rem; }
.theme-warm .tl-meta { color: var(--warm-soft); font-size: 0.92rem; margin-bottom: 8px; }
.theme-warm .tl-note { color: var(--warm-mute); font-size: 0.88rem; }
.theme-warm .tl-disabled { opacity: 0.6; }
.theme-warm .tl-disabled:hover { transform: none; box-shadow: none; border-color: var(--warm-border); }

.theme-warm .footer-warm { background: rgba(0,0,0,0.3); border-top-color: var(--warm-border); }
.theme-warm .footer-tagline, .theme-warm .footer-links a, .theme-warm .footer-bottom { color: var(--warm-mute); }
.theme-warm .footer-links a:hover { color: var(--warm-primary); }

@media (max-width: 640px) {
    .theme-warm .timeline-item { grid-template-columns: 1fr; }
    .theme-warm .timeline-date { position: static; display: flex; align-items: baseline; gap: 8px; padding: 10px 16px; }
    .theme-warm .date-day { font-size: 1.6rem; }
}
