/* ===================================================================== balOON.LK — original storefront design (dark default) + light theme Toggle via . Fonts: Manrope (body), Saira (display), Eras Bold ITC (logo) ===================================================================== */ @font-face{ font-family:'Eras Bold ITC'; src:url('../fonts/eras-bold-itc.woff2') format('woff2'), url('../fonts/eras-bold-itc.ttf') format('truetype'); font-weight:700;font-style:normal;font-display:swap; } :root{ /* brand accents (same in both themes) */ --pink:#ff2d9b; --pink-2:#c4187a; --pink-soft:#ff5bb0; --purple:#7c3aed; --purple-2:#a78bfa; --gold:#f59e0b; --card:#fff; --card-ink:#1c1530; --radius:14px; --wrap:1280px; --font:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; --display:'Saira',var(--font); /* DARK theme surfaces (default) */ --page-bg:#07060f; --page-glow:radial-gradient(60% 40% at 80% 0%,rgba(124,58,237,.12),transparent 60%); --topbar-bg:#050409; --header-bg:#0a0813; --footer-bg:#080611; --sidebar-bg:#0d0a1c; --strip-bg:linear-gradient(90deg,#120a26,#0e0820); --strip-border:rgba(255,255,255,.06); --ink:#fff; --logo-ink:#fff; --muted:#9b95b5; --muted-2:#c6c0da; --line:rgba(255,255,255,.06); --chip-bg:rgba(255,255,255,.07); } [data-theme="light"]{ --page-bg:#eef0f7; --page-glow:radial-gradient(60% 40% at 85% 0%,rgba(255,45,155,.10),transparent 60%); --topbar-bg:#ffffff; --header-bg:#ffffff; --footer-bg:#ffffff; --sidebar-bg:#ffffff; --strip-bg:#ffffff; --strip-border:rgba(20,10,40,.10); --ink:#1b1430; --logo-ink:#1b1430; --muted:#6b6580; --muted-2:#39324f; --line:rgba(20,10,40,.09); --chip-bg:rgba(20,10,40,.05); } *{box-sizing:border-box;} html{scroll-behavior:smooth;} body.baloon-theme{ margin:0; background:var(--page-glow),var(--page-bg); color:var(--ink); font-family:var(--font); font-size:15px; line-height:1.6; overflow-x:hidden; -webkit-font-smoothing:antialiased; transition:background .3s ease,color .3s ease; } body.baloon-theme a{color:inherit;text-decoration:none;} body.baloon-theme img{max-width:100%;height:auto;display:block;} body.baloon-theme h1,body.baloon-theme h2,body.baloon-theme h3,body.baloon-theme h4{font-family:var(--display);margin:0;} .bl-wrap{max-width:var(--wrap);margin:0 auto;padding:0 20px;width:100%;} .scrollrow{scrollbar-width:none;-ms-overflow-style:none;} .scrollrow::-webkit-scrollbar{display:none;} /* ---------- TOP BAR ---------- */ .bl-topbar{background:var(--topbar-bg);border-bottom:1px solid var(--line);} .bl-topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 20px;} .bl-topbar__promo{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:var(--muted-2);} .bl-topbar__promo b{color:var(--pink);font-weight:700;} .bl-topbar__bolt{color:var(--pink);font-size:14px;} .bl-topbar__right{display:flex;align-items:center;gap:16px;} .bl-social{display:flex;align-items:center;gap:11px;} .bl-social a{width:24px;height:24px;border-radius:50%;background:var(--chip-bg);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:.2s;} .bl-social a:hover{background:var(--pink);color:#fff;} .bl-topbar__sep{width:1px;height:14px;background:var(--line);} .bl-topbar__links{display:flex;align-items:center;gap:16px;list-style:none;margin:0;padding:0;font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--muted-2);} .bl-topbar__links a:hover{color:var(--pink);} /* theme toggle */ .bl-theme-toggle{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:20px;background:var(--chip-bg);border:1px solid var(--line);color:var(--ink);cursor:pointer;font-family:var(--font);} .bl-theme-toggle:hover{border-color:var(--pink);} .bl-theme-toggle .ico-sun{display:none;} .bl-theme-toggle .ico-moon{display:inline-flex;} [data-theme="light"] .bl-theme-toggle .ico-sun{display:inline-flex;} [data-theme="light"] .bl-theme-toggle .ico-moon{display:none;} /* ---------- MAIN HEADER ---------- */ .bl-header{background:var(--header-bg);border-bottom:1px solid var(--line);} .bl-header__inner{display:flex;align-items:center;gap:26px;padding:16px 20px;min-height:76px;box-sizing:border-box;} /* keep the search bar a fixed height everywhere (WooCommerce form CSS on shop pages can otherwise stretch inputs/selects and make the header taller) */ .bl-header .bl-search__form{height:44px!important;} .bl-header .bl-search__input{height:100%!important;line-height:normal!important;margin:0!important;box-shadow:none!important;} .bl-header .bl-search__cat select{height:100%!important;line-height:normal!important;margin:0!important;} .bl-burger{display:none;background:none;border:none;color:var(--ink);cursor:pointer;padding:4px;margin-right:2px;} .bl-logo{flex-shrink:0;display:flex;align-items:center;} /* image logo with light/dark swap by theme mode */ .bl-logo__img{display:inline-flex;align-items:center;line-height:0;height:54px;} .bl-logo__img img{width:auto;object-fit:contain;display:none;} /* dark-mode logo (white letters, fills frame edge-to-edge) — smaller so it visually matches the light pill logo */ .bl-logo .bl-logo__dark{display:inline-block!important;height:28px!important;max-height:28px!important;width:auto!important;} /* light-mode logo (navy pill, has padding around the text) */ .bl-logo .bl-logo__light{display:none!important;height:48px!important;max-height:48px!important;width:auto!important;} [data-theme="light"] .bl-logo__dark{display:none!important;} [data-theme="light"] .bl-logo__light{display:inline-block!important;} @media (max-width:768px){ .bl-logo__img{height:44px;} .bl-logo .bl-logo__dark{height:22px!important;max-height:22px!important;} .bl-logo .bl-logo__light{height:40px!important;max-height:40px!important;} } .bl-logo__text{font-family:'Eras Bold ITC',var(--display);font-weight:700;font-style:normal;font-size:30px;line-height:1;letter-spacing:.005em;color:var(--logo-ink);display:inline-block;} .bl-logo__text--lg{font-size:25px;} .bl-logo__text .hl{color:var(--pink);text-shadow:0 0 14px rgba(255,45,155,.55);} .bl-logo__tag{font-size:8px;font-weight:700;letter-spacing:.32em;color:#8b84a6;margin-top:2px;} .bl-logo .the-custom-logo,.bl-logo>img{max-height:54px;width:auto;} .bl-search{flex:1;max-width:640px;position:relative;} .bl-search__form{display:flex;align-items:stretch;background:#fff;border-radius:8px;overflow:hidden;height:44px;border:1px solid var(--line);} /* live-search dropdown */ .bl-search__results{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:120; background:var(--header-bg,#0c0a1e);border:1px solid var(--line);border-radius:14px; box-shadow:0 18px 44px rgba(4,3,16,.55);overflow:hidden;max-height:70vh;overflow-y:auto;} .bl-search__item{display:grid;grid-template-columns:46px 1fr auto;gap:12px;align-items:center; padding:10px 14px;border-bottom:1px solid var(--line);text-decoration:none;transition:.15s;} .bl-search__item:hover{background:rgba(255,45,155,.08);} .bl-search__item img{width:46px;height:46px;object-fit:contain;background:#fff;border-radius:8px;padding:3px;} .bl-search__item-t{color:var(--ink);font-size:13px;font-weight:600;line-height:1.3;} .bl-search__item-p{color:var(--pink);font-weight:800;font-size:13px;white-space:nowrap;} .bl-search__item-p .amount{color:var(--pink)!important;} .bl-search__item-p del{color:var(--muted);font-weight:400;font-size:11px;margin-right:4px;} .bl-search__all{display:block;text-align:center;padding:12px;font-weight:700;font-size:13px;color:#fff; background:linear-gradient(135deg,var(--pink),var(--pink-2));text-decoration:none;} .bl-search__all:hover{filter:brightness(1.07);} .bl-search__empty{padding:20px;text-align:center;color:var(--muted);font-size:13px;} .bl-search__input{flex:1;border:none;outline:none;padding:0 16px;font-size:13.5px;font-family:var(--font);color:#222;background:#fff;} .bl-search__cat{display:flex;align-items:center;border-left:1px solid #e7e7ee;background:#fff!important;min-width:150px;} /* force readable text — WooCommerce shop/archive pages style .postform / #product_cat which otherwise makes this select white-on-white (invisible) */ .bl-search__cat select, .bl-search__cat select.postform, .bl-search__cat select#product_cat{border:none!important;outline:none!important;background:#fff!important;color:#555!important; font-size:12px!important;font-weight:600!important;font-family:var(--font)!important;padding:0 12px!important;height:100%!important; width:100%;cursor:pointer;max-width:170px;min-width:140px;-webkit-appearance:menulist!important;appearance:menulist!important; margin:0!important;line-height:normal!important;text-indent:0!important;} .bl-search__cat select option{background:#fff!important;color:#333!important;} .bl-search__btn{width:52px;border:none;background:linear-gradient(135deg,var(--pink),var(--pink-2));display:flex;align-items:center;justify-content:center;cursor:pointer;} .bl-actions{display:flex;align-items:center;gap:20px;margin-left:auto;} .bl-account{display:flex;align-items:center;gap:9px;color:var(--ink);} .bl-account__txt{line-height:1.15;display:flex;flex-direction:column;} .bl-account__txt small{font-size:9px;color:var(--muted);font-weight:600;} .bl-account__txt b{font-size:12px;font-weight:700;color:var(--ink);} .bl-icon-btn{position:relative;color:var(--ink);display:inline-flex;} .bl-badge{position:absolute;top:-7px;right:-9px;background:var(--pink);color:#fff;font-size:9px;font-weight:800;min-width:15px;height:15px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 3px;} .bl-cart-total{font-size:13px;font-weight:800;color:var(--ink);margin-left:-9px;} .bl-cart-total .amount{color:var(--ink);} /* ---------- CATEGORY NAV (dark accent bar in both themes) ---------- */ .bl-nav{background:linear-gradient(90deg,#11091f,#0c0817);border-top:1px solid rgba(255,45,155,.18);border-bottom:1px solid rgba(255,255,255,.05);} .bl-nav__inner{display:flex!important;align-items:center!important;gap:8px;height:48px!important;min-height:48px;padding:0 20px!important;margin:0 auto!important;} /* browse button must fill the full nav height and align with the menu line. Forced because WooCommerce archive pages load button resets that strip the pink fill and shift the row up. */ .bl-nav .bl-nav__browse, button.bl-nav__browse{background:linear-gradient(135deg,var(--pink),#b3146f)!important;background-image:linear-gradient(135deg,var(--pink),#b3146f)!important;align-self:stretch!important;height:48px!important;min-height:48px!important;margin:0!important;display:inline-flex!important;align-items:center!important;justify-content:center;gap:10px;padding:0 20px!important;font-size:12.5px!important;font-weight:800!important;letter-spacing:.03em;color:#fff!important;border:none!important;border-radius:0!important;box-shadow:none!important;cursor:pointer;font-family:var(--font)!important;line-height:1!important;text-transform:none!important;} .bl-nav .bl-nav__browse:hover{filter:brightness(1.05);} .bl-nav__menu{margin-left:14px;display:flex;align-items:center;} .bl-menu{display:flex;align-items:center;gap:26px;list-style:none;margin:0;padding:0;font-size:12.5px;font-weight:700;letter-spacing:.03em;} .bl-menu li{position:relative;display:flex;align-items:center;} .bl-menu a{color:#d4cfe4;transition:.2s;text-transform:uppercase;line-height:1;display:inline-flex;align-items:center;} /* highlight the REAL active page (not always HOME) */ .bl-menu .current-menu-item>a, .bl-menu .current_page_item>a, .bl-menu .current-menu-ancestor>a, .bl-menu .current-menu-parent>a, .bl-menu .current-product_cat-ancestor>a, .bl-menu a:hover{color:var(--pink)!important;} /* HOME link is a custom link with .menu-item-home on EVERY page — only light it up on the actual front page, otherwise keep it neutral */ .bl-menu .menu-item-home>a{color:#d4cfe4;} .home.page .bl-menu .menu-item-home>a, .home.blog .bl-menu .menu-item-home>a, body.home .bl-menu .menu-item-home>a{color:var(--pink)!important;} [data-theme="light"] .bl-menu .menu-item-home>a{color:#e6e2f2;} [data-theme="light"] .home .bl-menu .menu-item-home>a{color:var(--pink)!important;} /* nav stays dark in BOTH themes — keep its own readable colors in light mode */ [data-theme="light"] .bl-nav{background:linear-gradient(90deg,#15102a,#0f0b22);} [data-theme="light"] .bl-menu a{color:#e6e2f2;} [data-theme="light"] .bl-nav__offer{color:#d8d2ea;} /* kill the browser text-selection highlight that looked like blue boxes */ .bl-nav ::selection,.bl-menu ::selection,.bl-nav__offer ::selection{background:rgba(255,45,155,.35);color:#fff;} .bl-menu .sub-menu{position:absolute;top:100%;left:0;min-width:200px;background:#0d0a1c;border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:8px 0;display:none;z-index:60;box-shadow:0 16px 40px rgba(0,0,0,.5);} .bl-menu li:hover>.sub-menu{display:block;} .bl-menu .sub-menu a{display:block;padding:8px 16px;font-size:12px;color:#c6c0da;text-transform:none;} .bl-menu .sub-menu a:hover{background:rgba(255,45,155,.09);color:#fff;} .bl-nav__offer{margin-left:auto;display:flex;align-items:center;gap:7px;font-size:11.5px;font-weight:800;letter-spacing:.05em;color:#cabfe0;} .bl-nav.is-stuck{position:fixed;top:0;left:0;right:0;z-index:90;box-shadow:0 8px 30px rgba(0,0,0,.5);animation:blDrop .3s ease;} @keyframes blDrop{from{transform:translateY(-100%);}to{transform:translateY(0);}} /* ---------- BODY GRID ---------- */ .bl-main-grid{display:flex;gap:18px;align-items:flex-start;padding-top:18px;} .bl-side{width:256px;flex-shrink:0;display:flex;flex-direction:column;gap:14px;} .bl-col{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px;} /* sidebar category card */ .bl-catbox{background:var(--sidebar-bg);border:1px solid var(--line);border-radius:12px;overflow:hidden;} .bl-catbox__head{background:linear-gradient(135deg,var(--pink),#b3146f);padding:12px 16px;display:flex;align-items:center;justify-content:space-between;font-size:12.5px;font-weight:800;letter-spacing:.03em;color:#fff;} .bl-catbox__head span{display:flex;align-items:center;gap:9px;} .bl-cat{display:flex;align-items:center;gap:11px;padding:9.5px 16px;border-bottom:1px solid var(--line);cursor:pointer;font-size:12px;font-weight:600;color:var(--muted-2);transition:.18s;} .bl-cat:hover{background:rgba(255,45,155,.09);color:var(--pink);} .bl-cat__ico{width:18px;height:18px;border-radius:5px;background:rgba(255,45,155,.13);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .bl-cat__name{flex:1;} /* sidebar promo */ .bl-promo{background:linear-gradient(135deg,#1c0f3a,#120a26);border:1px solid rgba(255,45,155,.25);border-radius:12px;padding:15px 16px;display:flex;align-items:center;gap:13px;} .bl-promo--alt{border-color:rgba(124,58,237,.3);} .bl-promo__t{font-family:var(--display);font-weight:800;font-size:16px;color:#fff;line-height:1.05;} .bl-promo__s{font-size:11px;color:#a89fc4;margin-top:3px;} .bl-promo__big{font-family:var(--display);font-weight:800;font-size:18px;color:var(--pink);margin-top:1px;} .bl-promo .hl{color:var(--pink);} /* "WE HAVE LARGEST EXPERIENCE CENTER" sidebar text block (replaces the 3 trust cards) */ .bl-exp{background:#0d0820;border:1px solid rgba(124,58,237,.28);border-radius:14px;padding:26px 18px 24px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;line-height:.96;} .bl-exp span{font-family:var(--display);font-weight:800;text-transform:uppercase;letter-spacing:.01em;display:block;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;} .bl-exp__l1{font-size:21px;letter-spacing:.06em;background-image:linear-gradient(95deg,#5b6dd6,#8a4bd0,#b0457f);} .bl-exp__l2{font-size:30px;background-image:linear-gradient(95deg,#5b8def,#7b5cf0,#c84fb0,#ff5bb0);} .bl-exp__l3{font-size:34px;letter-spacing:-.01em;background-image:linear-gradient(95deg,#f7e6a8,#f6c9a0,#f0a8c8,#e89ad8);} .bl-exp__l4{font-size:34px;background-image:linear-gradient(95deg,#f9e7b0,#f4b9c4,#e79ad8);} .bl-exp__sub{margin-top:12px;font-size:11px;font-weight:800;line-height:1.4;letter-spacing:.02em;background-image:linear-gradient(95deg,#ff6fb0,#f7a8c0,#f6c66a);} /* ---------- HERO ---------- */ .bl-hero{position:relative;border-radius:16px;overflow:hidden;min-height:300px;background:radial-gradient(120% 100% at 78% 30%,#3a1170 0%,#1a0838 40%,#0a0518 100%);border:1px solid rgba(255,45,155,.2);isolation:isolate;} .bl-hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(4,3,14,.95) 0%,rgba(7,5,20,.72) 38%,rgba(7,5,20,.18) 70%,rgba(7,5,20,.05) 100%);pointer-events:none;} .bl-hero__image{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.96;filter:saturate(1.35) brightness(1.18);} .bl-hero__glow{position:absolute;inset:0;z-index:2;background:radial-gradient(50% 60% at 80% 18%,rgba(255,45,155,.32),transparent 70%),radial-gradient(45% 55% at 60% 90%,rgba(124,58,237,.36),transparent 70%);pointer-events:none;mix-blend-mode:screen;} .bl-hero__inner{position:relative;z-index:3;padding:34px 38px;min-height:300px;display:flex;flex-direction:column;justify-content:center;max-width:62%;} .bl-hero__brand{font-family:var(--display);font-weight:800;font-size:15px;color:#fff;margin-bottom:8px;} .bl-hero__brand .hl{color:var(--pink);} .bl-hero__title{font-family:var(--display);font-weight:800;font-size:42px;line-height:.98;letter-spacing:-.01em;color:#fff;} .bl-hero__title .hl{color:var(--pink);} .bl-hero__sub{font-size:11.5px;line-height:1.7;color:#cabfe0;margin-top:16px;font-weight:500;} .bl-hero__art{position:absolute;right:30px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:14px;} .bl-hero__art-circle{width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(255,45,155,.4),transparent 65%);display:flex;align-items:center;justify-content:center;color:#fff;} .bl-hero__art-card{width:150px;height:185px;border-radius:18px;background:linear-gradient(160deg,#2a1458,#0e0622);border:1px solid rgba(168,85,247,.5);box-shadow:0 0 50px rgba(168,85,247,.45);display:flex;align-items:center;justify-content:center;} .bl-hero__cta{position:absolute;right:26px;bottom:18px;z-index:3;background:linear-gradient(135deg,var(--pink),var(--pink-2));padding:11px 22px;border-radius:30px;display:flex;align-items:center;gap:9px;font-size:12.5px;font-weight:800;color:#fff;cursor:pointer;box-shadow:0 6px 20px rgba(255,45,155,.4);transition:.2s;} .bl-hero__cta:hover{transform:translateY(-2px);} .bl-hero__cta span{width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;} .bl-hero__dots{position:absolute;left:38px;bottom:18px;z-index:3;display:flex;gap:6px;} .bl-hero__dots i{width:5px;height:5px;border-radius:3px;background:rgba(255,255,255,.3);} .bl-hero__dots i.on{width:18px;background:var(--pink);} /* ---------- FEATURE STRIP ---------- */ .bl-features{background:var(--strip-bg);border:1px solid var(--strip-border);border-radius:14px;padding:14px 18px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;} .bl-feature{flex:1;min-width:160px;display:flex;align-items:center;gap:11px;} .bl-feature__ico{width:34px;height:34px;border-radius:9px;background:rgba(255,45,155,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .bl-feature__t{font-size:11.5px;font-weight:800;color:var(--ink);letter-spacing:.02em;} .bl-feature__s{font-size:10px;color:var(--muted);margin-top:1px;} .bl-btn-pink{background:linear-gradient(135deg,var(--pink),var(--pink-2));padding:11px 24px;border-radius:30px;display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:#fff;cursor:pointer;border:none;font-family:var(--font);box-shadow:0 5px 16px rgba(255,45,155,.35);transition:.2s;} .bl-btn-pink:hover{transform:translateY(-2px);} /* ---------- PROMO CARDS ---------- */ .bl-promogrid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;} .bl-promocard{position:relative;border-radius:14px;overflow:hidden;min-height:128px;background:linear-gradient(135deg,#241152,#120a2c);border:1px solid rgba(124,58,237,.35);padding:16px 18px;cursor:pointer;transition:.2s;isolation:isolate;} .bl-promocard::after{content:"";position:absolute;inset:0;z-index:0;background-image:var(--promo-img,none);background-size:cover;background-position:center;opacity:.9;filter:saturate(1.45) brightness(1.22);transition:transform .35s ease,opacity .35s ease;} .bl-promocard::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(12,5,34,.98) 0%,rgba(13,6,38,.82) 42%,rgba(13,6,38,.28) 74%,rgba(13,6,38,.06) 100%);pointer-events:none;} .bl-promocard:hover{border-color:var(--pink);transform:translateY(-3px);} .bl-promocard:hover::after{transform:scale(1.04);opacity:1;} .bl-promocard__glow{position:absolute;right:-10px;bottom:-10px;z-index:1;width:120px;height:120px;background:radial-gradient(circle,rgba(168,85,247,.4),transparent 65%);} .bl-promocard__top{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;} .bl-promocard__t{font-family:var(--display);font-weight:800;font-size:16px;line-height:1.05;color:#fff;max-width:62%;} .bl-promocard__top>svg{opacity:.35;} .bl-promocard__s{position:relative;z-index:2;font-size:10.5px;color:#d9d3ee;margin-top:6px;line-height:1.4;max-width:58%;} .bl-promocard__btn{position:relative;z-index:2;margin-top:9px;display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,var(--pink),var(--pink-2));padding:5px 13px;border-radius:20px;font-size:10px;font-weight:800;color:#fff;} /* ---------- WHITE PANELS (carousels) ---------- */ .bl-panel{background:transparent;border-radius:16px;padding:18px 0 22px;} .bl-panel__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;position:relative;} .bl-panel__spacer{flex:1;} .bl-panel__title{font-family:var(--display);font-weight:700;font-size:19px;color:var(--ink);position:absolute;left:50%;transform:translateX(-50%);text-align:center;white-space:nowrap;} .bl-panel__viewall{font-size:12px;font-weight:700;color:var(--pink);cursor:pointer;} .bl-carousel{position:relative;} .bl-row{display:flex;gap:12px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;padding:2px;align-items:stretch;touch-action:pan-x pan-y;overscroll-behavior-x:contain;} .bl-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;} .bl-arrow--prev{left:-10px;background:#fff;border:1px solid #eceaf2;box-shadow:0 4px 14px rgba(20,10,40,.12);color:#15101f;} .bl-arrow--next{right:-10px;background:linear-gradient(135deg,var(--pink),var(--pink-2));box-shadow:0 4px 14px rgba(255,45,155,.35);color:#fff;} /* ---------- PRODUCT CARD (white) ---------- */ .bl-card{min-width:206px;width:206px;flex-shrink:0;background:#fff;border:1px solid #ececf2;border-radius:13px;padding:13px;position:relative;transition:.2s;display:flex;flex-direction:column;} .bl-card:hover{box-shadow:0 10px 26px rgba(124,58,237,.16);border-color:#e2d8f5;transform:translateY(-3px);} .bl-card__badge{position:absolute;top:11px;left:11px;background:linear-gradient(135deg,#6d28d9,#4c1d95);color:#fff;font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:6px;z-index:2;} .bl-card__wish{position:absolute;top:11px;right:11px;width:28px;height:28px;border-radius:50%;background:#f4f1fb;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;color:#9a8fc0;transition:.2s;} .bl-card__wish:hover,.bl-card__wish.is-active{color:#ff2d9b;background:#ffe3f1;} /* Brand logo under the single-product title */ .bl-single-brand{display:block;margin:4px 0 12px;} .bl-single-brand .yith-wcbr-brands{display:none;} /* logo only; brand name stays in the meta list */ .bl-single-brand .yith-wcbr-brands-logo{display:inline-block;} .bl-single-brand .yith-wcbr-brands-logo img{max-height:34px;width:auto;display:block;} /* add-to-compare icon (below the wishlist heart) */ .bl-card__compare{position:absolute;top:45px;right:11px;width:28px;height:28px;border-radius:50%;background:#f4f1fb;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:2;color:#9a8fc0;transition:.2s;} .bl-card__compare:hover,.bl-card__compare.added{color:#7c3aed;background:#ece4ff;} .bl-dcard .bl-card__compare{top:47px;right:11px;width:30px;height:30px;} .bl-card__media{height:128px;border-radius:11px;display:flex;align-items:center;justify-content:center;margin:8px 0 12px;background:radial-gradient(circle at 50% 45%,rgba(124,58,237,.1),transparent 70%);overflow:hidden;} .bl-card__media img{max-height:128px;width:auto;object-fit:contain;} .bl-card__brand{font-size:10.5px;color:#9a93ad;font-weight:600;} .bl-card__title{font-size:13px;font-weight:700;color:var(--card-ink);margin-top:2px;line-height:1.25;min-height:33px;} .bl-card__title a{color:var(--card-ink);} .bl-card__title a:hover{color:var(--pink);} .bl-card__price{display:flex;align-items:baseline;gap:7px;margin-top:5px;flex-wrap:wrap;} .bl-card__price del,.bl-card__price .bl-old{font-size:11px;color:#aeb0bd;text-decoration:line-through;} .bl-card__price ins,.bl-card__price .bl-now,.bl-card__price .amount{font-size:14px;font-weight:800;color:#e11d48;text-decoration:none;} .bl-card__price del .amount{color:#aeb0bd;font-weight:400;} .bl-card__rating{margin-top:6px;} .bl-stars{color:var(--gold);font-size:12px;letter-spacing:1px;} .bl-card__reviews{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:10.5px;color:#9a93ad;} .bl-card__add{margin-top:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff;border-radius:9px;padding:8px 10px;font-size:11.5px;font-weight:800;cursor:pointer;transition:.2s;border:none;font-family:var(--font);} .bl-card__add:hover{filter:brightness(1.06);color:#fff;} .bl-card__add.added{opacity:.85;} .bl-card__add.loading{opacity:.6;pointer-events:none;} /* ---------- BRANDS STRIP ---------- */ .bl-brands{background:var(--strip-bg);border:1px solid var(--strip-border);border-radius:14px;padding:16px 14px;display:flex;align-items:center;gap:8px;} .bl-brands__row{flex:1;display:flex;align-items:center;justify-content:space-around;gap:8px;flex-wrap:wrap;} .bl-brand{font-family:var(--display);font-weight:800;font-size:18px;color:var(--muted-2);opacity:.85;letter-spacing:.02em;cursor:pointer;transition:.2s;} .bl-brand:hover{opacity:1;color:var(--pink-soft);} .bl-brands__nav{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;border:none;} .bl-brands__nav--prev{background:var(--chip-bg);border:1px solid var(--line);color:var(--muted-2);} .bl-brands__nav--next{background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff;} /* ---------- BOTTOM FEATURES ---------- */ .bl-botfeat{background:var(--strip-bg);border:1px solid var(--strip-border);border-radius:14px;padding:20px 18px;display:flex;align-items:center;gap:14px;flex-wrap:wrap;} .bl-botfeat .bl-feature{justify-content:center;} .bl-botfeat .bl-feature__ico{width:42px;height:42px;border-radius:11px;} /* ---------- NEWSLETTER ---------- */ .bl-newsletter{background:linear-gradient(100deg,#1a0d38,#120a28);border:1px solid rgba(255,45,155,.2);border-radius:14px;padding:24px 30px;display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:16px;} .bl-newsletter__ico{width:58px;height:58px;border-radius:13px;background:radial-gradient(circle,rgba(255,45,155,.4),transparent 70%);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .bl-newsletter__txt{flex:1;min-width:230px;} .bl-newsletter__title{font-family:var(--display);font-weight:800;font-size:21px;color:#fff;} .bl-newsletter__sub{font-size:12.5px;color:#a89fc4;margin-top:3px;} .bl-newsletter__form{display:flex;align-items:center;background:#fff;border-radius:9px;overflow:hidden;height:48px;min-width:320px;flex:1;max-width:460px;} .bl-newsletter__form input{flex:1;border:none;outline:none;padding:0 18px;font-size:13px;font-family:var(--font);color:#222;} .bl-newsletter__form button{background:linear-gradient(135deg,var(--pink),var(--pink-2));height:100%;border:none;color:#fff;display:flex;align-items:center;padding:0 26px;font-size:12.5px;font-weight:800;cursor:pointer;font-family:var(--font);} /* ---------- FOOTER ---------- */ .bl-footer{margin-top:26px;background:var(--footer-bg);border-top:1px solid var(--line);} .bl-footer__cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr 1.2fr;gap:30px;padding:34px 20px 26px;} .bl-footer__about{font-size:12px;color:var(--muted);line-height:1.7;margin:16px 0 0;max-width:230px;} .bl-footer__social{display:flex;gap:9px;margin-top:18px;} .bl-footer__social a{width:30px;height:30px;border-radius:7px;background:var(--chip-bg);display:flex;align-items:center;justify-content:center;color:var(--ink);transition:.2s;} .bl-footer__social a:hover{background:var(--pink);color:#fff;} .footer-col-title,.bl-footer__col .widget-title{font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--ink);margin:0 0 15px;font-family:var(--font);text-transform:uppercase;} .bl-footer__links{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;} .bl-footer__links a,.bl-footer__col .widget a{font-size:12px;color:var(--muted);transition:.2s;} .bl-footer__links a:hover,.bl-footer__col .widget a:hover{color:var(--pink-soft);} .bl-footer__col .widget ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;} .bl-footer__contact{display:flex;flex-direction:column;gap:13px;} .bl-footer__contact>div{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--muted-2);} .bl-footer__contact--addr{align-items:flex-start!important;} .bl-footer__contact--addr svg{flex-shrink:0;margin-top:1px;} .bl-footer__bar{border-top:1px solid var(--line);} .bl-footer__bar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 20px;} .bl-footer__copy{font-size:11.5px;color:var(--muted);} .bl-pays{display:flex;align-items:center;gap:8px;flex-wrap:wrap;} .bl-pay{height:26px;padding:0 9px;background:#fff;border:1px solid var(--line);border-radius:5px;display:flex;align-items:center;font-family:var(--display);font-weight:800;font-size:10px;color:#1a1a2e;} /* ---------- FLOATING BUTTONS ---------- */ .bl-float{position:fixed;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;border:none;z-index:50;transition:.25s;} .bl-float--wa{left:20px;bottom:20px;background:#25d366;box-shadow:0 6px 20px rgba(37,211,102,.45);} .bl-float--top{right:20px;bottom:20px;width:42px;height:42px;background:linear-gradient(135deg,var(--pink),var(--pink-2));box-shadow:0 6px 20px rgba(255,45,155,.45);opacity:0;visibility:hidden;transform:translateY(12px);} .bl-float--top.is-visible{opacity:1;visibility:visible;transform:translateY(0);} .bl-float:hover{transform:scale(1.08);} .bl-float--top.is-visible:hover{transform:translateY(0) scale(1.08);} /* ---------- SCROLL-REVEAL ---------- */ .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);will-change:opacity,transform;} .reveal.is-in{opacity:1;transform:none;} .reveal[data-anim="left"]{transform:translateX(-30px);} .reveal[data-anim="right"]{transform:translateX(30px);} .reveal[data-anim="zoom"]{transform:scale(.94);} .reveal[data-anim="left"].is-in,.reveal[data-anim="right"].is-in,.reveal[data-anim="zoom"].is-in{transform:none;} @media (prefers-reduced-motion:reduce){.reveal{opacity:1!important;transform:none!important;}html{scroll-behavior:auto;}} /* ---------- MOBILE DRAWER ---------- */ .bl-overlay{position:fixed;inset:0;background:rgba(3,5,15,.62);z-index:120;opacity:0;visibility:hidden;transition:.25s;} .bl-overlay.is-open{opacity:1;visibility:visible;} .bl-drawer{position:fixed;top:0;left:0;height:100%;width:300px;max-width:84vw;background:var(--header-bg);border-right:1px solid var(--line);z-index:130;transform:translateX(-100%);transition:transform .3s cubic-bezier(.2,.7,.2,1);overflow-y:auto;padding-bottom:40px;} .bl-drawer.is-open{transform:translateX(0);box-shadow:24px 0 60px rgba(0,0,0,.4);} .bl-drawer__head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--header-bg);z-index:2;} .bl-drawer__head .bl-logo__text{font-size:22px;} .bl-drawer__close{background:none;border:none;color:var(--ink);cursor:pointer;} .bl-drawer__account{display:flex;align-items:center;gap:10px;padding:14px 18px;color:var(--ink);font-weight:700;font-size:13px;border-bottom:1px solid var(--line);} .bl-drawer__account:hover{color:var(--pink);} .bl-drawer__menu{list-style:none;margin:0;padding:6px 0;} .bl-drawer__menu li{border-bottom:1px solid var(--line);} .bl-drawer__menu a{display:block;padding:12px 18px;color:var(--muted-2);font-weight:700;font-size:13px;text-transform:uppercase;letter-spacing:.02em;} .bl-drawer__menu a:hover{color:var(--pink);background:rgba(255,45,155,.06);} .bl-drawer__menu .sub-menu{list-style:none;margin:0;padding:0;background:rgba(0,0,0,.06);} .bl-drawer__menu .sub-menu a{padding-left:34px;text-transform:none;font-weight:600;color:var(--muted);font-size:12.5px;} .bl-drawer__cats-title{padding:16px 18px 8px;font-size:11px;font-weight:800;letter-spacing:.08em;color:var(--pink);text-transform:uppercase;} .bl-drawer__cats{list-style:none;margin:0;padding:0 0 10px;} .bl-drawer__cats a{display:block;padding:9px 18px;color:var(--muted-2);font-size:12.5px;} .bl-drawer__cats a:hover{color:var(--pink);} body.bl-noscroll{overflow:hidden;} /* ===================================================================== INNER PAGES (banner, blog, single, woocommerce) ===================================================================== */ .bl-pagehero{position:relative;overflow:hidden;border-bottom:1px solid var(--line); background-image:linear-gradient(90deg,rgba(5,3,16,.96) 0%,rgba(9,8,34,.82) 48%,rgba(9,8,34,.28) 100%),url('../images/generated/page-banner.png'); background-size:cover; background-position:center; padding:30px 0 26px;margin-bottom:8px;} .bl-pagehero__title{font-family:var(--display);font-weight:800;font-size:30px;color:#fff;letter-spacing:.01em;} .bl-pagehero__sub{color:#cbb9e0;margin-top:6px;font-size:13.5px;} .bl-crumbs{font-size:12px;color:#b8aed0;margin-bottom:10px;display:flex;gap:7px;align-items:center;flex-wrap:wrap;} .bl-crumbs a{color:var(--pink-soft);} .bl-crumbs a:hover{color:#fff;} .bl-crumbs .sep{color:#9a93ad;} .bl-blog{display:flex;gap:24px;align-items:flex-start;padding:26px 20px;} .bl-blog__main{flex:1;min-width:0;} .bl-blog__side{width:300px;flex-shrink:0;} .bl-postgrid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;} .bl-post{background:var(--sidebar-bg);border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:.2s;} .bl-post:hover{border-color:rgba(255,45,155,.4);transform:translateY(-3px);} .bl-post__thumb img{width:100%;height:180px;object-fit:cover;} .bl-post__body{padding:16px 18px 20px;} .bl-post__meta{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;} .bl-post__title{font-size:18px;font-weight:700;margin:8px 0 10px;line-height:1.3;} .bl-post__title a{color:var(--ink);} .bl-post__title a:hover{color:var(--pink);} .bl-post__excerpt{font-size:13px;color:var(--muted-2);line-height:1.6;} .bl-post__more{display:inline-block;margin-top:14px;font-size:12px;font-weight:800;color:var(--pink);letter-spacing:.03em;} .bl-single{max-width:820px;margin:0 auto;padding:34px 20px;} .bl-single__title{font-family:var(--display);font-weight:800;font-size:34px;line-height:1.1;color:var(--ink);} .bl-single__meta{font-size:12px;color:var(--muted);margin:12px 0 22px;text-transform:uppercase;letter-spacing:.04em;} .bl-single__thumb{border-radius:14px;overflow:hidden;margin-bottom:24px;} .bl-content-area{color:var(--muted-2);font-size:15.5px;line-height:1.85;} .bl-content-area a{color:var(--pink-soft);text-decoration:underline;} .bl-content-area h2,.bl-content-area h3{color:var(--ink);margin:28px 0 12px;} .bl-content-area h2{font-family:var(--display);font-weight:800;font-size:22px;} .bl-content-area h3{font-family:var(--display);font-weight:800;font-size:18px;} .bl-content-area p{margin:0 0 16px;} .bl-content-area ul,.bl-content-area ol{margin:0 0 18px;padding-left:22px;} .bl-content-area ul{list-style:none;padding-left:4px;} .bl-content-area ul li{position:relative;padding:4px 0 4px 26px;} .bl-content-area ul li::before{content:"";position:absolute;left:4px;top:13px;width:8px;height:8px;border-radius:50%;background:linear-gradient(135deg,var(--pink),var(--pink-2,#a855f7));box-shadow:0 0 8px rgba(255,45,155,.5);} .bl-content-area ol li{padding:4px 0;} .bl-content-area img{border-radius:12px;margin:18px 0;} .bl-content-area blockquote{border-left:3px solid var(--pink);padding:6px 18px;margin:20px 0;color:var(--ink);background:rgba(255,45,155,.06);border-radius:0 10px 10px 0;} /* readable width + card for policy/legal pages */ .bl-single .bl-content-area{max-width:900px;} .pagination,.bl-postgrid+.navigation{margin:28px 0 0;} .pagination .nav-links,.navigation .nav-links{display:flex;gap:8px;flex-wrap:wrap;} .pagination a,.pagination span,.navigation .nav-links a,.navigation .nav-links span{padding:8px 14px;border-radius:8px;background:var(--sidebar-bg);border:1px solid var(--line);font-size:13px;font-weight:700;color:var(--muted-2);} .pagination .current,.navigation .nav-links .current{background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff;border-color:transparent;} .bl-sidebar .widget{background:var(--sidebar-bg);border:1px solid var(--line);border-radius:12px;padding:18px;margin-bottom:18px;} .bl-sidebar .widget-title{font-family:var(--display);font-weight:800;font-size:15px;color:var(--ink);margin:0 0 14px;} .bl-sidebar .widget ul{list-style:none;margin:0;padding:0;} .bl-sidebar .widget li{padding:7px 0;border-bottom:1px solid var(--line);font-size:13px;} .bl-sidebar .widget a{color:var(--muted-2);} .bl-sidebar .widget a:hover{color:var(--pink);} /* Brands dropdown (Perfect WC Brands .pwb-dropdown-widget) + any sidebar select: glass style to match the theme (was a plain white box) */ .bl-shop-side select,.bl-sidebar select,.pwb-dropdown-widget,.widget_brands_dropdown select{ display:block!important;width:100%!important;min-height:46px!important; -webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important; background-color:rgba(255,255,255,.05)!important; background-image:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.02)),url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23ff2d9b' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")!important; background-repeat:no-repeat,no-repeat!important;background-position:center,right 14px center!important;background-size:auto,13px!important; color:#fff!important;font-size:13.5px!important;font-weight:600!important;line-height:1.3!important; padding:12px 38px 12px 14px!important; border:1px solid rgba(168,85,247,.35)!important;border-radius:11px!important; box-shadow:0 8px 24px rgba(5,3,20,.4),inset 0 1px 0 rgba(255,255,255,.06)!important; -webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important; cursor:pointer!important;transition:border-color .2s ease,box-shadow .2s ease!important; } .bl-shop-side select:hover,.bl-sidebar select:hover,.pwb-dropdown-widget:hover{border-color:rgba(255,45,155,.6);} .bl-shop-side select:focus,.bl-sidebar select:focus,.pwb-dropdown-widget:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,45,155,.22),0 8px 24px rgba(5,3,20,.4);} .bl-shop-side select option,.bl-sidebar select option,.pwb-dropdown-widget option{color:#fff;background:#171228;} /* WooCommerce — white cards */ .bl-shop-layout{display:flex;gap:24px;align-items:flex-start;padding:26px 20px;} .bl-shop-layout .bl-shop-main{flex:1;min-width:0;} .bl-shop-layout .bl-shop-side{width:280px;flex-shrink:0;} /* Floating bubbles (theme WhatsApp + AI-support chat) get out of the way while the product's own action buttons / tab pills occupy the same bottom-of-viewport band — toggled by main.js section 13. Keyed off so it also covers .basw-root, which is injected later by the AI-support plugin and would miss any JS-set inline style. */ body.bl-floats-hidden .bl-float--wa, body.bl-floats-hidden .basw-root{opacity:0!important;pointer-events:none!important;} .bl-float--wa,.basw-root{transition:opacity .2s ease;} /* Mobile filter drawer — button/overlay/close hidden on desktop where the sidebar is already visible inline; see @980px below for the drawer. */ .bl-shop-filter-toggle{display:none;align-items:center;gap:8px;padding:10px 16px;border-radius:10px;border:1px solid var(--line);background:var(--chip-bg);color:var(--ink);font-weight:700;font-size:13px;cursor:pointer;} .bl-shop-filter-close{display:none;} .bl-shop-filter-overlay{display:none;} /* sorting dropdown — readable in dark mode (was white-on-white) */ .woocommerce .woocommerce-ordering select, .woocommerce-page .woocommerce-ordering select, .woocommerce select.orderby{background:var(--chip-bg)!important;color:var(--ink)!important; border:1px solid var(--line)!important;border-radius:10px!important;padding:10px 34px 10px 14px!important; font-size:13px!important;font-weight:600!important;font-family:var(--font)!important;cursor:pointer; -webkit-appearance:none;appearance:none; background-image:url("data:image/svg+xml;utf8,")!important; background-repeat:no-repeat!important;background-position:right 12px center!important;} .woocommerce .woocommerce-ordering select option, .woocommerce select.orderby option{background:#16122a;color:#fff;} [data-theme="light"] .woocommerce .woocommerce-ordering select option, [data-theme="light"] .woocommerce select.orderby option{background:#fff;color:#222;} /* SOLD OUT label for out-of-stock products (cards + WooCommerce loop) */ /* SOLD OUT sits TOP-LEFT, stacked UNDER the discount badge */ .bl-card__soldout{position:absolute;top:11px;left:11px;z-index:3; background:linear-gradient(135deg,#e11d48,#9f1239);color:#fff;font-size:9.5px;font-weight:800; letter-spacing:.04em;padding:4px 9px;border-radius:7px;box-shadow:0 4px 12px rgba(225,29,72,.45);text-transform:uppercase;} /* if a discount badge is present, push SOLD OUT below it */ .bl-card__badge ~ .bl-card__soldout{top:38px;} .bl-card.is-soldout .bl-card__media{opacity:.62;} /* WooCommerce loop out-of-stock cards: badge from the built-in .outofstock span */ .woocommerce ul.products li.product.outofstock, .woocommerce ul.products li.product.bl-loop-soldout{position:relative;} .woocommerce ul.products li.product.outofstock::before, .woocommerce ul.products li.product.bl-loop-soldout::before{content:"SOLD OUT";position:absolute;top:38px;left:11px;z-index:3; background:linear-gradient(135deg,#e11d48,#9f1239);color:#fff;font-size:9.5px;font-weight:800;letter-spacing:.04em; padding:4px 9px;border-radius:7px;box-shadow:0 4px 12px rgba(225,29,72,.45);} .woocommerce ul.products li.product.outofstock .woocommerce-LoopProduct-link img, .woocommerce ul.products li.product.outofstock a img, .woocommerce ul.products li.product.bl-loop-soldout a img{opacity:.6;} /* dark mobile dcard sold out */ .bl-dcard.is-soldout .bl-dcard__media,.bl-dmini.is-soldout .bl-dmini__media{opacity:.62;} .bl-dcard__soldout,.bl-dmini__soldout{position:absolute;top:10px;left:10px;z-index:3;background:linear-gradient(135deg,#e11d48,#9f1239);color:#fff;font-size:9px;font-weight:800;letter-spacing:.04em;padding:4px 8px;border-radius:7px;box-shadow:0 4px 12px rgba(225,29,72,.45);} .bl-dmini__badge ~ .bl-dmini__soldout,.bl-dcard__badge ~ .bl-dcard__soldout{top:36px;} .bl-dmini.is-soldout .bl-dmini__media,.bl-dcard.is-soldout .bl-dcard__media{opacity:.6;} /* single product page SOLD OUT badge */ .bl-single-soldout{display:inline-block;background:linear-gradient(135deg,#e11d48,#9f1239);color:#fff;font-size:12px;font-weight:800;letter-spacing:.05em;padding:6px 14px;border-radius:8px;margin:0 0 10px;box-shadow:0 5px 16px rgba(225,29,72,.4);text-transform:uppercase;} /* subcategory text TABS at top of a category archive ("All" default) */ .bl-subtabs{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 22px;} .bl-subtab{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;border-radius:999px; background:var(--chip-bg);border:1px solid var(--line);color:var(--muted-2); font-size:13px;font-weight:700;text-decoration:none;transition:.18s;white-space:nowrap;} .bl-subtab:hover{border-color:var(--pink);color:var(--ink);} .bl-subtab.is-active{background:linear-gradient(135deg,var(--pink),var(--pink-2));border-color:transparent;color:#fff;box-shadow:0 6px 16px rgba(255,45,155,.35);} .bl-subtab__count{font-size:11px;opacity:.7;font-weight:600;} .bl-subtab.is-active .bl-subtab__count{opacity:.85;} /* stock-status filter widget (On sale / In stock) */ .bl-stockfilter{margin:0 0 22px;} .bl-stockfilter .bl-widget__title,.bl-widget__title{font-family:var(--display);font-weight:800;font-size:15px;color:var(--ink);margin:0 0 12px;} .bl-stockfilter__form{display:flex;flex-direction:column;gap:10px;} .bl-checkrow{display:flex;align-items:center;gap:9px;font-size:13.5px;color:var(--muted-2);font-weight:600;cursor:pointer;} .bl-checkrow input[type=checkbox]{width:16px;height:16px;accent-color:var(--pink);cursor:pointer;} .bl-stockfilter__clear{font-size:12px;color:var(--pink);font-weight:700;text-decoration:none;margin-top:2px;} ul.products,.woocommerce ul.products{display:grid!important;grid-template-columns:repeat(4,1fr);gap:14px;margin:0;padding:0;list-style:none;} .woocommerce ul.products li.product{width:auto!important;margin:0!important;float:none!important;background:#fff;border:1px solid #ececf2;border-radius:13px;padding:13px;position:relative;text-align:left;transition:.2s;color:var(--card-ink);} .woocommerce ul.products li.product:hover{box-shadow:0 10px 26px rgba(124,58,237,.16);border-color:#e2d8f5;transform:translateY(-3px);} .woocommerce ul.products li.product a img{margin:0 auto 10px;background:radial-gradient(circle at 50% 45%,rgba(124,58,237,.08),transparent 70%);border-radius:10px;} .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:13px;font-weight:700;color:var(--card-ink);padding:4px 0;} .woocommerce ul.products li.product .price{color:#e11d48;font-weight:800;font-size:14px;} .woocommerce ul.products li.product .price del{color:#aeb0bd;font-weight:400;font-size:11px;} .woocommerce ul.products li.product .price ins{text-decoration:none;} .woocommerce ul.products li.product .star-rating{font-size:.9em;margin:6px 0;color:var(--gold);} .woocommerce span.onsale{background:linear-gradient(135deg,#6d28d9,#4c1d95);color:#fff;border-radius:6px;min-height:auto;min-width:auto;padding:3px 8px;font-size:11px;font-weight:800;top:10px;left:10px;margin:0;line-height:1.2;} .woocommerce a.button,.woocommerce button.button,.woocommerce .button,.woocommerce #respond input#submit,.woocommerce a.button.alt,.woocommerce button.button.alt{ background:linear-gradient(135deg,var(--pink),var(--pink-2))!important;color:#fff!important;border-radius:9px!important;font-weight:800!important;font-family:var(--font)!important;border:none!important;padding:.7em 1.2em!important;transition:.2s!important;text-transform:none; } .woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button:hover{filter:brightness(1.07);} .woocommerce .button.added::after{display:none;} .single-product .bl-shop-layout{display:block;} .woocommerce div.product{color:var(--muted-2);padding:26px 0;} .woocommerce div.product .product_title{font-family:var(--display);font-weight:800;color:var(--ink);font-size:30px;} .woocommerce div.product p.price,.woocommerce div.product span.price{color:#e11d48;font-weight:800;font-size:26px;} .woocommerce div.product p.price del{color:var(--muted);font-weight:400;font-size:18px;} .woocommerce div.product .woocommerce-product-details__short-description{color:var(--muted-2);} .woocommerce .woocommerce-tabs ul.tabs li{background:var(--sidebar-bg);border-color:var(--line);} .woocommerce .woocommerce-tabs ul.tabs li a{color:var(--muted-2);} .woocommerce div.product .woocommerce-tabs .panel{color:var(--muted-2);} .woocommerce #reviews #comments ol.commentlist li .comment-text{background:var(--sidebar-bg);border-color:var(--line);border-radius:12px;} .woocommerce .quantity .qty{background:#fff;border-radius:8px;border:1px solid #e4e0ee;color:#222;padding:8px;} .woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:var(--pink)!important;background:var(--sidebar-bg)!important;color:var(--ink)!important;border-radius:10px;} .woocommerce-message::before,.woocommerce-info::before{color:var(--pink)!important;} .woocommerce table.shop_table{background:var(--sidebar-bg);border-color:var(--line);border-radius:12px;color:var(--muted-2);} .woocommerce table.shop_table th{color:var(--ink);} .woocommerce-cart .cart-collaterals .cart_totals,.woocommerce form .form-row label{color:var(--muted-2);} .woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.select2-container--default .select2-selection--single{background:#fff;color:#222;border-radius:8px;border:1px solid #e4e0ee;} /* contact page */ .bl-contact{display:grid;grid-template-columns:1fr 1.3fr;gap:24px;padding:30px 20px;align-items:start;} .bl-contact__info{display:flex;flex-direction:column;gap:14px;} .bl-cinfo{display:flex;gap:14px;align-items:flex-start;background:var(--sidebar-bg);border:1px solid var(--line);border-radius:14px;padding:16px 18px;} .bl-cinfo__ico{width:40px;height:40px;border-radius:10px;background:rgba(255,45,155,.1);color:var(--pink);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .bl-cinfo b{display:block;color:var(--ink);font-size:13px;margin-bottom:3px;} .bl-cinfo a,.bl-cinfo span{color:var(--muted-2);font-size:13px;} .bl-cinfo a:hover{color:var(--pink);} .bl-cinfo__maplink{display:block;} .bl-cinfo__maphint{display:inline-block;margin-top:4px;color:var(--pink);font-weight:700;font-size:12px;white-space:nowrap;} /* Contact page map */ .bl-contact-map{padding:0 20px 36px;position:relative;} .bl-contact-map iframe{width:100%;border:1px solid var(--line);} .bl-contact-map__open{position:absolute;top:14px;right:34px;z-index:2;display:inline-flex;align-items:center;gap:7px;background:var(--header-bg,#0c0a1e);border:1px solid var(--line);color:var(--ink);font-size:12.5px;font-weight:700;padding:8px 13px;border-radius:10px;text-decoration:none;box-shadow:0 6px 18px rgba(4,3,16,.5);} .bl-contact-map__open:hover{border-color:var(--pink);color:var(--pink);} @media (max-width:600px){.bl-contact-map{padding:0 14px 28px;}.bl-contact-map iframe{height:280px;}.bl-contact-map__open{right:22px;}} .bl-contact__wa{justify-content:center;margin-top:4px;} .bl-contact__form{background:var(--sidebar-bg);border:1px solid var(--line);border-radius:16px;padding:24px;} .bl-contact__h{color:var(--ink);font-size:20px;margin-bottom:16px;font-family:var(--display);font-weight:800;} .bl-form{display:flex;flex-direction:column;gap:12px;} .bl-form__row{display:grid;grid-template-columns:1fr 1fr;gap:12px;} .bl-form input,.bl-form textarea{background:#fff;border:1px solid #e4e0ee;border-radius:10px;padding:12px 14px;color:#222;font-family:var(--font);font-size:13.5px;outline:none;width:100%;} .bl-form input:focus,.bl-form textarea:focus{border-color:var(--pink);} .bl-form button{align-self:flex-start;} .bl-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;} .bl-notice{padding:12px 16px;border-radius:10px;margin-bottom:14px;font-size:13px;} .bl-notice--ok{background:rgba(34,197,94,.12);border:1px solid rgba(34,197,94,.4);color:#4ade80;} .bl-notice--err{background:rgba(255,45,155,.12);border:1px solid rgba(255,45,155,.4);color:#ff9ec4;} /* 404 + search form */ .bl-404{text-align:center;padding:80px 20px;} .bl-404__code{font-family:var(--display);font-weight:800;font-size:90px;color:var(--pink);line-height:1;} .bl-404__msg{font-size:18px;color:var(--muted-2);margin:10px 0 24px;} .bl-searchform{display:flex;align-items:stretch;background:#fff;border-radius:8px;overflow:hidden;height:44px;max-width:420px;} .bl-searchform input{flex:1;border:none;outline:none;padding:0 16px;font-size:13.5px;font-family:var(--font);color:#222;} .bl-searchform button{width:50px;border:none;background:linear-gradient(135deg,var(--pink),var(--pink-2));display:flex;align-items:center;justify-content:center;cursor:pointer;} .widget .bl-searchform{max-width:none;} .bl-tags{margin-top:24px;display:flex;flex-wrap:wrap;gap:8px;} .bl-tags a{font-size:12px;padding:5px 12px;border-radius:20px;background:var(--sidebar-bg);border:1px solid var(--line);color:var(--muted-2);} .bl-tags a:hover{border-color:var(--pink);color:var(--pink);} .post-navigation{max-width:820px;margin:30px auto 0;padding:0 20px;} .post-navigation .nav-links{display:flex;justify-content:space-between;gap:16px;} .post-navigation a{color:var(--muted-2);font-size:13px;font-weight:700;} .post-navigation a:hover{color:var(--pink);} .bl-row--grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;} .bl-row--grid .bl-card{width:auto;min-width:0;} /* ===================================================================== RESPONSIVE ===================================================================== */ @media (max-width:1080px){ .bl-side{width:220px;} .bl-hero__inner{max-width:70%;} ul.products,.woocommerce ul.products,.bl-row--grid{grid-template-columns:repeat(3,1fr);} } @media (max-width:980px){ .bl-burger{display:inline-flex;align-items:center;} .bl-header__inner{flex-wrap:wrap;} .bl-search{order:3;flex-basis:100%;max-width:none;} .bl-menu{gap:18px;font-size:11.5px;} .bl-side{display:none;} .bl-promogrid{grid-template-columns:repeat(2,1fr);} .bl-hero__art{display:none;} .bl-hero__inner{max-width:100%;} .bl-hero__title{font-size:34px;} .bl-footer__cols{grid-template-columns:repeat(2,1fr);} .bl-postgrid{grid-template-columns:1fr;} .bl-blog{flex-direction:column;} .bl-blog__side{width:100%;} .bl-shop-layout{flex-direction:column;} /* The sidebar sits after ~50 products in the DOM, so on mobile it becomes a fixed slide-in drawer instead — reachable without scrolling past the whole product grid (see #bl-shop-filter-toggle in main.js). */ .bl-shop-filter-toggle{display:inline-flex;} .bl-shop-layout .bl-shop-side{ width:86%;max-width:340px; position:fixed;top:0;right:0;height:100%;z-index:10001; background:var(--header-bg); overflow-y:auto;padding:20px 18px 40px; box-shadow:-10px 0 30px rgba(0,0,0,.35); transform:translateX(100%);transition:transform .3s ease; } .bl-shop-layout .bl-shop-side.is-open{transform:translateX(0);} .bl-shop-filter-close{ display:block;margin:0 0 14px auto; width:36px;height:36px;border-radius:50%;border:1px solid var(--line); background:var(--chip-bg);color:var(--ink);font-size:20px;line-height:1;cursor:pointer; } .bl-shop-filter-overlay{ display:block;position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.5); opacity:0;pointer-events:none;transition:opacity .3s ease; } .bl-shop-filter-overlay.is-open{opacity:1;pointer-events:auto;} .bl-contact{grid-template-columns:1fr;} } @media (max-width:720px){ .bl-topbar__links,.bl-nav__menu,.bl-nav__offer{display:none;} .bl-actions{gap:14px;} .bl-account__txt,.bl-cart-total{display:none;} .bl-menu{display:none;} .bl-promogrid{grid-template-columns:1fr;} .bl-features,.bl-botfeat{justify-content:flex-start;} .bl-feature{min-width:130px;} .bl-newsletter{flex-direction:column;align-items:flex-start;} .bl-newsletter__form{min-width:0;width:100%;max-width:none;} ul.products,.woocommerce ul.products,.bl-row--grid{grid-template-columns:repeat(2,1fr);} .bl-footer__cols{grid-template-columns:1fr;gap:24px;} .bl-hero__title{font-size:27px;} .bl-panel__title{position:static;transform:none;} .bl-search__cat{display:none;} .bl-form__row{grid-template-columns:1fr;} } @media (max-width:420px){ ul.products,.woocommerce ul.products,.bl-row--grid{grid-template-columns:1fr;} } /* ===================================================================== MOBILE APP MODE (bottom tab bar, chips, sticky header) — <=768px only ===================================================================== */ .bl-chips{display:none;} .bl-bottomnav{display:none;} @media (max-width:768px){ /* keep the top of the app fixed like a native shell */ .bl-header{position:sticky;top:0;z-index:80;box-shadow:0 4px 18px rgba(0,0,0,.18);} .bl-header__inner{padding:12px 16px;gap:14px;} .bl-search{order:3;flex-basis:100%;max-width:none;margin-top:4px;} .bl-search__form{height:42px;border-radius:24px;} .bl-logo__text{font-size:23px;} /* category chips strip */ .bl-chips{display:flex;gap:8px;overflow-x:auto;padding:10px 14px;background:var(--header-bg);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:79;} .bl-chip{flex:0 0 auto;font-size:12px;font-weight:600;color:var(--muted-2);background:var(--chip-bg);border:1px solid var(--line);padding:7px 14px;border-radius:20px;white-space:nowrap;} .bl-chip:active,.bl-chip:hover{border-color:var(--pink);color:var(--pink);} /* the dark accent nav bar isn't needed in app mode */ .bl-nav{display:none;} /* room for the bottom bar + iOS safe area */ body.baloon-theme{padding-bottom:calc(62px + env(safe-area-inset-bottom));} /* bottom tab bar */ .bl-bottomnav{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:110;background:var(--header-bg);border-top:1px solid var(--line);padding:6px 2px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -8px 26px rgba(0,0,0,.28);} .bl-bottomnav__item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:9.5px;font-weight:700;letter-spacing:.01em;color:var(--muted);background:none;border:none;cursor:pointer;padding:5px 0;font-family:var(--font);text-transform:capitalize;transition:color .15s;} .bl-bottomnav__item.is-active,.bl-bottomnav__item:active{color:var(--pink);} .bl-bottomnav__item svg{display:block;} .bl-bottomnav__cartwrap{position:relative;display:inline-flex;} .bl-bottomnav__badge{position:absolute;top:-6px;left:14px;background:var(--pink);color:#fff;font-size:8px;font-weight:800;min-width:15px;height:15px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 3px;font-style:normal;box-shadow:0 0 0 2px var(--header-bg);} /* elevate the centre Cart tab like an app FAB */ .bl-bottomnav__item--cart .bl-bottomnav__cartwrap{width:48px;height:48px;margin-top:-22px;border-radius:50%;background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(255,45,155,.5);} .bl-bottomnav__item--cart{color:var(--ink);} .bl-bottomnav__item--cart .bl-bottomnav__badge{top:-2px;left:30px;box-shadow:0 0 0 2px #fff;} /* lift floating buttons above the bar */ .bl-float--wa{bottom:calc(78px + env(safe-area-inset-bottom));} .bl-float--top{bottom:calc(78px + env(safe-area-inset-bottom));} /* AI support chat bubble (baloon-ai-support plugin) ships its own fixed bottom:20px — that sits on/under the app bottom-nav bar and can cover in-page content (e.g. product tabs) since it's always visible, not scroll-triggered like .bl-float--top. Lift it the same amount. */ .basw-root{bottom:calc(78px + env(safe-area-inset-bottom))!important;} } /* ===================================================================== HEADER EXTRAS (wishlist/compare, mic, popular label, tagline variants) ===================================================================== */ .bl-search__mic{display:none;} .bl-logo__tag .tag-m{display:none;} .bl-chips__label{flex:0 0 auto;font-size:12.5px;font-weight:800;color:var(--pink);align-self:center;} .bl-wish-count,.bl-compare-count{background:var(--purple);} @media (max-width:980px){ .bl-hide-mobile{display:none;} } @media (max-width:768px){ .bl-search__mic{display:inline-flex;align-items:center;background:none;border:none;color:var(--muted);padding:0 8px;cursor:pointer;} .bl-logo__tag .tag-d{display:none;} .bl-logo__tag .tag-m{display:inline;} } /* ===================================================================== MOBILE "APP" HOMEPAGE (navy) — shown only <=768px ===================================================================== */ .bl-home-mobile{display:none;} @media (max-width:768px){ .bl-home-desktop{display:none;} .bl-home-mobile{display:block;padding-top:14px;} /* gradient page background: dark at top -> blue shade at bottom */ html[data-theme="dark"] body.baloon-theme{background:linear-gradient(180deg,#06060f 0%,#0a1226 52%,#0d1c40 100%);background-attachment:fixed;} } /* hero */ .bl-mhero{position:relative;overflow:hidden;border-radius:18px; background:radial-gradient(60% 90% at 82% 35%,rgba(59,130,246,.35),transparent 60%),radial-gradient(50% 80% at 92% 75%,rgba(255,45,155,.3),transparent 60%),linear-gradient(120deg,#1a1140,#0d0b2a 55%,#0a0820); border:1px solid rgba(168,85,247,.3);padding:26px 22px;isolation:isolate;} .bl-mhero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,6,26,.92) 0%,rgba(8,6,26,.62) 58%,rgba(8,6,26,.16) 100%);pointer-events:none;} .bl-mhero__image{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:62% center;opacity:.72;filter:saturate(1.45) brightness(1.12);} .bl-mhero__stars{position:absolute;inset:0;z-index:2;background-image:radial-gradient(1.5px 1.5px at 20% 30%,rgba(255,255,255,.6),transparent),radial-gradient(1.5px 1.5px at 75% 20%,rgba(255,255,255,.4),transparent),radial-gradient(1px 1px at 50% 70%,rgba(45,212,255,.6),transparent);opacity:.7;pointer-events:none;} .bl-mhero__in{position:relative;z-index:3;} .bl-mhero__kicker{font-family:var(--display);font-weight:800;color:var(--pink);font-size:14px;letter-spacing:.04em;} .bl-mhero__sale{display:flex;align-items:baseline;gap:8px;margin:2px 0 4px;font-family:var(--display);font-weight:800;line-height:.95;} .bl-mhero__sale .up{font-size:18px;color:#fff;} .bl-mhero__sale .big{font-size:56px;background:linear-gradient(135deg,#ff2d9b,#ffb020);-webkit-background-clip:text;background-clip:text;color:transparent;} .bl-mhero__sale .off{font-size:20px;color:#fff;} .bl-mhero__lead{font-family:var(--display);font-weight:800;font-size:22px;color:#fff;} .bl-mhero__list{font-size:12px;line-height:1.85;color:#cdd3ee;margin-top:8px;} .bl-mhero__cta{margin-top:15px;display:inline-flex;align-items:center;gap:9px;background:linear-gradient(135deg,var(--pink),var(--pink-2));padding:11px 22px;border-radius:30px;font-size:12.5px;font-weight:800;color:#fff;box-shadow:0 8px 22px rgba(255,45,155,.45);} .bl-mhero__cta span{width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;} .bl-mhero__dots{position:relative;z-index:3;display:flex;gap:6px;margin-top:14px;} .bl-mhero__dots i{width:6px;height:6px;border-radius:4px;background:rgba(255,255,255,.3);} .bl-mhero__dots i.on{width:20px;background:var(--pink);} /* section shell */ .bl-msec{margin-top:24px;} .bl-msec__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:12px;} .bl-msec__title{display:flex;align-items:center;gap:8px;font-family:var(--display);font-weight:800;font-size:16px;color:#fff;text-transform:uppercase;letter-spacing:.02em;} .bl-msec__title .ico{color:#2dd4ff;display:flex;} .bl-msec__all{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:700;color:#2dd4ff;white-space:nowrap;} /* category icon grid (big icons) */ .bl-mgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;} .bl-mtile{position:relative;overflow:hidden;isolation:isolate;background:linear-gradient(160deg,#10183c,#0b1024);border:1px solid rgba(120,140,220,.16);border-radius:15px;min-height:112px;padding:15px 6px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;} .bl-mtile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,14,36,.18),rgba(10,14,36,.92));} .bl-mtile__art{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;opacity:.62;filter:saturate(1.55) brightness(1.12);transition:transform .3s ease,opacity .3s ease;} .bl-mtile:hover .bl-mtile__art{transform:scale(1.06);opacity:.78;} .bl-mtile__ico{width:50px;height:50px;border-radius:16px;background:rgba(5,8,24,.58);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:#2dd4ff;backdrop-filter:blur(5px);} .bl-mtile__ico svg{width:32px;height:32px;} .bl-mtile__ico.c1{color:var(--pink);} .bl-mtile__ico.c2{color:#a855f7;} .bl-mtile__ico.c3{color:#22e3c0;} .bl-mtile__label{position:relative;font-size:10px;font-weight:800;color:#fff;line-height:1.15;text-shadow:0 1px 8px rgba(0,0,0,.8);} /* ---- MOBILE neon category grid (dark tile + glowing neon icon + label) ---- */ .bl-catsec--mobile{display:none;} .bl-neongrid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;} .bl-neontile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center; min-height:104px;padding:14px 6px;border-radius:16px; background:linear-gradient(165deg,rgba(30,22,60,.55),rgba(10,12,30,.85)); border:1px solid rgba(130,110,230,.28);position:relative;overflow:hidden;transition:.2s;} .bl-neontile::before{content:"";position:absolute;inset:0;border-radius:16px;padding:1px; background:linear-gradient(140deg,rgba(168,85,247,.55),rgba(34,227,192,.18),rgba(255,45,155,.4)); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:.7;} .bl-neontile:active,.bl-neontile:hover{transform:translateY(-2px);border-color:rgba(168,85,247,.6);box-shadow:0 8px 26px rgba(120,60,220,.3);} .bl-neontile__ico{width:52px;height:52px;border-radius:15px;display:flex;align-items:center;justify-content:center; background:rgba(8,8,26,.5);border:1px solid rgba(255,255,255,.07);} .bl-neontile__ico svg{width:30px;height:30px;filter:drop-shadow(0 0 6px currentColor);} .bl-neontile__ico.c1{color:#c084fc;} .bl-neontile__ico.c2{color:#38bdf8;} .bl-neontile__ico.c3{color:#2dd4bf;} .bl-neontile__label{font-size:10.5px;font-weight:700;color:#e8e4f5;line-height:1.2;} /* countdown */ .bl-countdown{display:flex;align-items:center;gap:4px;} .bl-cd{background:linear-gradient(135deg,var(--pink),var(--pink-2));border-radius:6px;min-width:34px;padding:4px 3px;text-align:center;line-height:1;} .bl-cd b{font-family:var(--display);font-weight:800;font-size:15px;color:#fff;display:block;} .bl-cd small{font-size:7px;letter-spacing:.05em;color:rgba(255,255,255,.85);font-weight:700;} .bl-cd-sep{color:var(--pink);font-weight:800;} /* dark cards rows */ .bl-drow{display:flex;gap:12px;overflow-x:auto;scroll-behavior:smooth;padding:2px;scrollbar-width:none;} .bl-drow::-webkit-scrollbar{display:none;} .bl-dgrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;} /* full mobile card — WHITE, button row pinned to bottom (same position on all) */ .bl-dcard{min-width:200px;width:200px;flex-shrink:0;background:#fff;border:1px solid #ececf2;border-radius:16px;padding:13px;position:relative;display:flex;flex-direction:column;} .bl-dgrid .bl-dcard{min-width:0;width:auto;} .bl-dcard__badge{position:absolute;top:11px;left:11px;background:linear-gradient(135deg,#6d28d9,#4c1d95);color:#fff;font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:7px;z-index:2;} .bl-dcard__wish{position:absolute;top:9px;right:9px;z-index:2;} .bl-dcard__wish .bl-card__wish{background:#f4f1fb;color:#9a8fc0;} .bl-dcard__wish .yith-wcwl-add-to-wishlist{margin:0;font-size:0;} .bl-dcard__wish .yith-wcwl-add-to-wishlist a{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#f4f1fb;color:#ff2d9b;} .bl-dcard__media{height:120px;display:flex;align-items:center;justify-content:center;margin:6px 0 10px;background:radial-gradient(circle at 50% 40%,rgba(124,58,237,.08),transparent 70%);border-radius:11px;overflow:hidden;} .bl-dcard__media img{max-height:120px;width:auto;object-fit:contain;} .bl-dgrid .bl-dcard__media{width:100%;} .bl-dcard__brand{font-size:10px;color:#9a93ad;font-weight:600;text-transform:uppercase;letter-spacing:.04em;} .bl-dcard__title{font-size:12.5px;font-weight:700;color:var(--card-ink,#15101f);margin-top:3px;line-height:1.25;min-height:32px;height:32px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} .bl-dcard__title a{color:var(--card-ink,#15101f);} .bl-dcard__specs{font-size:10.5px;color:#9a93ad;margin-top:2px;} .bl-dcard__price{display:flex;align-items:baseline;gap:7px;margin-top:6px;flex-wrap:wrap;} .bl-dcard__price del,.bl-dcard__price del .amount{font-size:11px;color:#aeb0bd;text-decoration:line-through;} .bl-dcard__price .bl-now,.bl-dcard__price .bl-now .amount{font-size:15px;font-weight:800;color:#e11d48;} .bl-dcard__inst{font-size:10px;color:#ff2d9b;font-weight:700;margin-top:4px;border-top:1px dashed rgba(255,45,155,.3);padding-top:5px;display:inline-block;} .bl-dcard__rating{margin-top:6px;display:flex;align-items:center;gap:6px;} .bl-dcard__rc{font-size:10.5px;color:#9a93ad;} .bl-dcard__free{font-size:10.5px;color:#16a34a;font-weight:700;display:inline-flex;align-items:center;gap:4px;} .bl-dcard .bl-free,.bl-free{font-size:10.5px;color:#16a34a;font-weight:700;display:inline-flex;align-items:center;gap:5px;line-height:1.2;} .bl-dcard__body{display:flex;flex-direction:column;flex:1;} .bl-dcard__foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto!important;padding-top:9px;} /* deal cards (no FREE DELIVERY text): hide the empty spacer + center the button */ .bl-dcard__foot>span:empty{display:none;} .bl-dcard__foot:has(>span:empty){justify-content:center;} .bl-dcard__add{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff!important;border-radius:10px;width:38px;height:38px;border:none;cursor:pointer;flex-shrink:0;box-shadow:0 5px 14px rgba(255,45,155,.4);} /* Desktop: full "Add to cart" pill; mobile keeps the icon-only square */ .bl-dcard__add-txt{display:none;} @media (min-width:769px){ .bl-dcard__add{width:auto;padding:0 14px;gap:7px;font-size:12px;font-weight:800;letter-spacing:.02em;text-decoration:none;} .bl-dcard__add-txt{display:inline;white-space:nowrap;} } /* mobile product card — WHITE, flex column, button pinned to bottom */ .bl-dmini{min-width:158px;width:158px;flex-shrink:0;background:#fff;border:1px solid #ececf2;border-radius:14px;padding:11px;position:relative;text-align:left;display:flex;flex-direction:column;} .bl-dmini__badge{position:absolute;top:8px;left:8px;background:linear-gradient(135deg,#6d28d9,#4c1d95);color:#fff;font-size:8.5px;font-weight:800;padding:3px 7px;border-radius:6px;z-index:2;} .bl-dmini__media{height:104px;display:flex;align-items:center;justify-content:center;margin:4px 0 8px;background:radial-gradient(circle at 50% 40%,rgba(124,58,237,.08),transparent 70%);border-radius:10px;overflow:hidden;} .bl-dmini__media img{max-height:104px;width:auto;object-fit:contain;} .bl-dmini__title{font-size:11.5px;font-weight:700;color:var(--card-ink,#15101f);line-height:1.25;min-height:30px;height:30px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} .bl-dmini__title a{color:var(--card-ink,#15101f);} .bl-dmini__price{font-size:14px;font-weight:800;color:#e11d48;margin-top:4px;} .bl-dmini__price .amount{color:#e11d48;} .bl-dmini__add{margin-top:auto!important;display:inline-flex;align-items:center;justify-content:center;gap:6px;background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff!important;border-radius:9px;padding:8px 10px;font-size:11px;font-weight:800;cursor:pointer;border:none;text-decoration:none;margin-top:10px;flex-shrink:0;transition:.2s;} .bl-dmini__add:hover{filter:brightness(1.06);color:#fff!important;} .bl-dmini__add.added{opacity:.85;}.bl-dmini__add.loading{opacity:.6;pointer-events:none;} /* mobile carousel rows — horizontal scroll ONLY */ .bl-drow{align-items:stretch;overflow-y:hidden;touch-action:pan-x pan-y;overscroll-behavior-x:contain;} /* brand tiles — horizontal scroll row (show all brands, swipe left/right) */ .bl-bgrid{display:flex!important;gap:10px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x pan-y;overscroll-behavior-x:contain;padding:2px;grid-template-columns:none!important;} .bl-bgrid::-webkit-scrollbar{display:none;} .bl-btile{flex:0 0 auto;min-width:110px;background:#fff;border:1px solid #ececf2;border-radius:12px;height:62px;padding:0 16px;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;font-size:14px;color:#15101f;white-space:nowrap;} .bl-btile--logo{min-width:118px;padding:8px 14px;} .bl-btile--logo img{max-height:38px;max-width:90px;width:auto;object-fit:contain;} /* video + banner */ .bl-video,.bl-video.reveal{opacity:1!important;transform:none!important;display:block!important;} .bl-video__frame{position:relative;width:100%;aspect-ratio:16/9;min-height:240px;border-radius:16px;overflow:hidden;background:#0b1126;border:1px solid rgba(120,140,220,.16);display:block;} .bl-video__frame iframe,.bl-video__frame video{position:absolute;inset:0;width:100%!important;height:100%!important;border:0;object-fit:cover;display:block;background:#0b1126;} /* background-style video: no controls, no interaction (plays muted+loop) */ .bl-video__frame video{pointer-events:none;} .bl-video__frame video::-webkit-media-controls, .bl-video__frame video::-webkit-media-controls-enclosure, .bl-video__frame video::-webkit-media-controls-panel{display:none!important;-webkit-appearance:none!important;} .bl-banner img{width:100%;border-radius:16px;display:block;border:1px solid rgba(168,85,247,.28);box-shadow:0 12px 34px rgba(7,5,24,.35);} /* KOKO background video banner — autoplay/muted/loop, no controls, fills the rounded box */ .bl-banner--video{border-radius:16px;overflow:hidden;} .bl-banner__video{width:100%;height:auto;display:block;border-radius:16px;border:1px solid rgba(168,85,247,.28);box-shadow:0 12px 34px rgba(7,5,24,.35);object-fit:cover;pointer-events:none;background:#0a0518;} .bl-banner__video::-webkit-media-controls{display:none!important;} .bl-banner--video .bl-banner__a{display:block;pointer-events:auto;} .bl-banner__ph{border-radius:16px;padding:24px 20px;text-align:center;border:1px solid rgba(168,85,247,.35); background:radial-gradient(60% 110% at 82% 25%,rgba(168,85,247,.45),transparent 60%),linear-gradient(120deg,#1a1140,#0d0b2a);} .bl-banner__big{font-family:var(--display);font-weight:800;font-size:42px;letter-spacing:.05em;background:linear-gradient(135deg,#ff5ea6,#a855f7);-webkit-background-clip:text;background-clip:text;color:transparent;} .bl-banner__t{font-family:var(--display);font-weight:800;font-size:18px;color:#fff;margin-top:2px;} .bl-banner__s{font-size:11.5px;color:#cdd3ee;margin-top:6px;} /* ===================================================================== REAL BANNER IMAGES (desktop hero, mobile hero, KOKO) + photo promo cards ===================================================================== */ /* desktop hero = full clickable banner image (text is baked into the art) */ .bl-hero--banner{display:block;min-height:0;aspect-ratio:1600/665;overflow:hidden;padding:0;} .bl-hero--banner .bl-hero__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1;filter:none;} /* mobile hero = full clickable Summer-Sale banner image */ .bl-mhero--banner{display:block;position:relative;padding:0;min-height:0;aspect-ratio:1120/920;overflow:hidden;background:none;border:1px solid rgba(168,85,247,.3);border-radius:18px;} .bl-mhero--banner .bl-mhero__image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1;filter:none;} /* promo cards: real product photo on the right, dark gradient keeps left text readable */ .bl-promocard::after{ z-index:1; background-image:linear-gradient(90deg,#1d1147 0%,rgba(29,17,71,.52) 46%,rgba(29,17,71,0) 78%),var(--promo-img,none); background-size:100% 100%,auto 138%; background-position:center,right center; background-repeat:no-repeat,no-repeat; opacity:1;filter:saturate(1.15) brightness(1.04); } .bl-promocard:hover::after{transform:none;background-size:100% 100%,auto 146%;} .bl-promocard__top,.bl-promocard__s,.bl-promocard__btn,.bl-promocard__glow{position:relative;z-index:2;} /* KOKO banner reused on desktop home — show the FULL banner (no crop) */ .bl-home-desktop .bl-banner{margin-top:16px;} .bl-home-desktop .bl-banner img{max-height:none;height:auto;width:100%;object-fit:contain;} .bl-home-desktop .bl-banner__video{max-height:none;height:auto;width:100%;object-fit:cover;} /* ===================================================================== FIXES: hero always-visible, uniform card height, KOKO on cards ===================================================================== */ /* hero banners must always be fully visible (don't depend on scroll-reveal) */ .bl-hero--banner,.bl-hero--banner.reveal,.bl-mhero--banner,.bl-mhero--banner.reveal{opacity:1!important;transform:none!important;} .bl-hero--banner .bl-hero__image,.bl-mhero--banner .bl-mhero__image{opacity:1!important;filter:none!important;} /* kill the dark left gradient overlay — the banner already has its own text baked in */ .bl-hero--banner::after,.bl-hero--banner::before,.bl-mhero--banner::after,.bl-mhero--banner::before{display:none!important;content:none!important;} .bl-mhero--banner .bl-mhero__stars{display:none!important;} /* uniform product cards: equal height, title clamped, button pinned to bottom in ONE line regardless of varying price/KOKO/review content above it */ .bl-row{align-items:stretch;} .bl-row--grid,ul.products,.woocommerce ul.products{align-items:stretch;} .bl-card{display:flex;flex-direction:column;height:auto;} .bl-card__title{min-height:34px;height:34px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} .bl-card__add{margin-top:auto!important;flex-shrink:0;} /* KOKO "Buy Now Pay Later" line on product cards */ .bl-card__koko{margin-top:4px;font-size:10.5px;color:#7c3aed;font-weight:600;display:flex;align-items:center;gap:5px;flex-wrap:wrap;line-height:1.2;} .bl-card__koko .bl-now{font-size:10.5px;color:#7c3aed;} .bl-koko-badge{background:linear-gradient(135deg,#ff2d9b,#a855f7);color:#fff;font-weight:800;font-size:9px;letter-spacing:.04em;padding:2px 6px;border-radius:5px;} /* real brand logos shown in white chips on the dark brand strip */ .bl-brand--logo{background:#fff;border-radius:10px;padding:8px 18px;min-width:104px;height:56px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s ease,box-shadow .2s ease;} .bl-brand--logo:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.28);} .bl-brand--logo img{max-height:36px;max-width:128px;width:auto;height:auto;object-fit:contain;} @media (max-width:768px){.bl-brand--logo{min-width:88px;height:48px;padding:7px 14px;}.bl-brand--logo img{max-height:30px;max-width:100px;}} /* footer payment-methods logo strip — compact white pill */ /* ===================================================================== Neon pink buttons + force WhatsApp (Creame plugin) green ===================================================================== */ .bl-btn-pink, .woocommerce a.button,.woocommerce button.button,.woocommerce .button, .woocommerce a.button.alt,.woocommerce button.button.alt,.woocommerce input.button, .woocommerce #respond input#submit, .bl-card__add,.bl-btn-pink2,.woocommerce-cart .button,.woocommerce-checkout #place_order{ box-shadow:0 0 0 1px rgba(255,90,180,.35),0 6px 18px rgba(255,45,155,.45),0 0 22px rgba(255,45,155,.55)!important; transition:box-shadow .25s ease,transform .2s ease,filter .2s ease; } .bl-btn-pink:hover, .woocommerce a.button:hover,.woocommerce button.button:hover,.woocommerce .button:hover, .bl-card__add:hover,.woocommerce-checkout #place_order:hover{ box-shadow:0 0 0 1px rgba(255,120,200,.6),0 8px 24px rgba(255,45,155,.6),0 0 34px rgba(255,45,155,.85)!important; filter:brightness(1.08);transform:translateY(-2px); } /* single-product main add-to-cart: extra neon */ .single-product .single_add_to_cart_button.button{ background:linear-gradient(135deg,#ff2d9b,#a21570)!important; box-shadow:0 0 0 1px rgba(255,90,180,.5),0 8px 26px rgba(255,45,155,.55),0 0 38px rgba(255,45,155,.85)!important; } /* WhatsApp floating button (Creame "Join.chat") must be GREEN, not pink */ .joinchat__button,.joinchat .joinchat__button,#joinchat .joinchat__button, .joinchat__button__open,.joinchat__button__sendtext{background:#25d366!important;} .joinchat__button:hover{background:#1fb855!important;} .joinchat__button__image,.joinchat__button svg,.joinchat__button img{color:#fff!important;fill:#fff!important;} .joinchat__tooltip{background:#25d366!important;} .bl-pays{display:flex!important;align-items:center;justify-content:flex-end;flex-wrap:nowrap!important;} .bl-footer__bar .bl-pays__pill{display:inline-flex!important;align-items:center;width:auto!important;max-width:max-content;background:#fff;border-radius:12px;padding:6px 12px;box-shadow:0 4px 14px rgba(0,0,0,.22);flex:0 0 auto;} body.baloon-theme .bl-footer__bar .bl-pays__img{height:22px!important;width:auto!important;max-width:none!important;object-fit:contain;display:block;} @media (max-width:768px){ .bl-footer__bar-inner{flex-direction:column;gap:12px;} .bl-pays{justify-content:center;} .bl-footer__bar .bl-pays__pill{padding:5px 10px;} body.baloon-theme .bl-footer__bar .bl-pays__img{height:18px!important;} } /* ===================================================================== FIXES v2: smaller bordered brand chips, single WhatsApp, mobile scroll ===================================================================== */ /* use our own floating WhatsApp (inline SVG, always renders) and hide the Creame/joinchat plugin button whose CSS-background icon gets stripped by PageSpeed */ .bl-float--wa{display:flex!important;} .bl-float--wa svg{width:26px;height:26px;display:block;} .joinchat,.joinchat__button{display:none!important;} /* smaller, bordered brand-logo chips */ .bl-brand--logo{min-width:82px;height:46px;padding:6px 12px;background:#fff;border:1px solid rgba(0,0,0,.10);border-radius:9px;} .bl-brand--logo img{max-height:26px;max-width:90px;} @media (max-width:768px){.bl-brand--logo{min-width:70px;height:40px;padding:5px 9px;}.bl-brand--logo img{max-height:22px;max-width:72px;}} /* mobile: kill horizontal page drift + category grid becomes a 2-row horizontal scroller */ @media (max-width:768px){ html,body.baloon-theme{overflow-x:clip;max-width:100%;} .bl-home-mobile,.bl-wrap{overflow-x:clip;} /* category groups: a clean 3-across grid (so a group of 6 = 2 tidy rows), no horizontal scroll */ .bl-mgrid{display:grid;grid-template-columns:repeat(3,1fr)!important;grid-auto-flow:row!important;gap:10px;overflow:visible!important;} .bl-mgrid .bl-mtile{min-height:96px;width:auto;min-width:0;scroll-snap-align:none;} .bl-mgrid .bl-mtile__ico{width:42px;height:42px;} .bl-mgrid .bl-mtile__ico svg{width:26px;height:26px;} .bl-mgrid .bl-mtile__label{font-size:10.5px;line-height:1.15;} } /* desktop: groups of 6 render as one row of 6 */ .bl-mgrid--group{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;} @media (max-width:768px){.bl-mgrid--group{grid-template-columns:repeat(3,1fr);}} /* category section: banner tiles on desktop, neon icon grid on mobile */ @media (max-width:768px){ .bl-catsec--desktop{display:none!important;} .bl-catsec--mobile{display:block!important;} .bl-neongrid{grid-template-columns:repeat(4,1fr);gap:10px;} /* MOBILE: show the category banner photo tiles, 2 per row (like the web look) */ .bl-mcatbanners{display:block!important;} /* ALL category banner groups (first 6 AND next 8): ALTERNATING widths wide|narrow, narrow|wide (~58/42) like the reference. Wide tiles keep 1.94:1 + set row height; narrow tiles stretch. background-position:left keeps each banner's text visible. */ .bl-home-mobile .bl-mcatbanners .bl-mgrid--group{display:flex!important;flex-wrap:wrap!important;gap:12px!important;align-items:stretch!important;grid-template-columns:none!important;} .bl-home-mobile .bl-mcatbanners .bl-mgrid--group>.bl-mtile--banner{width:auto!important;min-height:0!important;height:auto!important;} .bl-home-mobile .bl-mcatbanners .bl-mgrid--group>.bl-mtile--banner:nth-child(4n+1), .bl-home-mobile .bl-mcatbanners .bl-mgrid--group>.bl-mtile--banner:nth-child(4n){flex:0 0 calc(58% - 6px)!important;aspect-ratio:900/463!important;} .bl-home-mobile .bl-mcatbanners .bl-mgrid--group>.bl-mtile--banner:nth-child(4n+2), .bl-home-mobile .bl-mcatbanners .bl-mgrid--group>.bl-mtile--banner:nth-child(4n+3){flex:0 0 calc(42% - 6px)!important;} .bl-home-mobile .bl-mcatbanners .bl-mtile--banner .bl-mtile__art{background-size:cover!important;background-position:left center!important;} } @media (max-width:430px){ /* keep 4 per row on phones too (2 rows of 4 = 8 tiles) */ .bl-neongrid{grid-template-columns:repeat(4,1fr);gap:8px;} .bl-neontile{min-height:88px;padding:10px 4px;} .bl-neontile__ico{width:40px;height:40px;border-radius:12px;} .bl-neontile__ico svg{width:23px;height:23px;} .bl-neontile__label{font-size:9px;} } /* ===== landscape banner tiles — 3 columns x 2 rows = 6 per group ===== */ .bl-mgrid--group{display:grid!important;grid-template-columns:repeat(3,1fr)!important;grid-auto-flow:row!important;gap:12px;overflow:visible!important;} /* section 2: 8 tiles in 4 columns x 2 rows */ .bl-catgroup--4 .bl-mgrid--group{grid-template-columns:repeat(4,1fr)!important;} @media (max-width:980px){.bl-catgroup--4 .bl-mgrid--group{grid-template-columns:repeat(2,1fr)!important;}} .bl-mtile--banner{position:relative;display:block;aspect-ratio:900/374;width:100%;min-height:0;height:auto;padding:0;border-radius:12px;overflow:hidden;border:1px solid rgba(168,85,247,.22);background:#0b1024;transition:transform .2s ease,box-shadow .2s ease;} /* show the WHOLE banner (name + product) — never crop the text side */ .bl-mtile--banner .bl-mtile__art{position:absolute;inset:0;z-index:0;background-size:100% 100%;background-position:center;background-repeat:no-repeat;opacity:1;filter:none;} .bl-mtile--banner::after,.bl-mtile--banner::before{display:none;} .bl-mtile--banner:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(124,58,237,.3);} @media (max-width:768px){ .bl-mgrid--group{grid-template-columns:repeat(2,1fr)!important;gap:10px;} } /* desktop category groups */ .bl-catgroup{margin:18px 0;} .bl-catgroup .bl-mtile{min-height:0;border-radius:14px;} /* Group 1 stays INSIDE the content column (next to the sidebar) — 3 across */ .bl-catgroup:not(.bl-catgroup--4) .bl-mgrid--group{grid-template-columns:repeat(3,1fr)!important;gap:12px;} /* KOKO banner + 8 categories + New Arrivals break out to FULL width (the sidebar promo cards end above this, so no overlap now) */ .bl-fullbleed{width:calc(100% + 256px + 18px);margin-left:calc(-256px - 18px);display:flex;flex-direction:column;gap:16px;} .bl-catgroup--4 .bl-mgrid--group{grid-template-columns:repeat(4,1fr)!important;gap:12px;} @media (max-width:1100px){ .bl-fullbleed{width:100%;margin-left:0;} } @media (max-width:980px){ .bl-catgroup:not(.bl-catgroup--4) .bl-mgrid--group{grid-template-columns:repeat(3,1fr)!important;} .bl-catgroup--4 .bl-mgrid--group{grid-template-columns:repeat(2,1fr)!important;} } /* ===================================================================== FIXES v3: brand scroller works + bigger logos, uniform SHOP cards ===================================================================== */ /* brand strip must SCROLL (was wrapping) + bigger logos */ .bl-brands__row{flex-wrap:nowrap!important;overflow-x:auto;justify-content:flex-start!important;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;} .bl-brands__row::-webkit-scrollbar{height:0;} .bl-brand--logo{min-width:104px;height:58px;padding:8px 16px;} .bl-brand--logo img{max-height:38px;max-width:120px;} @media (max-width:768px){.bl-brand--logo{min-width:86px;height:50px;padding:7px 12px;}.bl-brand--logo img{max-height:32px;max-width:98px;}} /* SHOP archive product cards: equal height + button pinned to bottom */ .woocommerce ul.products li.product{display:flex;flex-direction:column;height:100%;} .woocommerce ul.products li.product>a:first-of-type{display:block;} /* size ONLY the product thumbnail — not KOKO/brand logos */ .woocommerce ul.products li.product img.wp-post-image, .woocommerce ul.products li.product a.woocommerce-LoopProduct-link>img{height:160px!important;width:auto;max-width:100%;object-fit:contain;} /* keep the KOKO installment logos at their intended small size */ .woocommerce ul.products li.product img.koko-logo{height:14px!important;width:auto!important;display:inline-block!important;vertical-align:middle;} .woocommerce ul.products li.product img.koko-info{height:12px!important;width:12px!important;display:inline-block!important;} .koko-logo{max-height:16px;width:auto;} .woocommerce ul.products li.product .woocommerce-loop-product__title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:34px;} .woocommerce ul.products li.product .button,.woocommerce ul.products li.product .add_to_cart_button{margin-top:auto;} /* keep the shop grid from clipping its first row */ .bl-shop-main{min-width:0;padding-top:4px;} .bl-shop-main ul.products{margin-top:0;} /* FIX: WooCommerce clearfix ::before/::after become phantom grid cells -> empty first slot */ .woocommerce ul.products::before,.woocommerce ul.products::after,.bl-row--grid::before,.bl-row--grid::after{display:none!important;content:none!important;} .woocommerce ul.products li.product.first{clear:none!important;margin-left:0!important;} /* center the Add to cart / button text on shop cards */ .woocommerce ul.products li.product .button,.woocommerce ul.products li.product .add_to_cart_button{display:flex!important;align-items:center;justify-content:center;text-align:center;width:100%;} .bl-card__add{justify-content:center;text-align:center;} /* WooCommerce pagination (1 2 3 … next) themed */ .woocommerce nav.woocommerce-pagination{margin:26px 0 8px;text-align:center;} .woocommerce nav.woocommerce-pagination ul{display:inline-flex;flex-wrap:wrap;gap:7px;border:none!important;margin:0;padding:0;} .woocommerce nav.woocommerce-pagination ul li{border:none!important;margin:0;overflow:visible;} .woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{ display:flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 12px; background:var(--chip-bg);border:1px solid var(--line)!important;border-radius:10px;color:var(--ink); font-weight:700;font-size:13.5px;line-height:1;transition:.18s;} .woocommerce nav.woocommerce-pagination ul li a:hover{background:rgba(255,45,155,.14);color:var(--pink);border-color:rgba(255,45,155,.4)!important;} .woocommerce nav.woocommerce-pagination ul li span.current{background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff;border-color:transparent!important;} /* product-categories widget: scrollable so the long list isn't endless */ .bl-shop-side .product-categories,.bl-shop-side .widget_product_categories>ul,.bl-sidebar .product-categories{max-height:360px;overflow-y:auto;padding-right:6px;} .bl-shop-side .product-categories::-webkit-scrollbar,.bl-sidebar .product-categories::-webkit-scrollbar{width:6px;} .bl-shop-side .product-categories::-webkit-scrollbar-thumb{background:rgba(255,45,155,.4);border-radius:6px;} /* ===================================================================== ABOUT page + WooCommerce CART / MY ACCOUNT themed to match ===================================================================== */ .bl-about{padding:8px 0 34px;} .bl-about__intro{max-width:880px;margin:0 auto 24px;text-align:center;} .bl-about__h{font-family:var(--display);font-weight:800;font-size:30px;color:var(--ink);margin:4px 0 12px;} .bl-about__lead{color:var(--muted-2);font-size:15px;line-height:1.75;} .bl-about__body{color:var(--muted);font-size:14px;line-height:1.7;margin-top:14px;text-align:left;} .bl-about__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:26px 0;} .bl-about__stat{background:var(--chip-bg);border:1px solid var(--line);border-radius:14px;padding:20px;text-align:center;} .bl-about__num{display:block;font-family:var(--display);font-weight:800;font-size:28px;background:linear-gradient(135deg,#ff5ea6,#a855f7);-webkit-background-clip:text;background-clip:text;color:transparent;} .bl-about__statl{color:var(--muted-2);font-size:12.5px;} .bl-about__feats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;} .bl-about__feat{display:flex;gap:14px;align-items:flex-start;background:var(--chip-bg);border:1px solid var(--line);border-radius:14px;padding:18px;} .bl-about__fico{width:46px;height:46px;border-radius:12px;background:rgba(255,45,155,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0;} .bl-about__ft{font-weight:800;color:var(--ink);font-size:15px;} .bl-about__fs{color:var(--muted-2);font-size:13px;margin-top:3px;} @media (max-width:768px){.bl-about__stats{grid-template-columns:repeat(2,1fr);}.bl-about__feats{grid-template-columns:1fr;}.bl-about__h{font-size:24px;}} /* WooCommerce cart + account: themed panels, pink buttons, readable text */ .woocommerce,.woocommerce-page{color:var(--ink);} .woocommerce .bl-wrap,.woocommerce-cart .bl-wrap,.woocommerce-account .bl-wrap{padding-top:18px;padding-bottom:30px;} .woocommerce table.shop_table{background:var(--chip-bg);border:1px solid var(--line);border-radius:14px;border-collapse:separate;overflow:hidden;} .woocommerce table.shop_table th{color:var(--ink);} .woocommerce table.shop_table td,.woocommerce table.shop_table tr{border-top-color:var(--line);color:var(--muted-2);} .woocommerce-cart table.cart img{width:70px!important;height:70px!important;object-fit:contain;border-radius:8px;background:#fff;padding:4px;display:block;} .woocommerce-cart table.cart td.product-thumbnail{width:90px;} /* ============ SLIDE CART DRAWER ============ */ html.bl-cart-locked,html.bl-cart-locked body{overflow:hidden;} .bl-cartdrawer{position:fixed;inset:0;z-index:1200;visibility:hidden;pointer-events:none;} .bl-cartdrawer.is-open{visibility:visible;pointer-events:auto;} .bl-cartdrawer__overlay{position:absolute;inset:0;background:rgba(4,3,16,.6);opacity:0;transition:opacity .3s ease;backdrop-filter:blur(2px);} .bl-cartdrawer.is-open .bl-cartdrawer__overlay{opacity:1;} .bl-cartdrawer__panel{position:absolute;top:0;right:0;height:100%;width:380px;max-width:90vw; background:var(--header-bg,#0c0a1e);border-left:1px solid var(--line);box-shadow:-12px 0 40px rgba(0,0,0,.45); display:flex;flex-direction:column;transform:translateX(100%);transition:transform .32s cubic-bezier(.22,.7,.2,1);} .bl-cartdrawer.is-open .bl-cartdrawer__panel{transform:translateX(0);} .bl-cartdrawer__handle{display:none;} .bl-cartdrawer__head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid var(--line);} .bl-cartdrawer__title{display:flex;align-items:center;gap:9px;font-family:var(--display);font-weight:800;font-size:16px;color:var(--ink);} .bl-cartdrawer__title svg{color:var(--pink);} .bl-cartdrawer__close{background:none;border:none;color:var(--muted-2);font-size:30px;line-height:1;cursor:pointer;width:34px;height:34px;border-radius:9px;} .bl-cartdrawer__close:hover{background:rgba(255,45,155,.14);color:var(--pink);} .bl-cartdrawer__body{flex:1;overflow-y:auto;padding:14px 16px;color:var(--muted-2);display:flex;flex-direction:column;} .bl-cartdrawer__body .widget_shopping_cart_content{display:flex;flex-direction:column;flex:1;} /* the cart items list */ .bl-cartdrawer__body ul.woocommerce-mini-cart{list-style:none!important;margin:0!important;padding:0!important;} /* each item = card: [thumb] [info] [remove] */ .bl-cartdrawer__body li.mini_cart_item{ display:grid!important;grid-template-columns:62px 1fr 28px;align-items:center;column-gap:12px; padding:12px!important;margin:0 0 10px!important; background:var(--chip-bg);border:1px solid var(--line);border-radius:14px;list-style:none!important;position:relative;} .bl-mc__thumb{display:flex;align-items:center;justify-content:center;} .bl-mc__thumb img{width:62px!important;height:62px!important;object-fit:contain;background:#fff;border-radius:10px;padding:4px;margin:0!important;float:none!important;display:block;} .bl-mc__info{min-width:0;display:flex;flex-direction:column;gap:5px;} .bl-mc__name{color:var(--ink)!important;font-weight:600;font-size:13px;line-height:1.35;text-decoration:none; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;} .bl-mc__price{color:var(--pink)!important;font-weight:800;font-size:13.5px;} .bl-mc__price .amount{color:var(--pink)!important;} /* compact variation meta (Color / Model etc.) inside the cart card */ .bl-cartdrawer__body .mini_cart_item dl.variation{display:flex;flex-wrap:wrap;gap:2px 6px;margin:1px 0 2px!important;padding:0;font-size:11.5px;line-height:1.3;} .bl-cartdrawer__body .mini_cart_item dl.variation dt{margin:0!important;padding:0!important;color:var(--muted);font-weight:600;clear:none!important;float:none!important;} .bl-cartdrawer__body .mini_cart_item dl.variation dt::after{content:":";} .bl-cartdrawer__body .mini_cart_item dl.variation dd{margin:0 8px 0 0!important;padding:0!important;color:var(--ink);font-weight:600;clear:none!important;float:none!important;} .bl-cartdrawer__body .mini_cart_item dl.variation dd p{margin:0!important;display:inline;} /* qty stepper */ .bl-mc__qty{display:inline-flex;align-items:center;gap:0;width:max-content;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--header-bg,#0c0a1e);} .bl-mc__qbtn{width:28px;height:28px;border:none;background:transparent;color:var(--ink);font-size:16px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;} .bl-mc__qbtn:hover{background:var(--pink);color:#fff;} .bl-mc__qval{min-width:30px;text-align:center;font-weight:700;font-size:13px;color:var(--ink);} /* clean circular REMOVE button (top-right of the card) */ .bl-cartdrawer__body a.remove, .bl-cartdrawer__body a.remove_from_cart_button{display:inline-flex!important;align-items:center;justify-content:center; width:26px!important;height:26px!important;border-radius:50%!important;background:rgba(255,45,155,.12)!important;color:var(--pink)!important; font-size:16px!important;line-height:1!important;font-weight:700;text-decoration:none!important;transition:.18s;align-self:flex-start;} .bl-cartdrawer__body a.remove:hover{background:var(--pink)!important;color:#fff!important;} /* busy state while updating qty */ .bl-cartdrawer__body.bl-mc--busy{opacity:.55;pointer-events:none;} /* totals + buttons pinned at the bottom */ .bl-cartdrawer__body .woocommerce-mini-cart__total{display:flex;justify-content:space-between;align-items:center;padding:14px 2px;font-weight:800;color:var(--ink);font-size:15px;border-top:1px solid var(--line);margin:8px 0 0;} .bl-cartdrawer__body .woocommerce-mini-cart__total .amount, .bl-cartdrawer__body .woocommerce-mini-cart__total strong{color:var(--pink)!important;} .bl-cartdrawer__body .woocommerce-mini-cart__buttons{display:flex;gap:10px;flex-wrap:nowrap;margin:0;padding-top:4px;} .bl-cartdrawer__body .woocommerce-mini-cart__buttons a{flex:1;text-align:center!important;justify-content:center;display:flex;align-items:center;border-radius:12px!important;font-weight:800!important;padding:12px 10px!important;font-size:13px!important;} .bl-cartdrawer__body .woocommerce-mini-cart__buttons a.button:not(.checkout){background:var(--chip-bg)!important;color:var(--ink)!important;border:1px solid var(--line)!important;} .bl-cartdrawer__body .woocommerce-mini-cart__buttons a.checkout{background:linear-gradient(135deg,var(--pink),var(--pink-2))!important;color:#fff!important;border:none!important;} .bl-cartdrawer__body p.woocommerce-mini-cart__empty-message{text-align:center;padding:40px 0;color:var(--muted);font-size:14px;} /* --------------------------------------------------------------------- Harden cart-item layout so WooCommerce archive/single styles can't squash it into vertical single-char columns on shop/brand pages. --------------------------------------------------------------------- */ .bl-cartdrawer__body li.mini_cart_item{grid-template-columns:62px minmax(0,1fr) 28px!important;width:auto!important;float:none!important;} .bl-cartdrawer__body .bl-mc__info{grid-column:2!important;min-width:0!important;width:auto!important;white-space:normal!important;word-break:normal!important;} .bl-cartdrawer__body .bl-mc__name{white-space:normal!important;word-break:break-word;} .bl-cartdrawer__body .bl-mc__thumb{grid-column:1!important;width:62px!important;} .bl-cartdrawer__body a.remove{grid-column:3!important;} /* --------------------------------------------------------------------- Hide variation swatch widgets from SHOP/ARCHIVE loop cards (three swatch plugins were all injecting overlapping chips). Swatches stay on the single product page; loop cards show clean image+name+price+button. --------------------------------------------------------------------- */ .woocommerce ul.products li.product .cfvsw_variations_form, .woocommerce ul.products li.product .cfvsw-shop-variations, .woocommerce ul.products li.product .cfvsw-swatches-container, .woocommerce ul.products li.product .tawcvs-swatches, .woocommerce ul.products li.product .wvs-archive-variations, .woocommerce ul.products li.product .variations_form, .woocommerce ul.products li.product table.variations, .woocommerce ul.products li.product .woo-variation-swatches-archive{display:none!important;} /* --------------------------------------------------------------------- * Variation BUTTON swatches (e.g. "Warranty: Without / 3 Month / 6 Month") * on the single product page: the woo-variation-swatches plugin renders white * pills whose label text was invisible (white on white) in dark mode. Make the * text dark/readable and give a clear selected + hover state. * ------------------------------------------------------------------- */ .single-product .variations .button-variable-item, .single-product .variations li.variable-item.button-variable-item{ background:#fff!important; border:1px solid rgba(0,0,0,.12)!important; border-radius:10px!important; box-shadow:0 2px 8px rgba(5,3,20,.35)!important; padding:0!important; transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease!important; } .single-product .variations .button-variable-item .variable-item-span, .single-product .variations .variable-item-span-button, body.wvs-theme-baloon .single-product .variations .button-variable-item .variable-item-span, body .button-variable-items-wrapper .variable-item.button-variable-item .variable-item-span.variable-item-span-button{ color:#15101f!important; font-weight:700!important; font-size:13.5px!important; padding:10px 16px!important; display:block!important; text-shadow:none!important; opacity:1!important; } .single-product .variations .button-variable-item:hover{ border-color:var(--pink)!important; transform:translateY(-1px)!important; } .single-product .variations .button-variable-item.selected, .single-product .variations .button-variable-item[aria-checked="true"]{ border-color:var(--pink)!important; box-shadow:0 0 0 2px rgba(255,45,155,.5),0 2px 10px rgba(255,45,155,.3)!important; } /* the attribute label ("Warranty"), variation price, availability + reset link */ .single-product .variations .label, .single-product .variations th.label, .single-product .variations_form .label label{color:var(--ink)!important;font-weight:700;} .single-product .single_variation_wrap .woocommerce-variation-price, .single-product .single_variation_wrap .woocommerce-variation-price .amount, .single-product .single_variation_wrap .woocommerce-variation-availability{color:var(--ink)!important;} .single-product .reset_variations{color:var(--muted-2)!important;} /* --------------------------------------------------------------------- * Hide the "X in stock" availability count on the single product page. * Only the OUT-of-stock message stays visible (plus our SOLD OUT badge). * ------------------------------------------------------------------- */ .single-product p.stock.in-stock, .single-product .single_variation_wrap .woocommerce-variation-availability p.stock.in-stock{display:none!important;} /* keep out-of-stock visible and styled */ .single-product p.stock.out-of-stock{display:block!important;color:var(--pink)!important;font-weight:700;} /* mobile: slide UP as a bottom sheet (app-style) */ @media (max-width:768px){ .bl-cartdrawer__panel{top:auto;bottom:0;right:0;left:0;width:100%;max-width:100%;height:auto;max-height:86vh; border-left:none;border-top:1px solid var(--line);border-radius:22px 22px 0 0; transform:translateY(100%);box-shadow:0 -12px 40px rgba(0,0,0,.5);} .bl-cartdrawer.is-open .bl-cartdrawer__panel{transform:translateY(0);} .bl-cartdrawer__handle{display:block;width:44px;height:5px;border-radius:5px;background:rgba(255,255,255,.22);margin:10px auto 2px;} } .woocommerce .cart_totals h2,.woocommerce-MyAccount-content h2,.woocommerce-MyAccount-content h3,.woocommerce .woocommerce-Address h3,.woocommerce-account h1,.woocommerce-cart h1{color:var(--ink);} .woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit,.woocommerce .button.alt{background:linear-gradient(135deg,var(--pink),var(--pink-2))!important;color:#fff!important;border:none!important;border-radius:9px!important;font-weight:800!important;padding:11px 20px!important;} .woocommerce a.button:hover,.woocommerce button.button:hover{filter:brightness(1.07);} .woocommerce .cart-collaterals .cart_totals,.woocommerce .woocommerce-info,.woocommerce .woocommerce-message{background:var(--chip-bg);border:1px solid var(--line);border-radius:14px;color:var(--muted-2);} .woocommerce .woocommerce-message,.woocommerce .woocommerce-info,.woocommerce .woocommerce-error{padding:14px 18px;} /* drop the default WC notice icon glyph — it's absolutely positioned and lands on top of the text */ .woocommerce .woocommerce-message::before,.woocommerce .woocommerce-info::before,.woocommerce .woocommerce-error::before{display:none!important;content:none!important;} .woocommerce .woocommerce-message .button,.woocommerce .woocommerce-info .button{color:var(--pink);} .woocommerce .woocommerce-message a,.woocommerce .woocommerce-info a{color:var(--pink);} .woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce .quantity input,.woocommerce input[type=text],.woocommerce input[type=email],.woocommerce input[type=password],.woocommerce select{background:var(--chip-bg);border:1px solid var(--line);color:var(--ink);border-radius:8px;padding:10px;} .woocommerce .product-remove a.remove{color:var(--pink)!important;} /* My Account dashboard */ .woocommerce-account .woocommerce-MyAccount-navigation ul{list-style:none;margin:0 0 18px;padding:0;background:var(--chip-bg);border:1px solid var(--line);border-radius:14px;overflow:hidden;} .woocommerce-account .woocommerce-MyAccount-navigation li{border-bottom:1px solid var(--line);} .woocommerce-account .woocommerce-MyAccount-navigation li a{display:block;padding:13px 18px;color:var(--muted-2);font-weight:600;} .woocommerce-account .woocommerce-MyAccount-navigation li.is-active a,.woocommerce-account .woocommerce-MyAccount-navigation li a:hover{background:rgba(255,45,155,.12);color:var(--pink);} .woocommerce-account .woocommerce-MyAccount-content{background:var(--chip-bg);border:1px solid var(--line);border-radius:14px;padding:22px;color:var(--muted-2);} .woocommerce-account .woocommerce-MyAccount-content a{color:var(--pink);} /* ===================================================================== CART PAGE — Temu-style: compact item rows (image+name+price grouped) on the left, "Order Summary" totals box on the right. Matches site theme. ===================================================================== */ /* legacy: the new .bl-cartpage template handles its own layout — keep the .woocommerce wrapper a plain block so it doesn't double-grid/overlap */ .woocommerce-cart .woocommerce{display:block;} .woocommerce-cart .bl-cartpage .cart-collaterals{position:static;width:auto!important;float:none!important;} /* turn the responsive table into a clean card list (no wide empty columns) */ .woocommerce-cart table.cart.shop_table{display:block;border:0;background:transparent;border-radius:0;overflow:visible;} .woocommerce-cart table.cart thead{display:none;} .woocommerce-cart table.cart tbody{display:flex;flex-direction:column;gap:12px;} .woocommerce-cart table.cart tr.cart_item{ display:grid; grid-template-columns:80px minmax(0,1fr) 130px; grid-template-areas: "img name qty" "img price subtotal"; align-items:center;column-gap:18px;row-gap:6px; background:var(--chip-bg);border:1px solid var(--line);border-radius:16px;padding:16px 44px 16px 18px;position:relative;} .woocommerce-cart table.cart tr.cart_item td{display:block;border:0!important;padding:0!important;margin:0!important;} /* thumbnail spans both rows */ .woocommerce-cart table.cart td.product-thumbnail{grid-area:img;align-self:center;} .woocommerce-cart table.cart td.product-thumbnail img{width:72px!important;height:72px!important;object-fit:contain;border-radius:12px;background:#fff;padding:5px;display:block;} /* name + variation (top of middle column) */ .woocommerce-cart table.cart td.product-name{grid-area:name;min-width:0;align-self:end;} .woocommerce-cart table.cart td.product-name a{color:var(--ink);font-weight:600;font-size:14.5px;line-height:1.35;text-decoration:none;display:block;} .woocommerce-cart table.cart td.product-name .variation{font-size:12px;color:var(--muted);margin-top:5px;display:flex;flex-wrap:wrap;gap:2px 8px;} .woocommerce-cart table.cart td.product-name .variation dt,.woocommerce-cart table.cart td.product-name .variation dd{margin:0!important;padding:0!important;float:none!important;display:inline;} .woocommerce-cart table.cart td.product-name .variation dt::after{content:":";} .woocommerce-cart table.cart td.product-name .variation dd{margin-right:8px!important;} .woocommerce-cart table.cart td.product-name .variation dd p{display:inline;margin:0!important;} /* unit price (bottom of middle column) */ .woocommerce-cart table.cart td.product-price{grid-area:price;align-self:start;color:var(--pink);font-weight:700;font-size:13px;} .woocommerce-cart table.cart td.product-price::before{content:"Unit: ";color:var(--muted);font-weight:600;} /* qty stepper (top of right column) with - and + buttons */ .woocommerce-cart table.cart td.product-quantity{grid-area:qty;justify-self:end;align-self:end;} .woocommerce-cart table.cart td.product-quantity .quantity{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--header-bg,#0c0a1e);} .woocommerce-cart table.cart td.product-quantity .quantity .bl-qbtn{width:34px;height:38px;border:0;background:transparent;color:var(--ink);font-size:17px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;} .woocommerce-cart table.cart td.product-quantity .quantity .bl-qbtn:hover{background:var(--pink);color:#fff;} .woocommerce-cart table.cart td.product-quantity .quantity input.qty{width:46px;border:0!important;border-left:1px solid var(--line)!important;border-right:1px solid var(--line)!important;background:transparent!important;color:var(--ink)!important;text-align:center;font-weight:700;padding:9px 2px!important;-moz-appearance:textfield;} .woocommerce-cart table.cart td.product-quantity .quantity input.qty::-webkit-outer-spin-button, .woocommerce-cart table.cart td.product-quantity .quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;} /* subtotal (bottom of right column) */ .woocommerce-cart table.cart td.product-subtotal{grid-area:subtotal;justify-self:end;align-self:start;color:var(--pink)!important;font-weight:800;font-size:15px;white-space:nowrap;} .woocommerce-cart table.cart td.product-subtotal .amount{color:var(--pink)!important;} /* remove button — round, top-right corner of the card */ .woocommerce-cart table.cart td.product-remove{position:absolute;top:12px;right:14px;} .woocommerce-cart table.cart td.product-remove a.remove{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:rgba(255,45,155,.12);color:var(--pink)!important;font-size:16px;line-height:1;text-decoration:none;} .woocommerce-cart table.cart td.product-remove a.remove:hover{background:var(--pink)!important;color:#fff!important;} /* coupon + update row */ .woocommerce-cart .actions{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:16px 2px 0;} .woocommerce-cart .actions .coupon{display:flex;gap:8px;} .woocommerce-cart .actions .coupon .input-text{max-width:200px;} /* ORDER SUMMARY box (cart totals) — Temu-style */ .woocommerce-cart .cart-collaterals .cart_totals{width:100%!important;float:none!important;padding:22px;background:var(--chip-bg);border:1px solid var(--line);border-radius:16px;} .woocommerce-cart .cart_totals h2{font-size:19px;margin:0 0 16px;color:var(--ink);} .woocommerce-cart .cart_totals table{width:100%;border:0;background:transparent;} .woocommerce-cart .cart_totals table tr th,.woocommerce-cart .cart_totals table tr td{padding:12px 2px;border-top:1px solid var(--line);color:var(--muted-2);font-size:14px;} .woocommerce-cart .cart_totals table tr:first-child th,.woocommerce-cart .cart_totals table tr:first-child td{border-top:0;} .woocommerce-cart .cart_totals .order-total th{font-size:16px;color:var(--ink);} .woocommerce-cart .cart_totals .order-total td .amount,.woocommerce-cart .cart_totals .order-total .woocommerce-Price-amount{color:var(--pink)!important;font-size:20px;font-weight:800;} .woocommerce-cart .wc-proceed-to-checkout{padding:16px 0 0;} .woocommerce-cart .wc-proceed-to-checkout a.checkout-button{width:100%;text-align:center;display:block;font-size:15px!important;padding:15px!important;border-radius:12px!important;} /* shipment options — tidy radio + label layout */ .woocommerce-cart .cart_totals .shipping td, .woocommerce-cart .cart_totals .woocommerce-shipping-totals td{padding-top:6px!important;} .woocommerce ul#shipping_method{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:12px;} .woocommerce ul#shipping_method li{margin:0;color:var(--muted-2);display:grid;grid-template-columns:18px 1fr;align-items:start;column-gap:10px;line-height:1.45;font-size:13.5px;} .woocommerce ul#shipping_method li input[type=radio]{width:16px;height:16px;margin:2px 0 0;accent-color:var(--pink);cursor:pointer;} .woocommerce ul#shipping_method li label{margin:0;color:var(--muted-2);cursor:pointer;display:inline;} .woocommerce ul#shipping_method li label .amount, .woocommerce ul#shipping_method li .woocommerce-Price-amount{color:var(--ink);font-weight:700;white-space:nowrap;} .woocommerce-cart .cart_totals .woocommerce-shipping-destination, .woocommerce-shipping-calculator{margin-top:10px!important;font-size:12.5px;color:var(--muted);} .woocommerce-shipping-calculator .shipping-calculator-button{color:var(--pink)!important;font-weight:700;} /* CART responsive: stack the summary under items on tablet/mobile */ @media (max-width:991px){ .woocommerce-cart .woocommerce{grid-template-columns:1fr;} .woocommerce-cart form.woocommerce-cart-form,.woocommerce-cart .cart-collaterals{grid-column:1;} .woocommerce-cart .cart-collaterals{position:static;} } @media (max-width:560px){ .woocommerce-cart table.cart tr.cart_item{ grid-template-columns:64px minmax(0,1fr); grid-template-areas: "img name" "img price" "qty subtotal"; column-gap:14px;row-gap:8px;padding:14px 40px 14px 14px;} .woocommerce-cart table.cart td.product-thumbnail{align-self:start;} .woocommerce-cart table.cart td.product-thumbnail img{width:58px!important;height:58px!important;} .woocommerce-cart table.cart td.product-name{align-self:start;} .woocommerce-cart table.cart td.product-quantity{justify-self:start;align-self:center;} .woocommerce-cart table.cart td.product-subtotal{justify-self:end;align-self:center;} } /* ===================================================================== CART PAGE v2 — custom "My Cart" UI (bl-cartpage template) ===================================================================== */ .bl-cartpage{padding:6px 0 36px;} .bl-cartpage__head{margin:0 0 24px;} .bl-cartpage__title{font-family:var(--display);font-weight:800;font-size:34px;color:var(--ink);margin:0;} .bl-cartpage__sub{color:var(--muted);font-size:15px;margin:6px 0 0;} .bl-cartpage__grid{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:26px;align-items:start;} .bl-cartpage__items{min-width:0;} .bl-cartpage__summary{position:sticky;top:90px;} /* item card */ .bl-citems{display:flex;flex-direction:column;gap:16px;} /* item card: thumb (left) + a flex info column. The qty/total/remove sit in a row UNDER the name+unit so the name never gets squeezed to one word/line. */ .bl-citem{display:flex;align-items:flex-start;gap:16px; background:var(--chip-bg);border:1px solid var(--line);border-radius:18px;padding:18px;position:relative;} .bl-citem__thumb{flex:0 0 auto;} .bl-citem__thumb img{width:90px!important;height:90px!important;object-fit:contain;background:#fff;border-radius:14px;padding:8px;display:block;} .bl-citem__info{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;} .bl-citem__name{display:block;color:var(--ink)!important;font-weight:700;font-size:15px;line-height:1.35;text-decoration:none;overflow-wrap:break-word;} .bl-citem__name:hover{color:var(--pink)!important;} .bl-citem .variation{font-size:12px;color:var(--muted);margin:4px 0;} .bl-citem__unit{margin-top:8px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;} .bl-citem__unit-l{font-size:12.5px;color:var(--muted);font-weight:600;} .bl-citem__unit-v{color:var(--pink);font-weight:800;font-size:15px;} .bl-citem__unit-v .amount{color:var(--pink)!important;} /* the action row under the name */ .bl-citem__row{display:flex;align-items:center;gap:14px;margin-top:14px;flex-wrap:wrap;} /* qty stepper */ .bl-citem__qty .quantity{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--header-bg,#0c0a1e);} .bl-citem__qty .quantity .bl-qbtn{width:38px;height:42px;border:0;background:transparent;color:var(--ink);font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.15s;} .bl-citem__qty .quantity .bl-qbtn:hover{background:var(--pink);color:#fff;} .bl-citem__qty .quantity input.qty{width:48px;border:0!important;border-left:1px solid var(--line)!important;border-right:1px solid var(--line)!important;background:transparent!important;color:var(--ink)!important;text-align:center;font-weight:700;font-size:15px;padding:10px 2px!important;-moz-appearance:textfield;} .bl-citem__qty .quantity input.qty::-webkit-outer-spin-button, .bl-citem__qty .quantity input.qty::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;} /* line total */ .bl-citem__total{color:var(--pink)!important;font-weight:800;font-size:17px;white-space:nowrap;margin-left:auto;} .bl-citem__total .amount{color:var(--pink)!important;} /* trash remove */ .bl-citem__remove a.remove{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px; background:var(--header-bg,#0c0a1e);border:1px solid var(--line);color:var(--muted-2)!important;transition:.18s;text-decoration:none!important;} .bl-citem__remove a.remove:hover{background:rgba(225,29,72,.14);border-color:rgba(225,29,72,.4);color:#e11d48!important;} /* coupon + update row */ .bl-cartpage__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:20px;} .bl-coupon{display:flex;gap:12px;flex:1;min-width:280px;} .bl-coupon .input-text{flex:1;background:var(--chip-bg)!important;border:1px solid var(--line)!important;border-radius:14px!important;color:var(--ink)!important;padding:14px 16px!important;font-size:14px;} .bl-coupon .button{border-radius:14px!important;padding:14px 26px!important;white-space:nowrap;} .bl-updatecart{background:var(--chip-bg)!important;color:var(--ink)!important;border:1px solid var(--line)!important;border-radius:14px!important;padding:14px 22px!important;display:inline-flex;align-items:center;gap:8px;} /* ORDER SUMMARY box */ .bl-cartpage__summary .cart_totals{padding:26px;background:var(--chip-bg);border:1px solid var(--line);border-radius:20px;} .bl-cartpage__summary .cart_totals h2{font-family:var(--display);font-weight:800;font-size:22px;color:var(--ink);margin:0 0 20px;} /* render the summary as BLOCK (not a real table) so every row is full-width and the shipping options can never be squeezed into a narrow column */ .bl-cartpage__summary .cart_totals table, .bl-cartpage__summary .cart_totals table tbody{display:block;width:100%;border:0;background:transparent;} .bl-cartpage__summary .cart_totals table tr{display:block;width:100%;border-top:1px solid var(--line);padding:0;} .bl-cartpage__summary .cart_totals table tr:first-child{border-top:0;} .bl-cartpage__summary .cart_totals table th, .bl-cartpage__summary .cart_totals table td{display:block;width:100%;padding:0;border:0;color:var(--muted-2);font-size:14px;text-align:left;} /* subtotal & total: label + amount on ONE line */ .bl-cartpage__summary .cart_totals .cart-subtotal, .bl-cartpage__summary .cart_totals .order-total, .bl-cartpage__summary .cart_totals .cart-discount, .bl-cartpage__summary .cart_totals .fee, .bl-cartpage__summary .cart_totals .tax-total{display:flex!important;align-items:center;justify-content:space-between;gap:12px;padding:14px 0;} .bl-cartpage__summary .cart_totals .cart-subtotal th, .bl-cartpage__summary .cart_totals .order-total th, .bl-cartpage__summary .cart_totals .cart-discount th, .bl-cartpage__summary .cart_totals .fee th, .bl-cartpage__summary .cart_totals .tax-total th{display:inline-block;width:auto;font-weight:700;color:var(--ink);} .bl-cartpage__summary .cart_totals .cart-subtotal td, .bl-cartpage__summary .cart_totals .order-total td, .bl-cartpage__summary .cart_totals .cart-discount td, .bl-cartpage__summary .cart_totals .fee td, .bl-cartpage__summary .cart_totals .tax-total td{display:inline-block;width:auto;text-align:right;} .bl-cartpage__summary .cart_totals .cart-subtotal td{color:var(--pink)!important;font-weight:800;} .bl-cartpage__summary .cart_totals .cart-subtotal .amount{color:var(--pink)!important;} .bl-cartpage__summary .cart_totals .order-total th{font-size:18px;} .bl-cartpage__summary .cart_totals .order-total td .amount,.bl-cartpage__summary .cart_totals .order-total .amount{color:var(--pink)!important;font-size:22px;font-weight:800;} .bl-cartpage__summary .cart_totals .order-total td{text-align:right;} /* shipping options list */ /* shipping row: "Shipment" label on its own line, options FULL WIDTH below */ .bl-cartpage__summary .cart_totals .shipping, .bl-cartpage__summary .cart_totals .woocommerce-shipping-totals{display:block!important;width:100%!important;} .bl-cartpage__summary .cart_totals .shipping th, .bl-cartpage__summary .cart_totals .woocommerce-shipping-totals th{display:block!important;width:100%!important;padding:14px 0 10px!important;font-size:15px;color:var(--ink);text-align:left!important;} .bl-cartpage__summary .cart_totals .shipping td, .bl-cartpage__summary .cart_totals .woocommerce-shipping-totals td{display:block!important;width:100%!important;padding:0 0 6px!important;border-top:0!important;text-align:left!important;} .bl-cartpage__summary ul#shipping_method{list-style:none;margin:0;padding:0;width:100%;display:flex;flex-direction:column;gap:14px;} .bl-cartpage__summary ul#shipping_method li{display:flex;align-items:flex-start;gap:10px;width:100%;line-height:1.45;font-size:13.5px;color:var(--muted-2);} .bl-cartpage__summary ul#shipping_method li label{flex:1;min-width:0;} .bl-cartpage__summary ul#shipping_method li input[type=radio]{width:16px;height:16px;margin:2px 0 0;accent-color:var(--pink);cursor:pointer;} .bl-cartpage__summary ul#shipping_method li label{margin:0;color:var(--muted-2);cursor:pointer;} .bl-cartpage__summary ul#shipping_method li label .amount, .bl-cartpage__summary ul#shipping_method li .woocommerce-Price-amount{color:var(--ink);font-weight:700;white-space:nowrap;} .bl-cartpage__summary .woocommerce-shipping-destination{margin-top:10px;font-size:12.5px;color:var(--muted);} .bl-cartpage__summary .shipping-calculator-button{color:var(--pink)!important;font-weight:700;} .bl-cartpage__summary .wc-proceed-to-checkout{padding:20px 0 0;display:flex;flex-direction:column;gap:12px;} .bl-cartpage__summary .wc-proceed-to-checkout a.checkout-button{width:100%;text-align:center;display:block;font-size:15px!important;padding:16px!important;border-radius:14px!important;} /* responsive cart */ @media (max-width:991px){ .bl-cartpage__grid{grid-template-columns:1fr;} .bl-cartpage__summary{position:static;} /* Order Summary uses the FULL card width on tablet/mobile: every row's label sits on its own line, value/options full-width underneath */ .bl-cartpage__summary .cart_totals table, .bl-cartpage__summary .cart_totals table tbody, .bl-cartpage__summary .cart_totals table tr{display:block;width:100%;} .bl-cartpage__summary .cart_totals table th{display:block;width:100%!important;padding:14px 0 6px;text-align:left;} .bl-cartpage__summary .cart_totals table td{display:block;width:100%!important;padding:0 0 12px;border-top:0;text-align:left!important;} .bl-cartpage__summary .cart_totals .cart-subtotal, .bl-cartpage__summary .cart_totals .order-total{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);} .bl-cartpage__summary .cart_totals .cart-subtotal th, .bl-cartpage__summary .cart_totals .cart-subtotal td, .bl-cartpage__summary .cart_totals .order-total th, .bl-cartpage__summary .cart_totals .order-total td{display:inline-block;width:auto!important;padding:14px 0;border:0;} .bl-cartpage__summary .cart_totals .cart-subtotal td, .bl-cartpage__summary .cart_totals .order-total td{text-align:right!important;} .bl-cartpage__summary ul#shipping_method li{grid-template-columns:18px 1fr;} .bl-cartpage__summary ul#shipping_method li label .amount, .bl-cartpage__summary ul#shipping_method li .woocommerce-Price-amount{display:inline;} } @media (max-width:600px){ .bl-cartpage{padding-bottom:80px;} /* clear the floating WhatsApp/scroll buttons */ .bl-cartpage__title{font-size:26px;} .bl-citem{padding:14px;gap:12px;} .bl-citem__thumb img{width:72px!important;height:72px!important;} /* coupon: stack input over button, both full width */ .bl-cartpage__actions{flex-direction:column;align-items:stretch;gap:12px;} .bl-coupon{flex-direction:column;min-width:0;width:100%;gap:10px;} .bl-coupon .input-text{width:100%;} .bl-coupon .button,.bl-updatecart{width:100%;justify-content:center;} } /* ===================================================================== CHECKOUT PAGE — billing left, sticky order + payment cards right ===================================================================== */ /* page header: title + trust badges */ .bl-checkout-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin:6px 0 24px;} .bl-checkout-title{font-family:var(--display);font-weight:800;font-size:32px;color:var(--ink);margin:0;} .bl-checkout-trust{display:flex;gap:22px;flex-wrap:wrap;} .bl-checkout-trust span{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:600;color:var(--muted-2);} .bl-checkout-trust span svg{color:var(--pink);} /* numbered section headings */ .woocommerce-checkout .woocommerce-billing-fields > h3, .woocommerce-checkout #order_review_heading{position:relative;} .woocommerce-checkout .woocommerce-billing-fields > h3::before{content:"1";display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--pink),var(--pink-2));color:#fff;font-size:13px;font-weight:800;margin-right:10px;vertical-align:middle;} .woocommerce-checkout #payment::before{content:"3 Payment Method";display:flex;align-items:center;gap:10px;font-family:var(--display);font-weight:800;font-size:18px;color:var(--ink);margin:0 0 16px;} .woocommerce-checkout #payment{counter-reset:none;} /* assurance boxes after payment */ .bl-checkout-assure{display:flex;flex-direction:column;gap:14px;margin-top:18px;} .bl-assure-box{background:var(--header-bg,#0c0a1e);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;gap:12px;align-items:flex-start;} .bl-assure-box__ico{color:var(--pink);flex-shrink:0;} .bl-assure-box strong{color:var(--ink);font-size:14px;display:block;} .bl-assure-box p{color:var(--muted);font-size:12.5px;margin:4px 0 0;line-height:1.5;} .bl-assure-box--help{flex-direction:column;gap:6px;} .bl-assure-box--help a{display:inline-flex;align-items:center;gap:8px;color:var(--pink);font-weight:700;font-size:13px;text-decoration:none;margin-top:4px;} .woocommerce-checkout #customer_details.col2-set{display:block;width:100%;float:none;} .woocommerce-checkout .col2-set .col-1,.woocommerce-checkout .col2-set .col-2{width:100%!important;float:none!important;background:var(--chip-bg);border:1px solid var(--line);border-radius:16px;padding:24px;margin:0 0 18px;} .woocommerce-checkout #order_review_heading{color:var(--ink);font-size:20px;padding:0;margin:0 0 14px;border:0;} .woocommerce-checkout #order_review{background:var(--chip-bg);border:1px solid var(--line);border-radius:16px;padding:22px;} .woocommerce form .form-row label{color:var(--muted-2);font-weight:600;font-size:13px;margin-bottom:6px;display:block;} .woocommerce form .form-row{margin:0 0 16px;} .woocommerce form .form-row .required{color:var(--pink);} .woocommerce-checkout .woocommerce-billing-fields h3,.woocommerce-checkout .woocommerce-shipping-fields h3,.woocommerce-checkout .woocommerce-additional-fields h3{color:var(--ink);font-size:18px;margin:0 0 16px;} /* order review table */ .woocommerce-checkout #order_review table.shop_table{background:transparent;border:0;} .woocommerce-checkout #order_review table.shop_table th,.woocommerce-checkout #order_review table.shop_table td{padding:11px 4px;border-top:1px solid var(--line);color:var(--muted-2);} .woocommerce-checkout #order_review .order-total .amount,.woocommerce-checkout #order_review .order-total th{color:var(--pink)!important;} .woocommerce-checkout #order_review .cart_item .product-name{color:var(--ink);} /* checkout review item: thumb + name + variation + qty/remove controls */ .bl-co-item{display:grid;grid-template-columns:48px 1fr;gap:10px;align-items:start;} .bl-co-item__thumb img{width:48px!important;height:48px!important;object-fit:contain;border-radius:8px;background:#fff;padding:3px;margin:0!important;display:block;} .bl-co-item__info{min-width:0;} .bl-co-item__name{color:var(--ink)!important;font-weight:600;font-size:13px;line-height:1.35;display:block;} .woocommerce-checkout #order_review .bl-co-item__info .variation{font-size:11.5px;color:var(--muted);margin:3px 0;} .woocommerce-checkout #order_review .bl-co-item__info .variation dt,.woocommerce-checkout #order_review .bl-co-item__info .variation dd{margin:0 6px 0 0!important;padding:0!important;display:inline;float:none!important;} .woocommerce-checkout #order_review .bl-co-item__info .variation dt::after{content:":";} .woocommerce-checkout #order_review .bl-co-item__info .variation dd p{display:inline;margin:0!important;} .bl-co-qty{display:inline-flex;align-items:center;gap:0;margin-top:7px;border:1px solid var(--line);border-radius:9px;overflow:hidden;background:var(--header-bg,#0c0a1e);} .bl-co-qbtn{width:26px;height:26px;border:0;background:transparent;color:var(--ink);font-size:15px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;} .bl-co-qbtn:hover{background:var(--pink);color:#fff;} .bl-co-qval{min-width:30px;text-align:center;font-weight:700;font-size:13px;color:var(--ink);} .bl-co-remove{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin-left:6px;border-radius:50%;background:rgba(255,45,155,.12);color:var(--pink)!important;font-size:15px;line-height:1;text-decoration:none;border-left:1px solid var(--line);} .bl-co-remove:hover{background:var(--pink)!important;color:#fff!important;} .woocommerce-checkout-review-order-table.bl-mc--busy{opacity:.55;pointer-events:none;} /* payment methods as selectable CARDS */ .woocommerce-checkout #payment{background:transparent!important;border-radius:0;} .woocommerce-checkout #payment ul.payment_methods{background:transparent!important;border:0!important;padding:0!important;margin:0 0 18px!important;list-style:none;display:flex;flex-direction:column;gap:10px;} .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method{background:var(--header-bg,#0c0a1e);border:1.5px solid var(--line);border-radius:14px;padding:14px 16px;transition:.18s;list-style:none;} .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:hover{border-color:rgba(255,45,155,.5);} .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:has(input:checked){border-color:var(--pink);box-shadow:0 0 0 3px rgba(255,45,155,.18);background:rgba(255,45,155,.05);} .woocommerce-checkout #payment ul.payment_methods li label{display:inline-flex;align-items:center;gap:10px;color:var(--ink)!important;font-weight:700;font-size:14px;cursor:pointer;margin:0;} .woocommerce-checkout #payment ul.payment_methods li label img{max-height:24px;width:auto;margin:0 0 0 4px;vertical-align:middle;} .woocommerce-checkout #payment ul.payment_methods li input[type=radio]{accent-color:var(--pink);width:18px;height:18px;margin:0;} .woocommerce-checkout #payment .payment_box{background:rgba(255,255,255,.03)!important;border:1px solid var(--line);border-radius:10px;margin:12px 0 0!important;padding:12px 14px!important;color:var(--muted-2);font-size:13px;} .woocommerce-checkout #payment .payment_box::before{display:none!important;} .woocommerce-checkout #payment div.place-order{padding-top:8px;} .woocommerce-checkout #payment div.place-order .button#place_order{width:100%;font-size:16px!important;padding:15px!important;border-radius:12px!important;} .woocommerce-checkout #payment .woocommerce-privacy-policy-text{color:var(--muted);font-size:12px;margin-top:10px;} .woocommerce-checkout .checkout_coupon{background:var(--chip-bg);border:1px solid var(--line)!important;border-radius:12px;} /* coupon toggle: kill the default WC info "ℹ" glyph that collides with the text, even out padding */ .woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info{position:relative;background:var(--chip-bg);padding:14px 18px;list-style:none;} .woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before{display:none!important;content:none!important;} .woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a{color:var(--pink);text-decoration:none;font-weight:600;} .woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a:hover{text-decoration:underline;} .woocommerce-checkout #ship-to-different-address{font-size:15px;} /* two-column on wide screens, sticky order pinned to the TOP */ @media (min-width:992px){ .woocommerce-checkout form.checkout{display:grid;grid-template-columns:1.35fr 1fr;grid-template-rows:auto 1fr;gap:10px 28px;align-items:start;} .woocommerce-checkout form.checkout #customer_details{grid-column:1;grid-row:1 / span 2;} .woocommerce-checkout form.checkout #order_review_heading{grid-column:2;grid-row:1;margin:0 0 14px;align-self:start;} .woocommerce-checkout form.checkout #order_review{grid-column:2;grid-row:2;align-self:start;position:sticky;top:90px;} } /* scrollable item list when many products — fixed height window, smooth on touch */ .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody{display:block;max-height:320px;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table thead{display:table;width:100%;table-layout:fixed;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody tr{display:table;width:100%;table-layout:fixed;} /* product row: wide name column, narrow right-aligned total — stop the price overlapping the name/qty */ .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table thead .product-name, .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody td.product-name{width:68%;vertical-align:top;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table thead .product-total, .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody td.product-total{width:32%;vertical-align:top;text-align:right;padding-left:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody td.product-total .amount, .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody td.product-total bdi{color:var(--ink);font-weight:600;font-size:12.5px;white-space:nowrap;} /* Full-width totals/shipping (mirrors the cart Order Summary) — escape table columns */ .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot{display:block;width:100%;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr{display:flex;width:100%;justify-content:space-between;align-items:baseline;gap:12px;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr th, .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr td{display:block;width:auto;padding:11px 0;border:0;text-align:right;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr th{text-align:left;} /* Shipping row stacks full-width: label on its own line, options span the whole card */ .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals.shipping{display:block;width:100%;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals.shipping th{display:block;width:100%;text-align:left;padding:11px 0 6px;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr.woocommerce-shipping-totals.shipping td{display:block;width:100%;text-align:left;padding:0 0 8px;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr.shipping ul#shipping_method{display:block;width:100%;margin:0;padding:0;list-style:none;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr.shipping ul#shipping_method li{display:flex;align-items:center;gap:8px;width:100%;padding:6px 0;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tfoot tr.shipping ul#shipping_method li label{flex:1;margin:0;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody::-webkit-scrollbar{width:6px;} .woocommerce-checkout #order_review .woocommerce-checkout-review-order-table tbody::-webkit-scrollbar-thumb{background:rgba(255,45,155,.4);border-radius:6px;} @media (max-width:991px){ .woocommerce-cart .woocommerce{flex-direction:column;} .woocommerce-cart form.woocommerce-cart-form,.woocommerce-cart .cart-collaterals{flex:1 1 100%;width:100%;} } /* ===================================================================== SINGLE PRODUCT — Temu-style v3 (big main image + vertical thumbnail rail on the left, summary on the right, full-width description below) ===================================================================== */ /* top: large gallery (≈55%) left, summary right */ .single-product div.product{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);grid-column-gap:40px;align-items:start;} .single-product div.product .woocommerce-product-gallery{float:none;width:auto!important;margin:0;grid-column:1;} .single-product div.product .summary.entry-summary{float:none;width:auto!important;margin:0;grid-column:2;} .single-product div.product .woocommerce-tabs, .single-product div.product .related, .single-product div.product .up-sells{grid-column:1 / -1;width:100%;clear:both;} /* GALLERY: flex row = vertical thumb rail | big main image (Temu style) */ .single-product .woocommerce-product-gallery{position:relative;display:flex;flex-direction:row-reverse;align-items:flex-start;gap:14px;background:transparent;border:0;} .single-product .woocommerce-product-gallery__wrapper{flex:1 1 auto;min-width:0;margin:0;border:1px solid var(--line);border-radius:18px;overflow:hidden;background:#fff;} .single-product .woocommerce-product-gallery__image{border-radius:18px;} .single-product .woocommerce-product-gallery__image a{display:block;} .single-product .woocommerce-product-gallery__image img{display:block;width:100%;height:auto;border-radius:18px;} /* zoom magnifier icon sits inside the big image */ .single-product .woocommerce-product-gallery__trigger{top:14px;right:14px;} /* vertical thumbnail rail on the LEFT */ .single-product .flex-control-thumbs{display:flex!important;flex-direction:column;flex:0 0 76px;gap:10px;margin:0!important;padding:0;list-style:none;float:none;width:76px!important;max-height:560px;overflow-y:auto;} .single-product .flex-control-thumbs li{width:auto!important;margin:0!important;float:none!important;list-style:none;} .single-product .flex-control-thumbs img{width:72px;height:72px;object-fit:cover;border-radius:12px;border:1px solid var(--line);opacity:.65;cursor:pointer;transition:.2s;background:#fff;} .single-product .flex-control-thumbs img:hover,.single-product .flex-control-thumbs img.flex-active{opacity:1;border-color:var(--pink);box-shadow:0 0 0 2px rgba(255,90,180,.35);} /* Payment Method / Price box — frosted glass effect */ .single-product .bl-paytable{margin:16px 0 6px;} .single-product .summary table,.single-product .bl-paytable table{width:100%;border-collapse:separate;border-spacing:0;margin:14px 0 6px; background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.03)); border:1px solid rgba(255,255,255,.14);border-radius:16px;overflow:hidden; -webkit-backdrop-filter:blur(14px) saturate(1.2);backdrop-filter:blur(14px) saturate(1.2); box-shadow:0 8px 30px rgba(8,5,24,.35),inset 0 1px 0 rgba(255,255,255,.12);} .single-product .summary table,.single-product .bl-paytable table th{background:linear-gradient(135deg,rgba(255,45,155,.28),rgba(168,85,247,.24));color:#fff;font-weight:700;text-align:left;padding:13px 16px;font-size:13px;letter-spacing:.02em;} .single-product .summary table,.single-product .bl-paytable table td{padding:12px 16px;border-top:1px solid rgba(255,255,255,.08);color:var(--ink);font-size:14px;} .single-product .summary table,.single-product .bl-paytable table td:last-child{text-align:right;color:#fff;font-weight:700;white-space:nowrap;} .single-product .summary table,.single-product .bl-paytable table tr:nth-child(even) td{background:rgba(255,255,255,.04);} .single-product .summary table,.single-product .bl-paytable table tr:hover td{background:rgba(255,45,155,.07);} /* light mode: keep the glass but readable on light bg */ [data-theme="light"] .single-product .summary table,.single-product .bl-paytable table{background:linear-gradient(160deg,rgba(20,10,40,.05),rgba(20,10,40,.02));border-color:rgba(20,10,40,.12);box-shadow:0 8px 26px rgba(20,10,40,.10);} [data-theme="light"] .single-product .summary table,.single-product .bl-paytable table th{color:var(--ink);} [data-theme="light"] .single-product .summary table,.single-product .bl-paytable table td{color:var(--ink);} [data-theme="light"] .single-product .summary table,.single-product .bl-paytable table td:last-child{color:var(--ink);} /* hide the redundant "Direct bank transfer with 8% Discount ₨X (₨0.00)" line that the Checkout-Fees plugin prints right before the short description. It is a class-less

sitting just before .short-description, so target any

in the summary that immediately precedes it. */ .single-product .summary p:has(+ .woocommerce-product-details__short-description), .single-product .entry-summary p:has(+ .woocommerce-product-details__short-description){display:none!important;} /* Short description IS shown in the summary (e.g. installment plans). Style it as a readable block; the payment table (priority 21) renders right after it. */ .single-product .summary .woocommerce-product-details__short-description{display:block!important;margin:14px 0 4px;color:var(--muted-2);font-size:14px;line-height:1.6;} .single-product .summary .woocommerce-product-details__short-description ul{margin:8px 0 0;padding-left:18px;} .single-product .summary .woocommerce-product-details__short-description li{margin:3px 0;} .single-product .summary .woocommerce-product-details__short-description strong{color:var(--ink);} /* WooCommerce's own form.cart default margin-bottom (2em/30px) leaves a big empty gap before the WhatsApp button below it — tighten to match the rest of this button cluster (WA button/Compare/tabs are all ~0-18px apart). */ .single-product form.cart{margin-bottom:14px!important;} /* Product action stack: "Check availability" (green) and "Compare" sat flush against each other, and Compare was a small left-aligned pill under a full-width green button — visually unbalanced. Match their widths and give the stack one even rhythm. */ .single-product .summary .wa-order-class{display:block;margin-bottom:10px;} .single-product .summary a.compare.button{ display:block;width:100%;box-sizing:border-box;text-align:center; padding:13px 20px;border-radius:12px;font-weight:800;font-size:14px;line-height:1.2; margin:0; } /* "Check availability before ordering" WhatsApp button — NEON GREEN (global: product, cart, checkout — must beat .button.alt pink !important) */ .woocommerce button.wa-order-button.button.alt, .woocommerce a.wa-order-button.button, .woocommerce button.wa-order-button, .wa-order-class button.wa-order-button, button.wa-order-button, a.wa-order-button, .wa-order-button{ background:#25d366!important;background-image:linear-gradient(135deg,#2be36e,#16a34a)!important; color:#fff!important;border:none!important;border-radius:12px!important;font-weight:800!important; box-shadow:0 0 0 1px rgba(37,211,102,.5),0 8px 22px rgba(37,211,102,.45),0 0 26px rgba(37,211,102,.55)!important; } button.wa-order-button:hover,a.wa-order-button:hover{filter:brightness(1.06)!important;} /* remove the Categories/Tags meta + brand text clutter under the button */ .single-product .summary .product_meta, .single-product .summary .pwb-single-product-brands, .single-product .summary .posted_in, .single-product .summary .tagged_as{display:none!important;} /* full-width description tabs below — modern pill tabs matching the theme */ .single-product .woocommerce-tabs{margin-top:18px;background:var(--sidebar-bg);border:1px solid var(--line);border-radius:18px;padding:18px 26px 26px;} /* tab nav: clean pills, no default borders/triangles */ .single-product .woocommerce-tabs ul.tabs{margin:0 0 20px!important;padding:0!important;display:flex;flex-wrap:wrap;gap:10px;border:0!important;list-style:none;background:transparent;} .single-product .woocommerce-tabs ul.tabs::before, .single-product .woocommerce-tabs ul.tabs::after, .single-product .woocommerce-tabs ul.tabs li::before, .single-product .woocommerce-tabs ul.tabs li::after{display:none!important;border:0!important;content:none!important;} .single-product .woocommerce-tabs ul.tabs li{background:transparent!important;border:1px solid var(--line)!important;border-radius:999px!important;margin:0!important;padding:0!important;} .single-product .woocommerce-tabs ul.tabs li a{display:block;color:var(--muted-2)!important;font-weight:700;font-size:13.5px;padding:9px 20px!important;border-radius:999px;text-decoration:none;} .single-product .woocommerce-tabs ul.tabs li.active, .single-product .woocommerce-tabs ul.tabs li:hover{background:linear-gradient(135deg,var(--pink),var(--pink-2))!important;border-color:transparent!important;box-shadow:0 6px 18px rgba(255,45,155,.4)!important;} .single-product .woocommerce-tabs ul.tabs li.active a, .single-product .woocommerce-tabs ul.tabs li:hover a{color:#fff!important;} /* panels */ .single-product .woocommerce-tabs .panel{color:var(--muted-2);font-size:15px;line-height:1.7;max-width:none;margin:0!important;} .single-product .woocommerce-tabs .panel h2{color:var(--ink);font-family:var(--display);font-size:22px;margin:0 0 12px;} .single-product .woocommerce-tabs .panel h3, .single-product .woocommerce-tabs .panel strong{color:var(--ink);} .single-product .woocommerce-tabs .panel ul li{margin:.3em 0;} /* tablet/mobile: stack columns, keep image LARGE, thumbs go horizontal below */ @media (max-width:900px){ .single-product div.product{display:block;} .single-product div.product .woocommerce-product-gallery, .single-product div.product .summary.entry-summary{width:100%!important;margin:0 0 20px!important;} /* image full width and big; thumbnail rail becomes a horizontal strip under it */ .single-product .woocommerce-product-gallery{flex-direction:column;gap:12px;} .single-product .woocommerce-product-gallery__wrapper{width:100%;} .single-product .flex-control-thumbs{flex-direction:row;flex-wrap:wrap;width:100%!important;flex:0 0 auto;max-height:none;} .single-product .flex-control-thumbs img{width:60px;height:60px;} .single-product .summary table,.single-product .bl-paytable table td,.single-product .summary table,.single-product .bl-paytable table th{padding:9px 12px;font-size:13px;} .single-product .woocommerce-tabs{margin-top:12px;padding:6px 14px 16px;} .single-product .woocommerce-product-details__short-description{font-size:13.5px;} } /* ===================================================================== TOP BRANDS page (Elementor HTML widget .image-table) — remove the white logo boxes, enlarge logos, give the grid a clean dark-glass look. ===================================================================== */ /* !important needed: Elementor prints the widget's own inline