/**
 * CONSOLIDATED MOBILE CSS - SINGLE SOURCE OF TRUTH
 * All mobile styles consolidated from: layout.css, components.css, vendor.css, 
 * pages.css, core.css, dark-theme.css, client-portal-logo-fix.css
 * 
 * Version: 2025-08-03
 * Purpose: End mobile CSS conflicts and scattered rules
 */

/* === TABLET/LARGE MOBILE (1200px and below) === */
@media (max-width: 1200px) {
  .container { 
    max-width: 100%; 
    padding: 0 var(--space-lg); 
  }
}

/* === MOBILE MAIN (768px and below) === */
@media (max-width: 768px) {
  
  /* === LOGO SIZING - CONSISTENT ACROSS ALL PAGES === */
  .site-banner-logo { 
    width: 95% !important;         /* FORCE 95% on ALL public pages */
    max-width: 95% !important;
    height: auto !important;
  }
  
  /* Client portal gets smaller logo */
  .woocommerce-account .site-banner-logo,
  .page-template-client-portal .site-banner-logo,
  body[class*="client-portal"] .site-banner-logo {
    width: 70% !important;         /* CLIENT PORTAL: 70% logo */
    max-width: 70% !important;
  }
  
  /* Force consistent logo container behavior */
  .logo-inner-wrap {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
  }
  
  /* === MOBILE NAVIGATION STRATEGY === */
  /* Hide under-logo menu links on mobile - panty drawer becomes sole navigation */
  .under-logo-menu,
  .under-logo-menu-list {
    display: none !important;
  }
  
  /* === PANTY DRAWER MENU STYLING === */
  .panty-links,
  .panty-links li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  
  /* === HEADER & NAVIGATION === */
  .hero-image-wrap { 
    padding: var(--space-lg); 
  }
  
  /* === PANTY DRAWER - PROPER LAYERING === */
  .nav-overlay,
  #navOverlay {
    z-index: var(--z-overlay);
    position: fixed;
  }
  
  /* Fix horizontal scroll from menu links */
  .under-logo-menu {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden;
  }
  
  .under-logo-menu-list {
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: var(--space-sm) !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 var(--space-sm) !important;
  }
  
  .under-logo-menu-list li {
    flex-shrink: 1 !important;
    min-width: 0 !important;
  }
  
  .under-logo-menu-list li a {
    font-size: var(--fs-xs) !important;
    padding: var(--space-xxs) var(--space-xs) !important;
    white-space: nowrap;
  }
  
  /* === LAYOUT GRIDS === */
  .video-grid {
    grid-template-columns: repeat(auto-fill, minmax(var(--space-250), 1fr));
    gap: var(--space-md);
  }
  
  .blog-grid-container {
    grid-template-columns: 1fr;
    gap: var(--space-lg);
  }
  
  .category-grid {
    grid-template-columns: repeat(auto-fill, minmax(var(--space-150), 1fr));
    gap: var(--space-md);
  }
  
  .talent-grid {
    grid-template-columns: repeat(auto-fill, minmax(var(--space-250), 1fr));
    gap: var(--space-lg);
  }
  
  /* === LAYOUT ADJUSTMENTS === */
  .product-main-layout-wrap {
    flex-direction: column;
  }
  
  /* === FOOTER MOBILE LAYOUT === */
  .site-footer {
    padding: var(--space-xl) 0 var(--space-lg) 0;
  }
  
  .footer-row {
    flex-direction: column;
    gap: var(--space-md);
    text-align: center;
  }
  
  .footer-col {
    min-width: auto;
    width: 100%;
    margin-bottom: var(--space-md);
  }
  
  .footer-title {
    font-size: var(--fs-md);
    margin-bottom: var(--space-md);
  }
  
  .footer-links {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-xs);
  }
  
  .footer-links li {
    margin-bottom: var(--space-xs);
  }
  
  .footer-social {
    justify-content: center;
    margin-top: var(--space-lg);
  }
  
  .footer-bottom {
    text-align: center;
    padding-top: var(--space-lg);
  }
  
  /* === GRID COLUMNS === */
  .col-1, .col-2, .col-3, .col-4, .col-6, .col-8, .col-9 {
    flex: 0 0 100%;
    max-width: 100%;
  }
  
  /* === COMPONENTS === */
  .hero-title { font-size: var(--fs-3xl); }
  .hero-subtitle { font-size: var(--fs-lg); }
  .hero-cta { padding: var(--space-md) var(--space-lg); }
  
  .search-form { flex-direction: column; }
  .search-input { margin-bottom: var(--space-sm); }
  
  .pagination { flex-wrap: wrap; }
  
  .modal-content { width: 95%; padding: var(--space-lg); }
  
  .talent-card { padding: var(--space-md); }
  .talent-avatar { 
    width: var(--space-100); 
    height: var(--space-100); 
  }
  
  /* === VIDEO ARCHIVE SEARCH AREA - FULL WIDTH MOBILE === */
  .advanced-search-container.compact-search .search-row {
    flex-direction: column !important;
    gap: var(--space-md) !important;
    align-items: stretch !important;
  }
  
  .compact-filter-container,
  .compact-search-container,
  .compact-search-input-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    flex: none !important;
  }
  
  .compact-search-input-wrapper {
    flex-direction: column !important;
    gap: var(--space-sm) !important;
  }
  
  .compact-search-input-wrapper .search-field {
    width: 100% !important;
    max-width: 100% !important;
    min-width: auto !important;
  }
  
  .compact-search-input-wrapper .search-button {
    width: 100% !important;
    max-width: 100% !important;
    padding: var(--space-sm) !important;
  }
  
  /* === WOOCOMMERCE === */
  .woocommerce .products {
    grid-template-columns: repeat(auto-fill, minmax(var(--space-250), 1fr));
    gap: var(--space-md);
  }
  
  .woocommerce div.product {
    padding: var(--space-md);
  }
  
  .woocommerce div.product .product_title {
    font-size: var(--fs-xl);
  }
  
  .woocommerce table.shop_table .product-thumbnail {
    width: var(--space-150);
  }
  
  .woocommerce table.shop_table .product-thumbnail img {
    max-width: var(--space-150);
  }
  
  .woocommerce .cart_totals {
    margin: var(--space-lg) auto 0;
    padding: var(--space-lg);
  }
  
  .woocommerce-checkout {
    padding: var(--space-md);
  }
  
  /* === PAGE-SPECIFIC === */
  .front-page .section-title,
  .home .section-title {
    font-size: var(--fs-xl);
  }
  
  .preview-title {
    font-size: var(--fs-3xl);
  }
  
  .single-product .product-main-layout-wrap {
    flex-direction: column;
    padding: var(--space-md);
  }
  
  .single-product .product-title,
  .single-product .video-title {
    font-size: var(--fs-xl);
  }
  
  .blog-post {
    padding: var(--space-lg);
  }
  
  /* === IMAGES - COMPREHENSIVE MOBILE RULES === */
  
  /* All images default mobile behavior (except main logo) */
  img:not(.site-banner-logo) {
    max-width: 100%;
    height: auto;
  }
  
  /* Hero/banner images */
  .hero-image,
  .banner-image,
  .featured-image {
    width: 100%;
    height: auto;
    object-fit: cover;
  }
  
  /* Video thumbnails */
  .video-thumbnail,
  .product-image,
  .woocommerce .product img {
    width: 100%;
    height: auto;
    border-radius: var(--radius-md);
  }
  
  /* Gallery images */
  .gallery img,
  .wp-block-gallery img {
    width: 100%;
    height: auto;
    border-radius: var(--radius-sm);
  }
  
  /* Content images in posts/pages */
  .entry-content img,
  .post-content img,
  .page-content img {
    max-width: 100%;
    height: auto;
    margin: var(--space-sm) 0;
    border-radius: var(--radius-sm);
  }
  
  /* Talent/model photos */
  .talent-avatar,
  .model-photo,
  .profile-image {
    width: 100%;
    max-width: var(--space-200);
    height: auto;
    border-radius: var(--radius-lg);
    margin: 0 auto;
  }
  
  /* Anatomik branding logo on front page - FIX SCALING */
  .anatomik-logo {
    max-width: 180px;
    width: 100%;
    height: auto;
    margin: var(--space-md) auto;
    display: block;
  }
  
  /* Category/taxonomy images */
  .category-image,
  .taxonomy-image {
    width: 100%;
    height: var(--space-120);
    object-fit: cover;
    border-radius: var(--radius-md);
  }
  
  /* === DARK THEME === */
  .dark-theme .modal-content {
    background: var(--dark-bg-primary);
  }
}

/* === ULTRA-MOBILE (480px and below) === */
@media (max-width: 480px) {
  
  /* === CONTAINERS === */
  .container { 
    padding: 0 var(--space-sm); 
  }
  
  .hero-image-wrap { 
    padding: var(--space-md); 
  }
  
  /* === LOGO - MAINTAIN PROPORTIONS === */
  .site-banner-logo { 
    width: 95%;
    max-width: 95%;
  }
  
  .woocommerce-account .site-banner-logo,
  .page-template-client-portal .site-banner-logo,
  body[class*="client-portal"] .site-banner-logo {
    width: 70%;
    max-width: 70%;
  }
  
  /* === TYPOGRAPHY === */
  h1 { font-size: var(--fs-2xl); }
  h2 { font-size: var(--fs-xl); }
  h3 { font-size: var(--fs-lg); }
  
  /* === GRIDS - SINGLE COLUMN === */
  .video-grid {
    grid-template-columns: 1fr;
    gap: var(--space-sm);
  }
  
  .category-grid {
    grid-template-columns: 1fr;
  }
  
  .talent-grid {
    grid-template-columns: 1fr;
  }
  
  /* === NAVIGATION === */
  .under-logo-menu-list {
    gap: var(--space-md);
  }
  
  .under-logo-menu-list li a {
    font-size: var(--fs-xs);
  }
  
  /* === COMPONENTS === */
  .hero-title { font-size: var(--fs-2xl); }
  .hero-cta { font-size: var(--fs-base); }
  
  .panty-links { gap: var(--space-md); }
  .menu-link { font-size: var(--fs-lg); }
  
  /* === WOOCOMMERCE === */
  .woocommerce .products {
    grid-template-columns: 1fr;
  }
  
  .woocommerce table.shop_table {
    font-size: var(--fs-sm);
  }
  
  .woocommerce table.shop_table th,
  .woocommerce table.shop_table td {
    padding: var(--space-sm);
  }
  
  .woocommerce nav.woocommerce-pagination ul {
    flex-wrap: wrap;
    justify-content: center;
  }
  
  /* === PAGE-SPECIFIC === */
  .front-page .section-title,
  .home .section-title {
    font-size: var(--fs-lg);
  }
  
  .preview-title {
    font-size: var(--fs-2xl);
  }
  
  .single-product .single_add_to_cart_button,
  .single-product .buy_now_button {
    padding: var(--space-md) var(--space-lg);
    font-size: var(--fs-base);
  }
  
  .blog-post .entry-title {
    font-size: var(--fs-xl);
  }
  
  .quickaccess-item {
    padding: var(--space-md);
  }
  
  /* === ULTRA-MOBILE FOOTER ADJUSTMENTS === */
  .site-footer {
    padding: var(--space-lg) 0 var(--space-md) 0;
  }
  
  .footer-col {
    margin-bottom: var(--space-md);
  }
  
  .footer-title {
    font-size: var(--fs-base);
    margin-bottom: var(--space-sm);
  }
  
  .footer-links {
    gap: var(--space-xxs);
  }
  
  .footer-links a {
    font-size: var(--fs-sm);
  }
  
  .footer-social {
    margin-top: var(--space-md);
  }
  
  .footer-bottom {
    padding-top: var(--space-md);
  }
  
  .footer-bottom p {
    font-size: var(--fs-xs);
  }
  
  /* === ULTRA-MOBILE IMAGE ADJUSTMENTS === */
  
  /* Smaller anatomik logo on ultra-mobile */
  .anatomik-logo {
    max-width: 120px;
  }
  
  /* Talent avatars smaller on ultra-mobile */
  .talent-avatar {
    max-width: var(--space-150);
  }
  
  /* Video thumbnails maintain full width */
  .video-thumbnail,
  .product-image {
    border-radius: var(--radius-sm);
  }
}