/**
 * FC COINS KSA Theme
 * Saudi Arabia inspired color scheme with green from flag
 */

:root {
  /* Saudi green colors */
  --fccoinsksa-green: #006C35;
  --fccoinsksa-green-bright: #00843D;
  --fccoinsksa-green-dark: #005429;

  /* Override primary colors */
  --primary: #006C35;
  --primary-600: #005429;
  --primary-color: #006C35;
}

/* Buttons - Dark theme */
body:not([data-theme="light"]) .btn-primary {
  background: var(--fccoinsksa-green);
  color: #ffffff;
  border: none;
  font-weight: 600;
  transition: all 0.2s ease;
}

body:not([data-theme="light"]) .btn-primary:hover {
  background: var(--fccoinsksa-green-bright);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 108, 53, 0.3);
}

/* Active tabs */
body:not([data-theme="light"]) .tab.is-active {
  color: #ffffff !important;
  background: var(--fccoinsksa-green) !important;
  border-color: var(--fccoinsksa-green) !important;
}

/* Logo styling - can be customized */
.logo-container {
  color: var(--fccoinsksa-green);
}

/* Promotional Badges - Hidden by default, shown only when theme is enabled */
.toty-promo-badge,
.flash-sale-promo-badge,
.cny-promo-badge,
.flash-lightning-overlay,
.cny-lanterns-container,
.cny-coin-rain-container {
  display: none !important;
}

/* Show TOTY promo when TOTY theme is enabled */
body.toty-theme-enabled .toty-promo-badge {
  display: block !important;
}

/* Show Flash Sale promo when Flash Sale theme is enabled */
body.flash-sale-theme-enabled .flash-sale-promo-badge,
body.flash-sale-theme-enabled .flash-lightning-overlay {
  display: block !important;
}

body.tots-theme-enabled .flash-sale-promo-badge,
body.tots-theme-enabled .flash-lightning-overlay {
  display: block !important;
}

/* Show CNY promo when CNY theme is enabled */
body.cny-theme-enabled .cny-promo-badge,
body.cny-theme-enabled .cny-lanterns-container,
body.cny-theme-enabled .cny-coin-rain-container {
  display: block !important;
}

/* Shared promo badge scaffold for seasonal themes */
.flash-sale-promo-badge {
  position: fixed;
  bottom: 88px;
  left: 20px;
  z-index: 9999;
}

.flash-badge-content {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, var(--fccoinsksa-green-dark) 0%, var(--fccoinsksa-green) 100%);
  padding: 15px 20px;
  border-radius: 14px;
  border: 2px solid var(--fccoinsksa-green-bright);
  box-shadow: 0 10px 28px rgba(0, 108, 53, 0.34), 0 0 18px rgba(0, 132, 61, 0.18);
  cursor: pointer;
  transition: all 0.3s ease;
}

.flash-badge-content:hover {
  transform: translateY(-3px);
  border-color: #14a44d;
  box-shadow: 0 14px 32px rgba(0, 108, 53, 0.42), 0 0 24px rgba(0, 132, 61, 0.26);
}

.flash-badge-icon {
  font-size: 32px;
  line-height: 1;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.4));
}

.flash-badge-text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.flash-badge-title {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: #d7ffe7;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.32);
}

.flash-badge-discount {
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
  color: #ffffff;
  text-shadow: 0 2px 6px rgba(0, 0, 0, 0.42);
}

.flash-badge-code {
  font-size: 11px;
  font-weight: 600;
  font-family: monospace;
  letter-spacing: 0.5px;
  color: #9df6c1;
}

.flash-badge-ends {
  font-size: 10px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.88);
}

.flash-lightning-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 99999;
}

@media (max-width: 768px) {
  .flash-sale-promo-badge {
    bottom: 84px;
    left: 10px;
  }

  .flash-badge-content {
    padding: 12px 16px;
    gap: 10px;
  }

  .flash-badge-icon {
    font-size: 28px;
  }

  .flash-badge-title {
    font-size: 12px;
  }

  .flash-badge-discount {
    font-size: 18px;
  }

  .flash-badge-code {
    font-size: 10px;
  }

  .flash-badge-ends {
    font-size: 9px;
  }
}

/* Match FCUTSTORE mobile header behavior */
@media (max-width: 768px) {
  body[data-store="fccoinsksa"] .site-header.easpc-v2-header .easpc-v2-header-utility {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body .site-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    padding: 10px 12px !important;
    min-height: 60px !important;
    height: auto !important;
  }

  body .header-actions,
  body .header-actions * {
    display: none !important;
    visibility: hidden !important;
  }

  body .header-actions {
    display: flex !important;
    visibility: visible !important;
    align-items: center !important;
    gap: 6px !important;
    width: auto !important;
  }

  body .header-actions > :not(#account-btn) {
    display: none !important;
    visibility: hidden !important;
  }

  body #account-btn {
    display: flex !important;
    visibility: visible !important;
    align-items: center !important;
    justify-content: center !important;
    height: 34px !important;
    padding: 0 10px !important;
    font-size: 12px !important;
    max-width: 140px !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  body .header-left {
    position: static !important;
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    width: auto !important;
  }

  body .mobile-menu-btn {
    display: flex !important;
    visibility: visible !important;
    width: 34px !important;
    height: 34px !important;
  }

  body .header-left > :not(.mobile-menu-btn):not(.whatsapp-btn):not(.lang-dropdown):not(.currency-dropdown) {
    display: none !important;
    visibility: hidden !important;
  }

  body .brand-text {
    display: none !important;
  }

  body .rotating-text {
    display: none !important;
    visibility: hidden !important;
  }

  body .header-left {
    order: 1 !important;
  }

  body .header-actions {
    order: 3 !important;
  }

  body .mobile-nav-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: rgba(0, 0, 0, 0.9) !important;
    backdrop-filter: blur(8px) !important;
  }
}


/* ========================================
   TOTS THEME
   ======================================== */

:root {
  --tots-navy: #081f4d;
  --tots-blue: #0f4cc3;
  --tots-aqua: #5cf2ff;
  --tots-mint: #7dffd6;
  --tots-gold: #f4d47c;
}

body.tots-theme-enabled .flash-sale-promo-badge {
  display: block !important;
  animation: tots-badge-float 3s ease-in-out infinite;
}

body.tots-theme-enabled .flash-badge-content {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, var(--tots-navy) 0%, var(--tots-blue) 58%, #159dcb 100%);
  padding: 15px 20px;
  border-radius: 14px;
  border: 1px solid rgba(125, 255, 214, 0.75);
  box-shadow: 0 12px 30px rgba(8, 31, 77, 0.35), 0 0 18px rgba(92, 242, 255, 0.22);
}

body.tots-theme-enabled .flash-badge-content:hover {
  transform: translateY(-3px);
  border-color: rgba(244, 212, 124, 0.9);
  box-shadow: 0 16px 34px rgba(8, 31, 77, 0.45), 0 0 22px rgba(92, 242, 255, 0.32);
}

body.tots-theme-enabled .flash-badge-icon {
  font-size: 0;
  line-height: 1;
  filter: none;
  animation: none;
}

body.tots-theme-enabled .tots-shield-icon {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 58px;
  clip-path: polygon(50% 0%, 88% 14%, 88% 60%, 50% 100%, 12% 60%, 12% 14%);
  background: linear-gradient(180deg, var(--tots-gold) 0%, var(--tots-mint) 34%, var(--tots-aqua) 66%, #0b5ed7 100%);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.36), inset 0 0 0 2px rgba(255, 255, 255, 0.24);
  animation: tots-shield-glow 2.8s ease-in-out infinite;
}

body.tots-theme-enabled .tots-shield-label {
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 1px;
  color: #17130b;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.28);
}

body.tots-theme-enabled .flash-badge-title {
  color: var(--tots-mint);
  animation: none;
  text-shadow: 0 2px 4px rgba(2, 12, 32, 0.45);
}

body.tots-theme-enabled .flash-badge-discount {
  color: #ffffff;
  text-shadow: 0 3px 10px rgba(2, 12, 32, 0.45);
}

body.tots-theme-enabled .flash-badge-code {
  color: var(--tots-gold);
}

body.tots-theme-enabled .flash-badge-ends {
  color: rgba(255, 255, 255, 0.86);
}

body.tots-theme-enabled #apply-coupon {
  background: linear-gradient(135deg, var(--tots-navy) 0%, var(--tots-blue) 62%, #159dcb 100%) !important;
  border: 2px solid rgba(125, 255, 214, 0.62) !important;
  color: #ffffff !important;
  box-shadow: 0 8px 22px rgba(8, 31, 77, 0.32);
}

body.tots-theme-enabled #apply-coupon:hover {
  border-color: rgba(244, 212, 124, 0.9) !important;
  box-shadow: 0 10px 26px rgba(8, 31, 77, 0.4), 0 0 16px rgba(92, 242, 255, 0.24) !important;
}

body.tots-theme-enabled .flash-lightning-overlay {
  display: block !important;
  opacity: 0;
  transition: opacity 0.35s ease-out;
}

body.tots-theme-enabled .flash-lightning-overlay.active {
  opacity: 1;
}

body.summer-sale-theme-enabled .flash-sale-promo-badge {
  display: block !important;
}

body.summer-sale-theme-enabled .flash-badge-content {
  background:
    radial-gradient(circle at top left, rgba(255, 232, 166, 0.45), rgba(255, 232, 166, 0) 32%),
    linear-gradient(135deg, #ff934f 0%, #ff7a45 44%, #ff5f6d 100%);
  border: 1px solid rgba(255, 235, 188, 0.68);
  box-shadow: 0 12px 30px rgba(89, 33, 13, 0.3), 0 0 24px rgba(255, 179, 71, 0.24);
}

body.summer-sale-theme-enabled .flash-badge-content:hover {
  border-color: rgba(255, 235, 188, 0.86);
  box-shadow: 0 18px 36px rgba(89, 33, 13, 0.4), 0 0 28px rgba(255, 179, 71, 0.34);
}

body.summer-sale-theme-enabled .flash-badge-icon {
  font-size: 0;
  width: 52px;
  height: 52px;
  background: transparent;
  box-shadow: none;
  filter: none;
  animation: none;
}

body.summer-sale-theme-enabled .flash-badge-title {
  color: #fff5df;
  animation: none;
}

body.summer-sale-theme-enabled .flash-badge-code {
  color: #fff2b2;
}

body.summer-sale-theme-enabled .flash-badge-ends {
  color: rgba(255, 248, 231, 0.92);
}

body.summer-sale-theme-enabled .summer-sun-icon {
  position: relative;
  display: inline-flex;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  background: radial-gradient(circle, rgba(255, 243, 194, 0.95) 0%, rgba(255, 210, 84, 0.98) 38%, rgba(255, 146, 79, 1) 78%, rgba(255, 95, 109, 1) 100%);
  box-shadow: 0 0 24px rgba(255, 179, 71, 0.36);
}

body.summer-sale-theme-enabled .summer-sun-icon::before {
  content: '';
  position: absolute;
  inset: -9px;
  border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(255, 222, 125, 0.95) 0deg 16deg, transparent 16deg 30deg, rgba(255, 222, 125, 0.95) 30deg 46deg, transparent 46deg 60deg, rgba(255, 222, 125, 0.95) 60deg 76deg, transparent 76deg 90deg, rgba(255, 222, 125, 0.95) 90deg 106deg, transparent 106deg 120deg, rgba(255, 222, 125, 0.95) 120deg 136deg, transparent 136deg 150deg, rgba(255, 222, 125, 0.95) 150deg 166deg, transparent 166deg 180deg, rgba(255, 222, 125, 0.95) 180deg 196deg, transparent 196deg 210deg, rgba(255, 222, 125, 0.95) 210deg 226deg, transparent 226deg 240deg, rgba(255, 222, 125, 0.95) 240deg 256deg, transparent 256deg 270deg, rgba(255, 222, 125, 0.95) 270deg 286deg, transparent 286deg 300deg, rgba(255, 222, 125, 0.95) 300deg 316deg, transparent 316deg 330deg, rgba(255, 222, 125, 0.95) 330deg 346deg, transparent 346deg 360deg);
  -webkit-mask: radial-gradient(circle, transparent 0 60%, #000 61% 100%);
  mask: radial-gradient(circle, transparent 0 60%, #000 61% 100%);
}

body.summer-sale-theme-enabled .summer-sun-core {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 250, 235, 1) 0%, rgba(255, 230, 148, 1) 54%, rgba(255, 184, 65, 1) 100%);
}

body.summer-sale-theme-enabled #apply-coupon {
  background: linear-gradient(135deg, #ff934f 0%, #ff7a45 50%, #ff5f6d 100%) !important;
  border: 2px solid rgba(255, 232, 166, 0.65) !important;
  color: #fffaf5 !important;
}

body.summer-sale-theme-enabled #apply-coupon:hover {
  border-color: rgba(255, 235, 188, 0.86) !important;
}

body.tots-theme-enabled .flash-lightning-bolt {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 64vmax;
  height: 64vmax;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: radial-gradient(circle, rgba(92, 242, 255, 0.2) 0%, rgba(15, 76, 195, 0.16) 36%, rgba(244, 212, 124, 0.12) 58%, transparent 72%);
  box-shadow: none;
  filter: blur(10px);
  animation: tots-aura-bloom 1.4s ease-out;
}

body.tots-theme-enabled .flash-lightning-bolt::before,
body.tots-theme-enabled .flash-lightning-bolt::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(125, 255, 214, 0.24) 0%, transparent 72%);
  box-shadow: none;
  filter: blur(6px);
}

body.tots-theme-enabled .flash-lightning-bolt::before {
  width: 18vmax;
  height: 18vmax;
  top: 10%;
  left: 12%;
  transform: none;
}

body.tots-theme-enabled .flash-lightning-bolt::after {
  width: 16vmax;
  height: 16vmax;
  right: 14%;
  bottom: 14%;
  transform: none;
}

body.tots-theme-enabled .flash-screen-flash {
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent 0%, rgba(92, 242, 255, 0.05) 28%, rgba(255, 255, 255, 0.12) 50%, rgba(244, 212, 124, 0.08) 72%, transparent 100%);
  animation: tots-sheen-sweep 1.4s ease-out;
}

@keyframes tots-badge-float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-4px);
  }
}

@keyframes tots-shield-glow {
  0%, 100% {
    transform: translateY(0) scale(1);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.36), inset 0 0 0 2px rgba(255, 255, 255, 0.24);
  }
  50% {
    transform: translateY(-1px) scale(1.03);
    box-shadow: 0 14px 26px rgba(0, 0, 0, 0.42), 0 0 14px rgba(92, 242, 255, 0.2), inset 0 0 0 2px rgba(255, 255, 255, 0.3);
  }
}

@keyframes tots-aura-bloom {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.72);
  }
  30% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.08);
  }
}

@keyframes tots-sheen-sweep {
  0% {
    opacity: 0;
    transform: translateX(-10%);
  }
  28% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translateX(10%);
  }
}

@media (max-width: 768px) {
  body.tots-theme-enabled .flash-badge-content {
    padding: 12px 16px;
    gap: 10px;
  }

  body.tots-theme-enabled .tots-shield-icon {
    width: 42px;
    height: 50px;
  }

  body.tots-theme-enabled .tots-shield-label {
    font-size: 9px;
  }
}


/* August Sale Theme - AUG10 ticket badge */
body.august-sale-theme-enabled .flash-sale-promo-badge {
  display: block !important;
}

body.august-sale-theme-enabled .flash-badge-content {
  background: linear-gradient(135deg, #050708 0%, #12171c 52%, #20272f 100%);
  border: 1px solid rgba(216, 255, 61, 0.72);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.36);
}

body.august-sale-theme-enabled .flash-badge-content:hover {
  border-color: rgba(216, 255, 61, 0.9);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.42);
}

body.august-sale-theme-enabled .flash-badge-icon {
  width: 58px;
  height: 48px;
  font-size: 0;
  background: transparent;
  box-shadow: none;
  filter: none;
  animation: none;
}

body.august-sale-theme-enabled .august-ticket-icon {
  position: relative;
  display: inline-flex;
  width: 58px;
  height: 38px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(7, 16, 8, 0.7);
  border-radius: 9px;
  background: #d8ff3d;
  color: #071008;
  transform: rotate(-5deg);
  box-shadow: 0 8px 14px rgba(0, 0, 0, 0.28);
}

body.august-sale-theme-enabled .august-ticket-icon::before,
body.august-sale-theme-enabled .august-ticket-icon::after {
  content: '';
  position: absolute;
  top: 50%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #0b0f12;
  transform: translateY(-50%);
}

body.august-sale-theme-enabled .august-ticket-icon::before {
  left: -6px;
}

body.august-sale-theme-enabled .august-ticket-icon::after {
  right: -6px;
}

body.august-sale-theme-enabled .august-ticket-icon span {
  position: relative;
  z-index: 1;
  font-size: 11px;
  font-weight: 1000;
  letter-spacing: -0.02em;
}

body.august-sale-theme-enabled .flash-badge-title {
  color: #f7f8fb;
  animation: none;
}

body.august-sale-theme-enabled .flash-badge-discount {
  color: #d8ff3d;
}

body.august-sale-theme-enabled .flash-badge-code {
  color: #ffffff;
}

body.august-sale-theme-enabled .flash-badge-ends {
  color: rgba(229, 231, 235, 0.86);
}

body.august-sale-theme-enabled #apply-coupon {
  background: #d8ff3d !important;
  border: 2px solid rgba(216, 255, 61, 0.78) !important;
  color: #071008 !important;
}

body.august-sale-theme-enabled #apply-coupon:hover {
  background: #f0ff70 !important;
  border-color: rgba(240, 255, 112, 0.92) !important;
}