/* City-page styles (extracted from dynamic-city.php inline block, v2.14.20).
 * Auto-generated by bin/extract-template-css.py — do not hand-edit.
 * Re-run the script after touching the source template's inline CSS. */

/* FIXED: Inherit theme background, plugin controls content colors */
.tkd-city-page {
    /* Let theme control page background */
    color: var(--tkd-text-color) !important;
    min-height: 100vh;
    padding: 2rem 0;
}

/* Enhanced Breadcrumb Styling - Card Container Like Country Page */
.tkd-breadcrumb {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: none;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    padding: 1rem 1.5rem;
    margin: 0 auto 2rem auto;
    max-width: fit-content;
    text-align: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.05);
}

.tkd-breadcrumb ol {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.tkd-breadcrumb a {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    text-decoration: none;
    transition: color 0.2s ease;
    font-weight: 500;
}

.tkd-breadcrumb a:hover {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1);
}

.tkd-breadcrumb span {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.8);
}

/* Hide Theme Elements - Suit Image and Menu Buttons */
.tkd-city-page .site-header,
.tkd-city-page .main-navigation,
.tkd-city-page .header-widget,
.tkd-city-page .site-branding img,
.tkd-city-page .custom-logo,
.tkd-city-page .site-logo,
.tkd-city-page .header-image,
.tkd-city-page .site-header .widget,
.tkd-city-page .header-sidebar,
.tkd-city-page .menu-toggle,
.tkd-city-page .main-navigation .menu,
body.tkd-city-template .site-header,
body.tkd-city-template .main-navigation,
body.tkd-city-template .header-widget,
body.tkd-city-template .site-branding img,
body.tkd-city-template .custom-logo,
body.tkd-city-template .site-logo,
body.tkd-city-template .header-image {
    display: none !important;
    visibility: hidden !important;
}

/* Override any theme header positioning */
.tkd-city-page {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Plugin Container - Isolated from Theme */
.glass-business-container {
    min-height: 100vh;
    padding: 40px 20px;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    box-sizing: border-box;
}

.glass-main-card {
    width: 100%;
    max-width: 1200px;
    background: var(--tkd-main-bg-color);
    border-radius: 20px;
    padding: 40px 15px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    display: flex;
    flex-direction: column;
    gap: 20px;
    box-sizing: border-box;
}

/* Responsive Design for Isolated Container */
@media (max-width: 1024px) {
    .glass-main-card {
        width: 98%;
        padding: 30px 12px;
    }
}

@media (max-width: 768px) {
    .glass-business-container {
        padding: 20px 8px;
    }
    
    .glass-main-card {
        width: 100%;
        padding: 25px 8px;
        gap: 15px;
    }
}

@media (max-width: 480px) {
    .glass-business-container {
        padding: 15px 5px;
    }
    
    .glass-main-card {
        width: 100%;
        padding: 20px 6px;
        gap: 12px;
    }
}

/* Restore glass design fallbacks for older browsers */
@supports not (backdrop-filter: none) {
    .tkd-hero-stats,
    .tkd-top-rated-card,
    .enhanced-business-card,
    .tkd-breadcrumb {
        background: rgba(255, 255, 255, 0.15) !important;
        border: 1px solid rgba(255, 255, 255, 0.2) !important;
    }
}

/* FIXED: Header Section with Dashboard Colors and Professional Sizing */
.tkd-hero-header {
    margin-bottom: 3rem;
    text-align: center;
    padding: 3rem 2rem 2rem 2rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05) 0%, 
        rgba(255, 255, 255, 0.95) 100%);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    border-radius: 16px;
    margin: 2rem auto;
    max-width: 1200px;
    box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

.tkd-hero-header h1 {
    font-size: var(--tkd-h1-size, 32px) !important;
    font-weight: var(--tkd-h1-weight, 700) !important;
    margin-bottom: 1.2rem !important;
    color: var(--tkd-text-color, var(--tkd-text-color)) !important;
    line-height: var(--tkd-line-height, 1.5) !important;
    letter-spacing: var(--tkd-letter-spacing, 0) !important;
    text-transform: var(--tkd-text-transform, none) !important;
    word-wrap: break-word;
    overflow-wrap: break-word;
}

.tkd-hero-subtitle {
    font-size: 1.2rem !important;
    margin-bottom: 2rem !important;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.8) !important;
    font-weight: 400;
    line-height: 1.5;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}

/* FIXED: Professional Stats Section with Dashboard Colors and Grid Layout */
.tkd-hero-stats {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 1rem;
    margin: 2rem auto;
    padding: 2.5rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.08) 0%, 
        rgba(255, 255, 255, 0.95) 100%);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    border-radius: 16px;
    box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.08),
        inset 0 1px 0 rgba(255, 255, 255, 0.5);
    max-width: 1200px;
}

.tkd-stat-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1.1rem 0.875rem;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.12);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    justify-content: flex-start;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
    min-width: 0;
    flex: 1 1 0;
}

/* All stat items fit in grid naturally */
.tkd-stat-item:nth-child(5) {
    grid-column: auto;
    max-width: none;
    margin: 0;
    padding: 1.1rem 0.875rem;
    background: rgba(255, 255, 255, 0.75);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.12);
}

.tkd-stat-item:hover {
    background: rgba(255, 255, 255, 0.95);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.12);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.25);
}

.tkd-stat-icon {
    font-size: 1.5rem;
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.85);
    flex-shrink: 0;
}

.tkd-stat-text {
    color: var(--tkd-text-color);
    font-weight: 500;
    font-size: 0.875rem;
    text-align: left;
    line-height: 1.4;
}

.tkd-stat-number {
    color: var(--tkd-text-color);
    font-weight: 700;
    font-size: 1.25rem;
    display: inline-block;
    margin-right: 0.35rem;
}

/* FIXED: Clean Action Buttons matching Business Listing Page Design */
.tkd-actions-section {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
}

.tkd-quick-actions {
    display: flex;
    gap: 0.75rem;
    justify-content: center;
    flex-wrap: wrap;
}

.tkd-quick-action-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 500;
    font-size: 0.9rem;
    transition: all 0.3s ease;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    background: rgba(255, 255, 255, 0.8);
    color: var(--tkd-text-color);
    min-width: 90px;
    justify-content: center;
}

.tkd-quick-action-btn:hover:not(.disabled) {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4);
    transform: translateY(-2px);
    text-decoration: none;
    color: var(--tkd-text-color);
}

.tkd-quick-action-btn.disabled {
    opacity: 0.4;
    cursor: not-allowed;
    background: rgba(200, 200, 200, 0.3);
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.5);
}

.tkd-quick-action-btn i {
    font-size: 1rem;
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
}

.tkd-quick-action-btn.disabled i {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.4);
}

/* Specific button colors */
.call-btn:not(.disabled) { 
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.1) 0%, rgba(255, 255, 255, 0.8) 100%);
}
.call-btn:not(.disabled):hover { 
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.2) 0%, rgba(255, 255, 255, 0.9) 100%);
}

.website-btn:not(.disabled) { 
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(255, 255, 255, 0.8) 100%);
}
.website-btn:not(.disabled):hover { 
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.2) 0%, rgba(255, 255, 255, 0.9) 100%);
}

.directions-btn:not(.disabled) { 
    background: linear-gradient(135deg, rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) 0%, rgba(255, 255, 255, 0.8) 100%);
}
.directions-btn:not(.disabled):hover { 
    background: linear-gradient(135deg, rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) 0%, rgba(255, 255, 255, 0.9) 100%);
}

/* ENHANCED: Top Rated Section Styling with Advanced Visual Hierarchy */
.tkd-top-rated-section {
    margin-bottom: 4rem;
    position: relative;
}

/* Decorative line - DISABLED to prevent cross-platform positioning issues */
.tkd-top-rated-section::before {
    display: none !important;
    content: none !important;
}

/* ALL Section Headers - MUST be centered */
.tkd-section-header,
.tkd-city-page .tkd-section-header,
body.tkd-city-template .tkd-section-header {
    text-align: center !important;
    margin-bottom: 3rem !important;
    position: relative !important;
    padding-top: 1rem !important;
    display: block !important;
    width: 100% !important;
}

/* Section Titles - Centered with flexbox for icon alignment */
.tkd-section-title,
.tkd-city-page .tkd-section-title,
body.tkd-city-template .tkd-section-title {
    font-size: var(--tkd-h2-size, 24px) !important;
    font-weight: var(--tkd-h2-weight, 600) !important;
    margin-bottom: 0.75rem !important;
    color: var(--tkd-text-color, var(--tkd-text-color)) !important;
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.5rem !important;
    text-align: center !important;
}

/* Decorative line - DISABLED to prevent cross-platform positioning issues */
.tkd-section-title::after {
    display: none !important;
    content: none !important;
}

.tkd-section-subtitle {
    /* Match dashboard paragraph typography */
    font-size: var(--tkd-p-size, 16px) !important;
    font-weight: var(--tkd-p-weight, 400) !important;
    color: var(--tkd-text-color) !important;
    margin-bottom: 1.5rem !important;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6;
}

/* IMPROVED: 3 Cards Per Row with Perfect Alignment */
.tkd-top-rated-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    margin-bottom: 2rem;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    align-items: stretch; /* Ensure equal heights */
}

/* FALLBACK: For smaller screens, allow fewer cards */
@media (max-width: 1200px) {
    .tkd-top-rated-grid {
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        max-width: 1000px;
    }
}

/* RESPONSIVE: Perfect mobile experience */
@media (max-width: 768px) {
    .tkd-top-rated-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 0 1rem;
        max-width: 100%;
    }
    
    .tkd-top-rated-card {
        min-height: 420px; /* Optimized for mobile */
    }
}

@media (max-width: 480px) {
    .tkd-top-rated-grid {
        gap: 0.75rem;
    }
    
    .tkd-top-rated-card {
        padding: 1.25rem;
        min-height: 380px;
    }
    
    .tkd-top-rated-card h3 {
        font-size: 1.15rem !important;
    }
}

/* ENHANCED: Top Rated Business Cards - FIXED: Solid white with proper framing */
.tkd-top-rated-card {
    background: #ffffff !important; /* FIXED: Solid white background */
    border: 1px solid rgba(0, 0, 0, 0.08) !important; /* Subtle grey border */
    border-radius: 16px !important;
    padding: 1.75rem !important;
    position: relative !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.05) !important; /* Clean shadow */
    /* FIXED: Ensure consistent heights with flex layout */
    display: flex !important;
    flex-direction: column !important;
    min-height: 750px !important; /* FIXED: Consistent height */
    height: auto !important;
}

/* ENHANCED: Clean Hover Effects */
.tkd-top-rated-card:hover {
    transform: translateY(-4px) !important;
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 8px rgba(0, 0, 0, 0.08) !important;
}

.tkd-top-rated-card:hover .tkd-top-rated-badge {
    animation-duration: 1.5s;
    transform: translateX(-50%) scale(1.1);
}

.tkd-top-rated-card:hover h3 {
    color: var(--tkd-text-color, var(--tkd-text-color)) !important;
}

.tkd-top-rated-card:hover .tkd-rating-display {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 215, 0, 0.3);
    transform: scale(1.05);
}

.tkd-top-rated-card:hover .tkd-star.filled {
    animation: starGlow 0.6s ease-in-out;
}

.tkd-top-rated-card:hover .tkd-hours-status {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4);
}

.tkd-top-rated-card:hover .tkd-specialty-tag {
    transform: translateY(-2px) scale(1.05);
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3) 100%);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.6);
    box-shadow: 0 4px 12px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
}

.tkd-top-rated-card:hover .tkd-address-display {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

@keyframes starGlow {
    0%, 100% { 
        filter: drop-shadow(0 1px 2px rgba(255, 215, 0, 0.4));
    }
    50% { 
        filter: drop-shadow(0 2px 8px rgba(255, 215, 0, 0.8)) drop-shadow(0 0 12px rgba(255, 215, 0, 0.6));
    }
}

/* ENHANCED: Advanced Badge System with Animations - CENTERED */
.tkd-top-rated-badge {
    position: absolute;
    top: -8px;
    left: 50%;
    transform: translateX(-50%);
    background: linear-gradient(135deg, 
        rgba(255, 215, 0, 0.95) 0%, 
        rgba(255, 193, 7, 0.9) 50%,
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.95) 100%);
    color: #1a1a1a;
    padding: 0.5rem 1rem;
    border-radius: 0 0 16px 16px;
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    box-shadow: 
        0 6px 20px rgba(255, 215, 0, 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    animation: badgePulse 3s ease-in-out infinite;
    position: relative;
    overflow: hidden;
    white-space: nowrap;
    z-index: 10;
}

.tkd-top-rated-badge::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    animation: badgeShine 2s ease-in-out infinite;
}

.tkd-top-rated-badge i {
    margin-right: 0.3rem;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.3));
}

@keyframes badgePulse {
    0%, 100% { 
        transform: translateX(-50%) scale(1);
        box-shadow: 
            0 6px 20px rgba(255, 215, 0, 0.4),
            inset 0 1px 0 rgba(255, 255, 255, 0.3);
    }
    50% { 
        transform: translateX(-50%) scale(1.05);
        box-shadow: 
            0 8px 25px rgba(255, 215, 0, 0.6),
            inset 0 1px 0 rgba(255, 255, 255, 0.4);
    }
}

@keyframes badgeShine {
    0% { left: -100%; }
    100% { left: 100%; }
}

/* ENHANCED: Business Name Styling - UNIFIED for all platforms */
.tkd-top-rated-card h3 {
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    margin-top: 0.5rem !important; /* ADDED: Space after badge */
    margin-bottom: 0.875rem !important; /* INCREASED: More breathing room */
    color: var(--tkd-text-color) !important;
    line-height: 1.3 !important;
    /* FIXED: Control text length for consistent spacing */
    min-height: 2.75rem !important; /* Reserve space for 2 lines */
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}

/* ENHANCED: Rating Display - UNIFIED for all platforms */
.tkd-rating-display {
    display: flex !important;
    align-items: center !important;
    gap: 0.625rem !important; /* Balanced spacing */
    margin-bottom: 0.875rem !important; /* Consistent with title */
    padding: 0.625rem 0.875rem !important; /* Slightly more padding */
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.08) !important;
    border-radius: 10px !important;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15) !important;
}

.tkd-stars-row {
    display: flex !important;
    gap: 0.2rem !important;
}

.tkd-star {
    font-size: 1.1rem !important;
    line-height: 1 !important;
}

.tkd-star.filled {
    color: #ffd700 !important;
    filter: drop-shadow(0 1px 2px rgba(255, 215, 0, 0.4)) !important;
}

.tkd-star.half {
    color: #ffd700 !important;
    opacity: 0.7 !important;
}

.tkd-star.empty {
    color: rgba(0, 0, 0, 0.2) !important; /* FIXED: Visible on white background */
}

.tkd-rating-info {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.25rem !important;
}

.tkd-rating-number {
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    color: var(--tkd-text-color) !important;
}

.tkd-review-count {
    font-size: 0.85rem !important;
    color: var(--tkd-text-color) !important;
    opacity: 0.7 !important;
    visibility: visible !important;
}

/* ENHANCED: Business Information - UNIFIED Spacing */
.tkd-business-info {
    margin-bottom: 0.875rem !important;
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.625rem !important;
}

/* ENHANCED: Address Display Styling - UNIFIED for all platforms */
.tkd-address-display {
    display: flex !important;
    align-items: flex-start !important;
    gap: 0.5rem !important;
    padding: 0.625rem 0.875rem !important; /* Consistent with rating */
    background: rgba(0, 0, 0, 0.03) !important;
    border-radius: 8px !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    transition: all 0.3s ease !important;
    margin-bottom: 0.875rem !important; /* Consistent spacing */
}

.tkd-address-display span {
    color: var(--tkd-text-color) !important;
    font-size: 0.875rem !important;
    line-height: 1.35 !important;
}

.tkd-address-display i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9) !important;
    font-size: 0.9rem;
    margin-top: 0.125rem;
    flex-shrink: 0;
}

.tkd-address-display span {
    color: var(--tkd-text-color) !important;
    font-size: 0.85rem;
    line-height: 1.4;
    font-weight: 500;
}

/* ENHANCED: Location Information */
.tkd-location-info {
    margin-bottom: 1rem;
    min-height: 3rem; /* Consistent spacing for alignment */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

/* ENHANCED: Specialties Section - UNIFIED */
.tkd-specialties-section {
    margin-bottom: 0.625rem !important;
    min-height: auto !important;
}

.tkd-section-label {
    color: var(--tkd-text-color) !important;
    margin-bottom: 0.5rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.025em !important;
    opacity: 0.9 !important;
    font-size: 0.75rem !important;
}

.tkd-section-label i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.75rem;
}

.tkd-specialty-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 0.3rem !important;
}

.tkd-specialty-tag {
    display: inline-block !important;
    padding: 0.25rem 0.5rem !important;
    font-size: 0.75rem !important;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) 100%);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    border-radius: 12px;
    color: var(--tkd-text-color) !important;
    font-size: 0.7rem;
    font-weight: 500;
    text-transform: capitalize;
    transition: all 0.3s ease;
}

/* ENHANCED: Hours Section */
.tkd-hours-section {
    margin-bottom: 1rem;
    min-height: 3rem; /* Consistent spacing for alignment */
}

.tkd-hours-status {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.5rem;
    border-radius: 12px;
    font-size: 0.65rem;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    margin-bottom: 0.4rem;
    transition: all 0.3s ease;
    width: fit-content;
}

.tkd-hours-status.open {
    background: rgba(34, 197, 94, 0.15);
    color: rgba(34, 197, 94, 0.9) !important;
    border: 1px solid rgba(34, 197, 94, 0.25);
}

.tkd-hours-status.closed {
    background: rgba(239, 68, 68, 0.15);
    color: rgba(239, 68, 68, 0.9) !important;
    border: 1px solid rgba(239, 68, 68, 0.25);
}

.tkd-hours-status i {
    font-size: 0.7rem;
}

.tkd-hours-today {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.8) !important;
    font-size: 0.75rem;
    font-weight: 500;
    padding-left: 0.75rem;
}

/* Enhanced Status Grid - UNIFIED Layout */
.tkd-status-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.625rem !important;
    margin: 0.875rem 0 !important;
}

/* Status card - UNIFIED visible on white background */
.tkd-status-card {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    padding: 0.625rem !important;
    background: rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
    min-height: 70px !important;
    max-height: 75px !important;
    min-width: 0 !important;
    overflow: hidden !important;
}

.tkd-status-card:hover {
    background: rgba(0, 0, 0, 0.05) !important;
    border-color: rgba(0, 0, 0, 0.1) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
}

.tkd-status-icon {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-shrink: 0 !important;
    font-size: 0.9rem !important;
    background: rgba(0, 0, 0, 0.05) !important; /* Subtle grey background */
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.tkd-status-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
    min-width: 0; /* Prevent flex item from growing beyond container */
    overflow: hidden;
}

.tkd-status-label {
    font-size: 0.75rem;
    font-weight: 600;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.tkd-status-details {
    font-size: 0.7rem;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7);
    line-height: 1.3;
    /* Text truncation for long content */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
}

/* Status-specific icon colors */
.tkd-status-card.hours-status-card .tkd-status-icon i.open {
    color: #10b981;
}

.tkd-status-card.hours-status-card .tkd-status-icon i.closed {
    color: #ef4444;
}

.tkd-status-card.distance-status-card .tkd-status-icon i {
    color: #3b82f6;
}

/* ENHANCED: Actions Section for Top Rated Cards */
.tkd-top-rated-card .tkd-actions-section {
    margin-top: auto; /* Push to bottom */
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 1rem;
    min-height: 5rem; /* Consistent spacing for alignment */
}

.tkd-primary-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.tkd-secondary-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));
    gap: 0.4rem;
}

.tkd-hours-status {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
    padding: 0.75rem;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
}

.tkd-status-indicator {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.8rem;
    font-weight: 600;
}

.tkd-status-indicator.open {
    color: #10b981;
}

.tkd-status-indicator.open i {
    color: #10b981;
    animation: statusPulse 2s ease-in-out infinite;
}

.tkd-status-indicator.closed {
    color: #ef4444;
}

.tkd-status-indicator.closed i {
    color: #ef4444;
}

.tkd-hours-text {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.75rem;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.8);
}

.tkd-hours-text i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
}

/* Specialties Tags - Optimized for 3-Card Layout */
.tkd-specialties {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 1rem;
    /* FIXED: Control height for consistency */
    min-height: 2.6rem;
    max-height: 3.9rem;
    overflow: hidden;
    align-content: flex-start;
}

.tkd-specialty-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    padding: 0.25rem 0.5rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) 100%);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    border-radius: 14px;
    font-size: 0.65rem;
    font-weight: 500;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
    transition: all 0.3s ease;
}

.tkd-specialty-tag:hover {
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) 100%);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.5);
    transform: translateY(-1px);
}

.tkd-specialty-tag i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.6rem;
}

@keyframes statusPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.6; }
}

/* ENHANCED: Location Information Display - Natural Spacing */
.tkd-location-info {
    margin-bottom: 1.25rem;
    /* Remove height constraints for natural content flow */
}

.tkd-address-display {
    display: flex;
    align-items: flex-start;
    gap: 0.6rem;
    margin-bottom: 0.5rem;
    padding: 0.6rem;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 10px;
}

.tkd-address-icon {
    color: #ef4444;
    font-size: 0.9rem;
    margin-top: 0.1rem;
    flex-shrink: 0;
}

.tkd-address-text {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
    font-size: 0.85rem;
    line-height: 1.4;
    /* FIXED: Limit address length for consistency */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Distance Indicator */
.tkd-distance-indicator {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.6rem;
    background: linear-gradient(135deg, 
        rgba(59, 130, 246, 0.15) 0%, 
        rgba(37, 99, 235, 0.1) 100%);
    border: 1px solid rgba(59, 130, 246, 0.3);
    border-radius: 8px;
    font-size: 0.75rem;
    font-weight: 500;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
    transition: all 0.3s ease;
}

.tkd-distance-indicator:hover {
    background: linear-gradient(135deg, 
        rgba(59, 130, 246, 0.25) 0%, 
        rgba(37, 99, 235, 0.2) 100%);
    border-color: rgba(59, 130, 246, 0.5);
    transform: translateY(-1px);
}

.tkd-distance-indicator i {
    color: rgba(59, 130, 246, 0.8);
    font-size: 0.7rem;
}

/* ENHANCED: Actions Section - Always at Bottom */
.tkd-actions-section {
    margin-top: auto !important; /* Push to bottom of flex container */
    padding-top: 1rem !important;
    flex-shrink: 0 !important; /* Don't shrink */
}

.tkd-primary-action {
    margin-bottom: 0.875rem !important;
}

/* Primary action button - UNIFIED visible on white background */
.tkd-primary-action .tkd-action-button {
    width: 100% !important;
    padding: 1rem 0.875rem !important;
    font-size: 0.925rem !important;
    font-weight: 600 !important;
    min-height: 55px !important;
    background: rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
    color: var(--tkd-text-color) !important;
}

.tkd-primary-action .tkd-action-button:hover {
    background: rgba(34, 197, 94, 0.1) !important;
    border-color: rgba(34, 197, 94, 0.3) !important;
    box-shadow: 0 6px 20px rgba(34, 197, 94, 0.12) !important;
    transform: translateY(-2px) !important;
}

.tkd-primary-action .tkd-action-button i {
    color: rgba(34, 197, 94, 0.9) !important;
    font-size: 1.2rem !important;
}

.tkd-secondary-actions {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 0.75rem !important;
}

/* FIXED: Action button visible on white background */
.tkd-action-button {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 0.3rem !important;
    text-decoration: none !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    text-align: center !important;
    color: var(--tkd-text-color) !important; /* FIXED: Dark text instead of white */
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    cursor: pointer !important;
    background: rgba(0, 0, 0, 0.03) !important; /* FIXED: Subtle grey instead of transparent */
    outline: none !important;
    font-family: inherit !important;
}

/* Primary Action Buttons - Larger and More Prominent */
.tkd-action-button.primary {
    padding: 1rem 0.75rem;
    font-size: 0.85rem;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
}

.tkd-action-button.primary.call {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.95), rgba(5, 150, 105, 0.9));
    box-shadow: 0 6px 25px rgba(16, 185, 129, 0.4);
}

.tkd-action-button.primary.website {
    background: linear-gradient(135deg, rgba(59, 130, 246, 0.95), rgba(37, 99, 235, 0.9));
    box-shadow: 0 6px 25px rgba(59, 130, 246, 0.4);
}

.tkd-action-button.primary small {
    font-size: 0.65rem;
    opacity: 0.9;
    font-weight: 400;
    margin-top: -0.2rem;
}

/* Secondary Action Buttons - UNIFIED for white background */
.tkd-action-button.secondary {
    padding: 0.625rem 0.5rem !important;
    font-size: 0.75rem !important;
    background: rgba(0, 0, 0, 0.03) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    color: var(--tkd-text-color) !important;
}

.tkd-action-button.secondary:hover {
    background: rgba(0, 0, 0, 0.06) !important;
    border-color: rgba(0, 0, 0, 0.12) !important;
    transform: translateY(-2px) !important;
}

.tkd-action-button.secondary.directions {
    background: rgba(16, 185, 129, 0.1) !important;
    border-color: rgba(16, 185, 129, 0.25) !important;
}

.tkd-action-button.secondary.directions:hover {
    background: rgba(16, 185, 129, 0.15) !important;
    border-color: rgba(16, 185, 129, 0.4) !important;
}

.tkd-action-button.secondary i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8) !important;
    font-size: 1rem !important;
}

.tkd-action-button.primary.book-btn {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.2), rgba(124, 58, 237, 0.15));
    border-color: rgba(139, 92, 246, 0.3);
}

.tkd-action-button.secondary.save {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.2), rgba(220, 38, 38, 0.15));
    border-color: rgba(239, 68, 68, 0.3);
}

/* Enhanced Hover Effects */
.tkd-action-button.primary:hover {
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.4);
}

.tkd-action-button.primary.call:hover {
    box-shadow: 0 12px 35px rgba(16, 185, 129, 0.6);
}

.tkd-action-button.primary.website:hover {
    box-shadow: 0 12px 35px rgba(59, 130, 246, 0.6);
}

.tkd-action-button.secondary:hover {
    transform: translateY(-2px);
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.3);
}

.tkd-action-button.secondary.directions:hover {
    background: linear-gradient(135deg, rgba(16, 185, 129, 0.4), rgba(5, 150, 105, 0.3));
    border-color: rgba(16, 185, 129, 0.5);
}

.tkd-action-button.primary.book-btn:hover {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.4), rgba(124, 58, 237, 0.3));
    border-color: rgba(139, 92, 246, 0.5);
    box-shadow: 0 12px 35px rgba(139, 92, 246, 0.6);
}

.tkd-action-button.secondary.save:hover {
    background: linear-gradient(135deg, rgba(239, 68, 68, 0.4), rgba(220, 38, 38, 0.3));
    border-color: rgba(239, 68, 68, 0.5);
}

.tkd-action-button i {
    font-size: 1rem;
    filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.2));
}

.tkd-action-button.secondary i {
    font-size: 0.9rem;
}

/* Disabled button styling */
.tkd-action-button.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
    box-shadow: none !important;
}

.tkd-action-button.disabled:hover {
    transform: none !important;
    box-shadow: none !important;
    background: rgba(255, 255, 255, 0.05) !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}

.tkd-action-button.disabled i {
    color: rgba(255, 255, 255, 0.3) !important;
}

/* View All Button */
.tkd-view-all-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.7) 100%);
    color: white !important;
    text-decoration: none !important;
    border-radius: 12px;
    font-weight: 600;
    font-size: 1rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 
        0 6px 20px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4),
        inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.tkd-view-all-btn:hover {
    transform: translateY(-3px);
    box-shadow: 
        0 10px 30px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.5),
        inset 0 1px 0 rgba(255, 255, 255, 0.3);
    color: white !important;
}

/* Enhanced Breadcrumb Styling */
.tkd-breadcrumb {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: none;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 12px;
    padding: 1rem 1.5rem;
    margin-bottom: 2rem;
}

/* ENHANCED: Search & Filter Section Styling */
.tkd-search-section {
    margin-bottom: 3rem;
    position: relative;
}

.tkd-search-card {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.90) 0%, 
        rgba(255, 255, 255, 0.85) 100%);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(var(--tkd-accent-rgb), 0.3);
    border-radius: 20px;
    padding: 2rem;
    position: relative;
    overflow: hidden;
    box-shadow: 
        0 12px 40px rgba(0, 0, 0, 0.15),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.tkd-search-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: linear-gradient(90deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.6),
        rgba(255, 215, 0, 0.6),
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.6)
    );
}

/* ENHANCED: Form Layout */
.tkd-form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 1.5rem;
    margin-bottom: 2rem;
}

.tkd-form-group {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.tkd-form-group label {
    color: var(--tkd-text-color) !important;
    font-weight: 700;
    font-size: 0.9rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    opacity: 1;
}

.tkd-form-group label i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.8rem;
}

/* ENHANCED: Input Styling with Dashboard Colors */
.tkd-form-group input,
.tkd-form-group select {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.12) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05) 100%);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.25);
    border-radius: 12px;
    padding: 0.875rem 1rem;
    color: var(--tkd-text-color);
    font-size: 0.95rem;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    backdrop-filter: none;
    position: relative;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
}

/* CUSTOM: Professional Select Dropdown Arrow */
.tkd-form-group select {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 1rem;
    padding-right: 3rem;
    cursor: pointer;
}

/* FIXED: Select Dropdown Options - Better Browser Support */
.tkd-form-group select {
    background-color: rgba(var(--tkd-main-bg-r), var(--tkd-main-bg-g), var(--tkd-main-bg-b), 0.95) !important;
    color: var(--tkd-text-color) !important;
}

/* ENHANCED: Better dropdown styling for all browsers */
.tkd-form-group select::-webkit-scrollbar {
    width: 8px;
}

.tkd-form-group select::-webkit-scrollbar-track {
    background: rgba(var(--tkd-main-bg-r), var(--tkd-main-bg-g), var(--tkd-main-bg-b), 0.1);
    border-radius: 6px;
}

.tkd-form-group select::-webkit-scrollbar-thumb {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.6);
    border-radius: 6px;
}

.tkd-form-group select::-webkit-scrollbar-thumb:hover {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
}

/* REMOVED: Problematic option styling that doesn't work consistently */
/* .tkd-form-group select option - removed as it has poor browser support */

/* ENHANCED: Glass Dropdown Styling - Match Working Hours Design */
.tkd-glass-dropdown-container {
    position: relative;
}

.tkd-glass-dropdown {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(255, 255, 255, 0.05) 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 8px !important;
    color: var(--tkd-text-color) !important;
    font-size: 0.95rem !important;
    padding: 0.75rem 1rem !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    z-index: 100 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
}

.tkd-glass-dropdown:focus {
    outline: none !important;
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.5) !important;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.18) 0%, 
        rgba(255, 255, 255, 0.08) 100%) !important;
    box-shadow: 
        0 0 0 2px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2),
        0 8px 16px rgba(0, 0, 0, 0.2) !important;
    transform: translateY(-1px) !important;
}

.tkd-glass-dropdown:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.18) 0%, 
        rgba(255, 255, 255, 0.08) 100%) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    transform: translateY(-1px) !important;
}

/* Custom dropdown arrow matching working hours style */
.tkd-glass-dropdown-container::after {
    content: '';
    position: absolute;
    top: 50%;
    right: 1rem;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 6px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    pointer-events: none;
    z-index: 101;
    transition: all 0.2s ease;
}

.tkd-glass-dropdown-container:hover::after {
    border-top-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1);
}

/* Ensure proper spacing for the arrow */
.tkd-glass-dropdown {
    padding-right: 2.5rem !important;
}

/* ENHANCED: Apply glass styling to ALL filter dropdowns */
.tkd-advanced-filters select,
.tkd-search-options select,
.tkd-form-group select {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(255, 255, 255, 0.05) 100%) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    border-radius: 8px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.tkd-advanced-filters select:focus,
.tkd-search-options select:focus,
.tkd-form-group select:focus {
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.5) !important;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.18) 0%, 
        rgba(255, 255, 255, 0.08) 100%) !important;
    box-shadow: 
        0 0 0 2px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2),
        0 8px 16px rgba(0, 0, 0, 0.2) !important;
    transform: translateY(-1px) !important;
}

.tkd-advanced-filters select:hover,
.tkd-search-options select:hover,
.tkd-form-group select:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.18) 0%, 
        rgba(255, 255, 255, 0.08) 100%) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
    transform: translateY(-1px) !important;
}

.tkd-form-group input:focus,
.tkd-form-group select:focus {
    outline: none;
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.18) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) 100%);
    box-shadow: 
        0 0 0 3px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2),
        0 6px 16px rgba(0, 0, 0, 0.15);
    transform: translateY(-2px);
}

.tkd-form-group input::placeholder {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.6);
}

/* Search Input — clean, no decorative icons inside the field (v2.14.21).
 * Previously had an inline FA search-icon and clear-icon overlaying the
 * input, which competed with the label icon above and looked busy. Now
 * the field is plain type="search" so browsers provide a native clear
 * button when there's text. */
.tkd-search-input-wrapper {
    position: relative;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

.tkd-search-input-wrapper input {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Hide any leftover decorative icons that may still exist in other templates
 * or older cached HTML. Safe to drop on the next cleanup pass. */
.tkd-search-input-wrapper .search-icon,
.tkd-search-input-wrapper .clear-icon {
    display: none !important;
}

/* ENHANCED: Dashboard-Connected Autocomplete Dropdown */
.tkd-autocomplete-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-main-bg-r), var(--tkd-main-bg-g), var(--tkd-main-bg-b), 0.98) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05) 100%);
    backdrop-filter: none;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    border-radius: 12px;
    margin-top: 0.25rem;
    max-height: 200px;
    overflow-y: auto;
    z-index: 1000;
    display: none;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
}

.tkd-autocomplete-item {
    padding: 0.75rem 1rem;
    color: var(--tkd-text-color);
    cursor: pointer;
    transition: all 0.2s ease;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-bottom: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
}

.tkd-autocomplete-item:last-child {
    border-bottom: none;
}

.tkd-autocomplete-item:hover,
.tkd-autocomplete-item.highlighted {
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.25) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15) 100%);
    color: var(--tkd-text-color);
    transform: translateX(3px);
}

.tkd-autocomplete-item i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.8rem;
}

/* ENHANCED: Quick Filter Tags */
.tkd-quick-filters {
    margin-bottom: 1.5rem;
}

.tkd-quick-filters-label {
    color: var(--tkd-text-color) !important;
    font-weight: 700;
    font-size: 0.95rem;
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
    opacity: 1;
}

.tkd-quick-filters-label i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.8rem;
}

/* Desktop: Show tags normally, hide mobile toggle */
.tkd-quick-filters-mobile-toggle {
    display: none !important; /* HIDDEN: Desktop default */
}

.tkd-quick-filter-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tkd-quick-filter-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.5rem 0.875rem;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.08) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.12) 100%);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    border-radius: 20px;
    color: var(--tkd-text-color) !important;
    font-size: 0.8rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    user-select: none;
}

.tkd-quick-filter-tag:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) 100%);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.6);
    color: var(--tkd-text-color) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.tkd-quick-filter-tag.active {
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8) 100%);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1);
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
}

.tkd-quick-filter-tag i {
    font-size: 0.7rem;
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
}

/* ENHANCED: Active Filters Display */
.tkd-active-filters {
    margin-bottom: 1.5rem;
    display: none;
}

.tkd-active-filters.has-filters {
    display: block;
}

.tkd-active-filters-label {
    color: var(--tkd-text-color);
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 0.75rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.tkd-active-filters-label i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.8rem;
}

.tkd-active-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.tkd-filter-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 0.75rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) 100%);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    border-radius: 16px;
    color: var(--tkd-text-color);
    font-size: 0.75rem;
    font-weight: 500;
    animation: slideInUp 0.3s ease-out;
}

.tkd-filter-chip .remove-filter {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7);
    cursor: pointer;
    font-size: 0.7rem;
    transition: color 0.2s ease;
}

.tkd-filter-chip .remove-filter:hover {
    color: var(--tkd-text-color);
}

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ENHANCED: Action Row */
.tkd-search-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1.5rem;
}

.tkd-search-options {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.tkd-checkbox-wrapper {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    color: var(--tkd-text-color) !important;
    cursor: pointer;
    font-weight: 600;
    font-size: 0.9rem;
    transition: color 0.2s ease;
    opacity: 1;
}

.tkd-checkbox-wrapper:hover {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9);
}

.tkd-checkbox-wrapper input[type="checkbox"] {
    width: 18px;
    height: 18px;
    accent-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    transform: none;
}

.tkd-live-search-toggle {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--tkd-text-color) !important;
    font-size: 0.85rem;
    font-weight: 500;
    cursor: pointer;
}

.tkd-live-search-toggle input[type="checkbox"] {
    width: 16px;
    height: 16px;
}

/* ENHANCED: Advanced Search Toggle */
.tkd-advanced-toggle {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9);
    font-size: 0.85rem;
    cursor: pointer;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    transition: color 0.2s ease;
}

.tkd-advanced-toggle:hover {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1);
}

.tkd-advanced-toggle i {
    transition: transform 0.3s ease;
}

.tkd-advanced-toggle.expanded i {
    transform: rotate(180deg);
}

/* ENHANCED: Advanced Filters Panel */
.tkd-advanced-filters {
    margin-top: 1.5rem;
    padding-top: 1.5rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: none;
    animation: slideDown 0.3s ease-out;
}

.tkd-advanced-filters.show {
    display: block;
}

@keyframes slideDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.tkd-advanced-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 1.25rem;
    margin-bottom: 1.5rem;
}

/* ENHANCED: Range Slider Styling */
.tkd-range-group {
    position: relative;
}

.tkd-range-slider {
    width: 100%;
    height: 6px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 3px;
    outline: none;
    -webkit-appearance: none;
    margin: 0.75rem 0;
}

.tkd-range-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9), 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.7));
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

.tkd-range-slider::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9), 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.7));
    border-radius: 50%;
    cursor: pointer;
    border: none;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
}

.tkd-range-value {
    color: var(--tkd-text-color);
    font-size: 0.85rem;
    font-weight: 600;
}

/* ENHANCED: Professional Search Button */
.tkd-search-btn {
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.95) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8) 100%);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1);
    border-radius: 12px;
    padding: 0.875rem 1.5rem;
    color: #ffffff;
    font-weight: 600;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    position: relative;
    overflow: hidden;
    min-width: 140px;
    justify-content: center;
    backdrop-filter: none;
    box-shadow: 
        0 4px 12px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.tkd-search-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(255, 255, 255, 0.2), 
        transparent);
    transition: left 0.5s ease;
}

.tkd-search-btn:hover::before {
    left: 100%;
}

.tkd-search-btn:hover {
    transform: translateY(-2px);
    box-shadow: 
        0 12px 32px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.45),
        0 6px 16px rgba(0, 0, 0, 0.25);
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9) 100%);
}

.tkd-search-btn:active {
    transform: translateY(-1px);
    box-shadow: 
        0 6px 20px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3),
        0 2px 8px rgba(0, 0, 0, 0.2);
}

.tkd-search-btn.loading {
    pointer-events: none;
}

.tkd-search-btn.loading i {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* ENHANCED: Clear Filters Button */
.tkd-clear-filters-btn {
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: 12px;
    padding: 0.75rem 1.25rem;
    color: rgba(239, 68, 68, 0.9);
    font-weight: 500;
    font-size: 0.85rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
}

.tkd-clear-filters-btn:hover {
    background: rgba(239, 68, 68, 0.2);
    border-color: rgba(239, 68, 68, 0.5);
    color: rgba(239, 68, 68, 1);
    transform: translateY(-1px);
}

/* ENHANCED: Mobile & Tablet Responsive Optimizations */

/* Tablet Landscape (1024px and below) */
@media (max-width: 1024px) {
    .glass-business-container {
        padding: 1.5rem 1rem;
    }
    
    .tkd-hero-header {
        padding: 2.5rem 1.5rem;
    }
    
    .tkd-hero-header h1 {
        font-size: clamp(2.2rem, 3.5vw, 3.2rem) !important;
    }
    
    .tkd-top-rated-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
        padding: 0 1rem;
    }
    
    .tkd-top-rated-card {
        min-height: 420px;
        padding: 1.5rem;
    }
    
    /* Business listing cards */
    .enhanced-card-content {
        padding: 1.5rem;
    }
    
    .enhanced-business-info-grid {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }
    
    .enhanced-secondary-actions {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }
    
    .tkd-status-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 0.75rem;
    }
    
    .tkd-business-grid {
        gap: 1.5rem;
        padding: 0 1rem;
    }
}

/* Tablet Portrait (768px and below) */
@media (max-width: 768px) {
    .glass-business-container {
        padding: 1rem 0.5rem;
    }
    
    .tkd-hero-header {
        padding: 2rem 1rem;
        margin: 1rem 0.5rem;
    }
    
    .tkd-hero-header h1 {
        font-size: clamp(2rem, 4vw, 2.8rem) !important;
    }
    
    .tkd-hero-subtitle {
        font-size: 1.1rem;
        line-height: 1.4;
    }
    
    /* Top Rated Cards Mobile Optimizations */
    .tkd-top-rated-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
        max-width: 100%;
        padding: 0 1rem;
    }

    .tkd-top-rated-card {
        min-height: 420px;
        padding: 1.5rem;
    }

    .tkd-top-rated-card h3 {
        font-size: 1.25rem !important;
        min-height: 2.5rem;
    }

    .tkd-business-info {
        min-height: auto;
    }

    .tkd-location-info {
        min-height: auto;
    }

    .tkd-actions-section {
        min-height: auto;
    }

    /* Enhanced action buttons for touch */
    .tkd-primary-actions {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .tkd-secondary-actions {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }

    .tkd-action-button.primary {
        padding: 1rem 0.75rem;
        font-size: 0.9rem;
        min-height: 48px; /* Touch-friendly minimum */
    }
    
    .tkd-action-button.secondary {
        padding: 0.75rem 0.5rem;
        font-size: 0.8rem;
        min-height: 44px; /* Touch-friendly minimum */
    }

    .tkd-action-button i {
        font-size: 1rem;
    }

    /* Enhanced business cards mobile layout */
    .enhanced-card-content {
        padding: 1.5rem;
    }
    
    .enhanced-business-info-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .enhanced-secondary-actions {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }
    
    .enhanced-status-row {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .enhanced-status-item {
        min-height: 70px;
        max-height: 70px;
    }
    
    .tkd-status-grid {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .tkd-status-card {
        min-height: 70px;
        max-height: 70px;
    }
    
    .enhanced-action-btn {
        min-height: 48px;
        padding: 0.75rem 0.5rem;
        font-size: 0.85rem;
    }
    
    .tkd-business-grid {
        gap: 1.5rem;
        padding: 0 1rem;
    }

    /* Search Section Mobile Optimizations */
    .tkd-search-card {
        padding: 1.5rem;
        border-radius: 16px;
        margin: 0 0.5rem;
    }
    
    .tkd-form-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    
    .tkd-search-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .tkd-search-options {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .tkd-quick-filter-tags {
        justify-content: center;
        gap: 0.5rem;
    }
    
    .tkd-quick-filter-tag {
        min-height: 40px;
        padding: 0.75rem 1rem;
        font-size: 0.85rem;
    }
    
    .tkd-advanced-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .tkd-search-btn {
        width: 100%;
        justify-content: center;
        min-height: 50px;
        font-size: 1rem;
    }
    
    /* Results and pagination */
    .tkd-results-meta {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .tkd-results-controls {
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 1rem;
    }
    
    .tkd-pagination {
        justify-content: center;
        gap: 0.5rem;
    }
    
    .tkd-page-btn {
        min-height: 44px;
        min-width: 44px;
        padding: 0.5rem;
    }
}

/* Small Mobile (480px and below) */
@media (max-width: 480px) {
    .glass-business-container {
        padding: 0.75rem 0.25rem;
    }
    
    .tkd-hero-header {
        padding: 1.5rem 0.75rem;
        margin: 0.75rem 0.25rem;
    }
    
    .tkd-hero-header h1 {
        font-size: clamp(1.8rem, 5vw, 2.2rem) !important;
        line-height: 1.1;
    }
    
    .tkd-hero-subtitle {
        font-size: 1rem;
        line-height: 1.4;
    }
    
    /* Top Rated Cards Phone Optimizations */
    .tkd-top-rated-grid {
        gap: 1.25rem;
        padding: 0 0.75rem;
    }
    
    .tkd-top-rated-card {
        padding: 1.25rem;
        min-height: 380px;
    }

    .tkd-top-rated-card h3 {
        font-size: 1.15rem !important;
        min-height: 2.3rem;
    }

    .tkd-business-info {
        min-height: auto;
    }

    .tkd-location-info {
        min-height: auto;
    }

    .tkd-actions-section {
        min-height: auto;
    }

    /* Touch-optimized action buttons */
    .tkd-primary-actions {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }

    .tkd-secondary-actions {
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }
    
    .tkd-action-button.primary {
        padding: 1.25rem 0.75rem;
        font-size: 1rem;
        min-height: 52px;
    }
    
    .tkd-action-button.secondary {
        padding: 1rem 0.5rem;
        font-size: 0.9rem;
        min-height: 48px;
    }

    .tkd-action-button i {
        font-size: 1.1rem;
    }

    /* Enhanced business cards mobile layout */
    .enhanced-card-content {
        padding: 1.25rem;
    }
    
    .enhanced-business-header {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .enhanced-header-actions {
        justify-content: center;
    }
    
    .enhanced-primary-actions {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .enhanced-secondary-actions {
        grid-template-columns: 1fr;
        gap: 0.75rem;
    }
    
    .enhanced-action-btn {
        min-height: 52px;
        padding: 1rem 0.75rem;
        font-size: 1rem;
    }
    
    .tkd-business-grid {
        gap: 1.25rem;
        padding: 0 0.75rem;
    }

    /* Search Section Phone Optimizations */
    .tkd-search-card {
        padding: 1.25rem;
        margin: 0 0.25rem;
    }
    
    .tkd-quick-filter-tags {
        gap: 0.75rem;
        flex-wrap: wrap;
    }
    
    .tkd-quick-filter-tag {
        font-size: 0.85rem;
        padding: 0.75rem 1rem;
        min-height: 44px;
    }
    
    .tkd-active-filter-chips {
        justify-content: center;
        gap: 0.5rem;
    }
    
    .tkd-search-btn {
        min-height: 54px;
        font-size: 1.1rem;
        padding: 1rem 1.5rem;
    }
    
    /* Status cards optimized for small screens */
    .tkd-status-card {
        min-height: 80px;
        max-height: 80px;
        padding: 0.75rem;
    }
    
    .enhanced-status-item {
        min-height: 80px;
        max-height: 80px;
        padding: 0.75rem;
    }
    
    /* Typography optimizations */
    .tkd-specialty-tag {
        font-size: 0.8rem;
        padding: 0.5rem 0.75rem;
        min-height: 32px;
    }
    
    .tkd-rating-display {
        padding: 0.75rem;
        gap: 0.5rem;
    }
    
    .tkd-star {
        font-size: 1.1rem;
    }
    
    .tkd-rating-number {
        font-size: 1.1rem;
    }
    
    .tkd-review-count {
        font-size: 0.85rem;
    }
    
    /* Improved pagination for mobile */
    .tkd-pagination {
        gap: 0.25rem;
    }
    
    .tkd-page-btn {
        min-height: 48px;
        min-width: 48px;
        padding: 0.75rem;
        font-size: 1rem;
    }
}

/* ENHANCED: Glass Card Business Listings System */
.glass-card-wrapper {
    position: relative;
    margin-bottom: 2rem;
    perspective: 1000px;
}

/* Glass card base removed - no longer needed */

.glass-card-top {
    position: relative;
    background: linear-gradient(135deg,
        rgba(255, 255, 255, 0.90) 0%,
        rgba(255, 255, 255, 0.85) 100%);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 16px;
    padding: 1.5rem;
    box-shadow: 
        0 8px 32px rgba(0, 0, 0, 0.25),
        inset 0 1px 0 rgba(255, 255, 255, 0.1);
    z-index: 2;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Hover effect only on card itself, not wrapper */
.glass-card-top:hover {
    transform: translateZ(0) translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
    border-color: rgba(var(--tkd-accent-rgb), 1);
    will-change: transform;
    position: relative;
    z-index: 10;
}

/* Banner cards: Make outer wrapper transparent - only inner glass-ad-banner shows */
.glass-card-wrapper.banner-card .glass-card-top {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Banner cards: Disable hover transform on outer layer */
.glass-card-wrapper.banner-card .glass-card-top:hover {
    transform: none !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* Prevent parent containers from moving */
.glass-card-wrapper:hover,
.glass-main-card:hover,
.glass-business-container:hover {
    transform: translateZ(0) !important;
    transition: none !important;
}

/* Glass border overlays removed — handled by turnkeydir-card-unified.css */

.glass-card-content {
    position: relative;
    z-index: 3;
}

/* Enhanced Business Listing Text Visibility */
.glass-business-name {
    color: var(--tkd-text-color) !important;
    font-weight: 700 !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

.glass-business-subtitle {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.85) !important;
    font-weight: 500 !important;
}

/* Action Button System */
.glass-action-btn {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9) !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

.glass-action-btn.active:hover {
    background: rgba(255, 255, 255, 0.15);
    border-color: rgba(255, 255, 255, 0.2);
    color: var(--tkd-text-color) !important;
    transform: translateY(-1px);
}

.glass-action-btn span {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9) !important;
    font-weight: 600;
}

.glass-action-btn.active:hover span {
    color: var(--tkd-text-color) !important;
}

/* Compact card styling for pagination */
.compact-card .glass-card-top {
    padding: 1.5rem;
}

/* Rating and review text visibility */
.glass-rating-number,
.glass-review-wrapper {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* Contact section text visibility */
.glass-contact-item span,
.glass-contact-item a {
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* Status badge text enhancement */
.glass-status-badge {
    text-shadow: none; /* Clean modern look */
}

/* No results section text */
.glass-fallback-title {
    color: var(--tkd-text-color) !important;
    font-size: 1.75rem;
    font-weight: 700;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
}

.glass-fallback-subtitle {
    color: var(--tkd-text-color) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
}

/* ENHANCED: Advanced Business Card System with Modern Layout */

/* Business Group Headers */
.tkd-business-group {
    margin-bottom: 3rem;
}

.tkd-group-header {
    margin-bottom: 2rem;
    padding: 1.5rem;
    background: linear-gradient(135deg,
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15) 0%,
        rgba(255, 255, 255, 0.08) 100%);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    border-radius: 16px;
    text-align: center;
}

.tkd-group-title {
    color: var(--tkd-text-color) !important;
    font-size: 1.5rem !important;
    font-weight: 700 !important;
    margin-bottom: 0.5rem !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
}

.tkd-group-title i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
}

.tkd-group-badge {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9);
    color: white;
    padding: 0.25rem 0.75rem;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-left: 0.5rem;
}

.tkd-group-subtitle {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.8) !important;
    font-size: 0.95rem !important;
    margin: 0 !important;
}

/* Business Grid Layout - Full Width Cards */
.tkd-business-grid {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    margin-bottom: 2rem;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}

/* Enhanced Business Card Container - Full Width with Animations */
.enhanced-business-card {
    position: relative;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 16px;
    overflow: hidden;
    opacity: 0;
    transform: translateY(20px);
    animation: slideInUp 0.6s ease-out forwards;
}

.enhanced-business-card:nth-child(1) { animation-delay: 0.1s; }
.enhanced-business-card:nth-child(2) { animation-delay: 0.2s; }
.enhanced-business-card:nth-child(3) { animation-delay: 0.3s; }
.enhanced-business-card:nth-child(4) { animation-delay: 0.4s; }
.enhanced-business-card:nth-child(5) { animation-delay: 0.5s; }

@keyframes slideInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.enhanced-card-container {
    position: relative;
    background: var(--tkd-main-bg-color);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    border-radius: 16px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

.enhanced-card-container::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1), 
        transparent);
    transition: left 0.6s ease;
    z-index: 1;
}

.enhanced-card-container:hover::before {
    left: 100%;
}

.enhanced-card-container:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.15);
    transform: translateY(-4px) scale(1.01);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4);
}

.enhanced-card-background {
    /* Remove glass background for clean look */
    display: none;
}

.enhanced-card-content {
    position: relative;
    z-index: 2;
    padding: 2rem;
    display: grid;
    grid-template-columns: 1fr 300px;
    gap: 2rem;
    align-items: start;
}

.enhanced-main-content {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}

.enhanced-sidebar-content {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

/* Sidebar Quick Contact Items */
.enhanced-contact-item.quick-call,
.enhanced-contact-item.quick-website,
.enhanced-contact-item.quick-directions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05);
    border-radius: 10px;
    text-decoration: none;
    color: var(--tkd-text-color);
    font-weight: 500;
    transition: all 0.3s ease;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
    margin-bottom: 0.5rem;
}

.enhanced-contact-item.quick-call:hover,
.enhanced-contact-item.quick-website:hover,
.enhanced-contact-item.quick-directions:hover {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.enhanced-contact-item.quick-call i {
    color: #22c55e;
    font-size: 1.1rem;
}

.enhanced-contact-item.quick-website i {
    color: #3b82f6;
    font-size: 1.1rem;
}

.enhanced-contact-item.quick-directions i {
    color: #f59e0b;
    font-size: 1.1rem;
}

/* Sidebar Cards */
.enhanced-info-section.contact-card,
.enhanced-info-section.hours-card {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.04);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15);
    border-radius: 12px;
    padding: 1.25rem;
    transition: all 0.3s ease;
}

.enhanced-info-section.contact-card:hover,
.enhanced-info-section.hours-card:hover {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.06);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    transform: translateY(-2px);
}

/* Enhanced Image Section for Sidebar */
.enhanced-sidebar-content .enhanced-image-section {
    margin-bottom: 1.25rem;
}

.enhanced-sidebar-content .enhanced-image-container {
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
}

.enhanced-sidebar-content .enhanced-image-container:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

.enhanced-sidebar-content .enhanced-business-image,
.enhanced-sidebar-content .enhanced-mapillary-frame {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 12px;
}

/* Card Type Specific Styling - Clean Light Theme */
.featured-card .enhanced-card-container {
    border: 2px solid rgba(255, 215, 0, 0.6);
    background: var(--tkd-main-bg-color);
    box-shadow: 0 2px 8px rgba(255, 215, 0, 0.15);
}

.featured-card .enhanced-card-container:hover {
    border-color: rgba(255, 215, 0, 0.8);
    box-shadow: 0 4px 16px rgba(255, 215, 0, 0.25);
}

.premium-card .enhanced-card-container {
    border: 2px solid rgba(34, 197, 94, 0.6);
    background: var(--tkd-main-bg-color);
    box-shadow: 0 2px 8px rgba(34, 197, 94, 0.15);
}

.premium-card .enhanced-card-container:hover {
    border-color: rgba(34, 197, 94, 0.8);
    box-shadow: 0 4px 16px rgba(34, 197, 94, 0.25);
}

/* Card Hover Effects - Subtle and Clean */
.enhanced-business-card:hover {
    /* Already handled in enhanced-card-container:hover */
}

/* Card Type Badges - Clean and Simple */
.enhanced-card-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 0.4rem 0.8rem;
    border-radius: 20px;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    z-index: 3;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.featured-badge {
    background: linear-gradient(135deg, rgba(255, 215, 0, 0.95), rgba(255, 193, 7, 0.9));
    color: #1a1a1a;
    border: 1px solid rgba(255, 215, 0, 0.3);
}

.premium-badge {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.95), rgba(22, 163, 74, 0.9));
    color: white;
    border: 1px solid rgba(34, 197, 94, 0.3);
}

/* Business Header - Clean and Simple */
.enhanced-business-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 1.25rem;
    gap: 1rem;
}

.enhanced-header-main {
    flex: 1;
}

.enhanced-business-name {
    color: var(--tkd-text-color) !important;
    font-size: 1.3rem !important;
    font-weight: 700 !important;
    margin-bottom: 0.4rem !important;
    line-height: 1.3;
}

.enhanced-business-category {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7) !important;
    font-size: 0.85rem !important;
    margin: 0 !important;
    font-weight: 500;
}

.enhanced-header-actions {
    display: flex;
    gap: 0.4rem;
}

.enhanced-action-icon {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05);
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.3s ease;
    font-size: 0.9rem;
}

.enhanced-action-icon:hover {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1);
    transform: translateY(-1px);
}

/* Rating and Status Bar - Clean Layout */
.enhanced-rating-status-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.25rem;
    gap: 1rem;
    flex-wrap: wrap;
}

.enhanced-rating-display {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05);
    border-radius: 10px;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15);
}

.enhanced-stars {
    display: flex;
    gap: 0.2rem;
}

.enhanced-stars i {
    color: #ffd700;
    font-size: 0.9rem;
    filter: drop-shadow(0 1px 2px rgba(255, 215, 0, 0.3));
}

.enhanced-rating-text {
    color: var(--tkd-text-color) !important;
    font-weight: 600;
    font-size: 0.9rem;
}

.enhanced-review-count {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7) !important;
    font-weight: 400;
    margin-left: 0.25rem;
}

/* Enhanced Status Info Bar - Better Symmetrical Layout */
.enhanced-status-info-bar {
    margin: 1.25rem 0;
    padding: 1rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.02) 100%);
    border-radius: 12px;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15);
    backdrop-filter: none;
}

.enhanced-status-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    align-items: center;
}

.enhanced-status-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.75rem;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.1) 0%, 
        rgba(255, 255, 255, 0.05) 100%);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 10px;
    backdrop-filter: none;
    transition: all 0.3s ease;
    /* Fixed dimensions for consistency */
    min-height: 80px;
    max-height: 80px;
    min-width: 0; /* Allow flex to work properly */
    overflow: hidden;
}

.enhanced-status-item:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.15) 0%, 
        rgba(255, 255, 255, 0.08) 100%);
    border-color: rgba(255, 255, 255, 0.25);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.enhanced-status-icon {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 0.9rem;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.1) 0%, 
        rgba(255, 255, 255, 0.05) 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

.enhanced-status-content {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    flex: 1;
    min-width: 0; /* Prevent flex item from growing beyond container */
    overflow: hidden;
}

.enhanced-status-label {
    font-size: 0.8rem;
    font-weight: 600;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.enhanced-status-details {
    font-size: 0.75rem;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7);
    line-height: 1.3;
    /* Text truncation for long content */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: break-word;
}

/* Status-specific colors */
.enhanced-status-item.status-item .enhanced-status-icon i.open {
    color: #10b981;
}

.enhanced-status-item.status-item .enhanced-status-icon i.closed {
    color: #ef4444;
}

.enhanced-status-item.distance-item .enhanced-status-icon i {
    color: #3b82f6;
}

.enhanced-status-item.verification-item .enhanced-status-icon i {
    color: #f59e0b;
}

/* Removed duplicate CSS - using the enhanced version above */

.enhanced-status-label {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--tkd-text-color) !important;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.enhanced-status-details {
    font-size: 0.75rem;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7) !important;
    line-height: 1.3;
}

/* Business Information Grid - Full Width Layout */
.enhanced-business-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 1.5rem;
    margin-bottom: 1.5rem;
}

/* Enhanced Specialties Grid */
.enhanced-specialties-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.enhanced-specialty-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05) 100%);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    border-radius: 8px;
    transition: all 0.3s ease;
    font-size: 0.8rem;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
}

.enhanced-specialty-item:hover {
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15) 0%, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.08) 100%);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    transform: translateY(-1px);
}

.enhanced-specialty-item i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.7rem;
}

.enhanced-features-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.enhanced-feature-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.5rem 0.75rem;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.08) 0%, 
        rgba(255, 255, 255, 0.04) 100%);
    border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 8px;
    transition: all 0.3s ease;
    font-size: 0.8rem;
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
}

.enhanced-feature-item:hover {
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.12) 0%, 
        rgba(255, 255, 255, 0.06) 100%);
    border-color: rgba(255, 255, 255, 0.25);
    transform: translateY(-1px);
}

.enhanced-feature-item i {
    color: #f59e0b;
    font-size: 0.7rem;
}

.enhanced-info-column {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.enhanced-info-section {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.03);
    border-radius: 12px;
    padding: 1.25rem;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
    transition: all 0.3s ease;
    position: relative;
    overflow: hidden;
}

.enhanced-info-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.6),
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3));
    transform: translateX(-100%);
    transition: transform 0.4s ease;
}

.enhanced-info-section:hover::before {
    transform: translateX(0);
}

.enhanced-info-section:hover {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
    transform: translateY(-2px);
}

.enhanced-section-title {
    color: var(--tkd-text-color) !important;
    /* font-size and font-weight now controlled by turnkeydir-typography-unified.css using --tkd-h4-size/weight */
    margin-bottom: 0.75rem !important;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-transform: uppercase;
    letter-spacing: 0.025em;
}

.enhanced-section-title i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 0.8rem;
}

/* Contact Information */
.enhanced-contact-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 0.75rem;
}

.enhanced-contact-item:last-child {
    margin-bottom: 0;
}

.enhanced-contact-item i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8);
    font-size: 1rem;
    margin-top: 0.125rem;
    flex-shrink: 0;
}

.enhanced-contact-details {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
}

.enhanced-contact-text {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9) !important;
    font-size: 0.85rem;
    line-height: 1.4;
    text-decoration: none;
    font-weight: 500;
}

.enhanced-contact-text:hover {
    color: var(--tkd-text-color) !important;
}

.enhanced-contact-link,
.enhanced-contact-note {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.6) !important;
    font-size: 0.75rem;
    text-decoration: none;
}

.enhanced-contact-link:hover {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9) !important;
}

/* Business Hours */
.enhanced-hours-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.enhanced-hours-item {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9) !important;
    font-size: 0.85rem;
    padding: 0.25rem 0;
}

/* Specialties and Features */
.enhanced-specialties-grid {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

.enhanced-specialty-item,
.enhanced-feature-item {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: rgba(255, 255, 255, 0.9);
    font-size: 0.85rem;
}

.enhanced-specialty-item i,
.enhanced-feature-item i {
    color: rgba(34, 197, 94, 0.8);
    font-size: 0.75rem;
    flex-shrink: 0;
}

.enhanced-features-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

/* Featured Image Section - Clean Layout */
.enhanced-image-section {
    margin: 1.25rem 0;
}

.enhanced-image-container {
    position: relative;
    border-radius: 8px;
    overflow: hidden;
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.03);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1);
}

.enhanced-business-image,
.enhanced-mapillary-frame {
    width: 100%;
    height: 180px;
    object-fit: cover;
    border-radius: 8px;
    transition: transform 0.3s ease;
}

.enhanced-image-container:hover .enhanced-business-image {
    transform: scale(1.02);
}

.enhanced-image-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    padding: 0.4rem 0.6rem;
    background: rgba(0, 0, 0, 0.75);
    color: white;
    border-radius: 15px;
    font-size: 0.7rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 0.25rem;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.enhanced-image-badge.mapillary i {
    color: #4ade80;
}

.enhanced-image-badge.photo i {
    color: #3b82f6;
}

/* Enhanced Action Buttons - Always Show All with Grid Layout */
.enhanced-actions-section {
    margin-top: 1.5rem;
    border-top: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15);
    padding-top: 1.5rem;
    position: relative;
    z-index: 2;
}

.enhanced-primary-action {
    margin-bottom: 1rem;
}

.enhanced-primary-action .enhanced-action-btn {
    width: 100%;
    padding: 1.2rem 1rem;
    font-size: 1rem;
    font-weight: 600;
    min-height: 60px;
    background: linear-gradient(135deg, 
        rgba(255, 255, 255, 0.1) 0%, 
        rgba(255, 255, 255, 0.05) 100%);
    border: 1px solid rgba(255, 255, 255, 0.2);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.9);
}

.enhanced-primary-action .enhanced-action-btn:hover {
    background: linear-gradient(135deg, 
        rgba(34, 197, 94, 0.08) 0%, 
        rgba(16, 185, 129, 0.05) 100%);
    border-color: rgba(34, 197, 94, 0.2);
    box-shadow: 0 6px 20px rgba(34, 197, 94, 0.15);
    transform: translateY(-2px);
}

.enhanced-primary-action .enhanced-action-btn i {
    color: rgba(34, 197, 94, 0.8);
}

.enhanced-secondary-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
}

.enhanced-action-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 1rem 0.8rem;
    border-radius: 12px;
    text-decoration: none;
    font-weight: 600;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
    cursor: pointer;
    gap: 0.5rem;
    text-align: center;
    min-height: 80px;
    position: relative;
    overflow: hidden;
    font-size: 0.85rem;
}

.enhanced-action-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, 
        transparent, 
        rgba(255, 255, 255, 0.2), 
        transparent);
    transition: left 0.6s ease;
    z-index: 1;
}

.enhanced-action-btn:hover::before {
    left: 100%;
}

.enhanced-action-btn i,
.enhanced-action-btn span {
    position: relative;
    z-index: 2;
}

/* Active State - Available Actions */
.enhanced-action-btn.active {
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) 0%,
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.05) 100%);
    color: var(--tkd-text-color);
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.3);
    box-shadow: 0 2px 8px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15);
}

/* Disabled State - Unavailable Actions */
.enhanced-action-btn.disabled {
    background: rgba(255, 255, 255, 0.02);
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.4);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    cursor: not-allowed;
    opacity: 0.6;
}

.enhanced-action-btn.disabled i {
    opacity: 0.5;
}

/* Hover Effects */
.enhanced-action-btn.active:hover {
    transform: translateY(-3px) scale(1.02);
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15) 0%,
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.08) 100%);
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4);
    box-shadow: 0 4px 12px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2);
}

.enhanced-action-btn.disabled:hover {
    transform: none;
    background: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.1);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.enhanced-action-btn i {
    font-size: 1.1rem;
}

.enhanced-action-btn span {
    font-size: 0.85rem;
}

/* Button-specific styling - Call button uses brand accent color */
.enhanced-action-btn.call-btn.active i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9);
}

.enhanced-action-btn.website-btn.active i {
    color: #3b82f6;
}

.enhanced-action-btn.directions-btn.active i {
    color: #f59e0b;
}

.enhanced-action-btn.book-btn.active i {
    color: #8b5cf6;
}

/* Results Controls */
        .tkd-results-meta {
            display: flex;
            justify-content: space-between;
            align-items: center;
            flex-wrap: wrap;
            gap: 1rem;
            margin-top: 1rem;
            color: var(--tkd-text-color) !important;
        }

.tkd-results-controls {
    display: flex;
    align-items: center;
    gap: 1.5rem;
}

.tkd-sort-controls {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.tkd-sort-controls select {
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    color: white;
    border-radius: 8px;
    padding: 0.5rem;
}

.tkd-view-controls {
    display: flex;
    gap: 0.5rem;
}

.tkd-view-btn {
    width: 40px;
    height: 40px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.8);
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.tkd-view-btn:hover,
.tkd-view-btn.active {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9);
    color: white;
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.5);
}

/* Responsive Design - Enhanced for Full Width Cards */
@media (max-width: 1024px) {
    .enhanced-card-content {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    
    .enhanced-business-info-grid {
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
    }
}

@media (max-width: 768px) {
    .tkd-business-grid {
        gap: 1.5rem;
        padding: 0 1rem;
    }
    
    .enhanced-card-content {
        padding: 1.5rem;
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    
    .enhanced-business-info-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .enhanced-secondary-actions {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }
    
    .enhanced-status-row {
        grid-template-columns: repeat(1, 1fr);
        gap: 0.5rem;
    }
    
    .enhanced-status-item {
        min-height: 70px;
        max-height: 70px;
    }
    
    .tkd-status-grid {
        grid-template-columns: 1fr;
        gap: 0.5rem;
    }
    
    .tkd-status-card {
        min-height: 70px;
        max-height: 70px;
    }
    
    .enhanced-action-btn {
        min-height: 60px;
        padding: 0.75rem 0.5rem;
    }
    
    .tkd-results-meta {
        flex-direction: column;
        align-items: stretch;
    }
    
    .tkd-results-controls {
        justify-content: space-between;
    }
}

@media (max-width: 480px) {
    .enhanced-card-content {
        padding: 1.25rem;
    }
    
    .enhanced-business-header {
        flex-direction: column;
        align-items: stretch;
        gap: 1rem;
    }
    
    .enhanced-header-actions {
        justify-content: center;
    }
    
    .enhanced-primary-actions {
        grid-template-columns: 1fr;
    }
    
    .enhanced-secondary-actions {
        grid-template-columns: 1fr;
    }
}

/* ENHANCED: Related Cities Section Styling - UNIFIED for all platforms */
.tkd-related-cities-section {
    margin: 4rem 0 !important;
    padding: 3rem 2rem !important;
    background: rgba(0, 0, 0, 0.02) !important; /* Subtle light grey background */
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    border-radius: 24px !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Hide decorative line on related cities section */
.tkd-related-cities-section::before {
    display: none !important;
    content: none !important;
}

.tkd-related-cities-container {
    max-width: 1200px !important;
    margin: 0 auto !important;
}

/* UNIFIED: Force 3-column grid for related cities */
.tkd-related-cities-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; /* FIXED: Always 3 columns */
    gap: 1.5rem !important;
    margin: 2rem 0 !important;
}

@media (max-width: 1024px) {
    .tkd-related-cities-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 640px) {
    .tkd-related-cities-grid {
        grid-template-columns: 1fr !important;
    }
}

/* UNIFIED: Solid white card backgrounds - FIXED HEIGHT to match Hostinger (225px) */
.tkd-related-city-card {
    position: relative !important;
    background: #ffffff !important; /* FIXED: Solid white */
    border: 1px solid rgba(0, 0, 0, 0.08) !important; /* Subtle grey border */
    border-radius: 16px !important;
    padding: 0.875rem !important; /* REDUCED: Slightly less padding to fit button */
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    overflow: hidden !important; /* KEEP: Maintain rounded corners */
    cursor: pointer !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06) !important;
    display: flex !important;
    flex-direction: column !important;
    min-height: 225px !important; /* ENSURE: Minimum matches Hostinger */
    max-height: none !important; /* REMOVED: Allow card to grow if needed */
    height: auto !important; /* CHANGED: Auto height to fit content */
}

.tkd-related-city-card:hover {
    transform: translateY(-4px) !important;
    background: #ffffff !important;
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4) !important;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12) !important;
}

/* HIDE all decorative lines on city cards */
.tkd-related-city-card::before,
.tkd-related-city-card::after,
.tkd-related-city-card:hover::before,
.tkd-related-city-card:hover::after {
    display: none !important;
    content: none !important;
}

/* Hover background effect - subtle accent glow */
.tkd-city-card-bg {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.03) 0%, 
        transparent 70%) !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
    pointer-events: none !important;
}

.tkd-related-city-card:hover .tkd-city-card-bg {
    opacity: 1 !important;
}

/* UNIFIED: Card header styling - compact with spacing and proper alignment */
.tkd-city-card-header {
    margin-bottom: 0 !important; /* REMOVED: Spacing handled by padding-bottom */
    padding: 0 !important;
    padding-bottom: 0.75rem !important; /* REDUCED: Space for divider, less to fit button */
    border-bottom: 1px solid rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.12) !important; /* ADDED: Subtle divider line */
    flex-shrink: 0 !important; /* Prevent header from shrinking */
}

.tkd-city-name {
    color: var(--tkd-text-color) !important;
    font-size: 1.1rem !important;
    font-weight: 600 !important;
    margin: 0 0 0.35rem 0 !important; /* INCREASED: More space between name and state */
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    line-height: 1.3 !important;
    text-align: left !important;
}

.tkd-city-name i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9) !important;
    font-size: 0.95rem !important;
    flex-shrink: 0 !important; /* Prevent icon from shrinking */
    width: 16px !important; /* Fixed width for consistent alignment */
    text-align: center !important;
}

.tkd-city-state {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7) !important;
    font-size: 0.85rem !important;
    font-weight: 500 !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: left !important;
    display: block !important;
    padding-left: 0 !important; /* REMOVED: Align with container, not icon */
    margin: 0 !important;
    line-height: 1.4 !important;
}

/* UNIFIED: Stats section - compact with spacing from header and proper alignment */
.tkd-city-stats {
    display: flex !important;
    flex-direction: column !important;
    gap: 0.35rem !important; /* REDUCED: Slightly less gap to fit button */
    margin-bottom: 0.75rem !important; /* REDUCED: Less space before button to fit */
    margin-top: 0.75rem !important; /* REDUCED: Less space after divider to fit */
    flex-grow: 1 !important;
    flex-shrink: 1 !important; /* Allow stats to shrink if needed */
    padding: 0 !important;
    min-height: 0 !important; /* Allow flex shrinking */
}

.tkd-city-stat {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important; /* INCREASED: More space between icon and text */
    color: var(--tkd-text-color) !important;
    font-size: 0.85rem !important; /* INCREASED: Slightly larger for readability */
    visibility: visible !important;
    opacity: 0.9 !important; /* INCREASED: Slightly more visible */
    line-height: 1.4 !important; /* INCREASED: Better line height */
    margin: 0 !important;
    padding: 0 !important;
    text-align: left !important;
}

.tkd-city-stat i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8) !important;
    font-size: 0.85rem !important;
    width: 18px !important; /* INCREASED: Slightly wider for better alignment */
    flex-shrink: 0 !important; /* Prevent icon from shrinking */
    text-align: center !important;
}

.tkd-city-stat span {
    flex: 1 !important; /* Allow text to take remaining space */
    text-align: left !important;
}

/* UNIFIED: Button container */
.tkd-city-actions {
    margin-top: auto !important;
    flex-shrink: 0 !important; /* Prevent button from shrinking */
    padding-top: 0 !important;
    margin-bottom: 0 !important;
}

/* UNIFIED: Explore button with solid accent color and WHITE text */
.tkd-city-explore-btn,
.tkd-related-city-card .tkd-city-explore-btn {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.4rem !important;
    width: 100% !important;
    padding: 0.55rem 0.875rem !important; /* REDUCED: Slightly less padding to fit */
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.95) !important; /* Solid accent color */
    color: #ffffff !important; /* WHITE text always */
    text-decoration: none !important;
    border-radius: 10px !important;
    font-weight: 600 !important;
    font-size: 0.875rem !important;
    transition: all 0.3s ease !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.25) !important;
    flex-shrink: 0 !important; /* Prevent button from shrinking */
    min-height: 38px !important; /* ENSURE: Minimum button height */
}

.tkd-city-explore-btn i,
.tkd-related-city-card .tkd-city-explore-btn i {
    color: #ffffff !important; /* WHITE icon always */
}

.tkd-city-explore-btn span,
.tkd-related-city-card .tkd-city-explore-btn span {
    color: #ffffff !important; /* WHITE span text always */
}

.tkd-city-explore-btn:hover,
.tkd-related-city-card .tkd-city-explore-btn:hover {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 1) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4) !important;
    color: #ffffff !important;
}

/* v2.14.29: aligned the city footer chrome with dynamic-country.php's inline
   .tkd-state-navigation-footer + .tkd-view-all-states-btn rules so the bottom
   of every page type (city / state / country) is now visually identical.
   Previous values (white solid bg, .tkd-related-cities-footer wrapper-only
   centering) were left over from when this button sat inside the related-cities
   section; now that it's been relocated outside .glass-main-card it needs the
   accent-gradient pill that country uses. */
.tkd-related-cities-footer,
.tkd-state-navigation-footer {
    text-align: center !important;
    margin: 2.5rem auto 2rem auto !important;
    max-width: 600px !important;
    padding-top: 2rem !important;
    border-top: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.1) !important;
}

.tkd-view-all-states-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 0.75rem !important;
    padding: 1rem 2rem !important;
    background: linear-gradient(135deg,
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.08) 0%,
        rgba(255, 255, 255, 0.95) 100%) !important;
    color: var(--tkd-text-color) !important;
    text-decoration: none !important;
    border-radius: 12px !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) !important;
}

.tkd-view-all-states-btn i {
    font-size: 1.1rem !important;
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.85) !important;
}

.tkd-view-all-states-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15) !important;
    border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.35) !important;
    background: linear-gradient(135deg,
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.12) 0%,
        rgba(255, 255, 255, 0.98) 100%) !important;
}

/* ============================================
   COMPREHENSIVE MOBILE OPTIMIZATIONS
   Following TurnkeyDir-DEVELOPMENT-GUIDELINES.md Rule 4
   Starting from top of page
   ============================================ */

/* Mobile: 768px and below - Top Sections */
@media (max-width: 768px) {
    /* === CONTAINER OPTIMIZATION === */
    .glass-business-container {
        padding: 1rem 0.75rem !important; /* REDUCED: Less padding on mobile */
        min-height: auto !important;
    }

    .glass-main-card {
        padding: 1rem 0.75rem !important; /* REDUCED: Less padding */
        gap: 1rem !important; /* REDUCED: Tighter spacing */
    }

    /* === BREADCRUMB - Mobile Optimized === */
    .tkd-breadcrumb {
        padding: 0.625rem 0.875rem !important; /* REDUCED: More compact */
        margin: 0 auto 1.25rem auto !important; /* REDUCED: Less bottom margin */
        font-size: 0.8rem !important; /* REDUCED: Smaller text */
        max-width: calc(100% - 1.5rem) !important;
        border-radius: 10px !important;
        background: rgba(255, 255, 255, 0.05) !important;
    }

    .tkd-breadcrumb ol {
        gap: 0.4rem !important; /* REDUCED: Tighter gap */
        font-size: 0.8rem !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
    }

    .tkd-breadcrumb a,
    .tkd-breadcrumb span {
        font-size: 0.8rem !important;
    }

    .tkd-breadcrumb li {
        white-space: nowrap !important;
    }

    /* === HERO HEADER - Mobile Optimized === */
    .tkd-hero-header {
        padding: 1.5rem 0.75rem !important; /* REDUCED: Less padding */
        margin: 0 auto 1.5rem auto !important; /* REDUCED: Less margin */
        text-align: center !important;
    }

    .tkd-hero-header h1 {
        font-size: clamp(1.5rem, 6vw, 2rem) !important; /* RESPONSIVE: Scales with viewport */
        line-height: 1.2 !important;
        margin: 0 0 0.875rem 0 !important; /* REDUCED: Less margin */
        word-wrap: break-word !important;
        hyphens: auto !important;
        padding: 0 0.5rem !important; /* ADDED: Prevent edge touching */
    }

    .tkd-hero-subtitle,
    .tkd-hero-header p {
        font-size: 0.9rem !important; /* REDUCED: Smaller subtitle */
        line-height: 1.5 !important;
        margin: 0 auto 1.5rem auto !important; /* REDUCED: Less margin */
        padding: 0 0.75rem !important; /* ADDED: Side padding */
        max-width: 100% !important;
        opacity: 0.85 !important;
    }

    /* === HERO STATS - Mobile Optimized === */
    .tkd-hero-stats {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important; /* TWO COLUMNS: Better for mobile */
        gap: 0.75rem !important; /* REDUCED: Tighter gap */
        margin: 1.5rem auto !important; /* REDUCED: Less margin */
        padding: 1rem 0.75rem !important; /* REDUCED: Less padding */
        border-radius: 12px !important;
        max-width: 100% !important;
        background: linear-gradient(135deg, 
            rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.06) 0%, 
            rgba(255, 255, 255, 0.95) 100%) !important; /* LIGHTER: Less intense gradient */
    }

    .tkd-hero-stats .tkd-stat-item {
        padding: 0.875rem 0.625rem !important; /* REDUCED: More compact */
        border-radius: 10px !important;
        min-height: auto !important;
        flex-direction: row !important; /* KEEP: Horizontal layout */
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 0.625rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-hero-stats .tkd-stat-icon {
        font-size: 1.25rem !important; /* REDUCED: Smaller icon */
        flex-shrink: 0 !important;
        width: auto !important;
    }

    .tkd-hero-stats .tkd-stat-text {
        display: flex !important;
        flex-direction: column !important;
        text-align: left !important;
        gap: 0.15rem !important;
        flex: 1 !important;
        min-width: 0 !important; /* ALLOW: Text to shrink */
    }

    .tkd-hero-stats .tkd-stat-number {
        font-size: 1.1rem !important; /* REDUCED: Smaller number */
        font-weight: 700 !important;
        line-height: 1.2 !important;
        margin-right: 0.25rem !important;
        display: inline !important;
    }

    .tkd-hero-stats .tkd-stat-label,
    .tkd-hero-stats .tkd-stat-text > span:not(.tkd-stat-number) {
        font-size: 0.7rem !important; /* REDUCED: Smaller label */
        line-height: 1.3 !important;
        opacity: 0.85 !important;
        word-wrap: break-word !important;
        overflow-wrap: break-word !important;
    }

    /* 5th stat item - spans full width on mobile if needed */
    .tkd-hero-stats .tkd-stat-item:nth-child(5) {
        grid-column: 1 / -1 !important; /* SPAN: Full width for 5th item */
    }
}

/* Small Mobile: 480px and below */
@media (max-width: 480px) {
    /* === CONTAINER === */
    .glass-business-container {
        padding: 0.75rem 0.5rem !important; /* REDUCED: Even less padding */
    }

    .glass-main-card {
        padding: 0.75rem 0.5rem !important;
        gap: 0.875rem !important;
    }

    /* === BREADCRUMB === */
    .tkd-breadcrumb {
        padding: 0.5rem 0.75rem !important;
        margin: 0 auto 1rem auto !important;
        font-size: 0.75rem !important; /* REDUCED: Even smaller */
        border-radius: 8px !important;
    }

    .tkd-breadcrumb ol {
        gap: 0.35rem !important;
        font-size: 0.75rem !important;
    }

    .tkd-breadcrumb a,
    .tkd-breadcrumb span {
        font-size: 0.75rem !important;
    }

    /* === HERO HEADER === */
    .tkd-hero-header {
        padding: 1.25rem 0.5rem !important;
        margin: 0 auto 1.25rem auto !important;
    }

    .tkd-hero-header h1 {
        font-size: clamp(1.375rem, 6.5vw, 1.875rem) !important;
        margin: 0 0 0.75rem 0 !important;
        padding: 0 0.25rem !important;
    }

    .tkd-hero-subtitle,
    .tkd-hero-header p {
        font-size: 0.85rem !important; /* REDUCED: Smaller */
        line-height: 1.4 !important;
        margin: 0 auto 1.25rem auto !important;
        padding: 0 0.5rem !important;
    }

    /* === HERO STATS === */
    .tkd-hero-stats {
        gap: 0.625rem !important; /* REDUCED: Even tighter */
        margin: 1.25rem auto !important;
        padding: 0.875rem 0.5rem !important;
        border-radius: 10px !important;
    }

    .tkd-hero-stats .tkd-stat-item {
        padding: 0.75rem 0.5rem !important; /* REDUCED: More compact */
        border-radius: 8px !important;
        gap: 0.5rem !important;
        flex-direction: row !important; /* KEEP: Horizontal layout */
    }

    .tkd-hero-stats .tkd-stat-icon {
        font-size: 1.1rem !important; /* REDUCED: Smaller icon */
    }

    .tkd-hero-stats .tkd-stat-number {
        font-size: 1rem !important; /* REDUCED: Smaller number */
    }

    .tkd-hero-stats .tkd-stat-label,
    .tkd-hero-stats .tkd-stat-text > span:not(.tkd-stat-number) {
        font-size: 0.65rem !important; /* REDUCED: Smaller label */
        line-height: 1.25 !important;
    }
}

/* Very Small Screens: ≤360px */
@media (max-width: 360px) {
    .glass-business-container {
        padding: 0.625rem 0.375rem !important;
    }

    .glass-main-card {
        padding: 0.625rem 0.375rem !important;
    }

    .tkd-breadcrumb {
        padding: 0.5rem 0.625rem !important;
        font-size: 0.7rem !important;
    }

    .tkd-hero-header h1 {
        font-size: clamp(1.25rem, 7vw, 1.75rem) !important;
    }

    .tkd-hero-subtitle,
    .tkd-hero-header p {
        font-size: 0.8rem !important;
    }

    .tkd-hero-stats {
        gap: 0.5rem !important;
        padding: 0.75rem 0.375rem !important;
    }

    .tkd-hero-stats .tkd-stat-item {
        padding: 0.625rem 0.375rem !important;
        gap: 0.4rem !important;
    }

    .tkd-hero-stats .tkd-stat-icon {
        font-size: 1rem !important;
    }

    .tkd-hero-stats .tkd-stat-number {
        font-size: 0.95rem !important;
    }

    .tkd-hero-stats .tkd-stat-label,
    .tkd-hero-stats .tkd-stat-text > span:not(.tkd-stat-number) {
        font-size: 0.6rem !important;
    }

    /* === SEARCH FILTER CARD === */
    .tkd-search-card {
        padding: 1rem 0.75rem !important;
        margin-bottom: 1.5rem !important;
    }

    .tkd-search-card .tkd-section-title {
        font-size: 1.1rem !important;
        margin-bottom: 0.5rem !important;
    }

    .tkd-search-card .tkd-section-subtitle {
        font-size: 0.8rem !important;
        margin-bottom: 1rem !important;
    }

    .tkd-quick-filters {
        margin-bottom: 1rem !important;
    }

    .tkd-quick-filters-label {
        font-size: 0.75rem !important;
        margin-bottom: 0.625rem !important;
    }

    .tkd-quick-filter-tags {
        gap: 0.4rem !important;
    }

    .tkd-quick-filter-tag {
        padding: 0.4rem 0.75rem !important;
        font-size: 0.7rem !important;
    }

    .tkd-form-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
        margin-bottom: 1.25rem !important;
    }

    .tkd-form-group label {
        font-size: 0.75rem !important;
    }

    .tkd-form-group input,
    .tkd-form-group select {
        padding: 0.75rem 0.875rem !important;
        font-size: 0.9rem !important;
    }

    /* v2.14.21: no more inline icons inside the input, so the left/right
     * padding inset for them is dropped. Native clear button on type="search"
     * fits inside the default input padding on mobile. */

    .tkd-search-actions {
        flex-direction: column !important;
        gap: 0.75rem !important;
    }

    .tkd-search-btn {
        width: 100% !important;
        padding: 0.875rem 1rem !important;
        font-size: 0.9rem !important;
    }
}

/* ============================================
   SEARCH FILTER CARD - Mobile Optimizations
   Following TurnkeyDir-DEVELOPMENT-GUIDELINES.md Rule 4
   ============================================ */

/* Mobile: 768px and below */
@media (max-width: 768px) {
    /* === SEARCH CARD CONTAINER === */
    .tkd-search-card {
        padding: 1.25rem 0.875rem !important; /* REDUCED: Match category page (1.5rem -> 1.25rem) */
        margin-bottom: 1.5rem !important; /* REDUCED: Less margin */
        border-radius: 12px !important; /* REDUCED: Smaller radius */
    }

    /* === SECTION HEADER === */
    .tkd-search-card .tkd-section-header {
        margin-bottom: 1rem !important; /* REDUCED: Less space */
    }

    .tkd-search-card .tkd-section-title {
        font-size: 1.1rem !important; /* REDUCED: Smaller title */
        margin-bottom: 0.375rem !important; /* REDUCED: Less margin */
        gap: 0.35rem !important;
    }

    .tkd-search-card .tkd-section-title i {
        font-size: 1rem !important; /* REDUCED: Smaller icon */
    }

    .tkd-search-card .tkd-section-subtitle {
        font-size: 0.8rem !important; /* REDUCED: Smaller subtitle */
        margin-bottom: 1rem !important; /* REDUCED: Less margin */
        padding: 0 0.25rem !important; /* ADDED: Side padding */
        line-height: 1.4 !important;
    }

    /* === QUICK FILTERS - Mobile Dropdown === */
    .tkd-quick-filters {
        margin-bottom: 1rem !important; /* REDUCED: Less margin */
    }

    .tkd-quick-filters-label {
        font-size: 0.75rem !important; /* REDUCED: Smaller label */
        margin-bottom: 0.5rem !important; /* REDUCED: Less margin */
        gap: 0.35rem !important;
        font-weight: 600 !important;
    }

    .tkd-quick-filters-label i {
        font-size: 0.7rem !important; /* REDUCED: Smaller icon */
    }

    /* Mobile Dropdown Toggle Button */
    .tkd-quick-filters-mobile-toggle {
        display: flex !important; /* SHOW: Mobile only */
        align-items: center !important;
        justify-content: space-between !important;
        width: 100% !important;
        padding: 0.75rem 1rem !important; /* TOUCH-FRIENDLY: Good padding */
        background: linear-gradient(135deg, 
            rgba(255, 255, 255, 0.12) 0%, 
            rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.08) 100%) !important;
        border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.25) !important;
        border-radius: 10px !important;
        color: var(--tkd-text-color) !important;
        font-size: 0.85rem !important;
        font-weight: 600 !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
        margin-bottom: 0.5rem !important;
        min-height: 44px !important; /* TOUCH-FRIENDLY: Minimum touch target */
        box-sizing: border-box !important;
    }

    .tkd-quick-filters-mobile-toggle:hover {
        background: linear-gradient(135deg, 
            rgba(255, 255, 255, 0.18) 0%, 
            rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.12) 100%) !important;
        border-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.4) !important;
    }

    .tkd-quick-filters-mobile-toggle i {
        color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.8) !important;
        font-size: 0.8rem !important;
        transition: transform 0.3s ease !important;
    }

    .tkd-quick-filters-mobile-toggle.active i {
        transform: rotate(180deg) !important;
    }

    /* Quick Filter Tags - Hidden on Mobile, Show as Dropdown */
    .tkd-quick-filter-tags {
        display: none !important; /* HIDDEN: Mobile default */
        flex-direction: column !important; /* STACK: Vertical when shown */
        gap: 0.5rem !important;
        padding: 0.75rem !important;
        background: rgba(255, 255, 255, 0.95) !important;
        border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) !important;
        border-radius: 10px !important;
        margin-top: 0.5rem !important;
        max-height: 0 !important; /* COLLAPSED: Default state */
        overflow: hidden !important;
        opacity: 0 !important;
        visibility: hidden !important;
        transition: all 0.3s ease !important; /* SMOOTH: Animation per Rule 3 */
    }

    /* Show dropdown when active */
    .tkd-quick-filters.active .tkd-quick-filter-tags {
        display: flex !important; /* SHOW: When active */
        max-height: 500px !important; /* EXPAND: Allow content */
        opacity: 1 !important;
        visibility: visible !important;
    }

    .tkd-quick-filter-tag {
        padding: 0.625rem 0.875rem !important; /* INCREASED: Better touch target */
        font-size: 0.8rem !important; /* INCREASED: More readable */
        border-radius: 8px !important;
        gap: 0.4rem !important;
        width: 100% !important; /* FULL WIDTH: Better for mobile */
        justify-content: flex-start !important;
        line-height: 1.3 !important;
        min-height: 44px !important; /* TOUCH-FRIENDLY: Minimum touch target */
        box-sizing: border-box !important;
    }

    .tkd-quick-filter-tag i {
        font-size: 0.75rem !important; /* INCREASED: More visible */
    }

    /* === SEARCH INPUT WRAPPER - Fix Width === */
    .tkd-search-input-wrapper {
        width: 100% !important; /* ENSURE: Full width container */
        max-width: 100% !important; /* PREVENT: Overflow */
        box-sizing: border-box !important;
    }

    .tkd-search-input-wrapper input {
        width: 100% !important; /* FULL WIDTH: Fit container */
        max-width: 100% !important; /* PREVENT: Overflow */
        box-sizing: border-box !important; /* INCLUDE: Padding in width */
    }

    /* === ACTIVE FILTERS === */
    .tkd-active-filters {
        margin-bottom: 1rem !important; /* REDUCED: Less margin */
    }

    .tkd-active-filters-label {
        font-size: 0.75rem !important; /* REDUCED: Smaller */
        margin-bottom: 0.5rem !important; /* REDUCED: Less margin */
    }

    .tkd-filter-chip {
        padding: 0.35rem 0.625rem !important; /* REDUCED: More compact */
        font-size: 0.7rem !important; /* REDUCED: Smaller */
    }

    /* === FORM GRID === */
    .tkd-form-grid {
        grid-template-columns: 1fr !important; /* SINGLE COLUMN: Better for mobile */
        gap: 1rem !important; /* REDUCED: Tighter gap (match category page) */
        margin-bottom: 1.25rem !important; /* REDUCED: Less margin */
    }

    /* === FORM GROUPS === */
    .tkd-form-group {
        gap: 0.35rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-form-group label {
        font-size: 0.75rem !important; /* REDUCED: Smaller label */
        gap: 0.35rem !important;
        font-weight: 600 !important;
    }

    .tkd-form-group label i {
        font-size: 0.7rem !important; /* REDUCED: Smaller icon */
    }

    .tkd-form-group input,
    .tkd-form-group select {
        padding: 0.75rem 0.875rem !important; /* REDUCED: Match category page */
        font-size: 16px !important; /* PREVENTS: iOS zoom on focus */
        border-radius: 10px !important; /* REDUCED: Smaller radius */
        min-height: 44px !important; /* TOUCH-FRIENDLY: Minimum touch target */
    }

    /* === SEARCH INPUT WRAPPER === */
    .tkd-search-input-wrapper {
        position: relative !important;
        width: 100% !important; /* ENSURE: Full width container */
        max-width: 100% !important; /* PREVENT: Overflow */
        box-sizing: border-box !important;
    }

    .tkd-search-input-wrapper input {
        width: 100% !important; /* FULL WIDTH: Fit container */
        max-width: 100% !important; /* PREVENT: Overflow */
        box-sizing: border-box !important; /* INCLUDE: Padding in width */
        /* v2.14.21: removed icon-inset padding (no decorative icons inside the
         * field anymore). Native browser clear button fits in default padding. */
    }

    .tkd-search-input-wrapper .clear-icon {
        right: 0.875rem !important; /* ADJUSTED: Position */
        font-size: 0.85rem !important; /* REDUCED: Smaller icon */
    }

    /* === QUICK FILTERS - Mobile Dropdown === */
    .tkd-quick-filters-mobile-toggle {
        display: none !important; /* HIDDEN: Desktop */
    }

    .tkd-quick-filter-tags {
        display: flex !important; /* DESKTOP: Show as tags */
    }

    /* === SEARCH ACTIONS === */
    .tkd-search-actions {
        display: flex !important;
        flex-direction: column !important; /* STACK: Vertical on mobile */
        gap: 0.75rem !important; /* REDUCED: Match category page */
        margin-top: 1.25rem !important; /* REDUCED: Less margin */
    }

    .tkd-search-options {
        display: flex !important;
        flex-direction: column !important; /* STACK: Vertical */
        gap: 0.625rem !important; /* REDUCED: Tighter gap */
        width: 100% !important;
    }

    .tkd-checkbox-wrapper,
    .tkd-live-search-toggle {
        font-size: 0.8rem !important; /* REDUCED: Smaller */
        padding: 0.4rem 0 !important; /* REDUCED: Less padding */
    }

    .tkd-advanced-toggle {
        font-size: 0.8rem !important; /* REDUCED: Smaller */
        padding: 0.4rem 0 !important; /* REDUCED: Less padding */
    }

    .tkd-search-actions > div:last-child {
        display: flex !important;
        flex-direction: column !important; /* STACK: Buttons vertical */
        gap: 0.75rem !important; /* REDUCED: Match category page */
        width: 100% !important;
    }

    .tkd-clear-filters-btn,
    .tkd-search-btn {
        width: 100% !important; /* FULL WIDTH: Better for mobile */
        padding: 0.75rem 1.25rem !important; /* REDUCED: Match category page */
        font-size: 0.85rem !important; /* REDUCED: Smaller text */
        min-height: 44px !important; /* TOUCH-FRIENDLY: Minimum touch target */
        justify-content: center !important;
        border-radius: 10px !important;
    }

    /* === ADVANCED FILTERS === */
    .tkd-advanced-filters {
        margin-top: 1rem !important; /* REDUCED: Less margin */
        padding-top: 1rem !important; /* REDUCED: Less padding */
        border-top: 1px solid rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.1) !important;
    }

    .tkd-advanced-grid {
        grid-template-columns: 1fr !important; /* SINGLE COLUMN */
        gap: 1rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-range-group {
        gap: 0.4rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-range-value {
        font-size: 0.8rem !important; /* REDUCED: Smaller */
    }
}

/* Small Mobile: 480px and below */
@media (max-width: 480px) {
    /* === SEARCH CARD === */
    .tkd-search-card {
        padding: 1rem 0.75rem !important; /* REDUCED: Even less padding */
        margin-bottom: 1.25rem !important; /* REDUCED: Less margin */
    }

    .tkd-search-card .tkd-section-title {
        font-size: 1rem !important; /* REDUCED: Smaller */
        margin-bottom: 0.25rem !important;
    }

    .tkd-search-card .tkd-section-subtitle {
        font-size: 0.75rem !important; /* REDUCED: Smaller */
        margin-bottom: 0.875rem !important; /* REDUCED: Less margin */
    }

    /* === QUICK FILTERS === */
    .tkd-quick-filters {
        margin-bottom: 0.875rem !important; /* REDUCED: Less margin */
    }

    .tkd-quick-filters-label {
        font-size: 0.7rem !important; /* REDUCED: Smaller */
        margin-bottom: 0.4rem !important;
    }

    .tkd-quick-filter-tags {
        gap: 0.35rem !important; /* REDUCED: Even tighter */
    }

    .tkd-quick-filter-tag {
        padding: 0.4rem 0.625rem !important; /* REDUCED: More compact */
        font-size: 0.65rem !important; /* REDUCED: Smaller */
    }

    /* === FORM GRID === */
    .tkd-form-grid {
        gap: 0.875rem !important; /* REDUCED: Tighter gap */
        margin-bottom: 1rem !important; /* REDUCED: Less margin */
    }

    .tkd-form-group {
        gap: 0.3rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-form-group label {
        font-size: 0.7rem !important; /* REDUCED: Smaller */
    }

    .tkd-form-group input,
    .tkd-form-group select {
        padding: 0.7rem 0.75rem !important; /* REDUCED: Slightly less */
        font-size: 16px !important; /* KEEP: Prevents iOS zoom */
        min-height: 42px !important; /* REDUCED: Slightly smaller but still touch-friendly */
    }

    .tkd-search-input-wrapper {
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    .tkd-search-input-wrapper input {
        width: 100% !important; /* FULL WIDTH: Fit container */
        max-width: 100% !important; /* PREVENT: Overflow */
        box-sizing: border-box !important; /* INCLUDE: Padding in width */
        padding-left: 2rem !important; /* REDUCED: Less padding */
        padding-right: 2rem !important;
    }

    .tkd-search-input-wrapper .search-icon {
        left: 0.625rem !important; /* ADJUSTED: Position */
        font-size: 0.85rem !important; /* REDUCED: Smaller */
    }

    .tkd-search-input-wrapper .clear-icon {
        right: 0.625rem !important; /* ADJUSTED: Position */
        font-size: 0.8rem !important; /* REDUCED: Smaller */
    }

    /* === SEARCH ACTIONS === */
    .tkd-search-actions {
        gap: 0.625rem !important; /* REDUCED: Tighter gap */
        margin-top: 1rem !important; /* REDUCED: Less margin */
    }

    .tkd-search-options {
        gap: 0.5rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-checkbox-wrapper,
    .tkd-live-search-toggle,
    .tkd-advanced-toggle {
        font-size: 0.75rem !important; /* REDUCED: Smaller */
        padding: 0.35rem 0 !important; /* REDUCED: Less padding */
    }

    .tkd-search-actions > div:last-child {
        gap: 0.625rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-clear-filters-btn,
    .tkd-search-btn {
        padding: 0.7rem 1rem !important; /* REDUCED: Slightly less */
        font-size: 0.8rem !important; /* REDUCED: Smaller */
        min-height: 42px !important; /* REDUCED: Slightly smaller but still touch-friendly */
    }

    /* === ADVANCED FILTERS === */
    .tkd-advanced-filters {
        margin-top: 0.875rem !important;
        padding-top: 0.875rem !important;
    }

    .tkd-advanced-grid {
        gap: 0.875rem !important; /* REDUCED: Tighter gap */
    }

    .tkd-range-value {
        font-size: 0.75rem !important; /* REDUCED: Smaller */
    }
}

/* ============================================
   MOBILE OPTIMIZATIONS FOR RELATED CITY CARDS
   Following TurnkeyDir-DEVELOPMENT-GUIDELINES.md Rule 4
   ============================================ */

/* Mobile: 768px and below */
@media (max-width: 768px) {
    /* Related Cities Section */
    .tkd-related-cities-section {
        margin: 2.5rem 0 !important;
        padding: 2rem 1rem !important;
        border-radius: 16px !important;
    }

    .tkd-related-cities-container {
        padding: 0 !important;
    }

    /* Related Cities Grid - Already handled above, but ensure single column */
    .tkd-related-cities-grid {
        grid-template-columns: 1fr !important;
        gap: 1rem !important;
        margin: 1.5rem 0 !important;
    }

    /* City Cards - Mobile Optimized */
    .tkd-related-city-card {
        padding: 1rem !important; /* INCREASED: More padding for touch */
        border-radius: 12px !important;
        min-height: auto !important; /* REMOVED: Allow natural height */
        height: auto !important;
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important; /* LIGHTER: Less shadow on mobile */
    }

    .tkd-related-city-card:hover {
        transform: translateY(-2px) !important; /* REDUCED: Less movement on mobile */
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
    }

    /* Card Header - Mobile */
    .tkd-city-card-header {
        margin-bottom: 0 !important;
        padding-bottom: 0.75rem !important; /* REDUCED: Less space on mobile */
        border-bottom: 1px solid rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.1) !important; /* LIGHTER: Subtle divider */
    }

    .tkd-city-name {
        font-size: 1.05rem !important; /* REDUCED: Slightly smaller */
        margin: 0 0 0.3rem 0 !important;
        gap: 0.45rem !important;
        line-height: 1.25 !important;
    }

    .tkd-city-name i {
        font-size: 0.9rem !important;
        width: 15px !important;
    }

    .tkd-city-state {
        font-size: 0.8rem !important; /* REDUCED: Smaller on mobile */
        line-height: 1.3 !important;
    }

    /* Stats Section - Mobile */
    .tkd-city-stats {
        gap: 0.35rem !important; /* REDUCED: Tighter spacing */
        margin-bottom: 0.875rem !important; /* REDUCED: Less space before button */
        margin-top: 0.75rem !important; /* REDUCED: Less space after divider */
    }

    .tkd-city-stat {
        gap: 0.45rem !important; /* REDUCED: Tighter icon-text gap */
        font-size: 0.8rem !important; /* REDUCED: Smaller text */
        line-height: 1.35 !important;
    }

    .tkd-city-stat i {
        font-size: 0.8rem !important;
        width: 16px !important; /* REDUCED: Smaller icons */
    }

    /* Button - Touch-Friendly Mobile */
    .tkd-city-actions {
        margin-top: auto !important;
    }

    .tkd-city-explore-btn,
    .tkd-related-city-card .tkd-city-explore-btn {
        padding: 0.75rem 1rem !important; /* INCREASED: Larger touch target */
        font-size: 0.9rem !important; /* INCREASED: More readable */
        min-height: 44px !important; /* TOUCH-FRIENDLY: Minimum 44px for touch */
        border-radius: 10px !important;
        gap: 0.5rem !important;
    }

    .tkd-city-explore-btn i,
    .tkd-related-city-card .tkd-city-explore-btn i {
        font-size: 0.95rem !important; /* INCREASED: Larger icon */
    }
}

/* Small Mobile: 480px and below */
@media (max-width: 480px) {
    /* Related Cities Section */
    .tkd-related-cities-section {
        margin: 2rem 0 !important;
        padding: 1.5rem 0.75rem !important;
        border-radius: 12px !important;
    }

    /* Related Cities Grid */
    .tkd-related-cities-grid {
        gap: 0.875rem !important; /* REDUCED: Tighter gap */
        margin: 1.25rem 0 !important;
    }

    /* City Cards - Extra Small Mobile */
    .tkd-related-city-card {
        padding: 0.875rem !important; /* REDUCED: Slightly less padding */
        border-radius: 10px !important;
    }

    /* Card Header */
    .tkd-city-card-header {
        padding-bottom: 0.625rem !important; /* REDUCED: Less space */
    }

    .tkd-city-name {
        font-size: 1rem !important; /* REDUCED: Smaller font */
        margin: 0 0 0.25rem 0 !important;
        gap: 0.4rem !important;
    }

    .tkd-city-name i {
        font-size: 0.85rem !important;
        width: 14px !important;
    }

    .tkd-city-state {
        font-size: 0.75rem !important; /* REDUCED: Smaller state text */
        line-height: 1.3 !important;
    }

    /* Stats Section */
    .tkd-city-stats {
        gap: 0.3rem !important; /* REDUCED: Even tighter */
        margin-bottom: 0.75rem !important;
        margin-top: 0.625rem !important;
    }

    .tkd-city-stat {
        gap: 0.4rem !important;
        font-size: 0.75rem !important; /* REDUCED: Smaller text */
        line-height: 1.3 !important;
    }

    .tkd-city-stat i {
        font-size: 0.75rem !important;
        width: 15px !important;
    }

    /* Button - Extra Small Mobile */
    .tkd-city-explore-btn,
    .tkd-related-city-card .tkd-city-explore-btn {
        padding: 0.7rem 0.875rem !important; /* REDUCED: Slightly less padding */
        font-size: 0.85rem !important; /* REDUCED: Smaller text */
        min-height: 42px !important; /* REDUCED: Slightly smaller but still touch-friendly */
        gap: 0.45rem !important;
    }

    .tkd-city-explore-btn i,
    .tkd-related-city-card .tkd-city-explore-btn i {
        font-size: 0.9rem !important;
    }
}

/* Touch Device Optimizations */
@media (hover: none) and (pointer: coarse) {
    /* Remove hover effects on touch devices */
    .tkd-related-city-card:hover {
        transform: none !important;
    }

    /* Use active state instead */
    .tkd-related-city-card:active {
        transform: scale(0.98) !important;
        transition: transform 0.1s ease !important;
    }

    /* Ensure touch-friendly button */
    .tkd-city-explore-btn,
    .tkd-related-city-card .tkd-city-explore-btn {
        min-height: 48px !important; /* TOUCH-FRIENDLY: 48px minimum for touch */
        -webkit-tap-highlight-color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.2) !important;
    }

    .tkd-city-explore-btn:active,
    .tkd-related-city-card .tkd-city-explore-btn:active {
        transform: translateY(1px) !important;
        transition: transform 0.1s ease !important;
    }
}

/* Landscape Orientation - Mobile */
@media (max-width: 768px) and (orientation: landscape) {
    .tkd-related-cities-grid {
        grid-template-columns: repeat(2, 1fr) !important; /* TWO COLUMNS: Use horizontal space */
        gap: 1rem !important;
    }

    .tkd-related-city-card {
        min-height: 200px !important; /* REDUCED: Less height in landscape */
    }
}

/* Very Small Screens: ≤360px */
@media (max-width: 360px) {
    .tkd-related-cities-section {
        padding: 1.25rem 0.625rem !important;
    }

    .tkd-related-cities-grid {
        gap: 0.75rem !important;
    }

    .tkd-related-city-card {
        padding: 0.75rem !important;
    }

    .tkd-city-name {
        font-size: 0.95rem !important;
    }

    .tkd-city-state {
        font-size: 0.7rem !important;
    }

    .tkd-city-stat {
        font-size: 0.7rem !important;
    }

    .tkd-city-explore-btn,
    .tkd-related-city-card .tkd-city-explore-btn {
        font-size: 0.8rem !important;
        padding: 0.65rem 0.75rem !important;
        min-height: 40px !important; /* MINIMUM: Still touch-friendly */
    }
}

/* UNIFIED: Related Cities Section Header */
.tkd-related-cities-section .tkd-section-header {
    text-align: center !important;
    margin-bottom: 1.5rem !important;
}

.tkd-related-cities-section .tkd-section-title {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.625rem !important;
    font-size: 1.375rem !important;
    font-weight: 700 !important;
    color: var(--tkd-text-color) !important;
    margin-bottom: 0.5rem !important;
    text-transform: uppercase !important;
    letter-spacing: 0.025em !important;
}

.tkd-related-cities-section .tkd-section-title i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9) !important;
    font-size: 1.25rem !important;
}

.tkd-related-cities-section .tkd-section-subtitle {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.75) !important;
    font-size: 0.95rem !important;
    font-weight: 400 !important;
    text-align: center !important;
    margin: 0 auto !important;
    display: block !important;
    width: 100% !important;
}

.tkd-view-all-states-btn small {
    display: none !important;
}

/* ENHANCED: Social Sharing Section Styling */
.tkd-social-sharing-section {
    margin: 2rem auto 3rem auto;
    padding: 2rem 1.5rem;
    background: linear-gradient(135deg, 
        rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.06) 0%, 
        rgba(255, 255, 255, 0.95) 100%);
    backdrop-filter: none;
    border: 1px solid rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.15);
    border-radius: 16px;
    max-width: 900px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.04);
}

.tkd-social-sharing-section::before {
    display: none;
}

.tkd-social-sharing-container {
    max-width: 100%;
    text-align: center;
}

.tkd-social-header {
    margin-bottom: 1.5rem;
}

/* v2.14.27: bumped specificity (.tkd-social-sharing-section .tkd-social-title)
   + !important on color/weight so the title and subtitle survive Kadence's
   theme text-color rules. Without these the subtitle was rendering as theme
   white-ish + thin in the share card's deep DOM context. */
.tkd-social-sharing-section .tkd-social-title {
    color: var(--tkd-text-color) !important;
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    margin: 0 0 0.5rem 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.tkd-social-sharing-section .tkd-social-title i {
    color: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.85) !important;
    font-size: 1.1rem;
}

.tkd-social-sharing-section .tkd-social-subtitle {
    color: rgba(var(--tkd-text-r), var(--tkd-text-g), var(--tkd-text-b), 0.7) !important;
    font-size: 0.875rem !important;
    margin: 0 !important;
    font-weight: 500 !important;
}

.tkd-social-buttons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.5rem;
}

.tkd-social-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1.25rem;
    border-radius: 10px;
    font-weight: 600;
    font-size: 0.875rem;
    text-decoration: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: none;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.tkd-social-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.tkd-social-btn i {
    font-size: 1rem;
}

/* CRITICAL: Force Font Awesome Brands icons to load properly */
.tkd-social-btn i.fab,
.tkd-social-btn i.fa-brands {
    font-family: "Font Awesome 6 Brands", "FontAwesome" !important;
    font-weight: 400 !important;
    font-style: normal !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
}

/* Explicit content declarations for Brand icons */
.tkd-social-btn.facebook i.fa-facebook-f::before {
    content: "\f39e" !important;
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

.tkd-social-btn.twitter i.fa-twitter::before {
    content: "\f099" !important;
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

.tkd-social-btn.linkedin i.fa-linkedin-in::before {
    content: "\f0e1" !important;
    font-family: "Font Awesome 6 Brands" !important;
    font-weight: 400 !important;
}

.tkd-social-btn.facebook {
    background: #1877f2;
    color: white !important;
}

.tkd-social-btn.twitter {
    background: #1da1f2;
    color: white !important;
}

.tkd-social-btn.linkedin {
    background: #0077b5;
    color: white !important;
}

.tkd-social-btn.email {
    background: #6b7280;
    color: white !important;
}

.tkd-social-btn.copy,
.tkd-social-btn.share-native {
    background: rgba(var(--tkd-accent-r), var(--tkd-accent-g), var(--tkd-accent-b), 0.9);
    color: white !important;
}

/* Responsive Design for New Sections */
@media (max-width: 768px) {
    .tkd-related-cities-section,
    .tkd-social-sharing-section {
        margin: 2rem 0;
        padding: 2rem 1rem;
    }
    
    .tkd-related-cities-grid {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    
    .tkd-social-buttons {
        gap: 0.75rem;
    }
    
    .tkd-social-btn {
        padding: 0.75rem 1rem;
        font-size: 0.85rem;
    }
}

@media (max-width: 480px) {
    .tkd-social-buttons {
        flex-direction: column;
        align-items: center;
    }
    
    .tkd-social-btn {
        width: 100%;
        max-width: 250px;
                 justify-content: center;
     }
 }

/* === MOBILE OPTIMIZATION FOR STATS SECTION === */
@media (max-width: 768px) {
    .tkd-hero-stats {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem !important;
        margin: 1rem 8px !important;
        padding: 1rem !important;
        max-width: 100% !important;
    }

    .tkd-stat-item {
        padding: 0.875rem 0.5rem !important;
        min-width: auto !important;
        max-width: none !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        text-align: center !important;
        min-height: 85px !important;
        gap: 0.5rem !important;
    }

    .tkd-stat-item:nth-child(5) {
        grid-column: auto !important;
        max-width: none !important;
        margin: 0 !important;
    }

    .tkd-stat-icon {
        font-size: 1.4rem !important;
        margin: 0 0 0.25rem 0 !important;
        display: block !important;
    }

    .tkd-stat-text {
        font-size: 0.7rem !important;
        line-height: 1.4 !important;
        text-align: center !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 0.15rem !important;
        width: 100% !important;
    }

    .tkd-stat-number {
        font-size: 1.4rem !important;
        margin: 0 0 0.2rem 0 !important;
        display: block !important;
        font-weight: 700 !important;
        line-height: 1 !important;
    }

    /* === QUICK ACTIONS BUTTONS === */
    .glass-action-grid {
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem !important;
        padding: 0 !important;
    }

    .glass-action-btn {
        padding: 0.875rem 0.5rem !important;
        min-height: 70px !important;
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0.5rem !important;
        text-align: center !important;
    }

    .glass-action-btn i {
        font-size: 1.1rem !important;
    }

    .glass-action-btn span {
        font-size: 0.75rem !important;
        white-space: nowrap !important;
    }
}