/**
 * Tour Catalog Page - Content.php Styles
 *
 * Styles for the main tour catalog page (excursions listing).
 * Extracted from inline styles for better caching and performance.
 *
 * @package Traveler Child Theme
 * @since 1.0.0
 */

/* ============================================================
   CSS CUSTOM PROPERTIES (TOKENS)
   ============================================================ */
:root {
    --pca-primary: #3b82f6;
    --pca-primary-hover: #2563eb;
    --pca-surface: #ffffff;
    --pca-border: #e4e4e4;
    --pca-border-hover: #d1d5db;
    --pca-text-primary: #111827;
    --pca-text-secondary: #4b5563;
    --pca-text-muted: #6b7280;
    --pca-success: #10b981;
    --pca-success-bg: #d1fae5;
    --pca-featured-accent: #fde68a;
    --pca-featured-bg: #fef3c7;
    --pca-featured-text: #92400e;
    --pca-spacing-xs: 4px;
    --pca-spacing-sm: 8px;
    --pca-spacing-md: 16px;
    --pca-spacing-lg: 24px;
    --pca-radius-sm: 8px;
    --pca-radius-md: 12px;
    --pca-radius-pill: 9999px;
    --pca-shadow-sm: 0 1px 3px rgba(0,0,0,0.1);
    --pca-shadow-md: 0 4px 12px rgba(0,0,0,0.1);
    --pca-shadow-lg: 0 8px 24px rgba(0,0,0,0.15);
}

/* ============================================================
   LAYOUT - WRAPPER & CONTAINER
   ============================================================ */
/* PCA Content Wrapper - Reset Bootstrap */
.pca-content-wrapper {
    width: 100%;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background-color: #fcfcfc !important; /* Light gray background - forced priority */
}

/* Modern Container Layout */
.st-results.st-hotel-result.st-search-tour {
    max-width: 1170px;
    margin: 0 auto;
    padding: 0 var(--pca-spacing-md);
    position: relative;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--pca-text-primary);
    box-sizing: border-box;
    background-color: #fcfcfc !important; /* Ensure background on parent container */
}

/* Results section */
.pca-results-section {
    margin: 2rem 0;  /* Separation from header/footer components */
    width: 100%;
    background-color: #fcfcfc !important; /* Match wrapper background - forced priority */
    border-radius: 8px; /* Optional: subtle rounded corners */
    box-sizing: border-box; /* Include padding in width calculation */
}

/* Ensure full page background on tour archive pages */
body.post-type-archive-st_tours,
body.tax-st_tour_type,
body.page-template-excursions-template {
    background-color: #fcfcfc !important;
}

/* Apply background to excursions template main content area */
.page-template-excursions-template .container-fluid,
.page-template-excursions-template #primary {
    background-color: #fcfcfc !important;
}

/* Apply background to the modern search result wrapper in excursions template */
.page-template-excursions-template #modern-search-result {
    background-color: #fcfcfc !important;
    padding: 1rem;
    border-radius: 8px;
}

/* Apply background to service-list-wrapper containers */
.service-list-wrapper.service-tour,
#modern-search-result .service-list-wrapper {
    background-color: #fcfcfc !important;
}

/* Apply background to main content wrapper */
div#st-content-wrapper {
    background-color: #fcfcfc !important;
}

/* Apply background to header section */
.pca-header-section {
    background: #fcfcfc !important;
}

/* Responsive padding adjustment for mobile */
@media (max-width: 768px) {
    .pca-results-section {
        margin: 1rem 0;
        border-radius: 0; /* Remove border radius on mobile for edge-to-edge look */
    }
}

/* ============================================================
   PAGINATION
   ============================================================ */
.pca-pagination {
    display: flex;
    justify-content: center;
    margin: 40px 0;
}

.pca-pagination .page-numbers {
    display: flex;
    gap: 0.5rem;
    list-style: none;
    padding: 0;
    margin: 0;
    align-items: center;
}

.pca-pagination .page-numbers li {
    margin: 0;
}

.pca-pagination .page-numbers a,
.pca-pagination .page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0.5rem 0.75rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    color: #374151;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.15s ease;
}

.pca-pagination .page-numbers a:hover {
    background: #f3f4f6;
    border-color: #d1d5db;
    color: #111827;
}

.pca-pagination .page-numbers .current {
    font-weight: 700;
    background: #3b82f6;
    border-color: #3b82f6;
    color: white;
}

.pca-pagination .page-numbers .dots {
    border: none;
    padding: 0 0.25rem;
}

.pca-pagination .visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ============================================================
   EMPTY STATE (NO RESULTS)
   ============================================================ */
.pca-empty-state {
    text-align: center;
    padding: 60px 20px;
    color: #6b7280;
}

.pca-empty-state h3 {
    font-size: 24px;
    color: #374151;
    margin-bottom: 12px;
}

.pca-empty-state p {
    font-size: 16px;
    margin-bottom: 24px;
}

.pca-clear-filters-btn {
    display: inline-flex;
    align-items: center;
    padding: 12px 24px;
    background: #3b82f6;
    color: white;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    transition: all 0.15s ease;
}

.pca-clear-filters-btn:hover {
    background: #2563eb;
    color: white;
    text-decoration: none;
}

/* ============================================================
   ACCESSIBILITY
   ============================================================ */
/* Screen reader only */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* Accessibility: Reduced Motion */
@media (prefers-reduced-motion: reduce) {
    .pca-tour-card,
    .pca-card-image,
    .pca-load-more-btn {
        transition: none;
        transform: none;
        will-change: auto;
    }

    .pca-tour-card:hover {
        transform: none;
    }

    .pca-tour-card:hover .pca-card-image {
        transform: none;
    }
}

/* High Contrast Mode Support */
@media (prefers-contrast: high) {
    .pca-tour-card {
        border-width: 2px;
    }

    .pca-badge {
        border-width: 2px;
    }

    .pca-text-secondary {
        color: #4b5563;
    }
}

/* ============================================================
   RESPONSIVE - MOBILE
   ============================================================ */
@media (max-width: 480px) {
    .pca-content-wrapper {
        padding: 0 8px;
    }

    .st-results.st-hotel-result.st-search-tour {
        padding: 0 8px;
    }
}