/* Kalkasi Smart Rewards — premium RTL reward timeline */
.ksr-rewards {
  --ksr-gold: #e8c56a;
  --ksr-gold-deep: #a97818;
  --ksr-ink: #11100d;
  direction: rtl;
  position: relative;
  isolation: isolate;
  overflow: hidden;
  margin: 0 0 24px;
  padding: 22px;
  border: 1px solid rgba(232, 197, 106, .5);
  border-radius: 18px;
  color: #fff4d3;
  background: radial-gradient(circle at 8% 0, rgba(232, 197, 106, .18), transparent 34%), linear-gradient(135deg, #1d1810, #0c0c0b 64%);
  box-shadow: 0 14px 32px rgba(0, 0, 0, .20);
}

.ksr-rewards::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  opacity: .32;
  background: linear-gradient(110deg, transparent 20%, rgba(255, 234, 170, .10) 45%, transparent 60%);
  transform: translateX(-100%);
  animation: ksr-shine 7s ease-in-out infinite;
}

.ksr-rewards__head { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
.ksr-rewards__eyebrow { color: var(--ksr-gold); font-size: 15px; font-weight: 800; letter-spacing: .02em; }
.ksr-rewards__head strong { color: #fff8e4; font-size: 17px; }
.ksr-rewards__head .woocommerce-Price-amount { color: inherit; }

.ksr-rewards__timeline-wrap {
  position: relative;
  overflow-x: auto;
  margin: 18px -4px 14px;
  padding: 12px 4px 15px;
  scrollbar-color: var(--ksr-gold-deep) #17140e;
  scrollbar-width: thin;
}

.ksr-rewards__timeline { position: relative; display: flex; min-width: 790px; align-items: flex-start; justify-content: space-between; padding: 0 17px; }
.ksr-rewards__rail { position: absolute; top: 32px; right: 38px; left: 38px; height: 4px; overflow: hidden; border-radius: 99px; background: #544423; }
.ksr-rewards__rail span { display: block; height: 100%; min-width: 0; border-radius: inherit; background: linear-gradient(90deg, #a8791a, #fff0a7 52%, #b57e1d); box-shadow: 0 0 14px rgba(255, 218, 115, .72); transition: width .65s cubic-bezier(.2,.75,.25,1); }

.ksr-stage { z-index: 1; display: flex; flex: 1 0 70px; flex-direction: column; align-items: center; min-width: 70px; gap: 7px; text-align: center; }
.ksr-stage__icon { display: grid; width: 52px; height: 52px; place-items: center; border: 2px solid #62512c; border-radius: 50%; color: #8d805f; background: #191713; box-shadow: 0 0 0 5px #12110f; filter: grayscale(1); transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease, background .3s ease; }
.ksr-stage__icon svg { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.ksr-stage__amount { color: #a7976f; font-size: 12px; font-weight: 800; white-space: nowrap; }
.ksr-stage--done .ksr-stage__icon, .ksr-stage--claimed .ksr-stage__icon, .ksr-stage--current .ksr-stage__icon { border-color: var(--ksr-gold); color: #fff0a6; background: #30250e; filter: none; box-shadow: 0 0 0 5px #12110f, 0 0 17px rgba(232, 197, 106, .48); }
.ksr-stage--done .ksr-stage__amount, .ksr-stage--claimed .ksr-stage__amount, .ksr-stage--current .ksr-stage__amount { color: #ffe7a0; }
.ksr-stage--claimed .ksr-stage__icon { color: #fff7c8; background: #3c2e0c; }
.ksr-stage--current .ksr-stage__icon { transform: scale(1.12); animation: ksr-pulse 1.55s ease-in-out infinite; }

.ksr-rewards__copy { margin: 6px auto 0; max-width: 660px; text-align: center; }
.ksr-rewards__copy h3 { margin: 0 0 7px; color: #ffedaf; font-size: 17px; line-height: 1.55; }
.ksr-rewards__copy p { margin: 0; color: #fff4d7; font-size: 14px; line-height: 2; }
.ksr-rewards__copy .woocommerce-Price-amount { color: #ffdd70; font-weight: 900; }
.ksr-rewards__activity { margin: 12px 0 0; color: #cbb982; font-size: 12px; text-align: center; }

/* The next reward is deliberately separated from the timeline so the customer
   sees a single, clear incentive rather than having to decode every stage. */
.ksr-next-reward { margin: 17px 0 4px; padding: 14px 15px; border: 1px solid rgba(240, 203, 91, .62); border-radius: 13px; color: #fff4d8; background: linear-gradient(110deg, rgba(174, 119, 18, .26), rgba(39, 29, 9, .85) 50%, rgba(174, 119, 18, .16)); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 9px 20px rgba(0,0,0,.17); }
.ksr-next-reward__head { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #ffe9a1; font-size: 13px; font-weight: 900; }
.ksr-next-reward__head span::before { content: "✦"; margin-left: 7px; color: #ffdc6d; }
.ksr-next-reward__head strong { min-width: 43px; padding: 3px 7px; border-radius: 999px; color: #171006; text-align: center; background: linear-gradient(135deg, #c99223, #ffeaa0); }
.ksr-next-reward p { margin: 8px 0 9px; color: #fff9e7; font-size: 14px; font-weight: 800; line-height: 1.55; }
.ksr-next-reward__bar { height: 9px; overflow: hidden; border: 1px solid rgba(255, 226, 128, .28); border-radius: 999px; background: #16120a; box-shadow: inset 0 1px 3px rgba(0,0,0,.5); }
.ksr-next-reward__bar span { display: block; height: 100%; min-width: 4px; border-radius: inherit; background: linear-gradient(90deg, #b47a14, #ffe79a 50%, #d19a2d); box-shadow: 0 0 13px rgba(255, 214, 100, .75); transition: width .65s cubic-bezier(.2,.75,.25,1); }
.ksr-next-reward small { display: block; margin-top: 8px; color: #f5db96; font-size: 12px; line-height: 1.65; }
.ksr-next-reward .woocommerce-Price-amount { color: #fff0ad; font-weight: 900; }

.ksr-open-gifts { display: block; margin: 17px auto 0; padding: 12px 27px; border: 1px solid rgba(255, 239, 170, .9); border-radius: 10px; color: #211807; font-size: 15px; font-weight: 900; background: linear-gradient(135deg, #ad7919, #ffe69a 52%, #ad7919); box-shadow: 0 9px 22px rgba(239, 200, 94, .30); cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.ksr-open-gifts:hover { transform: translateY(-2px); box-shadow: 0 13px 27px rgba(239, 200, 94, .46); }
.ksr-open-gifts:focus-visible, .ksr-gift-card:focus-visible, .ksr-modal__close:focus-visible { outline: 3px solid #fff0ac; outline-offset: 3px; }

.ksr-modal { position: fixed; z-index: 999999; inset: 0; display: none; align-items: center; justify-content: center; padding: 18px; background: rgba(5, 5, 4, .78); backdrop-filter: blur(4px); }
.ksr-modal.is-open { display: flex; }
.ksr-modal__box { direction: rtl; position: relative; width: min(880px, 100%); max-height: 88vh; overflow: auto; padding: 28px; border: 1px solid rgba(232, 197, 106, .75); border-radius: 18px; color: #fff3cb; background: radial-gradient(circle at top right, rgba(232, 197, 106, .13), transparent 34%), #15120d; box-shadow: 0 25px 65px rgba(0,0,0,.6); }
.ksr-modal__box h2 { margin: 0 0 19px; color: #ffeb9f; font-size: 21px; text-align: center; }
.ksr-modal__close { position: absolute; top: 9px; left: 12px; width: 38px; height: 38px; border: 0; border-radius: 50%; color: #fff7dc; font-size: 27px; line-height: 1; background: transparent; cursor: pointer; }
.ksr-modal__close:hover { background: rgba(255,255,255,.09); }
.ksr-gifts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 13px; }
.ksr-gift-card { overflow: hidden; padding: 10px; border: 1px solid #5f4b21; border-radius: 13px; color: #fff2ce; text-align: center; background: #211b10; cursor: pointer; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.ksr-gift-card:hover { transform: translateY(-3px); border-color: #e7c35f; box-shadow: 0 10px 22px rgba(0,0,0,.25); }
.ksr-gift-card img { display: block; width: 100%; height: auto; border-radius: 8px; }
.ksr-gift-card strong { display: block; min-height: 40px; margin: 10px 0 5px; font-size: 14px; line-height: 1.45; }
.ksr-gift-card__variation { display: block; margin: 5px 0; color: #ffe19a; font-size: 11px; font-weight: 800; line-height: 1.45; }
.ksr-gift-card em { display: block; margin-bottom: 5px; color: #cdbb86; font-size: 12px; font-style: normal; }
.ksr-gift-card em .woocommerce-Price-amount { color: #e9ca6d; }
.ksr-gift-card span { color: #ffd866; font-size: 13px; font-weight: 800; }
.ksr-gift-card:disabled { cursor: progress; opacity: .68; }
.ksr-modal__message { margin: 12px 0; color: #f7dfa0; text-align: center; }
.ksr-skeleton { display: grid; grid-template-columns: repeat(3, 1fr); gap: 13px; }
.ksr-skeleton span { display: block; height: 190px; border-radius: 13px; background: linear-gradient(90deg, #211b10 25%, #40351e 50%, #211b10 75%); background-size: 200% 100%; animation: ksr-loading 1.2s linear infinite; }

@keyframes ksr-pulse { 50% { transform: scale(1.19); box-shadow: 0 0 0 5px #12110f, 0 0 25px rgba(255, 221, 116, .7); } }
@keyframes ksr-shine { 25%, 100% { transform: translateX(120%); } }
@keyframes ksr-loading { to { background-position: -200% 0; } }

@media (max-width: 600px) {
  .ksr-rewards { padding: 17px 13px; border-radius: 15px; }
  .ksr-rewards__head strong { font-size: 15px; }
  .ksr-rewards__timeline { min-width: 745px; }
  .ksr-stage { flex-basis: 68px; min-width: 68px; }
  .ksr-stage__icon { width: 45px; height: 45px; }
  .ksr-stage__icon svg { width: 20px; height: 20px; }
  .ksr-rewards__rail { top: 28px; }
  .ksr-modal__box { padding: 25px 16px 18px; }
  .ksr-skeleton { grid-template-columns: repeat(2, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
  .ksr-rewards::before, .ksr-stage--current .ksr-stage__icon, .ksr-skeleton span { animation: none; }
  .ksr-rewards__rail span, .ksr-stage__icon, .ksr-open-gifts, .ksr-gift-card { transition: none; }
}

.ksr-rewards--no-motion::before, .ksr-rewards--no-motion .ksr-stage--current .ksr-stage__icon { animation: none; }

/* Premium gift-picker refresh. */
.ksr-modal { padding: 24px; background: rgba(3, 3, 3, .82); }
.ksr-modal__box { width: min(1050px, 100%); padding: 34px; border-color: rgba(233, 194, 82, .9); background: radial-gradient(circle at top right, rgba(236, 193, 73, .15), transparent 31%), linear-gradient(145deg, #16130e, #090909); }
.ksr-modal__box h2 { position: relative; padding-bottom: 13px; font-size: 24px; letter-spacing: -.2px; }
.ksr-modal__box h2::after { content: "اختر هديتك المجانية من المنتجات التالية"; display: block; margin-top: 7px; color: #cdbd90; font-size: 13px; font-weight: 500; }
.ksr-gifts { grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 16px; }
.ksr-gift-card { position: relative; display: flex; flex-direction: column; min-height: 290px; padding: 0; border: 1px solid rgba(225, 187, 81, .35); border-radius: 15px; color: #fff2ce; text-align: right; background: linear-gradient(165deg, #292113, #17130c); }
.ksr-gift-card::before { content: "هدية مجانية"; position: absolute; z-index: 2; top: 11px; right: 11px; padding: 5px 9px; border: 1px solid rgba(255, 224, 136, .66); border-radius: 999px; color: #fff0b0; font-size: 11px; font-weight: 800; background: rgba(24, 19, 9, .84); }
.ksr-gift-card:hover { transform: translateY(-4px); border-color: #f2cf71; box-shadow: 0 16px 28px rgba(0, 0, 0, .4), 0 0 0 1px rgba(241, 204, 105, .12) inset; }
.ksr-gift-card img { width: 100%; height: 158px; margin: 0; padding: 12px; object-fit: contain; border-radius: 15px 15px 0 0; background: linear-gradient(145deg, #f7f0de, #d9cda9); }
.ksr-gift-card strong { min-height: 0; margin: 11px 13px 2px; color: #fff3cf; font-size: 15px; line-height: 1.45; }
.ksr-gift-card__variation { margin: 2px 13px 8px; color: #e8cb77; font-size: 12px; }
.ksr-gift-card em { margin: 0 13px 8px; color: #cdbd90; font-size: 12px; }
.ksr-gift-card em del { color: #f0d483; text-decoration-color: #c28e2c; text-decoration-thickness: 1px; }
.ksr-gift-card span { display: block; width: calc(100% - 26px); margin: auto 13px 13px; padding: 10px 8px; border-radius: 8px; color: #1a1305; font-size: 13px; font-weight: 800; text-align: center; background: linear-gradient(135deg, #b9801e, #ffe08a, #bd861f); }
.ksr-gift-card:disabled span { background: #9c8553; }

@media (max-width: 600px) {
  .ksr-modal { padding: 10px; }
  .ksr-modal__box { padding: 30px 13px 16px; border-radius: 15px; }
  .ksr-modal__box h2 { font-size: 20px; }
  .ksr-gifts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .ksr-gift-card { min-height: 235px; }
  .ksr-gift-card img { height: 116px; padding: 8px; }
  .ksr-gift-card strong { margin: 8px 9px 2px; font-size: 13px; }
  .ksr-gift-card__variation { margin: 1px 9px 7px; font-size: 10px; }
  .ksr-gift-card em { margin: 0 9px 7px; font-size: 10px; }
  .ksr-gift-card span { width: calc(100% - 18px); margin: auto 9px 9px; padding: 8px 5px; font-size: 11px; }
}