/*
 Theme Name:   Urna Child
 Theme URI:    https://yourcart.in/
 Description:  Urna Child Theme - YourCart Modern Software Storefront
 Author:       YourCart Architect
 Author URI:   https://yourcart.in/
 Template:     urna
 Version:      1.3.0
 Text Domain:  urna-child
*/

/* ============================================================
   DESIGN TOKENS (React Reference Exact)
   ============================================================ */
:root {
    --yc-primary:       #2563eb;
    --yc-primary-hover: #1d4ed8;
    --yc-dark:          #0f172a;
    --yc-text:          #475569;
    --yc-muted:         #94a3b8;
    --yc-surface:       #f8fafc;
    --yc-white:         #ffffff;
    --yc-blue-tint:     #EEF2FF;
    --yc-border:        #e2e8f0;
    --yc-success:       #16a34a;
    --yc-success-bg:    #dcfce7;
    --yc-orange:        #f97316;
    --yc-yellow:        #facc15;
    --radius-card:      12px;
    --radius-btn:       8px;
    --shadow-card:      0 1px 3px 0 rgba(0,0,0,.05),0 1px 2px -1px rgba(0,0,0,.05);
    --shadow-hover:     0 12px 24px -6px rgba(15,23,42,.10);
    --shadow-btn:       0 4px 14px 0 rgba(37,99,235,.25);
}

/* ============================================================
   GLOBAL TYPOGRAPHY
   ============================================================ */
body, p, span, a, li, td, button, input, select, textarea {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}
h1,h2,h3,h4,h5,h6 {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
    color: var(--yc-dark);
}
body {
    background-color: var(--yc-surface);
    color: var(--yc-text);
}

/* ============================================================
   HEADER — Sticky Frosted Glass (React Navbar.tsx)
   ============================================================ */
#tbay-header,
.site-header,
header.site-header,
.tbay-header-wrapper,
.tbay-header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: rgba(255,255,255,0.92) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid var(--yc-border) !important;
    box-shadow: 0 1px 3px rgba(0,0,0,.06) !important;
}
/* Remove any default non-transparent Urna header backgrounds */
.header-sticky.is-sticky .header-inner,
.tbay-header .header-inner,
.header-inner {
    background: transparent !important;
}

/* ============================================================
   PRODUCT CARD — React ProductCard.tsx parity
   ============================================================ */

/* Card wrapper */
.product-block.grid,
.woocommerce ul.products li.product,
div.product.type-product .product-block {
    background: var(--yc-white) !important;
    border: 1px solid var(--yc-border) !important;
    border-radius: var(--radius-card) !important;
    padding: 0 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    box-shadow: var(--shadow-card) !important;
    transition: transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease, border-color .3s ease !important;
}
.product-block.grid:hover,
.woocommerce ul.products li.product:hover,
div.product.type-product .product-block:hover {
    transform: translateY(-4px) !important;
    box-shadow: var(--shadow-hover) !important;
    border-color: #cbd5e1 !important;
}

/* Product margin */
.woocommerce .products .product,
div.product.type-product {
    margin-bottom: 20px;
}

/* ---- Image section: 1:1 blue-tint well ---- */
.product-block figure.image,
.product-block .block-inner > figure,
div.product.type-product .product-block figure.image {
    background: var(--yc-blue-tint) !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    aspect-ratio: 1 / 1 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 0 !important;
    position: relative !important;
}
.product-block figure.image img,
div.product.type-product .product-block figure.image img,
.product-block figure.image a.product-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform .5s ease !important;
}
.product-block.grid:hover figure.image img,
div.product.type-product .product-block:hover figure.image img {
    transform: scale(1.04) !important;
}

/* ---- Deal badge (orange top-left) ---- */
.product-block figure.image .onsale,
.woocommerce ul.products li.product .onsale,
.product-block .onsale {
    position: absolute !important;
    top: 8px !important;
    left: 8px !important;
    right: auto !important;
    bottom: auto !important;
    background: var(--yc-orange) !important;
    color: #fff !important;
    border-radius: 6px !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    padding: 3px 7px !important;
    line-height: 1 !important;
    z-index: 10 !important;
    display: flex !important;
    align-items: center !important;
    gap: 3px !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    border: none !important;
}
/* Hide old Urna % text; our PHP hook adds "Deal" label */
.product-block .onsale .saled { display: none !important; }
/* YC deal label we inject */
.product-block .onsale .yc-deal-label { display: inline !important; }

/* ---- Caption/Content section ---- */
.product-block .caption,
div.product.type-product .product-block .caption {
    padding: 10px 12px 12px !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 !important;
}

/* ---- Product title ---- */
.product-block .caption h3.name,
.product-block .caption h3.name a,
.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: var(--yc-dark) !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    margin-bottom: 4px !important;
    text-decoration: none !important;
}
.product-block .caption h3.name a:hover,
.woocommerce ul.products li.product .woocommerce-loop-product__title:hover {
    color: var(--yc-primary) !important;
}

/* ---- Star rating row ---- */
.product-block .caption .rating,
.product-block .rating {
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    margin-bottom: 6px !important;
}
.product-block .rating .star-rating {
    font-size: 10px !important;
    color: var(--yc-yellow) !important;
    display: inline-flex !important;
}
.product-block .rating .star-rating::before,
.product-block .rating .star-rating span::before {
    color: var(--yc-yellow) !important;
}
/* Show even if .no-rate */
.product-block .rating.no-rate .star-rating {
    opacity: 0.4 !important;
}
.product-block .rating .count {
    font-size: 9px !important;
    color: var(--yc-muted) !important;
}

/* ---- Price section ---- */
.product-block .caption .price,
div.product.type-product .product-block .price,
.woocommerce ul.products li.product .price {
    display: flex !important;
    flex-direction: column !important;
    gap: 2px !important;
    margin-bottom: 8px !important;
}
/* Sale price (current bold) */
.product-block .price ins,
.woocommerce ul.products li.product .price ins {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: var(--yc-dark) !important;
    text-decoration: none !important;
}
/* Crossed MRP */
.product-block .price del,
.woocommerce ul.products li.product .price del {
    font-size: 11px !important;
    color: var(--yc-muted) !important;
    text-decoration: line-through !important;
}

/* Savings pill (injected via PHP) */
.yc-savings-pill {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    color: var(--yc-success) !important;
    background: var(--yc-success-bg) !important;
    border-radius: 4px !important;
    padding: 2px 6px !important;
    margin-top: 3px !important;
    width: fit-content !important;
}

/* ---- Feature pills ---- */
.yc-feature-pills {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
    margin-bottom: 8px !important;
}
.yc-feature-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    font-size: 9px !important;
    font-weight: 600 !important;
    color: #475569 !important;
    background: #f1f5f9 !important;
    border: 1px solid var(--yc-border) !important;
    border-radius: 4px !important;
    padding: 2px 6px !important;
}
.yc-feature-pill::before {
    content: '✓';
    color: var(--yc-success);
    font-size: 8px;
    font-weight: 900;
}

/* ---- Add to Cart button ---- */
.product-block .group-buttons,
.product-block .caption .group-buttons {
    margin-top: auto !important;
}
.product-block .add-cart a.button,
.product-block .add-cart a.add_to_cart_button,
.woocommerce ul.products li.product .add-cart a.button,
.woocommerce ul.products .button.add_to_cart_button {
    width: 100% !important;
    background: var(--yc-primary) !important;
    color: #fff !important;
    border: none !important;
    border-radius: var(--radius-btn) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    padding: 9px 12px !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    cursor: pointer !important;
    transition: background .2s ease, transform .15s ease, box-shadow .2s ease !important;
    box-shadow: var(--shadow-btn) !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}
.product-block .add-cart a.button:hover,
.product-block .add-cart a.add_to_cart_button:hover {
    background: var(--yc-primary-hover) !important;
    transform: translateY(-1px) !important;
}
.product-block .add-cart a.button:active {
    transform: scale(.97) !important;
}
/* After adding — added_to_cart state */
.product-block .add-cart a.added_to_cart {
    background: var(--yc-success) !important;
}

/* ---- Hide clutter ---- */
.product-block .tbay-quick-view,
.product-block .compare,
.product-block .wishlist,
.product-block .tbay-wishlist,
.product-block .add-links { display: none !important; }

/* ============================================================
   PRODUCT GRID COLUMN SPACING
   ============================================================ */
.woocommerce .products.columns-4 {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 16px !important;
}
@media (max-width: 1024px) {
    .woocommerce .products.columns-4 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 480px) {
    .woocommerce .products.columns-4 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 8px !important;
    }
}

/* ============================================================
   SINGLE PRODUCT PAGE
   ============================================================ */

/* Trust strip below product image */
.yc-trust-strip {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin-top: 12px !important;
}
.yc-trust-pill {
    display: inline-flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    color: #0f172a !important;
    background: #f1f5f9 !important;
    border: 1px solid var(--yc-border) !important;
    border-radius: 20px !important;
    padding: 4px 10px !important;
}

/* Savings pill on single product */
.yc-single-savings {
    display: inline-flex !important;
    align-items: center !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    color: var(--yc-success) !important;
    background: var(--yc-success-bg) !important;
    border-radius: 6px !important;
    padding: 4px 10px !important;
    margin-left: 10px !important;
}

/* Spec pills grid */
.yc-specs-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    margin: 14px 0 !important;
}
.yc-spec-pill {
    display: flex !important;
    flex-direction: column !important;
    background: var(--yc-blue-tint) !important;
    border: 1px solid #c7d2fe !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
}
.yc-spec-label {
    font-size: 9px !important;
    font-weight: 700 !important;
    color: var(--yc-muted) !important;
    text-transform: uppercase !important;
    letter-spacing: .05em !important;
    margin-bottom: 2px !important;
}
.yc-spec-value {
    font-size: 11px !important;
    font-weight: 600 !important;
    color: var(--yc-dark) !important;
}

/* Delivery status badge */
.yc-delivery-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    color: var(--yc-success) !important;
    background: var(--yc-success-bg) !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 20px !important;
    padding: 6px 14px !important;
    margin: 10px 0 !important;
}
.yc-delivery-badge::before {
    content: '🟢';
    font-size: 10px;
}

/* Payment seals */
.yc-payment-seal {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 6px !important;
    margin-top: 12px !important;
    padding: 10px 14px !important;
    background: var(--yc-surface) !important;
    border: 1px solid var(--yc-border) !important;
    border-radius: 10px !important;
}
.yc-payment-seal span {
    font-size: 10px !important;
    color: var(--yc-muted) !important;
    font-weight: 600 !important;
    margin-right: 4px !important;
}

/* Single product tabs upgrade */
.woocommerce-tabs .tabs li a {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--yc-text) !important;
    border-radius: 8px 8px 0 0 !important;
}
.woocommerce-tabs .tabs li.active a {
    color: var(--yc-primary) !important;
    border-bottom: 2px solid var(--yc-primary) !important;
}

/* ============================================================
   SHOP / ARCHIVE IMPROVEMENTS
   ============================================================ */
.woocommerce-breadcrumb {
    font-size: 12px !important;
    color: var(--yc-muted) !important;
    padding: 8px 0 !important;
}
.woocommerce-breadcrumb a {
    color: var(--yc-primary) !important;
    text-decoration: none !important;
}

/* Sort + count bar */
.woocommerce .woocommerce-result-count {
    font-size: 13px !important;
    color: var(--yc-text) !important;
}
.woocommerce .woocommerce-ordering select {
    border: 1px solid var(--yc-border) !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    padding: 6px 10px !important;
}

/* ============================================================
   HOMEPAGE SECTIONS
   ============================================================ */

/* Section container max-width */
.elementor-section-boxed > .elementor-container,
.elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 1280px !important;
}

/* Category section header strip top gradient border — React parity */
.yc-cat-header {
    border-top: 3px solid transparent !important;
    background-image: linear-gradient(white, white), linear-gradient(to right, #2563eb, #06b6d4) !important;
    background-origin: border-box !important;
    background-clip: padding-box, border-box !important;
    border-radius: 12px !important;
}

/* Marquee animation */
@keyframes yc-marquee {
    0%   { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.yc-marquee-track {
    display: flex !important;
    animation: yc-marquee 40s linear infinite !important;
    white-space: nowrap !important;
}
.yc-marquee-track:hover {
    animation-play-state: paused !important;
}
.yc-marquee-wrapper {
    overflow: hidden !important;
    position: relative !important;
}

/* Reviews marquee — slower */
.yc-reviews-marquee-track {
    display: flex !important;
    animation: yc-marquee 75s linear infinite !important;
    white-space: nowrap !important;
}
.yc-reviews-marquee-track:hover {
    animation-play-state: paused !important;
}

/* Trust strip icons */
.yc-trust-icon-box {
    background: var(--yc-blue-tint) !important;
    border-radius: 10px !important;
    width: 42px !important;
    height: 42px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--yc-primary) !important;
    flex-shrink: 0 !important;
}

/* Hero pill badge */
.yc-hero-badge {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    background: var(--yc-blue-tint) !important;
    border: 1px solid #c7d2fe !important;
    color: var(--yc-primary) !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    padding: 5px 14px !important;
    border-radius: 9999px !important;
    margin-bottom: 16px !important;
}
.yc-hero-badge .yc-ping {
    width: 8px !important;
    height: 8px !important;
    background: #22c55e !important;
    border-radius: 50% !important;
    animation: yc-ping 1.5s cubic-bezier(0,0,.2,1) infinite !important;
    position: relative !important;
    display: inline-block !important;
}
@keyframes yc-ping {
    75%, 100% { transform: scale(2); opacity: 0; }
}

/* ============================================================
   FOOTER ENHANCEMENTS
   ============================================================ */
.tbay-footer,
.site-footer,
#tbay-footer {
    background: #0f172a !important;
    color: #94a3b8 !important;
}
.tbay-footer a,
.site-footer a {
    color: #94a3b8 !important;
    text-decoration: none !important;
}
.tbay-footer a:hover,
.site-footer a:hover {
    color: #fff !important;
}

/* ============================================================
   MISC CLEANUP
   ============================================================ */
/* Remove Urna demo icons/widgets we don't need */
.tbay-scroll-to-top {
    background: var(--yc-primary) !important;
    border-radius: 50% !important;
}
/* WooCommerce alerts */
.woocommerce-message,
.woocommerce-info {
    border-top-color: var(--yc-primary) !important;
}
.woocommerce-message::before {
    color: var(--yc-primary) !important;
}
/* Buttons global */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
    background: var(--yc-primary) !important;
    color: #fff !important;
    border-radius: var(--radius-btn) !important;
    font-weight: 700 !important;
    font-size: 13px !important;
    padding: 10px 20px !important;
    transition: background .2s ease !important;
    border: none !important;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover {
    background: var(--yc-primary-hover) !important;
    color: #fff !important;
}
/* Cart & checkout */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
.woocommerce-checkout #place_order {
    background: var(--yc-primary) !important;
    border-radius: 10px !important;
    font-size: 15px !important;
    font-weight: 700 !important;
    box-shadow: var(--shadow-btn) !important;
}
