/* =========================================
   🎨 MALAK WATCHES — Custom Store CSS
   Cleaned & Optimized v2.0
   ========================================= */

/* 1. FONTS & BASE */
@font-face {
  font-family: 'Cairo';
  src: url('fonts/Cairo-Regular.woff2') format('woff2'),
       url('fonts/Cairo-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
}.dark :where(.s-breadcrumb-arrow svg) {
    fill: #ededed!important;
    opacity: 0.6;
}.dark .s-slider-block__title p {
    color: #051827;
}.tamara-summary-widget__inline__text {
    display: inline;
    color: #051827;
}.dark .thankyou-block {
    background-color: #14364f;
}.main-nav-container {
    min-height: 0;
    min-height: 104px;

}.s-cart-summary-count {
    background: #dc2626;
    height: .9rem;
    left: auto !important;
    padding: .1rem;
    right: 0 !important;
    top: 0 !important;
    width: .9rem;
}
.dark .styles__containerPortal--c9f84, .dark salla-installment>.mb-5 {
    background-color: #fff;
}.dark salla-installment>.mb-5 {
    color: #0a2e49;
}body {
    color: #231f1e;
    color: #d8ceb8;
    font-size: 15px;
    font-weight: 400;
    line-height: 26px;
}.dark salla-order-totals-card .s-order-totals-card-panel {
    background-color: #0d3451 !important;
    border-color: var(--dark-bg-main) !important;
}
body {
  font-family: 'Cairo', 'Tajawal', 'Montserrat', sans-serif;
  background: #0A2E49;
}.tabs__product .tab-trigger {
    background-color: #b9ac8f;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-top-left-radius: .375rem;
    border-top-right-radius: .375rem;
    color: var(--text-btn);
    padding: .5rem;
}
html, body { overflow-x: hidden; }

/* 2. LAYOUT */
header, main, section, .s-block, .container, .main-content {
  background-color: transparent !important;
}
.dark .opt-text p {
    color: #f3eae2!important;
}

/* 3. DARK MODE */
.dark .tabs-wrapper { background-color: #0a2e49;}
.dark .tabs .tab-trigger.is-active { background-color: #dfdaca; color: #0a2337; }
.dark .da-bgg { background-color: #0d3451 !important; }
.dark .da-cp  { color: #d0cec7 !important; }
.dark .da-tm  { color: #E5DFD3 !important; }
.dark .s-modal-body { background-color: #0a2e49; }
.dark .s-product-card-fixed-btn button { background-color: #0a2e49; }
.dark .s-add-product-toast__card { background-color: #0b2a41; }
.dark .footer-profile blockquote, .dark .footer-profile p { color: #E5DFD3; }

.dark .form-input, .dark .s-comment-form-input, .dark .s-login-modal-input,
.dark .s-product-availability-input, .dark .s-verify-input,
.dark .tel-input, .dark input, .dark select, .dark textarea {
  background-color: #d9d5cb; color: #ffffff;
}
.dark :where(.s-breadcrumb-item, .s-breadcrumb-item a,
  .s-product-options-option-label, .s-product-options-option-label b,
  .s-product-options-option-label small,
  .s-product-options-colors-item label > div) { color: #e5dfd3 !important; }

.s-login-modal-wrapper { transition: 0.3s cubic-bezier(0.55,0,0.1,1); background-color: #072941; }
.s-login-modal-label:is(.dark *) { color: rgb(10 46 73); }

/* 4. TYPOGRAPHY */
.text-primary { color: #e5dfd3; }
.s-add-product-toast__title, .s-add-product-toast__name { color: #d9d5cb; }
.s-quantity-input-input { color: #d9d5cb; }


/* 5. PRODUCT CARD */
.s-product-card-content {
  display: flex; flex-direction: column; height: 100%;
  padding: 0.5rem !important; margin-bottom: 0 !important;
  width: 100%; background-color: #0d3451;
}
.s-product-card-promotion-title {
  border-radius: 0 0 0 0.75rem !important;
  padding: 0.25rem 0.5rem !important;
  top: 0 !important; background-color: #d84144;
}

/* 6. BUTTONS */
.s-button-element:not(:disabled):not([loading]):hover {
  background: linear-gradient(135deg, #2C3E5C 0%, #1F2D45 100%) !important;
  color: #E5DFD3 !important; transform: translateY(-3px) scale(1.02);
  border-color: #E5DFD3 !important; letter-spacing: 1.5px !important;
  box-shadow: 0 12px 30px rgba(44,62,92,0.5), 0 0 25px rgba(229,223,211,0.4) !important;
  animation: none;
}


.s-button-element[loading] {
opacity: 0.85 !important;
  background: linear-gradient(135deg, #D4C9B0 0%, #B5A98F 100%) !important;
  color: transparent !important; position: relative !important;
}
.s-button-element[loading]::after {
  content: '' !important; position: absolute !important;
  width: 22px !important; height: 22px !important;
  border: 2.5px solid #2C3E5C !important; border-top-color: transparent !important;
  border-radius: 50% !important; animation: malakSpin 0.7s linear infinite !important;
  top: 50% !important; left: 50% !important; margin: -11px 0 0 -11px !important;
}
.s-button-element.malak-added {
  background: linear-gradient(135deg, #4CAF50 0%, #2E7D32 100%) !important;
  color: #fff !important; border-color: #4CAF50 !important;
  animation: malakSuccess 0.6s ease !important;
}
.s-fast-checkout-button.outline {
  background-color: #f14949; border: 1px solid var(--color-primary); color: #f1f1f1;
}
.s-add-product-button-mini-checkout-content {
  display: flex; align-items: center; flex-shrink: 0;
  font-size: 0.8rem; white-space: nowrap; color: #ffffff !important;
}
@media (min-width: 640px) {
  .s-add-product-button-mini-checkout-content { font-size: 0.875rem; line-height: 1.25rem; }
}

/* 7. ICONS */
.s-contacts-icon svg, .s-social-link a svg { fill: rgb(15 41 64); height: 0.875rem; width: 0.875rem; }

/* 8. SLIDER */
.s-slider-wrapper .swiper-pagination-bullet { background-color: rgb(249,249,249); }

/* 9. FAQ */
.s-block--faqs .faqs-list input:checked + div label { color: #dad6cd; }

/* 10. CUSTOM CURSOR */
.malak-cursor, .malak-cursor-dot, .malak-sparkle, .malak-ripple { pointer-events: none !important; z-index: 9999; }
.malak-cursor {
  position: fixed; width: 20px; height: 20px; transform: translate(-50%,-50%);
  transition: width 0.25s, height 0.25s, filter 0.25s;
  filter: drop-shadow(0 0 8px #E5DFD3); will-change: left, top;
}
.malak-cursor::before {
  content: ''; position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,");
  background-size: contain; background-repeat: no-repeat; background-position: center;
  animation: malakCursorSpin 4s linear infinite;
}
.malak-cursor.hover { width: 55px; height: 55px; filter: drop-shadow(0 0 20px #E5DFD3) brightness(1.2); }
.malak-cursor-dot {
  position: fixed; width: 5px; height: 5px; transform: translate(-50%,-50%);
  background-image: url("data:image/svg+xml;utf8,");
  background-size: contain; background-repeat: no-repeat;
  filter: drop-shadow(0 0 6px #E5DFD3); will-change: left, top;
}
.dark .s-slider-block__title h2 {
    color: #0a2e49;
}
/* 11. SPARKLE EFFECT */
.malak-sparkle {
  position: fixed; pointer-events: none; z-index: 9998;
  color: var(--malak-gold, #E5DFD3); text-shadow: 0 0 10px var(--malak-gold, #E5DFD3);
  animation: malakSparkleAnim 1s ease-out forwards;
}
footer .malak-sparkle, form .malak-sparkle, input ~ .malak-sparkle { display: none !important; }

/* 12. KEYFRAMES */
@keyframes malakCursorSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes malakSparkleAnim {
  0%   { transform: translate(-50%,-50%) scale(0)   rotate(0deg);   opacity: 1; }
  100% { transform: translate(-50%,-50%) scale(1.5) rotate(180deg); opacity: 0; }
}
@keyframes malakBtnPulse {
  0%, 100% { box-shadow: 0 4px 15px rgba(44,62,92,0.25), 0 0 0 0 rgba(229,223,211,0.6), inset 0 1px 0 rgba(255,255,255,0.5); }
  50%       { box-shadow: 0 4px 15px rgba(44,62,92,0.25), 0 0 0 12px rgba(229,223,211,0), inset 0 1px 0 rgba(255,255,255,0.5); }
}
@keyframes malakSpin { to { transform: rotate(360deg); } }
@keyframes malakSuccess { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }