/* ==========================================
   BLOND — CLEAN VERSION
   INTRO HOME ONLY + HEADER
========================================== */

html {
    background: #050505;
}

body {
    margin: 0;
}


/* ==========================================
   CINEMATIC INTRO — HOME PAGE ONLY
========================================== */

body.index::before {
    content: "";
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100vh;
    z-index: 9999999;

    background:
        radial-gradient(
            circle at 50% 50%,
            rgba(190, 151, 92, 0.16) 0%,
            rgba(190, 151, 92, 0.06) 22%,
            rgba(0,0,0,0) 48%
        ),
        #050505
        url("https://cdn.files.salla.network/other/510128631/859b0918-9102-4c2c-8995-32e7c92d5d01-original.webp")
        center center / 290px auto
        no-repeat;

    pointer-events: none;

    animation:
        blondIntroScreen 2.8s
        cubic-bezier(.77,0,.18,1)
        forwards;
}


body.index::after {
    content: "ELEVATED ACCESSORIES";
    position: fixed;
    z-index: 10000000;
    left: 50%;
    top: calc(50% + 155px);
    transform: translate(-50%, 20px);
    color: #C7A36B;
    font-family: Georgia, serif;
    font-size: 10px;
    letter-spacing: 6px;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;

    animation:
        blondIntroCaption 2.8s ease forwards;
}


@keyframes blondIntroScreen {

    0% {
        opacity: 0;
        background-size: auto, 220px auto;
    }

    15% {
        opacity: 1;
        background-size: auto, 290px auto;
    }

    65% {
        opacity: 1;
        background-size: auto, 290px auto;
        transform: translateY(0);
    }

    78% {
        opacity: 1;
        transform: translateY(0);
    }

    100% {
        opacity: 1;
        transform: translateY(-105%);
        visibility: hidden;
    }
}


@keyframes blondIntroCaption {

    0%,
    20% {
        opacity: 0;
        transform: translate(-50%, 20px);
        letter-spacing: 10px;
    }

    38% {
        opacity: .85;
        transform: translate(-50%, 0);
        letter-spacing: 6px;
    }

    65% {
        opacity: .85;
        transform: translate(-50%, 0);
    }

    78% {
        opacity: 0;
        transform: translate(-50%, -10px);
    }

    100% {
        opacity: 0;
        visibility: hidden;
    }
}


/* دخول المتجر — الرئيسية فقط */

body.index main {
    animation: blondStoreReveal 1.2s ease 2.2s both;
}

@keyframes blondStoreReveal {

    from {
        opacity: 0;
        transform: translateY(18px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}


/* ==========================================
   LUXURY BLACK HEADER
========================================== */

header,
.main-nav-container,
.navbar-brand {
    background: #080808 !important;
}


header {
    border-bottom: 1px solid rgba(199,163,107,.22) !important;
    box-shadow: 0 8px 30px rgba(0,0,0,.12) !important;
}


header a,
header button {
    color: #F5F0E8 !important;
    transition: .3s ease !important;
}


header a:hover,
header button:hover {
    color: #C7A36B !important;
}


header svg {
    color: #C7A36B !important;
    stroke: #C7A36B !important;
}


/* البحث */

header input,
header .search-input {
    background: #141414 !important;
    color: #F8F4EE !important;
    border: 1px solid rgba(199,163,107,.28) !important;
    border-radius: 50px !important;
    box-shadow: none !important;
    transition: .3s ease !important;
}


header input:focus {
    border-color: #C7A36B !important;
    box-shadow: 0 0 0 3px rgba(199,163,107,.08) !important;
}


header input::placeholder {
    color: rgba(245,240,232,.50) !important;
}


/* اللوقو */

header img {
    transition:
        transform .4s cubic-bezier(.22,1,.36,1),
        filter .4s ease !important;
}


header img:hover {
    transform: scale(1.04);
    filter: brightness(1.08);
}


/* عداد السلة */

header .badge,
header [class*="count"] {
    background: #C7A36B !important;
    color: #080808 !important;
}


/* ==========================================
   LOGGED IN ACCOUNT — CIRCLE FIX
========================================== */

header .s-user-menu-trigger,
header salla-user-menu button {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    padding: 0 !important;

    border-radius: 50% !important;
    aspect-ratio: 1 / 1 !important;

    background: transparent !important;
    border: 1px solid rgba(199,163,107,.55) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}


header salla-user-menu img {
    display: block !important;
    width: 34px !important;
    height: 34px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}


/* ==========================================
   MOBILE
========================================== */

@media (max-width: 768px) {

    body.index::before {
        background-size:
            auto,
            225px auto;
    }

    body.index::after {
        top: calc(50% + 125px);
        font-size: 8px;
        letter-spacing: 4px;
    }

    header {
        background: #080808 !important;
    }
}


/* ==========================================
   BLOND INTRO — MOBILE CAPTION FIX
========================================== */

@media (max-width: 768px) {

    body.index::after {
        left: 0 !important;
        right: 0 !important;
        width: 100% !important;
        top: calc(50% + 125px) !important;
        text-align: center !important;
        direction: ltr !important;
        transform: translateY(20px) !important;
    }

    @keyframes blondIntroCaption {

        0%, 20% {
            opacity: 0;
            transform: translateY(20px);
            letter-spacing: 7px;
        }

        38% {
            opacity: .85;
            transform: translateY(0);
            letter-spacing: 4px;
        }

        65% {
            opacity: .85;
            transform: translateY(0);
        }

        78% {
            opacity: 0;
            transform: translateY(-10px);
        }

        100% {
            opacity: 0;
            transform: translateY(-10px);
            visibility: hidden;
        }
    }
}


/* ==========================================
   HIDE TOP BAR
========================================== */

.top-navbar {
    display: none !important;
}


/* BLOND — CART BORDER GOLD ONLY */

.s-cart-summary-wrapper .header-btn__icon {
    border-color: #C7A36B !important;
}


/* BLOND — CART + ACCOUNT SAME SIZE */

header .s-user-menu-trigger,
header salla-user-menu button {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    border-color: #C7A36B !important;
}

header salla-user-menu img {
    width: 30px !important;
    height: 30px !important;
}

.s-cart-summary-wrapper .header-btn__icon {
    border-color: #C7A36B !important;
}
/* ==========================================
   BLOND — LUXURY COLLECTION DESIGN
========================================== */

/* الخلفية الكريمية */
body,
body main {
    background:
        radial-gradient(
            circle at 50% 20%,
            rgba(255,255,255,.60) 0%,
            rgba(255,255,255,0) 35%
        ),
        radial-gradient(
            circle at 15% 60%,
            rgba(199,163,107,.10) 0%,
            transparent 32%
        ),
        radial-gradient(
            circle at 85% 65%,
            rgba(199,163,107,.08) 0%,
            transparent 35%
        ),
        linear-gradient(
            135deg,
            #F4EDE4 0%,
            #E8DAC7 50%,
            #F5EEE5 100%
        ) !important;
}


/* ==========================================
   BLOND COLLECTION — بالنص
========================================== */

body.index .s-block--fixed-products .s-block__title,
body.index .s-block--fixed-products h2 {
    width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;

    color: #171717 !important;
    font-weight: 500 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
}


/* الخط الذهبي تحت العنوان */

body.index .s-block--fixed-products .s-block__title::after,
body.index .s-block--fixed-products h2::after {
    content: "";
    display: block;
    width: 52px;
    height: 2px;
    background: #C7A36B;
    margin: 14px auto 0;
}


/* ==========================================
   PRODUCT CARDS — كريمي شفاف
========================================== */

body.index .s-product-card-horizontal {
    background: rgba(255, 252, 247, .82) !important;

    border: 1px solid rgba(255,255,255,.65) !important;
    border-radius: 14px !important;

    box-shadow:
        0 12px 35px rgba(90,65,35,.06) !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}


/* داخل كرت المنتج */

body.index .s-product-card-horizontal,
body.index .s-product-card-horizontal * {
    border-color: rgba(30,30,30,.65);
}


/* ==========================================
   FEATURES CARDS
========================================== */

body.index .s-block--features .feature-item,
body.index .s-block--features [class*="feature"] {
    background: rgba(255,252,247,.72) !important;
    border-color: rgba(255,255,255,.60) !important;
    border-radius: 14px !important;

    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
/* BLOND — FIX TITLE + FEATURES */

/* BLOND COLLECTION في المنتصف */
body.index .s-block--fixed-products .s-block__title,
body.index .s-block--fixed-products .s-block__title h2,
body.index .s-block--fixed-products h2 {
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    justify-content: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* رجع دوائر الأيقونات سوداء */
body.index .s-block--features [class*="icon"] {
    background: #080808 !important;
    color: #ffffff !important;
}

body.index .s-block--features [class*="icon"] svg {
    color: #ffffff !important;
    stroke: #ffffff !important;
}
/* BLOND COLLECTION — CENTER */

section[component-id="277558456"] .s-block__title {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
}

section[component-id="277558456"] .s-block__title .right-side {
    width: 100% !important;
    text-align: center !important;
}

section[component-id="277558456"] .s-block__title h2 {
    text-align: center !important;
    width: 100% !important;
    letter-spacing: 6px !important;
}

/* الخط الذهبي تحته */
section[component-id="277558456"] .s-block__title h2::after {
    content: "";
    display: block;
    width: 52px;
    height: 2px;
    background: #C7A36B;
    margin: 14px auto 0;
}
/* BLOND — PRODUCT IMAGE + HEART CREAM */

/* خلفية منطقة صورة المنتج */
body.index .s-product-card-image,
body.index .s-product-card-image a {
    background: #F3E8D8 !important;
}

/* دائرة القلب */
body.index .s-product-card-wishlist-btn,
body.index .s-button-element {
    background: #EADBC6 !important;
    border-color: rgba(199,163,107,.35) !important;
}

/* لون القلب */
body.index .s-product-card-wishlist-btn svg,
body.index .s-button-element svg {
    color: #171717 !important;
    stroke: #171717 !important;
}
/* BLOND — PRODUCT CARD COLOR FIX */

body.index .s-product-card-horizontal,
body.index .s-product-card-horizontal .s-product-card-content,
body.index .s-product-card-horizontal .s-product-card-image,
body.index .s-product-card-horizontal .s-product-card-image a {
    background: #F3E8D8 !important;
}

/* القلب */
body.index .s-product-card-wishlist-btn,
body.index .s-button-element {
    background: #F3E8D8 !important;
}
/* ==========================================
   BLOND — COMPLETE FOOTER DESIGN
========================================== */

/* الفوتر كامل */
footer {
    background: #F5EFE7 !important;
    color: #171717 !important;
    border-top: 1px solid rgba(199,163,107,.22) !important;
}


/* كل أجزاء الفوتر */
footer > *,
footer .container,
footer [class*="footer"] {
    background-color: transparent !important;
}


/* عناوين الفوتر */
footer h2,
footer h3,
footer h4,
footer h5,
footer strong {
    color: #171717 !important;
}


/* النصوص */
footer p,
footer span {
    color: #6F675E !important;
}


/* الروابط */
footer a {
    color: #6F675E !important;
    transition: .25s ease !important;
}

footer a:hover {
    color: #C7A36B !important;
}


/* أيقونات الفوتر */
footer svg,
footer i {
    color: #C7A36B !important;
    stroke: #C7A36B !important;
}


/* دوائر السوشال والتواصل */
footer a[class*="social"],
footer [class*="social"] a,
footer [class*="contact"] a {
    border-color: rgba(199,163,107,.35) !important;
}


/* الخطوط والفواصل */
footer hr,
footer [class*="border"] {
    border-color: rgba(199,163,107,.20) !important;
}


/* ==========================================
   CUSTOMER REVIEWS
========================================== */

/* منطقة آراء العملاء */
body.index [class*="testimonial"],
body.index [class*="review"] {
    border-color: rgba(199,163,107,.20) !important;
}


/* كروت الآراء */
body.index [class*="testimonial"] [class*="card"],
body.index [class*="review"] [class*="card"] {
    background: rgba(255,252,247,.72) !important;
    border: 1px solid rgba(199,163,107,.15) !important;
    border-radius: 14px !important;

    box-shadow:
        0 12px 30px rgba(90,65,35,.05) !important;
}


/* النجوم */
body.index [class*="testimonial"] svg,
body.index [class*="review"] svg {
    color: #C7A36B !important;
}


/* ==========================================
/* ==========================================
   BLOND — BOTTOM COPYRIGHT BAR
========================================== */

footer > div.md\:flex.items-center.justify-between.py-4.container.text-center {
    background: #080808 !important;
    color: #C7A36B !important;
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 30px !important;
    padding-right: 30px !important;
}

/* يخفي النص الأصلي */
footer > div.md\:flex.items-center.justify-between.py-4.container.text-center > div:last-child {
    font-size: 0 !important;
}

/* النص الجديد */
footer > div.md\:flex.items-center.justify-between.py-4.container.text-center > div:last-child::after {
    content: "جميع الحقوق محفوظه لـ BLOND | 2026";
    font-size: 14px !important;
    color: #C7A36B !important;
}
/* BLOND — COPYRIGHT TEXT COLOR */

footer .copyright-text p {
    color: #C7A36B !important;
}
/* BLOND — CHANGE COPYRIGHT TEXT */

footer .copyright-text p {
    font-size: 0 !important;
}

footer .copyright-text p::after {
    content: "جميع الحقوق محفوظه لـ BLOND";
    font-size: 14px !important;
    color: #C7A36B !important;
}
/* BLOND — LUXURY BACKGROUND FIX */

body.index main {
    background:
        radial-gradient(circle at 50% 20%,
            rgba(255,255,255,.55) 0%,
            transparent 38%),
        radial-gradient(circle at 15% 60%,
            rgba(199,163,107,.10) 0%,
            transparent 32%),
        radial-gradient(circle at 85% 65%,
            rgba(199,163,107,.08) 0%,
            transparent 35%),
        linear-gradient(
            135deg,
            #F4EDE4 0%,
            #E8DAC7 50%,
            #F5EEE5 100%
        ) !important;
}

/* نخلي الاقسام شفافه عشان يظهر التدرج */
body.index main section {
    background: transparent !important;
}
/* BLOND — FOOTER EXACT BACKGROUND MATCH */

.store-footer__inner {
    background:
        radial-gradient(circle at 50% 20%,
            rgba(255,255,255,.55) 0%,
            transparent 38%),
        radial-gradient(circle at 15% 60%,
            rgba(199,163,107,.10) 0%,
            transparent 32%),
        radial-gradient(circle at 85% 65%,
            rgba(199,163,107,.08) 0%,
            transparent 35%),
        linear-gradient(
            135deg,
            #F4EDE4 0%,
            #E8DAC7 50%,
            #F5EEE5 100%
        ) !important;

    border: 0 !important;
}
/* BLOND — ONE UNIFIED COLOR */

body.index,
body.index main,
body.index main > *,
.store-footer,
.store-footer__inner {
    background: #EFE3D3 !important;
    background-image: none !important;
}
/* BLOND — PRODUCT PAGE COLORS */

body.product-single,
body.product-single main,
body.product-single #main-content {
    background: #EFE3D3 !important;
    background-image: none !important;
}

/* بوكس السعر والكمية */
body.product-single .product-form,
body.product-single [class*="product-form"] {
    background: #F7EFE4 !important;
}

/* خلفية منطقة صورة المنتج */
body.product-single [class*="product-gallery"],
body.product-single [class*="product-image"] {
    background: #EFE3D3 !important;
}

/* الازرار */
body.product-single salla-add-product-button button {
    background: #080808 !important;
    color: #C7A36B !important;
}

/* القلب والمشاركة */
body.product-single .btn--wishlist,
body.product-single [class*="wishlist"],
body.product-single [class*="share"] {
    border-color: #C7A36B !important;
}
/* BLOND — PRODUCT PAGE FINAL FIX */

/* بوكس السعر والكمية */
body:not(.index) section.bg-white {
    background: #F3E8D8 !important;
    border: 1px solid rgba(199,163,107,.22) !important;
    box-shadow: none !important;
}

/* عداد الكمية */
body:not(.index) section.bg-white input,
body:not(.index) section.bg-white button {
    border-color: rgba(199,163,107,.35) !important;
}

/* القلب والمشاركة */
body:not(.index) .btn--wishlist,
body:not(.index) [class*="wishlist"],
body:not(.index) [class*="share"] {
    background: #F3E8D8 !important;
    border-color: #C7A36B !important;
}

/* زر أضف للسلة */
body:not(.index) salla-add-product-button button {
    background: #080808 !important;
    color: #C7A36B !important;
}
/* BLOND — PRODUCT MAIN IMAGE WHITE BACKGROUND */

.product-entry .s-slider-block__display,
.product-entry .swiper-slide,
.product-entry .swiper-slide img {
    background: #FFFFFF !important;
}
/* BLOND — PRODUCT IMAGE SAME BACKGROUND */

body:not(.index) .product-entry .s-slider-block__display,
body:not(.index) .product-entry .swiper,
body:not(.index) .product-entry .swiper-wrapper,
body:not(.index) .product-entry .swiper-slide,
body:not(.index) .product-entry .swiper-slide img {
    background: #F3E8D8 !important;
}
/* BLOND — FAQ STYLE */

body:not(.index) details {
    max-width: 700px;
    margin: 12px auto !important;
    background: #F3E8D8 !important;
    border: 1px solid rgba(199,163,107,.45) !important;
    border-radius: 10px !important;
    overflow: hidden;
}

body:not(.index) details summary {
    padding: 16px 20px !important;
    color: #171717 !important;
    font-weight: 600 !important;
    cursor: pointer;
}

body:not(.index) details[open] summary {
    border-bottom: 1px solid rgba(199,163,107,.25) !important;
}

body:not(.index) details > *:not(summary) {
    padding: 0 20px 16px !important;
    color: #6F675E !important;
    line-height: 1.8 !important;
}
/* BLOND — HIDE DISCOUNT BADGE */
.product-entry__image .promotion-title,
.product-entry .promotion-title,
[class*="product"] .promotion-title {
    display: none !important;
}
/* BLOND — HIDE DISCOUNT ON PRODUCT CARDS */
salla-product-card .s-product-card-promotion-title,
salla-product-card [class*="promotion"],
.s-product-card-promotion-title {
    display: none !important;
}
/* BLOND — REMOVE WHITE BARS */

body:not(.index) section.bg-white,
body:not(.index) .s-quantity-input-input {
    background: #F1E3CD !important;
}

/* خانة رقم الموديل */
body:not(.index) section.bg-white {
    border-color: rgba(199,163,107,.35) !important;
}

/* خانة الكمية */
body:not(.index) .s-quantity-input-input {
    border-color: rgba(199,163,107,.35) !important;
}
/* BLOND — MODEL NUMBER BAR */

body:not(.index) [class*="sku"],
body:not(.index) [class*="model"] {
    background: #F1E3CD !important;
    border-color: rgba(199,163,107,.35) !important;
}
/* BLOND — MODEL NUMBER FULL BAR */

body:not(.index) .product-sku-wrapper > div.bg-white {
    background: #F1E3CD !important;
}
/* BLOND — HIDE MODEL NUMBER */
body:not(.index) .product-sku-wrapper {
    display: none !important;
}
/* BLOND — COMMENTS BACKGROUND */
.s-comments-product {
    background-color: #F1E3CD !important;
}
/* BLOND — CART SUMMARY */
.s-cart-summary-card {
    background-color: #F1E3CD !important;
}
/* BLOND — CART SUMMARY HEADER */
.s-cart-summary-card-sheet-header {
    background: #F1E3CD !important;
}
/* BLOND — CART SUMMARY BAR */
.s-cart-summary-card-bar {
    background: #F1E3CD !important;
}
/* BLOND — ADD TO CART POPUP */
salla-add-product-toast,
.s-add-product-toast,
.s-add-product-toast--visible {
    background: #F1E3CD !important;
    color: #080808 !important;
}

/* داخل النافذة */
salla-add-product-toast > *,
.s-add-product-toast > * {
    background-color: #F1E3CD !important;
}

/* الأزرار */
salla-add-product-toast .s-button-element {
    background: #F1E3CD !important;
    border-color: #C7A36B !important;
    color: #080808 !important;
}
/* BLOND — HIDE ANNOUNCEMENT CLOSE X */
.top-navbar .close,
.top-navbar [class*="close"],
.announcement-bar [class*="close"] {
    display: none !important;
}
/* BLOND — MOVING ANNOUNCEMENT BAR */
.top-navbar .container,
.top-navbar,
[class*="announcement"] {
    overflow: hidden !important;
}

.top-navbar p,
.top-navbar a,
[class*="announcement"] p,
[class*="announcement"] a {
    white-space: nowrap !important;
    color: #C7A36B !important;
    animation: blondAnnouncement 10s linear infinite !important;
}

@keyframes blondAnnouncement {
    from {
        transform: translateX(100%);
    }
    to {
        transform: translateX(-100%);
    }
}
/* BLOND — MOVING ANNOUNCEMENT */
.s-advertisement-content {
    overflow: hidden !important;
}

.s-advertisement-content-main {
    display: inline-flex !important;
    width: max-content !important;
    white-space: nowrap !important;
    animation: blondMarquee 15s linear infinite !important;
}

.s-advertisement-content-icon {
    display: none !important;
}

@keyframes blondMarquee {
    0% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(-100%);
    }
}