/* ============================================================================
   THAILAND MARKET THEME
   Cultural Design Preferences:
   - Warm, vibrant colors (orange, gold, purple)
   - More ornate styling with prominent borders and shadows
   - Rounder shapes
   - Gold accents for prosperity
   ============================================================================ */

body.country-th {
    /* ========== COLORS ========== */
    --color-primary: #f97316;           /* Warm orange (auspicious) */
    --color-primary-dark: #ea580c;
    --color-primary-light: #fb923c;

    --color-secondary: #a855f7;         /* Purple (royal) */
    --color-secondary-dark: #9333ea;
    --color-secondary-light: #c084fc;

    --color-accent: #fbbf24;            /* Gold (prosperity) */
    --color-success: #10b981;
    --color-background-alt: #fef3c7;    /* Warm cream background */

    /* ========== TYPOGRAPHY ========== */
    --font-family-primary: 'Sarabun', 'Prompt', 'Noto Sans Thai', sans-serif;
    --font-family-heading: 'Prompt', 'Sarabun', 'Noto Sans Thai', sans-serif;
    --font-size-base: 17px;             /* Slightly larger for Thai script readability */
    --line-height-base: 1.75;           /* More breathing room for Thai text */

    /* ========== BORDERS & SHAPES ========== */
    --border-radius: 12px;              /* More rounded */
    --border-radius-lg: 16px;
    --border-radius-xl: 20px;

    /* ========== LAYOUT ========== */
    --container-max-width: 1400px;      /* Can be wider, more content-dense */
}

/* ========== COMPONENT STYLING ========== */

/* Hero section - warm, inviting gradient */
body.country-th .hero {
    background: linear-gradient(135deg, #fef3c7 0%, #fed7aa 100%);
    border-bottom: 3px solid var(--color-accent);
    padding: 80px 20px;
}

body.country-th .hero h1 {
    color: #c2410c;                     /* Warm brown-orange */
    text-shadow: 2px 2px 4px rgba(0,0,0,0.1);
}

body.country-th .hero-image {
    border-radius: 20px;
    border: 4px solid var(--color-accent);
    box-shadow: 0 20px 40px rgba(0,0,0,0.2);
}

/* Buttons - vibrant gradient with gold border */
body.country-th .btn-primary {
    background: linear-gradient(135deg, #f97316 0%, #ea580c 100%);
    border: 2px solid #fbbf24;
    border-radius: 24px;                /* Very rounded */
    padding: 14px 36px;
    font-size: 18px;
    font-weight: 600;
    box-shadow: 0 4px 12px rgba(249, 115, 22, 0.4);
    transition: all 0.3s ease;
    color: white;
    text-decoration: none;
    display: inline-block;
}

body.country-th .btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 20px rgba(249, 115, 22, 0.5);
}

body.country-th .btn-secondary {
    background: linear-gradient(135deg, #a855f7 0%, #9333ea 100%);
    border: 2px solid #c084fc;
    border-radius: 24px;
    padding: 14px 36px;
    color: white;
    text-decoration: none;
    display: inline-block;
}

/* Cards - prominent borders and shadows */
body.country-th .card,
body.country-th .feature-card {
    background: white;
    border: 3px solid var(--color-accent);
    border-radius: 16px;
    padding: 32px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    transition: all 0.3s ease;
}

body.country-th .card:hover,
body.country-th .feature-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.16);
    border-color: var(--color-primary);
}

/* Feature icons - ornate styling */
body.country-th .feature-icon {
    width: 85px;
    height: 85px;
    margin-bottom: 1rem;                /* Space between icon and text */
    background: linear-gradient(135deg, #fef3c7 0%, #fed7aa 100%);
    border-radius: 50%;
    border: 3px solid var(--color-accent);
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;                 /* Center in flex column */
    font-size: 3.75rem;                 /* 60px emoji */
}

/* Navigation */
body.country-th .navbar {
    background: linear-gradient(135deg, #ffffff 0%, #fef3c7 50%, #ffffff 100%);
    border-bottom: 2px solid var(--color-accent);
}

body.country-th .navbar-container {
    max-width: 1100px;
    margin: 0 auto;
}

body.country-th .nav-menu {
    gap: var(--spacing-md);
}

/* Footer */
body.country-th footer {
    background: linear-gradient(135deg, #fed7aa 0%, #fbbf24 100%);
    border-top: 3px solid #f97316;
    color: #78350f;
}