/* ========================================================================== */
/* BLUE SKIN LUXURY ENTERPRISE - MASTER MOBILE ENGINE (SPACE MANAGED)          */
/* ========================================================================== */

@media screen and (max-width: 768px) {
/* ========================================================================== */
/* === START: TOP SCROLLING TICKER BAR (EXACT FIRST PAGE CLONE) ============= */
/* ========================================================================== */

/* முதல் பக்கத்தின் அசல் ராயல் ப்ளூ கிரேடியன்ட் பின்னணி & பார்டர் */
.top-ticker-bar {
    height: 60px !important;
    min-height: 60px !important;
    max-height: 60px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
}

/* எழுத்துக்கள் மற்றும் இடைவெளி */
.ticker-content span {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    letter-spacing: 1.2px !important;
    color: #ffffff !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
}

/* பொன்னிற கிரீடம் மற்றும் ஐகான்கள் */
.ticker-content span i {
    color: #f5c443 !important;
    font-size: 0.75rem !important;
}

/* பிரிப்பான் புள்ளி (Dot) */
.ticker-dot {
    margin: 0 10px !important;
    color: #f5c443 !important;
    font-size: 0.85rem !important;
}

/* === END: TOP SCROLLING TICKER BAR ======================================= */



/* ========================================================================== */
/* === START: 2. HEADER & NAVIGATION (EXACT COLOR & 100% ROUND CIRCLES) ===== */
/* ========================================================================== */

/* 1. ஹெடர் பின்னணி: முதல் பக்கத்தின் அதே ராயல் கிளாஸ் நேவி நிறம் */
.header {
    position: sticky !important;
    top: 0 !important;
    z-index: 1000 !important;
    background: rgba(13, 34, 68, 0.82) !important;
    backdrop-filter: blur(12px) !important;
    border-bottom: 1px solid rgba(245, 196, 67, 0.25) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4) !important;
    padding: 0 !important;
    width: 100% !important;
}

/* கண்டெய்னர் பேடிங் மற்றும் லேஅவுட் */
.header .nav-container,
.nav-container,
.shop-nav-flex {
    padding: 0.9rem 12px !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 2. பிராண்ட் லோகோ: கிரீடம் நீக்கப்பட்டு அசல் BLUE SKIN அளவு */
.brand-emblem,
.nav-left-brand .brand-emblem {
    display: none !important;
}

.nav-left-brand {
    flex: 0 0 auto !important;
    margin: 0 !important;
    padding: 0 !important;
}

.nav-left-brand .logo,
.logo {
    font-family: 'Cinzel', serif !important;
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    letter-spacing: 1px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    white-space: nowrap !important;
}

.nav-left-brand .logo .gold-text,
.gold-text {
    color: #f5c443 !important;
    margin-left: 4px !important;
}

/* 3. வலதுபுற பட்டன்கள் தொகுப்பு (5px இடைவெளியில் வலது ஓரத்தில் ஒட்டி நிற்க) */
.shop-nav-flex .nav-actions-right,
header .nav-actions-right,
.nav-actions-right {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 5px !important;                       /* 3 பட்டன்களுக்கு இடைவெளி வெறும் 5px */
    width: auto !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    flex: 0 0 auto !important;
}

.nav-actions-right > * {
    margin: 0 !important;
    flex: 0 0 35px !important;                 /* ஓவல் ஆகாமல் 35px-ல் லாக் செய்கிறது */
}

/* 4. பேக் பட்டன் (Arrow): முதல் பக்கத்தைப் போல உள்ளே முழு மஞ்சள் நிறம் (Solid Yellow) */
.btn-back-portfolio {
    width: 35px !important;
    height: 35px !important;
    min-width: 35px !important;
    max-width: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
    aspect-ratio: 1 / 1 !important;            /* 100% வட்டம் மட்டுமே வர கட்டுப்பாடு */
    border-radius: 50% !important;
    padding: 0 !important;
    margin: 0 !important;
    background: linear-gradient(135deg, #f5c443 0%, #e0ab26 100%) !important; /* அசல் மஞ்சள் நிறம் */
    color: #0b1a30 !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    box-shadow: 0 0 12px rgba(245, 196, 67, 0.45) !important;
    position: relative !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.btn-back-portfolio span {
    display: none !important;
}

.btn-back-portfolio i {
    font-size: 0.85rem !important;
    color: #0b1a30 !important;                 /* அம்பு கறுப்பு நிறத்தில் பளிச்சென நிற்கும் */
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 5. விஷ்லிஸ்ட் (Heart) & கார்ட் (Bag) - 100% வட்ட வடிவ பட்டன்கள் */
#openWishlistBtn,
#openCartBtn,
.luxury-round-btn {
    width: 35px !important;
    height: 35px !important;
    min-width: 35px !important;
    max-width: 35px !important;
    min-height: 35px !important;
    max-height: 35px !important;
    aspect-ratio: 1 / 1 !important;            /* ஓவல் ஆகாமல் தடுக்கும் விகிதம் */
    border-radius: 50% !important;             /* முழுமையான வட்டம் */
    padding: 0 !important;
    margin: 0 !important;
    background: rgba(16, 42, 78, 0.85) !important;
    border: 1.5px solid rgba(245, 196, 67, 0.45) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.35) !important;
    position: relative !important;
    text-decoration: none !important;
    cursor: pointer !important;
}

.luxury-round-btn i,
#headerWishlistIcon,
#openCartBtn i {
    font-size: 0.82rem !important;
    color: #ffffff !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 6. கவுண்ட் பேட்ஜ் (Corner Dots) */
.action-badge {
    position: absolute !important;
    top: -3px !important;
    right: -3px !important;
    width: 15px !important;
    height: 15px !important;
    min-width: 15px !important;
    max-width: 15px !important;
    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;
    background: #f5c443 !important;
    color: #0b1a30 !important;
    font-size: 0.50rem !important;
    font-weight: 800 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1.5px solid #08162d !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}
/* === END: 2. HEADER & NAVIGATION ========================================= */


/* ========================================================================== */
/* === START: 3. SHOP BY CATEGORY SECTION (ROUNDED SQUARES & BALANCED SPACE) = */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* --- 3.1: OVERALL SECTION CONTAINER & VERTICAL RHYTHM ---                   */
/* -------------------------------------------------------------------------- */
.cosmetics-cat-section {
    width: 100% !important;
    padding: 1.5rem 0 1.2rem 0 !important;
    background: transparent !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
}

.cosmetics-cat-section .section-container {
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
}

.cat-slider-header {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    padding: 0 16px !important;
    margin-bottom: 1.1rem !important;          /* Title-kum slider-kum even gap */
}

/* -------------------------------------------------------------------------- */
/* --- 3.2: CURATED SELECTIONS SUB-BADGE (EVEN SPACING 1) ---                 */
/* -------------------------------------------------------------------------- */
.cat-slider-header .sub-badge {
    background: rgba(245, 196, 67, 0.12) !important;
    border: 1px solid rgba(245, 196, 67, 0.35) !important;
    color: #f5c443 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.62rem !important;
    font-weight: 600 !important;
    letter-spacing: 1.2px !important;
    text-transform: uppercase !important;
    padding: 5px 14px !important;
    border-radius: 20px !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    margin: 0 0 0.75rem 0 !important;          /* Badge-kum Title-kum even gap */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

.cat-slider-header .sub-badge i {
    font-size: 0.65rem !important;
    color: #f5c443 !important;
}

/* -------------------------------------------------------------------------- */
/* --- 3.3: 'SHOP BY CATEGORY' TITLE (EVEN SPACING 2) ---                     */
/* -------------------------------------------------------------------------- */
.cat-section-title {
    font-family: 'Cinzel', serif !important;
    font-size: 1.35rem !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    letter-spacing: 0.8px !important;
    margin: 0 !important;
    line-height: 1.25 !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.6) !important;
}

.cat-section-title .gold-gradient-text {
    background: linear-gradient(135deg, #ffd768 0%, #f5c443 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    display: inline-block !important;
}

/* -------------------------------------------------------------------------- */
/* --- 3.4: HORIZONTAL TOUCH SCROLL CAROUSEL ---                              */
/* -------------------------------------------------------------------------- */
.cat-carousel-container {
    width: 100% !important;
    position: relative !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Arrow buttons hide panni smooth touch scroll aakkiduvom */
.cat-arrow-btn {
    display: none !important;
}

/* Horizontal swipe track */
.cat-track-scroll {
    display: flex !important;
    flex-direction: row !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    -webkit-overflow-scrolling: touch !important;
    gap: 12px !important;                      /* Squares-kku naduvula neat gap */
    padding: 4px 16px 10px 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    scrollbar-width: none !important;
}

.cat-track-scroll::-webkit-scrollbar {
    display: none !important;
}

/* -------------------------------------------------------------------------- */
/* --- 3.5: ROUNDED SQUARES (CURVED CORNER CHINNA SQUARES) ---                */
/* -------------------------------------------------------------------------- */
.cat-item {
    flex: 0 0 auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 7px !important;
    cursor: pointer !important;
    scroll-snap-align: start !important;
    text-align: center !important;
    width: 68px !important;                    /* Balanced square card width */
    transition: transform 0.25s ease !important;
}

/* Square box with curved corners */
.cat-thumb-circle {
    width: 66px !important;
    height: 66px !important;
    min-width: 66px !important;
    min-height: 66px !important;
    border-radius: 14px !important;            /* Circle illama neat curved square */
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    position: relative !important;
    background: #0d2244 !important;
    border: 1.5px solid rgba(245, 196, 67, 0.3) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4) !important;
    transition: all 0.3s ease !important;
}

.cat-thumb-circle img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 12px !important;
}

/* Active select aana square-kku golden border & glow */
.cat-item.active .cat-thumb-circle {
    border-color: #f5c443 !important;
    box-shadow: 0 0 14px rgba(245, 196, 67, 0.55) !important;
    transform: scale(1.05) !important;
}

/* 'All Collections' overlay */
.cat-overlay-icon {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(8, 22, 45, 0.45) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #ffffff !important;
    font-size: 0.95rem !important;
    border-radius: 12px !important;
}

/* -------------------------------------------------------------------------- */
/* --- 3.6: CATEGORY LABELS BELOW SQUARES ---                                 */
/* -------------------------------------------------------------------------- */
.cat-label {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.66rem !important;
    font-weight: 500 !important;
    color: #94a3b8 !important;
    white-space: nowrap !important;
    letter-spacing: 0.3px !important;
    line-height: 1.2 !important;
    transition: color 0.3s ease !important;
}

.cat-item.active .cat-label {
    color: #f5c443 !important;
    font-weight: 600 !important;
    text-shadow: 0 0 8px rgba(245, 196, 67, 0.3) !important;
}

/* ========================================================================== */
/* === END: 3. SHOP BY CATEGORY SECTION ===================================== */
/* ========================================================================== */
/* === END: 3. SHOP BY CATEGORY SECTION ===================================== */

/* ========================================================================== */
/* === START: 4. PRODUCTS GRID (REVOLUTIONARY LUXURY 4x2 BOUTIQUE MODEL) ==== */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* --- 4.1: செக்ஷன் கண்டெய்னர் & ஃபிரேம் பாதுகாப்பு ---                       */
/* -------------------------------------------------------------------------- */
.shop-products-section {
    padding: 1rem 0 3.5rem 0 !important;
    width: 100% !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;              /* திரையை விட்டு வெளியே வழிவதை அடியோடு தடுக்கும் */
    box-sizing: border-box !important;
}

.shop-products-section .section-container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 10px !important;                 /* சரியான பக்கவாட்டு பேடிங் */
    margin: 0 auto !important;
    box-sizing: border-box !important;
}

/* -------------------------------------------------------------------------- */
/* --- 4.2: மையப்படுத்தப்பட்ட கேட்டகிரி தலைப்பு (CENTERED LUXURY TITLE) ---     */
/* -------------------------------------------------------------------------- */
.active-category-title-bar {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding: 0.6rem 0 1.2rem 0 !important;
    border-bottom: 1px solid rgba(245, 196, 67, 0.2) !important;
    margin-bottom: 1.2rem !important;
    width: 100% !important;
}

/* நீங்கள் தொடும் கேட்டகிரி பெயர் நடுவில் தங்கம் போல ஒளிரும் */
#currentCategoryHeading,
.active-category-title-bar h3 {
    font-family: 'Cinzel', serif !important;
    font-size: 1.25rem !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    letter-spacing: 1.2px !important;
    text-align: center !important;
    margin: 0 !important;
    line-height: 1.2 !important;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.8), 0 0 15px rgba(245, 196, 67, 0.3) !important;
}

/* 'Showing all editions / 8 pieces' உரை முழுமையாக நீக்கம் */
.active-category-title-bar span,
#productCounterText {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
}

/* -------------------------------------------------------------------------- */
/* --- 4.3: 4x2 கிரிட் கட்டமைப்பு (2 COLUMNS PER ROW - ZERO OVERFLOW) ---     */
/* -------------------------------------------------------------------------- */
.products-grid-catalog {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 11px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

/* -------------------------------------------------------------------------- */
/* --- 4.4: புதிய பிரீமியம் கார்டு மாடல் (PREMIUM BOUTIQUE CARD) ---          */
/* -------------------------------------------------------------------------- */
.shop-prod-card {
    position: relative !important;              /* மிதக்கும் View பட்டனுக்கு அஸ்திவாரம் */
    background: linear-gradient(165deg, rgba(16, 38, 70, 0.92) 0%, rgba(8, 20, 38, 0.98) 100%) !important;
    border: 1px solid rgba(245, 196, 67, 0.28) !important;
    border-radius: 16px !important;
    padding: 8px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.45) !important;
    box-sizing: border-box !important;
    min-width: 0 !important;
    width: 100% !important;
    overflow: hidden !important;
}

/* தயாரிப்பு படம் */
.shop-prod-img-box {
    width: 100% !important;
    height: 150px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    position: relative !important;
    background: #050e1a !important;
}

.shop-prod-img-box img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

/* இடதுபுற டேக் பேட்ஜ் (CURATED / SIGNATURE) */
.shop-prod-tag {
    position: absolute !important;
    top: 7px !important;
    left: 7px !important;
    background: rgba(8, 22, 45, 0.94) !important;
    color: #f5c443 !important;
    border: 1px solid rgba(245, 196, 67, 0.4) !important;
    padding: 3px 8px !important;
    border-radius: 12px !important;
    font-size: 0.55rem !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    z-index: 2 !important;
}

/* -------------------------------------------------------------------------- */
/* --- 4.5: மிதக்கும் 'VIEW' கிளாஸ் பேட்ஜ் (FLOATING QUICK VIEW) ---           */
/* -------------------------------------------------------------------------- */
/* 1. Details பட்டன் நிரந்தர நீக்கம் */
.btn-card-view {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* 2. பட்டனில் 'ADD TO CART' என மாற்றுதல் & முழு அகலம் */
.btn-card-add {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    background: linear-gradient(135deg, #f5c443 0%, #e0ab26 100%) !important;
    border: none !important;
    color: #0b1a30 !important;
    border-radius: 20px !important;
    font-size: 0 !important;                      /* பழைய 'Add' உரையை மறைக்கும் */
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    box-shadow: 0 3px 12px rgba(245, 196, 67, 0.35) !important;
    transition: transform 0.2s ease !important;
}

.btn-card-add:active {
    transform: scale(0.97) !important;
}

.btn-card-add i {
    font-size: 0.75rem !important;
    color: #0b1a30 !important;
}

/* -------------------------------------------------------------------------- */
/* --- 4.6: தயாரிப்பு தகவல் & விலை ---                                        */
/* -------------------------------------------------------------------------- */
.shop-prod-info {
    padding: 8px 3px 6px 3px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

.shop-prod-title {
    font-family: 'Cinzel', serif !important;
    font-size: 0.84rem !important;
    color: #ffffff !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    margin-bottom: 2px !important;
}

.shop-prod-price {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 700 !important;
    color: #f5c443 !important;
    margin: 2px 0 8px 0 !important;
}

/* -------------------------------------------------------------------------- */
/* --- 4.7: முழு அகல கோல்டன் பட்டன் (FULL-WIDTH LUXURY '+ ADD TO BAG') ---     */
/* -------------------------------------------------------------------------- */
.shop-card-actions {
    display: block !important;
    width: 100% !important;
    margin-top: auto !important;
    padding: 0 !important;
}

.btn-card-add {
    width: 100% !important;
    height: 38px !important;                   /* விரலால் தொட வசதியான 38px உயரம் */
    min-height: 38px !important;
    background: linear-gradient(135deg, #f5c443 0%, #e0ab26 100%) !important;
    border: none !important;
    color: #0b1a30 !important;
    border-radius: 20px !important;             /* எலிகண்ட் கோல்டன் பில் வடிவம் */
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.74rem !important;             /* பெரிய தெளிவான எழுத்து */
    font-weight: 700 !important;
    letter-spacing: 0.6px !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 6px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    box-shadow: 0 3px 12px rgba(245, 196, 67, 0.35) !important;
    transition: transform 0.2s ease !important;
}

.btn-card-add:active {
    transform: scale(0.97) !important;
}

.btn-card-add i {
    font-size: 0.75rem !important;
    color: #0b1a30 !important;
}

/* -------------------------------------------------------------------------- */
/* --- 4.8: "VIEW MORE CREATIONS" பட்டன் (CENTERED LUXURY GOLD) ---            */
/* -------------------------------------------------------------------------- */
.view-more-container {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin-top: 2.2rem !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
}

.btn-view-more-catalog {
    background: linear-gradient(135deg, rgba(16, 42, 78, 0.9) 0%, rgba(10, 26, 50, 0.95) 100%) !important;
    border: 1.5px solid #f5c443 !important;
    color: #f5c443 !important;
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.78rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
    padding: 11px 28px !important;
    height: 44px !important;
    border-radius: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    cursor: pointer !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.5), 0 0 12px rgba(245, 196, 67, 0.25) !important;
    transition: all 0.25s ease !important;
}

.btn-view-more-catalog:active {
    background: #f5c443 !important;
    color: #0b1a30 !important;
    transform: scale(0.97) !important;
}
/* === END: 4. PRODUCTS GRID ================================================ */

/* ========================================================================== */
/* === 1. INLINE COUNTER FIX (ADD TO CART பட்டனின் அதே 38px & 100% வடிவம்) === */
/* ========================================================================== */

/* ஆட் டு கார்ட் பட்டனின் அதே முழு அகலம் (100%), 38px உயரம் மற்றும் பில் வடிவம் */
.card-inline-counter {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    background: linear-gradient(135deg, #f5c443 0%, #e0ab26 100%) !important; /* அதே தங்க நிறம் */
    border-radius: 20px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    box-shadow: 0 3px 12px rgba(245, 196, 67, 0.35) !important;
    margin: 0 !important;
}

/* ========================================================================== */
/* === 1. INLINE COUNTER FIX (CLEAN +/- ICONS WITHOUT BACKGROUND) =========== */
/* ========================================================================== */

/* ஆட் டு கார்ட் பட்டனின் அதே 38px உயரம் மற்றும் தங்க நிற பின்னணி */
.card-inline-counter {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    max-height: 38px !important;
    background: linear-gradient(135deg, #f5c443 0%, #e0ab26 100%) !important;
    border-radius: 20px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 0 14px !important;                  /* பட்டன்களுக்கு வசதியான பக்கவாட்டு இடைவெளி */
    box-sizing: border-box !important;
    box-shadow: 0 3px 12px rgba(245, 196, 67, 0.35) !important;
    margin: 0 !important;
}

/* பேக்ரவுண்ட் எதுவுமில்லாத தூய மைனஸ் (-) மற்றும் பிளஸ் (+) குறிகள் */
.card-inline-counter .inline-btn,
.inline-btn {
    background: transparent !important;         /* பேக்ரவுண்ட் வட்டம் முழுமையாக நீக்கம் */
    border: none !important;                    /* பார்டர்கள் எதுவும் இல்லை */
    outline: none !important;
    box-shadow: none !important;
    color: #0b1a30 !important;                  /* அடர் நேவி நிறத்தில் பளிச்சென நிற்கும் */
    font-size: 1.35rem !important;              /* தொடுவதற்கு வசதியான பெரிய +/- அளவு */
    font-weight: 700 !important;
    line-height: 1 !important;
    width: 32px !important;
    height: 38px !important;
    min-width: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    padding: 0 !important;
    margin: 0 !important;
    user-select: none !important;
    -webkit-tap-highlight-color: transparent !important;
    transition: transform 0.15s ease, opacity 0.15s ease !important;
}

.card-inline-counter .inline-btn:active {
    transform: scale(0.85) !important;          /* தொடும் போது லேசாக அமுங்கும் எஃபெக்ட் */
    opacity: 0.6 !important;
}

/* நடுவில் இருக்கும் எண்ணிக்கை (1, 2, 3...) */
.card-inline-counter .inline-val,
.inline-val {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.95rem !important;
    font-weight: 800 !important;
    color: #0b1a30 !important;
    min-width: 24px !important;
    text-align: center !important;
    line-height: 1 !important;
    user-select: none !important;
}
.card-inline-counter .inline-btn:active {
    transform: scale(0.9) !important;
}

/* நடுவில் இருக்கும் கவுண்ட் எண் (1, 2, 3...) */
.card-inline-counter .inline-val,
.inline-val {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.90rem !important;
    font-weight: 800 !important;
    color: #0b1a30 !important;                     /* கறுப்பு/நேவி போல் பளிச்சென நிற்கும் */
    min-width: 24px !important;
    text-align: center !important;
    line-height: 1 !important;
}


/* ========================================================================== */
/* === 2. WISHLIST HEART POSITION (இமேஜின் இடது கீழ் மூலைக்கு மாற்றுதல்) ==== */
/* ========================================================================== */

/* விஷ்லிஸ்ட் ஹார்ட் ஐகான் டாப்-ல் இருந்து பாட்டம்-லெஃப்ட்டுக்கு நகர்த்தப்பட்டது */
.card-wishlist-toggle,
.shop-prod-card .card-wishlist-toggle,
.shop-prod-img-box .card-wishlist-toggle {
    position: absolute !important;
    top: auto !important;                          /* டாப் ரத்து செய்யப்பட்டது */
    bottom: 7px !important;                       /* படத்தின் கீழ் விளிம்பில் இருந்து 7px */
    left: 7px !important;                         /* படத்தின் இடது விளிம்பில் இருந்து 7px */
    right: auto !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    border-radius: 50% !important;
    background: rgba(8, 22, 45, 0.85) !important;  /* கிளாஸ்மார்பிசம் நேவி வட்டம் */
    backdrop-filter: blur(6px) !important;
    border: 1px solid rgba(245, 196, 67, 0.35) !important;
    color: #ffffff !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 0.75rem !important;
    z-index: 4 !important;
    cursor: pointer !important;
    box-shadow: 0 3px 8px rgba(0, 0, 0, 0.4) !important;
}

/* விஷ்லிஸ்ட் ஆக்டிவ் / கிளிக் செய்தவுடன் சிவப்பு நிறமாக மாற */
.card-wishlist-toggle.active,
.card-wishlist-toggle.active i {
    background: #f43f5e !important;
    color: #ffffff !important;
    border-color: #f43f5e !important;
}


/* ========================================================================== */
/* === 5. SPACE MANAGEMENT & LUXURY FOOTER REDESIGN ========================= */
/* ========================================================================== */

/* -------------------------------------------------------------------------- */
/* --- 5.1: VIEW MORE பட்டனுக்கு கீழே உள்ள அதிகப்படியான இடைவெளி குறைப்பு ---   */
/* -------------------------------------------------------------------------- */
.shop-products-section {
    padding-bottom: 1rem !important;            /* 3.5rem-ல் இருந்து 1rem-ஆக குறைக்கப்பட்டது */
    margin-bottom: 0 !important;
}

.view-more-container {
    margin-top: 1.4rem !important;
    margin-bottom: 0.8rem !important;           /* பட்டனுக்கு கீழே தேவையற்ற இடைவெளி நீக்கம் */
}

/* -------------------------------------------------------------------------- */
/* --- 5.2: புதிய லக்சரி மொபைல் ஃபூட்டர் (FULL SPACE UTILIZATION) ---         */
/* -------------------------------------------------------------------------- */
.footer-section {
    background: linear-gradient(180deg, rgba(8, 22, 45, 0.98) 0%, #040c18 100%) !important;
    border-top: 1px solid rgba(245, 196, 67, 0.28) !important;
    box-shadow: 0 -10px 30px rgba(0, 0, 0, 0.5) !important;
    padding: 2.2rem 16px 1.8rem 16px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    position: relative !important;
    overflow: hidden !important;
}

.footer-section .section-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    gap: 1.4rem !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 auto !important;
}

/* பிராண்ட் லோகோ & டேக்லைன் */
.footer-brand {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
}

.footer-brand .logo {
    font-family: 'Cinzel', serif !important;
    font-size: 1.4rem !important;
    font-weight: 700 !important;
    letter-spacing: 2px !important;
    color: #ffffff !important;
    text-decoration: none !important;
    text-shadow: 0 0 15px rgba(245, 196, 67, 0.3) !important;
}

.footer-brand .gold-text {
    color: #f5c443 !important;
}

.footer-brand p {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.72rem !important;
    color: #94a3b8 !important;
    letter-spacing: 0.5px !important;
    margin: 0 !important;
    max-width: 280px !important;
    line-height: 1.4 !important;
}

/* சோஷியல் மீடியா & கன்சியர்ஜ் வட்ட பட்டன்கள் */
.footer-socials {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 0.2rem 0 !important;
}

.footer-socials a {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    min-height: 40px !important;
    border-radius: 50% !important;
    background: rgba(16, 42, 78, 0.7) !important;
    border: 1px solid rgba(245, 196, 67, 0.35) !important;
    color: #f5c443 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 1rem !important;
    text-decoration: none !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.2s ease, background 0.2s ease !important;
}

.footer-socials a:active {
    background: #f5c443 !important;
    color: #0b1a30 !important;
    transform: scale(0.92) !important;
}

/* மெல்லிய கோல்டன் டிவைடர் கோடு */
.footer-bottom {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    width: 100% !important;
    gap: 1.2rem !important;
    border-bottom: 1px solid rgba(245, 196, 67, 0.15) !important;
    padding-bottom: 1.4rem !important;
}

/* காப்பிரைட் & CorePulse பிராண்டிங் பட்டி */
.copyright-bar {
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

.copyright-bar p {
    font-family: 'Poppins', sans-serif !important;
    font-size: 0.68rem !important;
    color: #64748b !important;
    letter-spacing: 0.3px !important;
    line-height: 1.6 !important;
    margin: 0 !important;
}

.dev-brand-link {
    color: #f5c443 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    letter-spacing: 0.5px !important;
    display: inline-block !important;
    text-shadow: 0 0 10px rgba(245, 196, 67, 0.4) !important;
}
}
