/* ============================================================
   DESKTOP LAYOUT ON ALL SCREEN SIZES
   Makes mobile, tablet, and small screens match desktop layout
   ============================================================ */

/* Override all mobile breakpoint changes */
@media (max-width: 1400px) {
    /* Keep desktop header */
    :root {
        --header-h: 80px;
    }
    
    /* Keep navigation visible */
    .main-navigation ul {
        display: flex !important;
    }
    
    /* Hide mobile hamburger on larger tablets */
    .nav-toggle {
        display: none !important;
    }
}

@media (max-width: 1200px) {
    /* Keep 4-5 column product grids */
    .marketplace-product-grid,
    .featured-products-grid,
    .bestsellers-products-grid,
    .woocommerce ul.products {
        grid-template-columns: repeat(4, 1fr) !important;
        gap: 1.5rem !important;
    }
    
    /* Keep footer 4 columns */
    .footer-grid {
        grid-template-columns: 2fr 1fr 1fr 1.5fr !important;
        gap: 3rem !important;
    }
    
    /* Keep desktop navigation */
    .main-navigation ul {
        display: flex !important;
        gap: 2rem !important;
    }
}

@media (max-width: 1024px) {
    /* Tablet - keep desktop-like layout but slightly adjusted */
    :root {
        --header-h: 70px;
    }
    
    /* Keep 3-4 columns on tablet */
    .marketplace-product-grid,
    .featured-products-grid,
    .bestsellers-products-grid,
    .woocommerce ul.products {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 1.25rem !important;
    }
    
    /* Product page - keep side-by-side layout */
    .product-hero-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 3rem !important;
    }
    
    /* Keep footer layout */
    .footer-grid {
        grid-template-columns: 2fr 1fr 1fr 1fr !important;
        gap: 2rem !important;
    }
    
    /* Keep navigation visible */
    .main-navigation ul {
        display: flex !important;
        gap: 1.5rem !important;
    }
    
    .main-navigation a {
        font-size: 0.85rem !important;
    }
}

@media (max-width: 900px) {
    /* Small tablet - minimal adjustments */
    .marketplace-product-grid,
    .featured-products-grid,
    .woocommerce ul.products {
        grid-template-columns: repeat(3, 1fr) !important;
    }
    
    /* Show hamburger on smaller tablets */
    .nav-toggle {
        display: flex !important;
    }
    
    .main-navigation ul {
        display: none !important;
    }
}

@media (max-width: 768px) {
    /* Mobile landscape - keep multi-column */
    :root {
        --header-h: 64px;
    }
    
    /* Keep 2-3 columns on mobile */
    .marketplace-product-grid,
    .featured-products-grid,
    .bestsellers-products-grid,
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 1rem !important;
    }
    
    /* Product page - stacked but with desktop feel */
    .product-hero-grid {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }
    
    /* Keep card sizing consistent */
    .inr-product-card {
        border-radius: 12px !important;
    }
    
    .inr-card-info {
        padding: 1.25rem !important;
    }
    
    .inr-card-title {
        font-size: 1rem !important;
    }
    
    .inr-card-price {
        font-size: 1rem !important;
    }
    
    /* Footer - 2 columns on mobile landscape */
    .footer-grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 2rem !important;
    }
    
    /* Mobile navigation - slide out like desktop */
    .mobile-nav-overlay {
        width: 320px !important;
        left: auto !important;
        right: 0 !important;
        transform: translateX(100%) !important;
    }
    
    .mobile-nav-overlay.open {
        transform: translateX(0) !important;
    }
    
    /* Keep text readable */
    .product-details-wrapper .product_title {
        font-size: 1.75rem !important;
    }
    
    .marketplace-hero-title {
        font-size: 2.5rem !important;
    }
}

@media (max-width: 640px) {
    /* Mobile portrait - minimum 2 columns */
    .marketplace-product-grid,
    .featured-products-grid,
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.75rem !important;
    }
    
    /* Hero sizing */
    .marketplace-hero-title {
        font-size: 2rem !important;
    }
    
    .marketplace-hero-subtitle {
        font-size: 1rem !important;
    }
    
    /* Footer single column on small mobile */
    .footer-grid {
        grid-template-columns: 1fr !important;
        gap: 2rem !important;
    }
}

@media (max-width: 480px) {
    /* Small mobile - still 2 columns minimum */
    .marketplace-product-grid,
    .featured-products-grid,
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.5rem !important;
    }
    
    /* Compact but readable cards */
    .inr-card-title {
        font-size: 0.85rem !important;
    }
    
    .inr-card-price {
        font-size: 0.9rem !important;
    }
    
    .inr-card-info {
        padding: 0.75rem !important;
    }
    
    /* Compact header */
    .site-branding .logo-text {
        font-size: 1.2rem !important;
    }
}

@media (max-width: 375px) {
    /* iPhone SE - still 2 columns */
    .marketplace-product-grid,
    .featured-products-grid,
    .woocommerce ul.products {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 0.5rem !important;
    }
    
    .inr-card-title {
        font-size: 0.8rem !important;
    }
}

/* ============================================================
   OCEAN VIDEO BACKGROUND
   ============================================================ */

/* Video background container */
.ocean-video-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    overflow: hidden;
}

.ocean-video-background video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

/* Dark overlay for readability */
.ocean-video-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(8, 5, 10, 0.75);
    z-index: 1;
}

/* Alternative: CSS gradient ocean effect (if no video) */
.ocean-gradient-background {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
    background: linear-gradient(135deg, 
        #0a1628 0%, 
        #1a3a52 25%, 
        #2d5a7b 50%, 
        #1a3a52 75%, 
        #0a1628 100%
    );
    background-size: 400% 400%;
    animation: oceanFlow 15s ease infinite;
}

@keyframes oceanFlow {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}

/* ============================================================
   LOGO PLACEMENT AREA
   ============================================================ */

/* Logo header area - prominent placement */
.logo-header-area {
    position: relative;
    width: 100%;
    padding: 1rem 0;
    text-align: center;
    background: rgba(8, 5, 10, 0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(212, 175, 55, 0.1);
}

.logo-header-area .site-logo {
    max-height: 80px;
    width: auto;
    filter: drop-shadow(0 4px 20px rgba(0,0,0,0.3));
}

.logo-header-area .logo-text-main {
    font-family: var(--font-display);
    font-size: 2.5rem;
    font-weight: 700;
    color: var(--clr-gold);
    text-shadow: 0 2px 20px rgba(0,0,0,0.5);
    letter-spacing: 2px;
}

.logo-header-area .logo-tagline {
    font-size: 0.9rem;
    color: var(--clr-text-muted);
    margin-top: 0.5rem;
    font-style: italic;
}

/* Logo in hero section */
.hero-logo-placement {
    position: absolute;
    top: 2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
    text-align: center;
}

.hero-logo-placement img {
    max-height: 100px;
    filter: drop-shadow(0 4px 20px rgba(0,0,0,0.5));
}

/* Logo watermark on product images */
.product-logo-watermark {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 5;
    opacity: 0.6;
}

.product-logo-watermark img {
    max-height: 30px;
    filter: brightness(0) invert(1);
}

/* ============================================================
   CART LAYOUT FIXES
   ============================================================ */

/* Cart page - desktop layout preserved */
.woocommerce-cart .woocommerce {
    max-width: var(--max-w);
    margin: 0 auto;
    padding: 2rem;
}

/* Cart table - keep desktop style */
.woocommerce-cart table.cart {
    width: 100%;
    border-collapse: collapse;
}

.woocommerce-cart table.cart th {
    background: rgba(212, 175, 55, 0.1);
    padding: 1rem;
    text-align: left;
    font-weight: 500;
    border-bottom: 1px solid var(--glass-border);
}

.woocommerce-cart table.cart td {
    padding: 1.5rem 1rem;
    border-bottom: 1px solid var(--glass-border);
    vertical-align: middle;
}

/* Cart item image */
.woocommerce-cart table.cart .product-thumbnail img {
    max-width: 100px;
    border-radius: 8px;
}

/* Quantity input */
.woocommerce-cart .quantity input {
    width: 80px;
    padding: 0.5rem;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--glass-border);
    border-radius: 8px;
    color: var(--clr-text);
    text-align: center;
}

/* Remove button */
.woocommerce-cart .remove {
    color: #ff4444;
    font-size: 1.5rem;
    text-decoration: none;
    transition: color 0.2s;
}

.woocommerce-cart .remove:hover {
    color: #ff6666;
}

/* Cart actions */
.woocommerce-cart .actions {
    padding: 1.5rem;
    background: rgba(255,255,255,0.02);
    border-radius: 12px;
    margin-top: 1rem;
}

/* Coupon input */
.woocommerce-cart .coupon {
    display: flex;
    gap: 0.5rem;
}

.woocommerce-cart .coupon input {
    flex: 1;
    padding: 0.75rem 1rem;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--glass-border);
    border-radius: 8px;
    color: var(--clr-text);
}

/* Cart totals sidebar */
.woocommerce-cart .cart-collaterals {
    margin-top: 2rem;
}

.woocommerce-cart .cart_totals {
    background: rgba(255,255,255,0.02);
    padding: 2rem;
    border-radius: 12px;
    border: 1px solid var(--glass-border);
}

.woocommerce-cart .cart_totals h2 {
    margin-bottom: 1.5rem;
    font-size: 1.5rem;
}

/* Cart totals table */
.woocommerce-cart .cart_totals table {
    width: 100%;
    margin-bottom: 1.5rem;
}

.woocommerce-cart .cart_totals th,
.woocommerce-cart .cart_totals td {
    padding: 1rem 0;
    border-bottom: 1px solid var(--glass-border);
}

.woocommerce-cart .cart_totals .order-total {
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--clr-gold);
}

/* Mobile cart adjustments */
@media (max-width: 768px) {
    .woocommerce-cart .woocommerce {
        padding: 1rem;
    }
    
    /* Keep table layout but smaller */
    .woocommerce-cart table.cart .product-thumbnail img {
        max-width: 70px;
    }
    
    .woocommerce-cart table.cart td {
        padding: 1rem 0.5rem;
    }
    
    /* Stack coupon on mobile */
    .woocommerce-cart .coupon {
        flex-direction: column;
    }
    
    /* Keep cart totals readable */
    .woocommerce-cart .cart_totals {
        padding: 1.5rem;
    }
}

/* ============================================================
   CHECKOUT LAYOUT FIXES
   ============================================================ */

/* Checkout page - desktop layout */
.woocommerce-checkout .woocommerce {
    max-width: var(--max-w);
    margin: 0 auto;
    padding: 2rem;
}

/* Checkout form layout */
.woocommerce-checkout .checkout {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 3rem;
    align-items: start;
}

/* Billing details */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields {
    background: rgba(255,255,255,0.02);
    padding: 2rem;
    border-radius: 12px;
    border: 1px solid var(--glass-border);
}

.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3 {
    margin-bottom: 1.5rem;
    font-size: 1.25rem;
}

/* Form fields */
.woocommerce-checkout .form-row {
    margin-bottom: 1.5rem;
}

.woocommerce-checkout label {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 0.9rem;
    color: var(--clr-text-dim);
}

.woocommerce-checkout input,
.woocommerce-checkout select,
.woocommerce-checkout textarea {
    width: 100%;
    padding: 0.75rem 1rem;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--glass-border);
    border-radius: 8px;
    color: var(--clr-text);
    font-size: 1rem;
}

.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
    border-color: var(--clr-gold);
    outline: none;
}

/* Order review sidebar */
.woocommerce-checkout .woocommerce-checkout-review-order {
    background: rgba(255,255,255,0.02);
    padding: 2rem;
    border-radius: 12px;
    border: 1px solid var(--glass-border);
    position: sticky;
    top: calc(var(--header-h) + 2rem);
}

.woocommerce-checkout .woocommerce-checkout-review-order h3 {
    margin-bottom: 1.5rem;
    font-size: 1.25rem;
}

/* Order table */
.woocommerce-checkout .shop_table {
    width: 100%;
    margin-bottom: 1.5rem;
}

.woocommerce-checkout .shop_table th,
.woocommerce-checkout .shop_table td {
    padding: 1rem 0;
    border-bottom: 1px solid var(--glass-border);
}

/* Payment methods */
.woocommerce-checkout .woocommerce-checkout-payment {
    margin-top: 2rem;
}

.woocommerce-checkout .payment_methods {
    list-style: none;
    margin-bottom: 1.5rem;
}

.woocommerce-checkout .payment_methods li {
    padding: 1rem;
    background: rgba(255,255,255,0.03);
    border: 1px solid var(--glass-border);
    border-radius: 8px;
    margin-bottom: 0.5rem;
}

/* Mobile checkout - stacked but styled */
@media (max-width: 900px) {
    .woocommerce-checkout .checkout {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .woocommerce-checkout .woocommerce-checkout-review-order {
        position: static;
    }
}

@media (max-width: 768px) {
    .woocommerce-checkout .woocommerce {
        padding: 1rem;
    }
    
    .woocommerce-checkout .woocommerce-billing-fields,
    .woocommerce-checkout .woocommerce-shipping-fields,
    .woocommerce-checkout .woocommerce-checkout-review-order {
        padding: 1.5rem;
    }
}

/* ============================================================
   PRODUCT PAGE LAYOUT FIXES
   ============================================================ */

/* Product hero - consistent layout */
.product-hero-section {
    padding: 3rem 0;
}

.product-hero-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4rem;
    max-width: var(--max-w);
    margin: 0 auto;
    padding: 0 2rem;
    align-items: start;
}

/* Gallery - left side */
.product-gallery-wrapper {
    position: sticky;
    top: calc(var(--header-h) + 2rem);
}

.woocommerce-product-gallery {
    position: relative;
}

.woocommerce-product-gallery__image img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
}

/* Product details - right side */
.product-details-wrapper {
    padding-top: 1rem;
}

.product-details-wrapper .product_title {
    font-size: 2.5rem;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.product-details-wrapper .price {
    font-size: 1.75rem;
    color: var(--clr-gold);
    margin-bottom: 1.5rem;
}

.product-details-wrapper .woocommerce-product-details__short-description {
    margin-bottom: 2rem;
    line-height: 1.8;
    color: var(--clr-text-dim);
}

/* Add to cart form */
.product-details-wrapper .cart {
    margin-bottom: 2rem;
}

/* Quantity selector */
.product-details-wrapper .quantity {
    display: inline-flex;
    align-items: center;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--glass-border);
    border-radius: 8px;
    overflow: hidden;
}

.product-details-wrapper .quantity input {
    width: 60px;
    padding: 0.75rem;
    background: transparent;
    border: none;
    color: var(--clr-text);
    text-align: center;
    font-size: 1rem;
}

/* Add to cart button */
.product-details-wrapper .single_add_to_cart_button {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem 2rem;
    background: linear-gradient(135deg, var(--clr-gold), var(--clr-gold-dark));
    color: #000;
    font-weight: 600;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    transition: transform 0.2s, box-shadow 0.2s;
}

.product-details-wrapper .single_add_to_cart_button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 30px rgba(212, 175, 55, 0.3);
}

.product-details-wrapper .single_add_to_cart_button:disabled {
    background: rgba(255,255,255,0.1);
    color: var(--clr-text-muted);
    cursor: not-allowed;
    transform: none;
    box-shadow: none;
}

/* Meta information */
.product-details-wrapper .product_meta {
    padding-top: 2rem;
    border-top: 1px solid var(--glass-border);
    font-size: 0.9rem;
    color: var(--clr-text-dim);
}

.product-details-wrapper .product_meta span {
    display: block;
    margin-bottom: 0.5rem;
}

.product-details-wrapper .product_meta a {
    color: var(--clr-rose);
}

/* Product tabs */
.product-tabs-section {
    max-width: var(--max-w);
    margin: 4rem auto 0;
    padding: 0 2rem;
}

.product-tabs-wrapper {
    background: rgba(255,255,255,0.02);
    border: 1px solid var(--glass-border);
    border-radius: 12px;
    overflow: hidden;
}

.woocommerce-tabs .wc-tabs {
    display: flex;
    border-bottom: 1px solid var(--glass-border);
    background: rgba(255,255,255,0.03);
}

.woocommerce-tabs .wc-tabs li {
    flex: 1;
}

.woocommerce-tabs .wc-tabs li a {
    display: block;
    padding: 1.25rem;
    text-align: center;
    color: var(--clr-text-dim);
    transition: all 0.2s;
}

.woocommerce-tabs .wc-tabs li.active a,
.woocommerce-tabs .wc-tabs li a:hover {
    color: var(--clr-gold);
    background: rgba(255,255,255,0.03);
}

.woocommerce-tabs .woocommerce-Tabs-panel {
    padding: 2rem;
}

/* Related products */
.related.products {
    max-width: var(--max-w);
    margin: 4rem auto 0;
    padding: 0 2rem;
}

.related.products h2 {
    margin-bottom: 2rem;
    font-size: 1.75rem;
}

/* Mobile product page */
@media (max-width: 900px) {
    .product-hero-grid {
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .product-gallery-wrapper {
        position: relative;
        top: 0;
    }
    
    .product-details-wrapper .product_title {
        font-size: 2rem;
    }
}

@media (max-width: 768px) {
    .product-hero-section {
        padding: 2rem 0;
    }
    
    .product-hero-grid,
    .product-tabs-section,
    .related.products {
        padding: 0 1rem;
    }
    
    .product-details-wrapper .product_title {
        font-size: 1.75rem;
    }
    
    .woocommerce-tabs .wc-tabs {
        flex-direction: column;
    }
}

/* ============================================================
   VARIANT SELECTION REQUIRED
   ============================================================ */

/* Style for disabled add to cart button */
.variation-selection-required {
    opacity: 0.5;
    cursor: not-allowed !important;
    background: rgba(255,255,255,0.1) !important;
    color: var(--clr-text-muted) !important;
}

/* Variant select styling */
.woocommerce .variations_form .variations {
    margin-bottom: 1.5rem;
}

.woocommerce .variations_form .variations tr {
    display: flex;
    flex-direction: column;
    margin-bottom: 1rem;
}

.woocommerce .variations_form .variations label {
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: var(--clr-text);
}

.woocommerce .variations_form .variations select {
    width: 100%;
    padding: 0.75rem 1rem;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--glass-border);
    border-radius: 8px;
    color: var(--clr-text);
    font-size: 1rem;
}

.woocommerce .variations_form .variations select:focus {
    border-color: var(--clr-gold);
    outline: none;
}

/* Reset variations link */
.woocommerce .variations_form .reset_variations {
    display: inline-block;
    margin-top: 0.5rem;
    font-size: 0.85rem;
    color: var(--clr-rose);
}

/* Variation price */
.woocommerce .variations_form .single_variation_wrap {
    margin: 1.5rem 0;
}

.woocommerce .variations_form .woocommerce-variation-price {
    font-size: 1.5rem;
    color: var(--clr-gold);
    margin-bottom: 1rem;
}

/* Custom option variant styling */
.inr-product-options .inr-option-select {
    width: 100%;
    padding: 0.75rem 1rem;
    background: rgba(255,255,255,0.05);
    border: 1px solid var(--glass-border);
    border-radius: 8px;
    color: var(--clr-text);
    font-size: 1rem;
    margin-bottom: 1rem;
}

.inr-product-options .inr-option-select:focus {
    border-color: var(--clr-gold);
    outline: none;
}

.inr-product-options label {
    display: block;
    font-weight: 500;
    margin-bottom: 0.5rem;
    color: var(--clr-text);
}

/* Warning message for required selection */
.inr-variant-warning {
    background: rgba(255, 193, 7, 0.1);
    border: 1px solid rgba(255, 193, 7, 0.3);
    color: #ffc107;
    padding: 0.75rem 1rem;
    border-radius: 8px;
    margin-bottom: 1rem;
    font-size: 0.9rem;
}
