
/* Follow Store - Blue/Black V10 Safe Fix */

/* Main variables */
:root{
  --product-badge-bg:#0094ff!important;
  --product-badge-text:#ffffff!important;
  --product-card-add-btn-bg:#0094ff!important;
  --product-card-add-btn-text:#ffffff!important;
  --product-card-bg:#0f1828!important;
  --logo-height-mobile:70px!important;
  --logo-height-desktop:110px!important;
  --header-height-mobile:90px!important;
  --header-height-desktop:115px!important;
}

/* Background */
html,
body,
#__next,
.app_container,
div[class*="app_container"],
main,
section,
div[class*="collection"],
div[class*="products"],
div[class*="page"]{
  background:#070b14!important;
  color:#ffffff!important;
}

/* Header */
header,
nav,
.header-col-left,
.header-col-center,
div[class*="header"],
div[class*="navbar"]{
  background:#050914!important;
  color:#ffffff!important;
  border-color:#0094ff44!important;
}

/* Logo */
.header-col-center,
a.ab-logo{
  min-height:90px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
}

.header-col-center .ab-logo img,
.ab-logo img,
img[class*="logo"],
img[alt*="logo"],
img[alt*="Logo"]{
  height:78px!important;
  max-height:78px!important;
  width:auto!important;
  object-fit:contain!important;
}

/* Product detail title - restore visibility */
.ab-pd-title,
.ab-pd-title *,
.ab-dg-modal__title,
.ab-dg-modal__title *,
[itemprop="name"],
[itemprop="name"] *{
  color:#ffffff!important;
  opacity:1!important;
  text-shadow:none!important;
}

/* Product detail price row */
.ab-pd-price-row,
.ab-pd-price-group,
.ab-dg-modal__price-row,
.ab-dg-modal__price-row *{
  background:transparent!important;
  opacity:1!important;
}

/* Current price */
.ab-pd-price,
.ab-pd-price-group .ab-pd-price,
.ab-pd-price-row .ab-pd-price,
.ab-dg-modal__price,
.ab-dg-modal-body .ab-dg-modal__price,
span.ab-dg-modal__price{
  color:#00a8ff!important;
  background:transparent!important;
  font-weight:900!important;
  font-size:28px!important;
  opacity:1!important;
  text-shadow:0 0 10px rgba(0,168,255,.35)!important;
}

/* Old price */
.ab-pd-old-price,
.ab-pd-price-group .ab-pd-old-price,
.ab-pd-price-row .ab-pd-old-price,
.ab-dg-modal__old-price,
.ab-dg-modal-body .ab-dg-modal__old-price,
span.ab-dg-modal__old-price{
  color:#9aa3b5!important;
  background:transparent!important;
  text-decoration:line-through!important;
  text-decoration-thickness:2px!important;
  font-weight:800!important;
  font-size:24px!important;
  opacity:1!important;
  filter:none!important;
  text-shadow:none!important;
}

/* Product grid cards */
.ab-pgrid-card{
  background:#101827!important;
  border:1px solid rgba(0,148,255,.35)!important;
  border-radius:18px!important;
  padding:0!important;
  overflow:hidden!important;
  box-shadow:0 8px 22px rgba(0,0,0,.25)!important;
}

.ab-pgrid-card:hover{
  border-color:#00a8ff!important;
  box-shadow:0 0 25px rgba(0,148,255,.45)!important;
}

.ab-pgrid-card img{
  background:#ffffff!important;
  border-radius:14px!important;
}

.ab-pgrid-info{
  background:#070b14!important;
  color:#ffffff!important;
  padding:10px 8px 12px!important;
}

.ab-pgrid-info,
.ab-pgrid-info a,
.ab-pgrid-info p,
.ab-pgrid-info span{
  color:#ffffff!important;
}

/* Grid price */
.ab-pgrid-price-row{
  background:transparent!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  flex-wrap:wrap!important;
  margin-top:8px!important;
  padding:0!important;
}

.ab-pgrid-price-row,
.ab-pgrid-price-row span,
.ab-pgrid-price-row div,
.ab-pgrid-price-row p{
  background:transparent!important;
  color:#00a8ff!important;
  font-size:18px!important;
  font-weight:800!important;
  line-height:1.2!important;
  padding:0!important;
  border:none!important;
  box-shadow:none!important;
}

.ab-pgrid-price-row del,
.ab-pgrid-price-row s,
.ab-pgrid-price-row span:first-child{
  color:#9aa3b5!important;
  text-decoration:line-through!important;
  font-weight:700!important;
  opacity:1!important;
}

/* Badges */
.ab-pgrid-badge,
.ab-sale-badge,
span.ab-pgrid-badge.ab-sale-badge,
[class*="sale-badge"],
[class*="discount"]{
  background:#0094ff!important;
  color:#ffffff!important;
  border-radius:999px!important;
  padding:7px 13px!important;
  font-weight:800!important;
  box-shadow:0 0 14px rgba(0,148,255,.55)!important;
}

/* Buttons */
button,
[class*="cart"],
[class*="Cart"]{
  background:#0094ff!important;
  color:#ffffff!important;
  border-color:#0094ff!important;
}

button:hover,
[class*="cart"]:hover,
[class*="Cart"]:hover{
  background:#00b7ff!important;
  box-shadow:0 0 18px rgba(0,148,255,.65)!important;
}

/* Footer safe dark */
footer,
.ab-footer,
.ab-footer-inner,
.ab-footer-inner--kids,
.ab-footer-bar,
.ab-footer-bar-meta,
div[class*="footer"]{
  background:#050914!important;
  background-color:#050914!important;
  color:#ffffff!important;
  border-color:#0094ff33!important;
}

footer *,
.ab-footer *,
.ab-footer-inner *,
.ab-footer-inner--kids *,
div[class*="footer"] *{
  color:#ffffff!important;
}

footer h1,
footer h2,
footer h3,
footer h4,
footer strong,
footer b,
.ab-footer strong,
.ab-footer b{
  color:#00a8ff!important;
}

/* Forms */
select,
option,
input{
  background:#0f1828!important;
  color:#ffffff!important;
  border:1px solid rgba(0,148,255,.5)!important;
  border-radius:12px!important;
}

a{
  color:#ffffff!important;
}

a:hover{
  color:#00a8ff!important;
}


/* ===== Product Page Fix ===== */

/* عنوان المنتج */
h1.ab-pd-name{
    color:#ffffff !important;
    opacity:1 !important;
}

/* السعر قبل الخصم */
span.ab-pd-price-old{
    color:#9aa3b5 !important;
    opacity:1 !important;
    text-decoration:line-through !important;
}

/* وصف المنتج */
.ab-pd-short-description,
.ab-pd-short-description *,
.ab-pd-description,
.ab-pd-description *{
    color:#d1d5db !important;
    opacity:1 !important;
}


/* =====================================================
   V12 FIXES: SEARCH + CART + CHECKOUT
   Keep product title/price fixes from V11 unchanged
===================================================== */

/* ---------- SEARCH FIX ---------- */
input.global_input,
input.global_input::placeholder,
.global_input,
.global_input::placeholder{
    color:#ffffff !important;
    caret-color:#ffffff !important;
}

input.global_input,
.global_input{
    background:#0f1828 !important;
    border:1px solid rgba(0,148,255,.55) !important;
    border-radius:12px !important;
}

input.global_input:focus,
.global_input:focus{
    outline:none !important;
    border-color:#00a8ff !important;
    box-shadow:0 0 14px rgba(0,148,255,.45) !important;
}

/* ---------- CART SIDEBAR FIX ---------- */
[data-cart="panel"],
[data-cart="panel"] *,
[data-cart="content"],
[data-cart="footer"]{
    color:#ffffff !important;
}

[data-cart="panel"] .bg-white,
[data-cart="panel"] .flex.h-full.flex-col.overflow-y-auto,
[data-cart="panel"] [class*="bg-white"],
[data-cart="panel"] [class*="bg-[#FFFCEA]"],
[data-cart="panel"] [class*="bg-"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

[data-cart="content"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

[data-cart="footer"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
    border-top:1px solid rgba(0,148,255,.35) !important;
}

/* Cart product card */
[data-cart="content"] > div,
[data-cart="content"] [class*="bg-[#00AEEF]"],
[data-cart="content"] [class*="bg-"]{
    border-radius:14px !important;
}

/* Cart buttons */
[data-cart="panel"] button,
[data-cart="footer"] button{
    background:#0094ff !important;
    color:#ffffff !important;
    border:none !important;
}

[data-cart="panel"] button:hover,
[data-cart="footer"] button:hover{
    background:#00b7ff !important;
    box-shadow:0 0 18px rgba(0,148,255,.65) !important;
}

/* Cart close button */
[data-cart="panel"] button[aria-label],
[data-cart="panel"] [class*="close"]{
    color:#ffffff !important;
}

/* Cart item image should stay clean */
[data-cart="content"] img{
    background:#ffffff !important;
    border-radius:10px !important;
}

/* ---------- CHECKOUT PAGE FIX ---------- */
body:has(form) main,
body:has(form) section,
body:has(form) [class*="checkout"],
body:has(form) [class*="Checkout"],
body:has(form) [class*="order"],
body:has(form) [class*="Order"]{
    background:#070b14 !important;
    color:#ffffff !important;
}

/* Checkout page general light backgrounds */
[class*="checkout"] .bg-white,
[class*="Checkout"] .bg-white,
[class*="order"] .bg-white,
[class*="Order"] .bg-white,
[class*="summary"] .bg-white,
[class*="Summary"] .bg-white{
    background:#101827 !important;
    color:#ffffff !important;
}

/* Checkout cards / summary */
[class*="checkout"] > div,
[class*="Checkout"] > div,
[class*="summary"],
[class*="Summary"],
[class*="order-summary"],
[class*="OrderSummary"]{
    color:#ffffff !important;
    border-color:rgba(0,148,255,.35) !important;
}

/* Checkout form area */
form,
form *,
[class*="form"],
[class*="Form"]{
    color:#ffffff !important;
}

form input,
form select,
form textarea,
[class*="checkout"] input,
[class*="checkout"] select,
[class*="checkout"] textarea,
[class*="Checkout"] input,
[class*="Checkout"] select,
[class*="Checkout"] textarea{
    background:#0f1828 !important;
    color:#ffffff !important;
    caret-color:#ffffff !important;
    border:1px solid rgba(0,148,255,.55) !important;
    border-radius:14px !important;
}

form input::placeholder,
form textarea::placeholder,
[class*="checkout"] input::placeholder,
[class*="checkout"] textarea::placeholder,
[class*="Checkout"] input::placeholder,
[class*="Checkout"] textarea::placeholder{
    color:#9aa3b5 !important;
}

/* Checkout buttons */
form button,
[class*="checkout"] button,
[class*="Checkout"] button{
    background:#0094ff !important;
    color:#ffffff !important;
    border:none !important;
}

form button:hover,
[class*="checkout"] button:hover,
[class*="Checkout"] button:hover{
    background:#00b7ff !important;
    box-shadow:0 0 18px rgba(0,148,255,.65) !important;
}

/* Checkout / summary price text */
[class*="checkout"] span,
[class*="checkout"] p,
[class*="checkout"] h1,
[class*="checkout"] h2,
[class*="checkout"] h3,
[class*="Checkout"] span,
[class*="Checkout"] p,
[class*="Checkout"] h1,
[class*="Checkout"] h2,
[class*="Checkout"] h3,
[class*="summary"] *,
[class*="Summary"] *{
    color:#ffffff !important;
}

/* Keep Tabby box readable */
[class*="tabby"],
[class*="Tabby"],
[class*="payment"],
[class*="Payment"]{
    color:#111827 !important;
}



/* ===== V13 FINAL FIXES ===== */

/* Homepage beige background */
.content_container,
.content_container.py-0{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Checkout left background */
.checkout_bg_left,
.bg-gray-50{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Global dark background safety */
body,
main{
    background:#020d22 !important;
}


/* ===== V14 STRONG BEIGE REMOVAL ===== */

/* Exact homepage content container */
div.content_container,
div.content_container.py-0,
[class~="content_container"],
[class*="content_container"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Remove EasyOrders beige/cream backgrounds */
[class*="FFFCEA"],
[class*="fffcea"],
[class*="bg-[#FFFCEA]"],
[class*="bg-\\[\\#FFFCEA\\]"],
[class*="bg-\\[\\#fffcea\\]"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Override inline or generated beige backgrounds */
*[style*="#FFFCEA"],
*[style*="#fffcea"],
*[style*="255, 252, 234"],
*[style*="rgb(255, 252, 234)"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Main page wrappers */
#__next,
body > div,
.app_container,
main,
section,
.content_container,
.content_container > div,
.content_container section,
.content_container main{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Checkout gray/white side panels */
.checkout_bg_left,
.checkout_bg_right,
[class*="checkout_bg"],
.bg-gray-50,
[class*="bg-gray-50"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
}



/* ===== V15 CHECKOUT LEFT BACKGROUND FIX ===== */

/* Exact checkout left background from DevTools */
div.checkout_bg_left,
.checkout_bg_left,
div[class*="checkout_bg_left"],
[class*="checkout_bg_left"],
div.fixed.top-0.left-0.hidden.h-full.w-1\/2.bg-gray-50,
.bg-gray-50{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Force any checkout pale background */
*[class*="bg-gray-50"],
*[style*="#F2F2F2"],
*[style*="#f2f2f2"],
*[style*="rgb(242, 242, 242)"]{
    background:#020d22 !important;
    background-color:#020d22 !important;
}

/* Checkout page container safety */
body:has(.checkout_bg_left),
body:has([class*="checkout_bg"]),
body:has([class*="checkout"]) {
    background:#020d22 !important;
}


/* =====================================================
   V17 HEADER CLEAN STYLE
   Based on the stable V15 file.
   هدفه: هيدر قريب من Blast Gamers بدون دوائر على روابط القائمة.
===================================================== */

/* Header base */
header,
nav,
.ab-header,
.ab-header-inner,
div[class*="header"],
div[class*="navbar"]{
    background:#050914 !important;
    background-color:#050914 !important;
    color:#ffffff !important;
    border-bottom:1px solid rgba(0,148,255,.28) !important;
}

/* Keep header height controlled */
header,
nav,
.ab-header,
.ab-header-inner{
    min-height:88px !important;
}

/* Header columns */
.header-col-left,
.header-col-right,
.header-col-center{
    display:flex !important;
    align-items:center !important;
}

/* Logo center */
.header-col-center,
a.ab-logo{
    min-height:86px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

.header-col-center .ab-logo img,
.ab-logo img,
img[class*="logo"],
img[alt*="logo"],
img[alt*="Logo"]{
    height:72px !important;
    max-height:72px !important;
    width:auto !important;
    object-fit:contain !important;
    background:#ffffff !important;
    padding:5px !important;
    border-radius:2px !important;
}

/* Menu links - normal text, NOT circles */
nav a,
header a,
.ab-header a,
div[class*="header"] a,
div[class*="navbar"] a{
    background:transparent !important;
    box-shadow:none !important;
    border:none !important;
    border-radius:0 !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    color:#ffffff !important;
    font-weight:800 !important;
    font-size:16px !important;
    text-decoration:none !important;
    padding:0 8px !important;
}

nav a:hover,
header a:hover,
.ab-header a:hover,
div[class*="header"] a:hover,
div[class*="navbar"] a:hover{
    color:#00a8ff !important;
    text-shadow:0 0 10px rgba(0,168,255,.55) !important;
}

/* Icons only: cart/search/language get circles */
.header-col-left > button,
.header-col-right > button,
.header-col-left > a:not(.ab-logo),
.header-col-right > a:not(.ab-logo),
button[class*="cart"],
a[class*="cart"],
button[class*="search"],
a[class*="search"],
button[aria-label*="بحث"],
button[aria-label*="Search"]{
    background:#0094ff !important;
    background-color:#0094ff !important;
    color:#ffffff !important;
    border:1px solid rgba(0,168,255,.5) !important;
    border-radius:999px !important;
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-shadow:0 0 14px rgba(0,148,255,.35) !important;
}

.header-col-left > button:hover,
.header-col-right > button:hover,
.header-col-left > a:not(.ab-logo):hover,
.header-col-right > a:not(.ab-logo):hover,
button[class*="cart"]:hover,
a[class*="cart"]:hover,
button[class*="search"]:hover,
a[class*="search"]:hover{
    background:#00b7ff !important;
    box-shadow:0 0 22px rgba(0,168,255,.75) !important;
}

/* Hamburger square like gaming theme */
button.ab-hamburger,
.ab-hamburger,
button[class*="hamburger"],
button[id*="menu"]{
    background:#0094ff !important;
    color:#ffffff !important;
    border-radius:0 !important;
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
}

/* SVG icons */
header svg,
nav svg,
.ab-header svg,
div[class*="header"] svg{
    color:#ffffff !important;
    stroke:#ffffff !important;
}

/* Cart badge */
header [class*="badge"],
header [class*="count"],
.ab-header [class*="badge"],
.ab-header [class*="count"]{
    background:#ffffff !important;
    color:#0094ff !important;
    font-weight:900 !important;
}

/* Remove the huge empty area under header if caused by header wrappers */
header + div,
nav + div{
    border-top:1px solid rgba(0,148,255,.18) !important;
}

/* Mobile */
@media (max-width:768px){
    header,
    nav,
    .ab-header,
    .ab-header-inner{
        min-height:74px !important;
    }

    .header-col-center .ab-logo img,
    .ab-logo img{
        height:58px !important;
        max-height:58px !important;
    }

    .header-col-left > button,
    .header-col-right > button,
    .header-col-left > a:not(.ab-logo),
    .header-col-right > a:not(.ab-logo){
        width:44px !important;
        height:44px !important;
        min-width:44px !important;
    }
}


/* =====================================================
   V18 HEADER COMPACT FIX
   الهدف: إزالة الفراغ تحت الهيدر + ترتيب القائمة بدون دوائر
===================================================== */

/* تقليل ارتفاع الهيدر */
header,
nav,
.ab-header,
.ab-header-inner,
div[class*="header"],
div[class*="navbar"]{
    min-height:78px !important;
    height:auto !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin-bottom:0 !important;
}

/* الحاوية الداخلية للهيدر */
.ab-header-inner,
div[class*="header-inner"],
div[class*="header_inner"],
.header-col-left,
.header-col-center,
.header-col-right{
    min-height:76px !important;
    height:76px !important;
    align-items:center !important;
}

/* تصغير اللوقو */
.header-col-center .ab-logo img,
.ab-logo img,
img[class*="logo"],
img[alt*="logo"],
img[alt*="Logo"]{
    height:68px !important;
    max-height:68px !important;
    width:auto !important;
    object-fit:contain !important;
}

/* روابط القائمة: نص فقط بدون دوائر */
nav a,
header a,
.ab-header a,
div[class*="header"] a,
div[class*="navbar"] a{
    background:transparent !important;
    background-color:transparent !important;
    box-shadow:none !important;
    border:none !important;
    border-radius:0 !important;
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    color:#ffffff !important;
    font-size:15px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
    padding:0 7px !important;
    white-space:nowrap !important;
}

/* الدوائر فقط للأيقونات في الجهة اليسار/يمين */
.header-col-left > button,
.header-col-right > button,
.header-col-left > a:not(.ab-logo),
.header-col-right > a:not(.ab-logo){
    background:#0094ff !important;
    background-color:#0094ff !important;
    color:#ffffff !important;
    border-radius:999px !important;
    width:48px !important;
    height:48px !important;
    min-width:48px !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

/* زر المنيو فقط مربع */
button.ab-hamburger,
.ab-hamburger,
button[class*="hamburger"],
button[id*="menu"]{
    background:#0094ff !important;
    background-color:#0094ff !important;
    color:#ffffff !important;
    border-radius:0 !important;
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
}

/* إزالة الفراغ الكبير تحت الهيدر */
header + *,
nav + *,
.ab-header + *,
div[class*="header"] + *{
    margin-top:0 !important;
}

div[class*="hero"],
div[class*="banner"],
.content_container,
.content_container.py-0{
    padding-top:0 !important;
    margin-top:0 !important;
}

/* تقليل أي مساحة فارغة فوق محتوى الصفحة */
main,
section{
    padding-top:0 !important;
}

/* خط أزرق خفيف تحت الهيدر مثل قالب الألعاب */
header,
nav,
.ab-header{
    border-bottom:1px solid rgba(0,148,255,.35) !important;
}

/* موبايل */
@media (max-width:768px){
    header,
    nav,
    .ab-header,
    .ab-header-inner{
        min-height:70px !important;
    }

    .header-col-center .ab-logo img,
    .ab-logo img{
        height:56px !important;
        max-height:56px !important;
    }

    nav a,
    header a{
        font-size:13px !important;
    }
}
