/* =========================================================
   ORS — فرم‌ها، سبد خرید، تسویه و پیام‌ها
   ========================================================= */

.ors-messages {
  width: min(1320px, calc(100% - 64px));
  margin: 18px auto 0;
  display: grid;
  gap: 8px;
}

.ors-message {
  margin: 0;
  padding: 13px 18px;
  border-radius: 12px;
  border-inline-start: 3px solid var(--ors-green);
  background: #1c1c1c;
  color: #fff;
  font-size: 14px;
}

.ors-message--error { border-color: #d0554b; }
.ors-message--warning { border-color: #d9a441; }


/* ---------------- panels ---------------- */

.ors-panel {
  padding: clamp(22px, 2.6vw, 34px);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  background: #1a1a1a;
}

.ors-panel__title {
  margin: 0 0 20px;
  color: #fff;
  font-size: 19px;
  font-weight: 800;
}


/* ---------------- fields ---------------- */

.ors-field { margin-bottom: 18px; }

.ors-field label {
  display: block;
  margin-bottom: 7px;
  color: var(--ors-grey-text-light);
  font-size: 13px;
  font-weight: 600;
}

.ors-field input[type="text"],
.ors-field input[type="tel"],
.ors-field input[type="email"],
.ors-field input[type="number"],
.ors-field select,
.ors-field textarea {
  width: 100%;
  padding: 13px 16px;

  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;

  background: #131313;
  color: #fff;

  font-family: inherit;
  font-size: 15px;

  transition: border-color 0.2s ease;
}

.ors-field input:focus,
.ors-field select:focus,
.ors-field textarea:focus {
  outline: none;
  border-color: var(--ors-green);
}

.ors-field--check {
  display: flex;
  align-items: center;
  gap: 9px;
}

.ors-field--check label { margin: 0; }

.ors-field__error {
  margin: 6px 0 0;
  color: #e2796d;
  font-size: 13px;
}

.ors-field__help {
  margin: 6px 0 0;
  color: var(--ors-grey-text);
  font-size: 12px;
}

/* ارقام و شماره‌ها همیشه چپ‌به‌راست */
.ors-ltr,
input[type="tel"],
input[inputmode="numeric"] {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: start;
}


/* ---------------- OTP ---------------- */

.ors-auth {
  width: min(430px, calc(100% - 32px));
  margin: clamp(48px, 8vh, 96px) auto;
}

.ors-auth__title {
  margin: 0 0 8px;
  color: #fff;
  font-size: 24px;
  font-weight: 900;
}

.ors-auth__lead {
  margin: 0 0 26px;
  color: var(--ors-grey-text);
  font-size: 14px;
  line-height: 1.9;
}

.ors-otp-input {
  letter-spacing: 0.6em;
  text-align: center !important;
  font-size: 22px !important;
  font-weight: 700;
}


/* ---------------- cart ---------------- */

.ors-cart {
  display: grid;
  grid-template-columns: 1.7fr 1fr;
  align-items: start;
  gap: clamp(24px, 3vw, 44px);
}

.ors-line {
  display: grid;
  grid-template-columns: 88px 1fr auto;
  align-items: center;
  gap: 16px;

  padding: 16px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.ors-line__media {
  width: 88px;
  aspect-ratio: 1;
  border-radius: 12px;
  overflow: hidden;
  background: #f2efe9;
}

.ors-line__media img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.ors-line__name {
  margin: 0 0 4px;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.ors-line__meta {
  margin: 0;
  color: var(--ors-grey-text);
  font-size: 13px;
}

.ors-line__qty {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  flex-wrap: wrap;      /* در عرض کم، «حذف» زیر تعداد می‌رود نه بیرون کارت */
}

/* بدون align-items، دکمه در کنار ورودی کشیده می‌شد و ۶۶ پیکسل
   ارتفاع می‌گرفت در حالی که ورودی ۴۴ بود */
.ors-line__form {
  display: flex;
  align-items: center;
  gap: 8px;
}

.ors-line__qty input {
  width: 68px;
  min-height: 44px;
  padding: 7px 10px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 9px;
  background: #131313;
  color: #fff;
  text-align: center;
}

/* دکمه‌ی متنی، با سطح لمس واقعی.
   با padding صفر، «حذف» ۲۸ در ۲۳ پیکسل می‌شد — نصف حداقل ۴۴
   پیکسلی که برای انگشت لازم است، و درست کنار دکمه‌ی به‌روزرسانی.
   margin منفی همان padding را خنثی می‌کند تا چیدمان جابه‌جا نشود:
   سطح لمس بزرگ می‌شود بدون اینکه ظاهر عوض شود. */
.ors-linkbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 10px;
  margin: -11px -10px;

  border: 0;
  border-radius: 8px;
  background: none;
  color: var(--ors-grey-text);
  font-family: inherit;
  font-size: 13px;
  cursor: pointer;
}

.ors-linkbtn:hover { color: #e2796d; }

.ors-linkbtn:focus-visible {
  outline: 2px solid var(--ors-green);
  outline-offset: 2px;
}


/* ---------------- summary ---------------- */

.ors-summary__row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 0;
  color: var(--ors-grey-text-light);
  font-size: 14px;
}

.ors-summary__row--total {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  color: #fff;
  font-size: 17px;
  font-weight: 900;
}

.ors-summary__free {
  color: var(--ors-green);
  font-weight: 700;
}


/* ---------------- checkout ---------------- */

.ors-checkout {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  align-items: start;
  gap: clamp(24px, 3vw, 44px);
}

.ors-shipping-option {
  display: flex;
  align-items: flex-start;
  gap: 12px;

  padding: 15px 18px;
  margin-bottom: 10px;

  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 14px;

  cursor: pointer;
  transition: border-color 0.2s ease;
}

.ors-shipping-option:hover { border-color: var(--ors-green); }

.ors-shipping-option strong {
  display: block;
  color: #fff;
  font-size: 14px;
}

.ors-shipping-option span {
  color: var(--ors-grey-text);
  font-size: 13px;
}


/* ---------------- tables / orders ---------------- */

.ors-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;
}

.ors-table th,
.ors-table td {
  padding: 13px 10px;
  text-align: start;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.ors-table th {
  color: var(--ors-grey-text);
  font-weight: 600;
  font-size: 13px;
}

.ors-table td { color: #fff; }

.ors-status {
  display: inline-block;
  padding: 5px 13px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  font-size: 12px;
  font-weight: 700;
}

.ors-status--paid,
.ors-status--delivered { background: rgba(75, 152, 85, 0.25); color: #8fd39c; }

.ors-status--awaiting_payment { background: rgba(217, 164, 65, 0.22); color: #e8c07a; }

.ors-status--cancelled { background: rgba(208, 85, 75, 0.22); color: #e2796d; }

.ors-empty {
  padding: clamp(40px, 6vw, 80px) 20px;
  text-align: center;
  color: var(--ors-grey-text);
}


@media (max-width: 900px) {
  .ors-cart,
  .ors-checkout { grid-template-columns: 1fr; }
  .ors-messages { width: calc(100% - 32px); }
}

@media (max-width: 560px) {
  /* سه ستون در عرض ۳۹۰ پیکسل جا نمی‌شود: ستون قیمت آن‌قدر فشرده
     می‌شد که «۹۷۵٬۰۰۰ تومان» دو خط می‌شکست و زیر دکمه‌ها می‌افتاد.
     حالا عکس و متن بالا، و قیمت در ردیف خودش زیر آن‌ها. */
  .ors-line {
    grid-template-columns: 64px 1fr;
    align-items: start;
  }

  .ors-line > strong {
    grid-column: 1 / -1;
    padding-top: 4px;
    text-align: start;
    font-size: 16px;
  }
  .ors-line__media { width: 64px; }
}


/* پنل تأیید شماره در تسویه‌ی مهمان */
.ors-otp-panel {
  max-width: 460px;
  margin-inline: auto;
}


/* =========================
   B2B — کارت لینک و فرم
========================= */

.ors-linkcard {
  display: flex;
  flex-direction: column;
  gap: 8px;

  padding: 24px 26px;

  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  background: #1a1a1a;

  transition: border-color 0.2s ease, transform 0.2s ease;
}

.ors-linkcard:hover {
  border-color: var(--ors-green);
  transform: translateY(-2px);
}

.ors-linkcard__title {
  margin: 0;
  color: #fff;
  font-size: 17px;
  font-weight: 800;
}

.ors-linkcard__text {
  margin: 0;
  color: var(--ors-grey-text);
  font-size: 14px;
  line-height: 1.9;
}

.ors-linkcard__more {
  margin-top: auto;
  padding-top: 10px;
  color: var(--ors-green);
  font-size: 13px;
  font-weight: 700;
}

.ors-formgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0 18px;
}

.ors-field--wide { grid-column: 1 / -1; }

.ors-field__optional {
  margin-inline-start: 6px;
  color: var(--ors-grey-text);
  font-size: 11px;
  font-weight: 400;
}


/* ---------------- انتخاب روش پرداخت ---------------- */

.ors-paylist {
  display: grid;
  gap: 12px;
}

.ors-paylist__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  /* ارتفاع کمینه بالای ۴۴px نگه داشته می‌شود: این یک هدف لمسی
     تصمیم‌گیرنده است و نباید روی موبایل کوچک شود. */
  min-height: 68px;
  padding: 16px 20px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: #1a1a1a;
  color: #fff;
  text-decoration: none;
  transition: border-color 0.2s ease, background 0.2s ease;
}

.ors-paylist__item:hover,
.ors-paylist__item:focus-visible {
  border-color: var(--ors-green);
  background: #1f1f1f;
}

.ors-paylist__text { display: grid; gap: 4px; }

.ors-paylist__label { font-size: 16px; font-weight: 800; }

.ors-paylist__tagline {
  color: var(--ors-grey-text-light);
  font-size: 13px;
  line-height: 1.7;
}

.ors-paylist__badge {
  flex: none;
  padding: 5px 11px;
  border-radius: 999px;
  background: var(--ors-green-action);
  color: #fff;
  font-size: 12px;
  font-weight: 700;
}

.ors-paylist__note {
  margin-top: 18px;
  color: var(--ors-grey-text-light);
  font-size: 13px;
  line-height: 2;
  text-align: center;
}


/* ---------------- ستاره‌های امتیاز ---------------- */

/*
  انتخاب امتیاز با ستاره، نه با select.

  رنگ‌شدن با انتخابگر خواهرـبرادری انجام می‌شود و آن فقط رو به جلو کار
  می‌کند، پس ورودی‌ها در قالب از پنج به یک چیده شده‌اند. row-reverse
  دوباره برشان می‌گرداند تا در صفحه‌ی راست‌به‌چپ، ستاره‌ی یک سمت راست
  بنشیند و پنج سمت چپ.

  خودِ ورودی‌ها رادیوی واقعی‌اند و فقط بصری پنهان شده‌اند: با Tab و
  کلیدهای جهت کار می‌کنند و صفحه‌خوان مقدارشان را می‌خواند.
*/

.ors-stars {
  border: 0;
  padding: 0;
  margin: 0 0 18px;
}

.ors-stars legend {
  padding: 0;
  margin-bottom: 8px;
  color: var(--ors-grey-text-light);
  font-size: 14px;
}

.ors-stars__row {
  display: inline-flex;
  flex-direction: row-reverse;
  gap: 4px;
}

.ors-stars__input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.ors-stars__star {
  display: grid;
  place-items: center;

  width: 40px;
  height: 40px;

  border-radius: 10px;
  color: rgba(255, 255, 255, 0.22);

  cursor: pointer;
  transition: color 0.15s ease, transform 0.15s ease;
}

.ors-stars__star svg {
  width: 30px;
  height: 30px;
  fill: currentColor;
}

/* انتخاب‌شده: خودش و هرچه بعدش می‌آید (یعنی ستاره‌های کوچک‌تر) */
.ors-stars__input:checked ~ .ors-stars__star {
  color: #f0a92b;
}

/* پیش‌نمایش هنگام هاور، و خاموش کردن حالت انتخاب‌شده تا قاطی نشود */
.ors-stars__row:hover .ors-stars__input:checked ~ .ors-stars__star {
  color: rgba(255, 255, 255, 0.22);
}

.ors-stars__star:hover,
.ors-stars__star:hover ~ .ors-stars__star {
  color: #f0a92b;
}

.ors-stars__star:active {
  transform: scale(0.92);
}

/* حلقه‌ی فوکوس روی لیبل می‌آید، چون خود ورودی پنهان است */
.ors-stars__input:focus-visible + .ors-stars__star {
  outline: 2px solid var(--ors-green);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .ors-stars__star {
    transition: none;
  }
}


/* ---------------- اسلایدر دو سرِ قیمت ---------------- */

/*
  دو ورودی range دقیقاً روی هم می‌نشینند. خودِ ریلشان شفاف است و ریل
  دیده‌شده یک div جداست، وگرنه ریل بالایی ریل پایینی را می‌پوشاند.

  ورودی بالایی رویدادهای ماوس را می‌گیرد، پس pointer-events روی خودشان
  خاموش و فقط روی دسته‌ها روشن است — بدون این، همیشه یکی از دو دسته
  قابل گرفتن نیست.
*/

.ors-range {
  position: relative;
  height: 34px;
  margin: 6px 2px 2px;
}

.ors-range__track {
  position: absolute;
  inset-inline: 0;
  top: 50%;
  transform: translateY(-50%);

  height: 4px;
  border-radius: 999px;
  background-color: rgba(255, 255, 255, 0.14);
}

.ors-range__fill {
  position: absolute;
  top: 0;
  bottom: 0;
  border-radius: 999px;
  background-color: var(--ors-green);
}

.ors-range__input {
  position: absolute;
  inset-inline: 0;
  top: 0;

  width: 100%;
  height: 34px;
  margin: 0;

  appearance: none;
  background: transparent;
  pointer-events: none;
}

.ors-range__input:focus {
  outline: none;
}

/* دسته‌ها — WebKit و Gecko هرکدام شبه‌عنصر خودشان را می‌خواهند و
   نمی‌شود در یک قاعده جمعشان کرد؛ اگر یکی نامعتبر باشد کل قاعده
   کنار گذاشته می‌شود. */
.ors-range__input::-webkit-slider-thumb {
  appearance: none;
  pointer-events: auto;

  width: 18px;
  height: 18px;

  border: 3px solid var(--ors-green);
  border-radius: 50%;
  background-color: #151515;

  cursor: grab;
}

.ors-range__input::-moz-range-thumb {
  pointer-events: auto;

  width: 18px;
  height: 18px;

  border: 3px solid var(--ors-green);
  border-radius: 50%;
  background-color: #151515;

  cursor: grab;
}

.ors-range__input:focus-visible::-webkit-slider-thumb {
  box-shadow: 0 0 0 3px rgba(75, 152, 85, 0.4);
}

.ors-range__input:focus-visible::-moz-range-thumb {
  box-shadow: 0 0 0 3px rgba(75, 152, 85, 0.4);
}

.ors-range__readout {
  margin: 4px 0 0;
  color: var(--ors-grey-text-light);
  font-size: 13px;
}

.ors-range__readout span {
  color: #ffffff;
  font-weight: 700;
}

/* ------------------------------------------------ نوار «تا ارسال رایگان» */

.ors-freeship {
  margin: 16px 0;
  padding: 13px 15px;
  border: 1px solid rgba(255, 255, 255, .1);
  border-radius: 14px;
  background: rgba(255, 255, 255, .035);
}

.ors-freeship.is-reached {
  border-color: rgba(75, 152, 85, .45);
  background: rgba(75, 152, 85, .12);
}

.ors-freeship__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.8;
  color: var(--ors-grey-text-light);
}

.ors-freeship__text b { color: var(--ors-white); }
.ors-freeship.is-reached .ors-freeship__text b { color: #8fd39a; }

.ors-freeship__bar {
  margin-top: 10px;
  height: 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, .1);
  overflow: hidden;
}

.ors-freeship__bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: var(--ors-green);
}


/* =========================
   صفحه‌ی تماس
========================= */

/* نوار وضعیت: «الان باز است» به‌جای جدولی که باید خوانده و با ساعت
   خود بازدیدکننده مقایسه شود. نقطه‌ی رنگی تنها حاملِ معنا نیست —
   متن کنارش همان را می‌گوید، وگرنه برای کسی که رنگ را تشخیص
   نمی‌دهد بی‌معنا می‌شد. */
.ors-hours {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;

  margin: 0 0 28px;
  padding: 14px 18px;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);

  font-size: 14px;
}

.ors-hours__dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--ors-grey-text);
  flex: 0 0 auto;
}

.ors-hours.is-open {
  border-color: rgba(75, 152, 85, 0.45);
  background: rgba(75, 152, 85, 0.1);
}

.ors-hours.is-open .ors-hours__dot {
  background: var(--ors-green);
  box-shadow: 0 0 0 4px rgba(75, 152, 85, 0.22);
}

.ors-hours strong { color: #fff; font-weight: 700; }
.ors-hours__detail { color: var(--ors-grey-text); }

/* جدول کامل ساعات آخر می‌آید و در موبایل سطر خودش را می‌گیرد:
   جوابِ «الان چطور؟» مهم‌تر از جوابِ «کلاً چطور؟» است. */
.ors-hours__table {
  margin-inline-start: auto;
  color: var(--ors-grey-text);
  font-size: 12px;
}

@media (max-width: 640px) {
  .ors-hours__table {
    margin-inline-start: 0;
    flex-basis: 100%;
  }
}

/* ۱۶۵ پیکسل، نه ۲۱۰: با پنج کانال و ظرف ۹۶۰ پیکسلی، مقدار بزرگ‌تر
   چهار ستون می‌داد و کارت پنجم تنها در سطر دوم می‌ماند — که هم
   بی‌قواره بود و هم آن یک کانال را بی‌دلیل برجسته می‌کرد. */
.ors-contact__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}

.ors-contact__card {
  display: grid;
  gap: 4px;
  padding: 18px;

  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 16px;

  color: #fff;
  transition: border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;
}

.ors-contact__card:hover {
  border-color: var(--ors-green);
  background: rgba(75, 152, 85, 0.08);
  transform: translateY(-2px);
}

/* تماس تلفنی کارت اصلی است: در ساعات کاری، همان لحظه جواب می‌گیرد
   و بقیه‌ی راه‌ها نمی‌گیرند. */
.ors-contact__card--primary {
  border-color: rgba(75, 152, 85, 0.5);
  background: rgba(75, 152, 85, 0.1);
}

.ors-contact__icon {
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  margin-bottom: 6px;

  border-radius: 10px;
  background: rgba(255, 255, 255, 0.07);
  color: var(--ors-green);
}

.ors-contact__icon svg { width: 19px; height: 19px; }

.ors-contact__label { font-size: 13px; color: var(--ors-grey-text); }
.ors-contact__value { font-size: 17px; font-weight: 700; }
.ors-contact__note { font-size: 12px; color: var(--ors-grey-text); }

.ors-contact__address {
  margin: 0 0 28px;
  padding: 14px 18px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.03);
  font-size: 14px;
  color: var(--ors-grey-text);
}

.ors-contact__address strong { color: #fff; }

.ors-contact__shortcuts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin-bottom: 32px;
}

.ors-contact__shortcut {
  display: grid;
  gap: 4px;
  padding: 16px 18px;

  border: 1px dashed rgba(255, 255, 255, 0.2);
  border-radius: 14px;
  color: #fff;

  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.ors-contact__shortcut:hover {
  border-style: solid;
  border-color: var(--ors-green);
  background: rgba(75, 152, 85, 0.07);
}

.ors-contact__shortcut span {
  font-size: 12.5px;
  color: var(--ors-grey-text);
}

/* پنل تأیید، جای همان فرم. رنگ سبز کمرنگ تفاوت را بی‌صدا می‌گوید؛
   خودِ تیتر هم می‌گویدش، پس رنگ تنها حامل معنا نیست. */
.ors-panel--done {
  border-color: rgba(75, 152, 85, 0.45);
  background: rgba(75, 152, 85, 0.08);
}

.ors-panel--done p { margin: 0 0 8px; }


/* =========================
   صفحه‌ی درباره‌ی ما
========================= */

.ors-pillars {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 14px;
  margin-bottom: 44px;
}

.ors-pillar {
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.02);
}

.ors-pillar__icon {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  margin-bottom: 14px;

  border-radius: 12px;
  background: rgba(75, 152, 85, 0.14);
  color: var(--ors-green);
}

.ors-pillar__icon svg { width: 21px; height: 21px; }

.ors-pillar__title {
  margin: 0 0 8px;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
}

.ors-pillar__text {
  margin: 0 0 14px;
  color: var(--ors-grey-text);
  font-size: 13.5px;
  line-height: 2;
}

/* خط «اثبات» عمداً از متن جدا می‌شود: همان چیزی است که این ادعا را
   از یک جمله‌ی تبلیغاتی جدا می‌کند، و باید دیده شود. */
.ors-pillar__proof {
  margin: 0;
  padding-top: 12px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);

  color: var(--ors-green);
  font-size: 12.5px;
  line-height: 1.9;
}

.ors-degas {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  gap: 28px;
  align-items: center;

  padding: 26px;
  border: 1px solid rgba(75, 152, 85, 0.3);
  border-radius: 20px;
  background: rgba(75, 152, 85, 0.06);
}

@media (max-width: 760px) {
  .ors-degas { grid-template-columns: 1fr; gap: 20px; }
}

.ors-degas__title {
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 800;
  color: #fff;
}

.ors-degas__lead {
  margin: 0;
  color: var(--ors-grey-text);
  font-size: 13.5px;
  line-height: 2;
}

.ors-degas__list { margin: 0; padding: 0; list-style: none; }

.ors-degas__list li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
}

.ors-degas__list li:last-child { border-bottom: 0; }

.ors-degas__method { color: #fff; font-size: 14px; }
.ors-degas__window { color: var(--ors-green); font-size: 14px; font-weight: 700; }


/* ---------------- شمارنده‌ی کد یک‌بارمصرف ---------------- */

.ors-otp-timer {
  margin: 12px 0 4px;
  text-align: center;
}

.ors-otp-timer__life {
  margin: 0;
  color: var(--ors-grey-text);
  font-size: 12.5px;
  line-height: 1.8;
}

/* منقضی‌شده باید از «هنوز وقت داری» متمایز باشد، وگرنه کاربر
   همان کد مرده را دوباره تایپ می‌کند. */
.ors-otp-timer__life.is-expired { color: #e2796d; }

.ors-otp-timer__resend {
  margin: 4px 0 0;
  color: var(--ors-grey-text);
  font-size: 12px;
}

/* دکمه‌ی خاموش باید خاموش دیده شود؛ وگرنه کاربر می‌زند و خطا
   می‌گیرد، که بدتر از نزدن است. */
[data-otp-resend]:disabled {
  opacity: .45;
  cursor: not-allowed;
}
