/**
 * Palace Tours Display - Timeline Itinerary Style
 * Version: 21.1.0
 */

:root {
    --ptd-primary: #2c3e50;
    --ptd-accent: #8b7355;
    --ptd-accent-light: #a08060;
    --ptd-text-dark: #1a1a1a;
    --ptd-text-body: #333333;
    --ptd-text-muted: #666666;
    --ptd-text-light: #999999;
    --ptd-bg-light: #f8f8f6;
    --ptd-bg-white: #ffffff;
    --ptd-bg-cream: #faf9f7;
    --ptd-timeline-color: #cccccc;
    --ptd-timeline-dot: #8b7355;
    --ptd-font-family: 'Georgia', 'Times New Roman', serif;
    --ptd-font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --ptd-font-size-base: 18px;
    --ptd-font-size-lg: 20px;
    --ptd-font-size-xl: 24px;
    --ptd-font-size-2xl: 32px;
    --ptd-font-size-3xl: 42px;
    --ptd-font-size-sm: 16px;
    --ptd-font-size-xs: 14px;
    --ptd-line-height: 1.8;
    --ptd-space-xs: 8px;
    --ptd-space-sm: 12px;
    --ptd-space-md: 20px;
    --ptd-space-lg: 32px;
    --ptd-space-xl: 48px;
}

/* Screen reader only text (for SEO H1 when hidden) */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}

/* Visible H1 for home page - between banner and categories */
.ptd-home-h1:not(.screen-reader-text) {
    font-family: 'Georgia', 'Times New Roman', serif;
    font-size: 28px;
    font-weight: 600;
    color: #2c3e50;
    text-align: center !important;
    margin: 30px auto 20px auto;
    padding: 0 20px;
    max-width: 900px;
    line-height: 1.3;
    display: block;
    width: 100%;
    box-sizing: border-box;
}

@media (max-width: 768px) {
    .ptd-home-h1:not(.screen-reader-text) {
        font-size: 22px;
        margin: 20px auto 15px auto;
    }
}

/* Fix for Elementor containers - ensure they don't break sticky positioning */
/* These selectors target the Elementor wrapper elements that contain our tour */
.elementor-shortcode,
.elementor-widget-shortcode,
.elementor-widget-shortcode .elementor-widget-container,
.elementor-element:has(.ptd-tour-container),
.e-con:has(.ptd-tour-container),
.e-con-inner:has(.ptd-tour-container) {
    overflow: visible !important;
}

/* Fix for Elementor containers wrapping category/region/home pages */
/* Allow overflow so banners can break out to full viewport width */
.elementor-widget-shortcode:has(.ptd-category-page),
.elementor-widget-shortcode:has(.ptd-region-page),
.elementor-widget-shortcode:has(.ptd-home-page),
.elementor-widget-shortcode .elementor-widget-container:has(.ptd-category-page),
.elementor-widget-shortcode .elementor-widget-container:has(.ptd-region-page),
.elementor-widget-shortcode .elementor-widget-container:has(.ptd-home-page),
.elementor-shortcode:has(.ptd-category-page),
.elementor-shortcode:has(.ptd-region-page),
.elementor-shortcode:has(.ptd-home-page) {
    overflow: visible !important;
    max-width: 100%;
    box-sizing: border-box;
}

/* The Elementor parent containers must also allow overflow for full-width banners */
.e-con:has(.ptd-category-page),
.e-con:has(.ptd-region-page),
.e-con:has(.ptd-home-page),
.e-con-inner:has(.ptd-category-page),
.e-con-inner:has(.ptd-region-page),
.e-con-inner:has(.ptd-home-page),
.is-layout-constrained:has(.ptd-category-page),
.is-layout-constrained:has(.ptd-region-page),
.is-layout-constrained:has(.ptd-home-page) {
    overflow: visible !important;
    max-width: 100%;
    box-sizing: border-box;
}

/* Override WordPress constrained layout that limits content to 800px */
.is-layout-constrained .ptd-category-page,
.is-layout-constrained .ptd-region-page,
.is-layout-constrained .ptd-editorial-grid,
.is-layout-constrained .elementor-shortcode {
    max-width: 100% !important;
}

/* Force entire editorial chain to respect container width */
.elementor-shortcode:has(.ptd-category-editorial),
.ptd-category-editorial,
.ptd-category-editorial .ptd-editorial-grid,
.ptd-category-editorial .ptd-editorial-card,
.ptd-category-editorial .ptd-editorial-card-link,
.ptd-category-editorial .ptd-editorial-card-details,
.ptd-category-editorial .ptd-editorial-card-details h3,
.ptd-category-editorial .ptd-editorial-card-details p,
.ptd-category-editorial .ptd-editorial-location-meta {
    max-width: 100% !important;
    box-sizing: border-box !important;
}

/* Ensure all ptd elements use border-box */
.ptd-category-page *,
.ptd-region-page *,
.ptd-category-editorial * {
    box-sizing: border-box;
    max-width: 100%;
}

/* Base */
.ptd-tour-container {
    font-family: var(--ptd-font-sans);
    font-size: var(--ptd-font-size-base);
    line-height: var(--ptd-line-height);
    color: var(--ptd-text-body);
    max-width: 1400px;
    margin: 0 auto;
    background: var(--ptd-bg-white);
    overflow: visible !important; /* Required for sticky positioning */
}
.ptd-tour-container * { box-sizing: border-box; }
.ptd-error {
    background: #fee2e2;
    color: #dc2626;
    padding: var(--ptd-space-md);
    border-radius: 4px;
    margin: var(--ptd-space-md);
}