/*!
 * MyEscape × Bootstrap 5.3 — theme extension
 * Load AFTER bootstrap(.rtl).min.css, with <html dir="rtl" data-bs-theme="dark">.
 *
 *   1 · Primitive tokens      (--me-*)
 *   2 · Bootstrap remap       (--bs-* → --me-*)
 *   3 · Bootstrap components  (themed through their own CSS variables)
 *   4 · MyEscape components   (.me-*) — things Bootstrap has no equivalent for
 *   5 · Utilities
 *
 * Tested against Bootstrap 5.3.3.
 */

/* =========================================================
   1 · PRIMITIVE TOKENS
   ========================================================= */
@font-face{font-family:"IRANYekan";src:url("../fonts/iranyekanweblight.woff2") format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:"IRANYekan";src:url("../fonts/iranyekanwebregular.woff2") format("woff2");font-weight:400 500;font-display:swap}
@font-face{font-family:"IRANYekan";src:url("../fonts/iranyekanwebbold.woff2") format("woff2");font-weight:600 900;font-display:swap}

:root{
  /* surfaces */
  --me-bg:#0A0120; --me-bg-rgb:10,1,32;
  --me-bg-alt:#0D0127;
  --me-surface-1:#0A0716;
  --me-surface-2:#11052B;
  --me-surface-3:#1A1036;
  --me-surface-ink:#020104;
  --me-surface-ink-2:#0D0617;
  --me-surface-violet:#190638;
  --me-surface-violet-2:#13042A;
  --me-surface-slate:#131220;
  --me-surface-slate-2:#1B1A2E;

  /* brand violet */
  --me-brand-50:#F3EDFD; --me-brand-100:#E2D4FB; --me-brand-200:#C5A9F6; --me-brand-300:#A97EF0;
  --me-brand-400:#9360E9; --me-brand-500:#7146BC; --me-brand-600:#5A339D; --me-brand-700:#4E278A;
  --me-brand-800:#380E68; --me-brand-900:#22073F;
  --me-brand-rgb:147,96,233;
  --me-brand-deep-rgb:78,39,138;

  /* text */
  --me-text:#FFFFFF; --me-text-rgb:255,255,255;
  --me-text-2:#D9D4E4; --me-text-2-rgb:217,212,228;
  --me-text-3:#9C95AE; --me-text-3-rgb:156,149,174;
  --me-text-4:#626262;
  --me-text-on-brand:#FFFFFF;

  /* lines */
  --me-line:#29233D;
  --me-line-input:#2A2440;
  --me-line-soft:#171617;
  --me-line-brand:#4E278A;
  --me-line-brand-2:#5D439E;

  /* status / accents */
  --me-success:#3ACE15; --me-success-rgb:58,206,21;
  --me-lime:#46FA19; --me-lime-dim:#1A6707;
  --me-danger:#7D0101; --me-danger-rgb:125,1,1; --me-danger-2:#B3121C;
  --me-age:#FF2D2D; --me-age-rgb:255,45,45;
  --me-cyan:#00FFF6; --me-cyan-rgb:0,255,246;
  --me-cyan-bg:#09203A; --me-cyan-line:#0B5A58;
  --me-warning:#F5B400; --me-warning-rgb:245,180,0;
  --me-star:#FF9500;
  --me-gray:#848484;
  --me-day-future:#C7AFFF;
  --me-scrim:rgba(20,20,24,.72);

  /* gradients */
  --me-grad-brand:linear-gradient(90deg,#5A339D 0%,#380E68 100%);
  --me-grad-brand-v:linear-gradient(180deg,#5A339D 0%,#380E68 100%);
  --me-grad-ink:linear-gradient(180deg,#0D0617 0%,#010001 100%);
  --me-grad-promo:linear-gradient(90deg,#071A30 0%,#0A2340 100%);
  --me-grad-page:radial-gradient(1200px 600px at 80% -10%,rgba(78,39,138,.18),transparent 60%);
  --me-grad-glass:linear-gradient(135deg,#1C1233 0%,#030108 38%,#030108 62%,#1A1430 100%);
  --me-grad-glass-line:linear-gradient(135deg,rgba(147,96,233,.9),rgba(147,96,233,.08) 35%,rgba(147,96,233,.08) 65%,rgba(147,96,233,.9));
  --me-grad-form:linear-gradient(135deg,#130B22 0%,#000001 35%,#000001 70%,#0E0A18 100%);
  --me-grad-hero:linear-gradient(270deg,rgba(10,1,32,.92) 0%,rgba(10,1,32,.55) 45%,rgba(10,1,32,0) 75%),linear-gradient(0deg,var(--me-bg) 0%,transparent 25%);
  --me-grad-violet:linear-gradient(270deg,#190638 0%,#13042A 100%);
  --me-grid-pattern:linear-gradient(rgba(147,96,233,.06) 1px,transparent 1px) 0 0/210px 195px,linear-gradient(90deg,rgba(147,96,233,.06) 1px,transparent 1px) 0 0/210px 195px;

  /* typography */
  --me-font:"IRANYekan","Vazirmatn",Tahoma,sans-serif;
  --me-fs-hero:clamp(1.5rem,1.05rem + 1.9vw,2.5rem);
  --me-fs-display:clamp(1.25rem,1.1rem + .55vw,1.625rem);
  --me-fs-h2:clamp(1.125rem,1.02rem + .4vw,1.375rem);
  --me-fs-h3:clamp(1rem,.95rem + .25vw,1.125rem);
  --me-fs-price:clamp(1.125rem,1.02rem + .4vw,1.375rem);
  --me-fs-lg:clamp(.9375rem,.9rem + .15vw,1.0625rem);
  --me-fs-md:.9375rem;
  --me-fs-sm:.8125rem;
  --me-fs-xs:.75rem;
  --me-fs-2xs:.6875rem;
  --me-lh-base:1.7; --me-lh-prose:2;

  /* spacing (4px) */
  --me-sp-1:4px; --me-sp-2:8px; --me-sp-3:12px; --me-sp-4:16px; --me-sp-5:20px; --me-sp-6:24px;
  --me-sp-8:32px; --me-sp-10:40px; --me-sp-12:48px; --me-sp-16:64px; --me-sp-20:80px;

  /* radii */
  --me-r-xs:4px; --me-r-sm:6px; --me-r-md:8px; --me-r-lg:12px; --me-r-xl:16px; --me-r-2xl:28px; --me-r-pill:999px;

  /* shadows */
  --me-sh-sm:0 2px 8px rgba(0,0,0,.35);
  --me-sh-md:0 8px 24px rgba(0,0,0,.45);
  --me-sh-lg:0 20px 48px rgba(0,0,0,.55);
  --me-sh-glow:0 6px 24px rgba(var(--me-brand-rgb),.35);
  --me-sh-inset:inset 0 1px 0 rgba(255,255,255,.06);

  /* motion */
  --me-dur-fast:120ms; --me-dur:200ms; --me-dur-slow:360ms;
  --me-ease:cubic-bezier(.2,.7,.2,1);

  /* layout */
  --me-container:1680px;
  --me-header-h:80px;
  --me-sidebar-w:420px;
  --me-poster-w:270px;
  --me-tap:44px;
  --me-h-control:42px;
  --me-h-control-lg:50px;
}

/* =========================================================
   2 · BOOTSTRAP REMAP
   Both selectors so this beats Bootstrap's own [data-bs-theme=dark] block
   (same specificity, later in the cascade).
   ========================================================= */
:root,
[data-bs-theme="dark"]{
  color-scheme:dark;

  --bs-font-sans-serif:var(--me-font);
  --bs-body-font-family:var(--me-font);
  --bs-body-font-size:var(--me-fs-md);
  --bs-body-line-height:var(--me-lh-base);

  --bs-body-bg:var(--me-bg);
  --bs-body-bg-rgb:var(--me-bg-rgb);
  --bs-body-color:var(--me-text-2);
  --bs-body-color-rgb:var(--me-text-2-rgb);
  --bs-emphasis-color:var(--me-text);
  --bs-emphasis-color-rgb:var(--me-text-rgb);
  --bs-heading-color:var(--me-text);
  --bs-secondary-color:var(--me-text-3);
  --bs-secondary-color-rgb:var(--me-text-3-rgb);
  --bs-tertiary-color:var(--me-text-4);
  --bs-secondary-bg:var(--me-surface-1);
  --bs-secondary-bg-rgb:10,7,22;
  --bs-tertiary-bg:var(--me-surface-2);
  --bs-tertiary-bg-rgb:17,5,43;
  --bs-secondary-rgb:var(--me-text-3-rgb);   /* .text-secondary / .bg-secondary */
  --bs-light-rgb:236,231,247;
  --bs-dark-rgb:2,1,4;

  --bs-primary:var(--me-brand-400);
  --bs-primary-rgb:var(--me-brand-rgb);
  --bs-primary-text-emphasis:var(--me-brand-200);
  --bs-primary-bg-subtle:rgba(var(--me-brand-rgb),.14);
  --bs-primary-border-subtle:var(--me-brand-700);

  --bs-success:var(--me-success);
  --bs-success-rgb:var(--me-success-rgb);
  --bs-success-text-emphasis:var(--me-lime);
  --bs-success-bg-subtle:rgba(var(--me-success-rgb),.1);
  --bs-success-border-subtle:var(--me-lime-dim);

  --bs-danger:var(--me-age);
  --bs-danger-rgb:var(--me-age-rgb);
  --bs-danger-text-emphasis:#FF8A8A;
  --bs-danger-bg-subtle:rgba(var(--me-danger-rgb),.35);
  --bs-danger-border-subtle:#5C0A0A;

  --bs-info:var(--me-cyan);
  --bs-info-rgb:var(--me-cyan-rgb);
  --bs-info-text-emphasis:var(--me-cyan);
  --bs-info-bg-subtle:var(--me-cyan-bg);
  --bs-info-border-subtle:var(--me-cyan-line);

  --bs-warning:var(--me-warning);
  --bs-warning-rgb:var(--me-warning-rgb);
  --bs-warning-text-emphasis:#FFD466;
  --bs-warning-bg-subtle:rgba(var(--me-warning-rgb),.1);
  --bs-warning-border-subtle:#5E4600;

  --bs-secondary-text-emphasis:var(--me-text-2);
  --bs-secondary-bg-subtle:var(--me-surface-slate);
  --bs-secondary-border-subtle:var(--me-line);
  --bs-light-bg-subtle:var(--me-surface-3);
  --bs-dark-bg-subtle:var(--me-surface-ink);

  --bs-border-color:var(--me-line);
  --bs-border-color-translucent:rgba(var(--me-brand-rgb),.18);
  --bs-border-radius:var(--me-r-md);
  --bs-border-radius-sm:var(--me-r-sm);
  --bs-border-radius-lg:var(--me-r-lg);
  --bs-border-radius-xl:var(--me-r-xl);
  --bs-border-radius-xxl:var(--me-r-2xl);
  --bs-border-radius-pill:var(--me-r-pill);

  --bs-link-color:var(--me-brand-300);
  --bs-link-color-rgb:169,126,240;
  --bs-link-hover-color:var(--me-brand-200);
  --bs-link-hover-color-rgb:197,169,246;

  --bs-box-shadow:var(--me-sh-md);
  --bs-box-shadow-sm:var(--me-sh-sm);
  --bs-box-shadow-lg:var(--me-sh-lg);

  --bs-focus-ring-color:rgba(var(--me-brand-rgb),.25);
  --bs-form-valid-color:var(--me-lime);
  --bs-form-valid-border-color:var(--me-lime-dim);
  --bs-form-invalid-color:var(--me-age);
  --bs-form-invalid-border-color:var(--me-age);
  --bs-highlight-bg:rgba(var(--me-brand-rgb),.3);
  --bs-highlight-color:var(--me-text);
}

body{background-image:var(--me-grad-page);background-repeat:no-repeat;-webkit-font-smoothing:antialiased}
a{text-decoration:none}
::selection{background:rgba(var(--me-brand-rgb),.45);color:#fff}

/* container: Bootstrap stops at 1320; the design runs 1680 wide at 1920 */
@media (min-width:1600px){
  .container,.container-xxl{max-width:calc(var(--me-container) + var(--bs-gutter-x))}
}

/* =========================================================
   3 · BOOTSTRAP COMPONENTS
   ========================================================= */

/* ---------- Buttons ---------- */
.btn{
  --bs-btn-padding-x:1.125rem;
  --bs-btn-padding-y:.5625rem;
  --bs-btn-font-size:.875rem;
  --bs-btn-font-weight:700;
  --bs-btn-line-height:1.5;
  --bs-btn-border-radius:var(--me-r-md);
  --bs-btn-focus-shadow-rgb:var(--me-brand-rgb);
  --bs-btn-disabled-opacity:.45;
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  transition:color var(--me-dur),background-color var(--me-dur),border-color var(--me-dur),box-shadow var(--me-dur),filter var(--me-dur),transform var(--me-dur-fast);
}
.btn:active{transform:translateY(1px)}
.btn-lg{--bs-btn-padding-y:.8125rem;--bs-btn-padding-x:1.5rem;--bs-btn-font-size:var(--me-fs-md);--bs-btn-border-radius:var(--me-r-md)}
.btn-sm{--bs-btn-padding-y:.375rem;--bs-btn-padding-x:.75rem;--bs-btn-font-size:var(--me-fs-sm);--bs-btn-border-radius:var(--me-r-sm)}
.btn .ti{font-size:1.25em;line-height:1}

/* primary = brand gradient */
.btn-primary,.btn-brand{
  --bs-btn-color:var(--me-text-on-brand);
  --bs-btn-bg:var(--me-brand-700);
  --bs-btn-border-color:transparent;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:var(--me-brand-600);
  --bs-btn-hover-border-color:transparent;
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:var(--me-brand-800);
  --bs-btn-active-border-color:transparent;
  --bs-btn-disabled-color:#fff;
  --bs-btn-disabled-bg:var(--me-brand-700);
  --bs-btn-disabled-border-color:transparent;
  background-image:var(--me-grad-brand);
}
.btn-primary:hover,.btn-brand:hover{filter:brightness(1.15);box-shadow:var(--me-sh-glow)}
.btn-primary:disabled,.btn-brand:disabled{filter:none;box-shadow:none}

/* outline on brand line, white text — «مشاهده سانس ها» */
.btn-outline-primary,.btn-outline-brand{
  --bs-btn-color:var(--me-text);
  --bs-btn-border-color:var(--me-line-brand);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:rgba(var(--me-brand-rgb),.12);
  --bs-btn-hover-border-color:var(--me-brand-400);
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:rgba(var(--me-brand-rgb),.2);
  --bs-btn-active-border-color:var(--me-brand-400);
  --bs-btn-disabled-color:var(--me-text-3);
  --bs-btn-disabled-border-color:var(--me-line);
  border-width:1.5px;
}
/* outline with violet text — «ویرایش سانس»، «افزودن عضو» */
.btn-outline-accent{
  --bs-btn-color:var(--me-brand-300);
  --bs-btn-border-color:var(--me-brand-500);
  --bs-btn-hover-color:var(--me-brand-200);
  --bs-btn-hover-bg:rgba(var(--me-brand-rgb),.1);
  --bs-btn-hover-border-color:var(--me-brand-400);
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:rgba(var(--me-brand-rgb),.2);
  --bs-btn-active-border-color:var(--me-brand-400);
  --bs-btn-font-weight:500;
  border-width:1.5px;
}
/* near-black secondary — «جزئیات بازی» */
.btn-ink{
  --bs-btn-color:var(--me-text);
  --bs-btn-bg:#07050C;
  --bs-btn-border-color:#2A2440;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:#0E0A18;
  --bs-btn-hover-border-color:var(--me-brand-500);
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:#140E22;
  --bs-btn-active-border-color:var(--me-brand-400);
  --bs-btn-font-weight:500;
}
/* soft slate — help rows */
.btn-slate{
  --bs-btn-color:var(--me-text);
  --bs-btn-bg:var(--me-surface-slate);
  --bs-btn-border-color:transparent;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:var(--me-surface-slate-2);
  --bs-btn-hover-border-color:transparent;
  --bs-btn-active-bg:var(--me-surface-slate-2);
  --bs-btn-active-color:#fff;
  --bs-btn-font-weight:400;
  justify-content:flex-start;
}
.btn-secondary{
  --bs-btn-color:var(--me-text);
  --bs-btn-bg:var(--me-surface-3);
  --bs-btn-border-color:var(--me-line);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:var(--me-surface-2);
  --bs-btn-hover-border-color:var(--me-brand-700);
  --bs-btn-active-bg:var(--me-surface-2);
  --bs-btn-active-border-color:var(--me-brand-500);
}
.btn-link{--bs-btn-color:var(--me-brand-300);--bs-btn-hover-color:var(--me-brand-200);--bs-btn-font-weight:500;text-decoration:none}

/* shape modifiers */
.btn-pill{--bs-btn-border-radius:var(--me-r-pill)}
/* physical corners (same in LTR/RTL): bottom-right is square — «نمایش همه»، «افزودن عضو» */
.btn-notch{border-radius:var(--me-r-md) var(--me-r-md) 0 var(--me-r-md) !important}
.btn-circle{--bs-btn-padding-x:0;--bs-btn-padding-y:0;width:40px;height:40px;border-radius:50% !important;flex:none}
.btn-circle.btn-lg{width:52px;height:52px;font-size:1.25rem}
.btn-circle.btn-sm{width:32px;height:32px}
.btn-arrow{
  --bs-btn-color:var(--me-brand-300);
  --bs-btn-border-color:var(--me-brand-500);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:rgba(var(--me-brand-rgb),.15);
  --bs-btn-hover-border-color:var(--me-brand-400);
  --bs-btn-active-bg:rgba(var(--me-brand-rgb),.25);
  --bs-btn-active-color:#fff;
  --bs-btn-active-border-color:var(--me-brand-400);
  border-width:2px;
}

/* selectable pills built on .btn-check */
.btn-slot{ /* time slot */
  --bs-btn-color:var(--me-text);
  --bs-btn-border-color:var(--me-line);
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-border-color:var(--me-brand-700);
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:var(--me-brand-400);
  --bs-btn-active-border-color:var(--me-brand-400);
  --bs-btn-border-radius:var(--me-r-pill);
  --bs-btn-padding-x:1.25rem;
  border-width:1.5px;
  width:100%;min-height:var(--me-h-control-lg);
  justify-content:space-between;
}
.btn-slot small{font-size:var(--me-fs-2xs);font-weight:400;color:var(--me-text-3)}
.btn-check:checked+.btn-slot{box-shadow:var(--me-sh-glow)}
.btn-check:checked+.btn-slot small{color:rgba(255,255,255,.85)}

.btn-date{ /* date chip */
  --bs-btn-color:var(--me-text-2);
  --bs-btn-bg:transparent;
  --bs-btn-border-color:transparent;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:rgba(var(--me-brand-rgb),.1);
  --bs-btn-hover-border-color:transparent;
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:var(--me-brand-400);
  --bs-btn-active-border-color:transparent;
  --bs-btn-border-radius:var(--me-r-pill);
  --bs-btn-font-size:var(--me-fs-sm);
  --bs-btn-font-weight:400;
  --bs-btn-padding-x:.875rem;
  min-height:40px;flex:none;
}

.btn-genre{ /* genre filter pill */
  --bs-btn-color:var(--me-text-2);
  --bs-btn-bg:#0E0C10;
  --bs-btn-border-color:#2A2833;
  --bs-btn-hover-color:#fff;
  --bs-btn-hover-bg:#0E0C10;
  --bs-btn-hover-border-color:var(--me-brand-700);
  --bs-btn-active-color:#fff;
  --bs-btn-active-bg:#04020D;
  --bs-btn-active-border-color:var(--me-brand-400);
  --bs-btn-border-radius:var(--me-r-pill);
  --bs-btn-font-size:var(--me-fs-md);
  --bs-btn-font-weight:400;
  --bs-btn-padding-x:1.25rem;
  border-width:1.5px;min-height:44px;flex:none;
}
.btn-check:checked+.btn-genre,.btn-genre.active{box-shadow:inset 0 -2px 0 var(--me-brand-400),var(--me-sh-glow)}

/* ---------- Forms ---------- */
.form-control,.form-select{
  --me-ctl-h:var(--me-h-control);
  min-height:var(--me-ctl-h);
  padding:.5rem 1.25rem;
  background-color:transparent;
  border:1.5px solid var(--me-line-input);
  border-radius:var(--me-r-pill);
  color:var(--me-text);
  font-size:var(--me-fs-md);
}
.form-control-lg,.form-select-lg{--me-ctl-h:var(--me-h-control-lg);padding:.6875rem 1.375rem;font-size:var(--me-fs-md);border-radius:var(--me-r-pill)}
.form-control-sm,.form-select-sm{--me-ctl-h:34px;padding:.25rem .875rem;font-size:var(--me-fs-sm);border-radius:var(--me-r-pill)}
.form-control::placeholder{color:var(--me-text-3);opacity:1}
.form-control:focus,.form-select:focus{background-color:transparent;color:var(--me-text);border-color:var(--me-brand-400);box-shadow:0 0 0 4px rgba(var(--me-brand-rgb),.18)}
.form-control:disabled,.form-select:disabled{background-color:rgba(255,255,255,.03);color:var(--me-text-4)}
textarea.form-control{border-radius:var(--me-r-xl);min-height:120px}
.form-select option{background:var(--me-surface-2);color:var(--me-text)}
/* select chevron: Bootstrap re-sets this inside [data-bs-theme=dark] */
[data-bs-theme="dark"] .form-select{
  --bs-form-select-bg-img:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
  background-size:18px 18px;
}
[dir="rtl"] .form-select{padding-left:3rem;background-position:left 1.25rem center}
.form-label{color:var(--me-text);font-size:var(--me-fs-sm);margin-bottom:.75rem}
.form-text{color:var(--me-text-3);font-size:var(--me-fs-xs)}
.form-control.is-invalid,.form-select.is-invalid{border-color:var(--me-age)}
.form-control.is-valid,.form-select.is-valid{border-color:var(--me-lime-dim)}
.invalid-feedback{color:var(--me-age)}
.valid-feedback{color:var(--me-lime)}

/* input with leading icon: <div class="form-icon"><i class="ti ti-user"></i><input class="form-control"></div> */
.form-icon{position:relative}
.form-icon>.ti:first-child{position:absolute;inset-inline-start:1.25rem;top:50%;transform:translateY(-50%);font-size:19px;color:var(--me-text);pointer-events:none;z-index:5}
.form-icon>.form-control,.form-icon>.form-select{padding-inline-start:3rem}

/* floating labels */
.form-floating>.form-control,.form-floating>.form-select{min-height:var(--me-h-control-lg)}
.form-floating>.form-control,.form-floating>.form-select{padding-inline:1.25rem}
.form-floating>label{padding-inline:1.25rem;color:var(--me-text-3)}
.form-floating>.form-control:focus~label::after,.form-floating>.form-control:not(:placeholder-shown)~label::after{background:transparent}

/* checks / radios / switch */
.form-check-input{background-color:transparent;border:1.5px solid var(--me-line-brand-2)}
.form-check-input:checked{background-color:var(--me-brand-400);border-color:var(--me-brand-400)}
.form-check-input:focus{border-color:var(--me-brand-400);box-shadow:0 0 0 4px rgba(var(--me-brand-rgb),.18)}
.form-check-label{color:var(--me-text-2)}
[data-bs-theme="dark"] .form-switch .form-check-input:not(:checked):not(:focus){
  --bs-form-switch-bg:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%235D439E'/%3e%3c/svg%3e");
}
.form-range::-webkit-slider-thumb{background-color:var(--me-brand-400)}
.form-range::-moz-range-thumb{background-color:var(--me-brand-400)}
.form-range::-webkit-slider-runnable-track{background-color:var(--me-surface-3)}
.form-range::-moz-range-track{background-color:var(--me-surface-3)}

/* input group — coupon */
.input-group-text{background:transparent;border:1.5px solid var(--me-line-input);color:var(--me-text);border-radius:var(--me-r-pill);padding-inline:1.25rem}
.input-group-pill{border:1.5px solid var(--me-line-input);border-radius:var(--me-r-pill);overflow:hidden;flex-wrap:nowrap;transition:border-color var(--me-dur),box-shadow var(--me-dur)}
.input-group-pill:focus-within{border-color:var(--me-brand-400);box-shadow:0 0 0 4px rgba(var(--me-brand-rgb),.18)}
.input-group-pill>.form-control{border:0;border-radius:0 !important;min-width:0}
.input-group-pill>.form-control:focus{box-shadow:none}
.input-group-pill>.btn{border-radius:var(--me-r-pill) !important;margin:0 !important;flex:none}
[dir="rtl"] .input-group-pill>.btn:last-child{border-top-right-radius:0 !important;border-bottom-right-radius:0 !important}

/* ---------- Navbar & nav ---------- */
.navbar{
  --bs-navbar-padding-y:1rem;
  --bs-navbar-color:var(--me-text);
  --bs-navbar-hover-color:#fff;
  --bs-navbar-active-color:#fff;
  --bs-navbar-brand-color:#fff;
  --bs-navbar-brand-hover-color:#fff;
  --bs-navbar-nav-link-padding-x:1.25rem;
  --bs-navbar-toggler-border-color:var(--me-line-brand);
  --bs-navbar-toggler-border-radius:var(--me-r-pill);
  --bs-navbar-toggler-focus-width:3px;
}
.navbar-brand{display:flex;flex-direction:column;line-height:1;font-weight:900;font-size:clamp(1.25rem,1rem + .8vw,1.75rem)}
.navbar-brand small{font-size:.625rem;font-weight:400;letter-spacing:.2em;align-self:flex-end;margin-top:4px;direction:ltr;font-family:Arial,sans-serif}

/* pill nav bar: <ul class="nav nav-pills nav-bar"> */
.nav-pills{
  --bs-nav-pills-border-radius:var(--me-r-pill);
  --bs-nav-pills-link-active-color:#fff;
  --bs-nav-pills-link-active-bg:var(--me-brand-700);
  --bs-nav-link-color:var(--me-text);
  --bs-nav-link-hover-color:#fff;
  --bs-nav-link-font-weight:500;
}
.nav-pills .nav-link{transition:background-color var(--me-dur),box-shadow var(--me-dur)}
.nav-pills .nav-link:not(.active):hover{background:rgba(var(--me-brand-rgb),.12)}
.nav-pills .nav-link.active,.nav-pills .show>.nav-link{background-image:var(--me-grad-brand);box-shadow:var(--me-sh-glow)}
.nav-bar{background:var(--me-bg-alt);border-radius:var(--me-r-2xl);padding:6px;gap:6px;box-shadow:var(--me-sh-inset);flex-wrap:nowrap}
.nav-bar .nav-link{--bs-nav-link-padding-x:1.25rem;--bs-nav-link-padding-y:.5rem;font-size:var(--me-fs-md);display:flex;align-items:center;gap:6px;white-space:nowrap}
.nav-bar .dropdown-toggle::after{display:none}

/* content tabs: <ul class="nav nav-pills nav-tabs-me"> */
.nav-tabs-me{border:1.5px solid var(--me-line-brand);border-radius:var(--me-r-pill);padding:6px;gap:8px;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.nav-tabs-me::-webkit-scrollbar{display:none}
.nav-tabs-me .nav-link{--bs-nav-link-padding-x:1.5rem;--bs-nav-link-padding-y:.625rem;font-size:var(--me-fs-lg);white-space:nowrap}
.nav-tabs-me .nav-link.active{box-shadow:none}

/* classic underline tabs, themed */
.nav-tabs{--bs-nav-tabs-border-color:var(--me-line);--bs-nav-tabs-link-hover-border-color:transparent transparent var(--me-brand-700);--bs-nav-tabs-link-active-color:#fff;--bs-nav-tabs-link-active-bg:transparent;--bs-nav-tabs-link-active-border-color:transparent transparent var(--me-brand-400);--bs-nav-link-color:var(--me-text-2);--bs-nav-link-hover-color:#fff}
.nav-tabs .nav-link{border-width:0 0 2px}

.nav-underline{--bs-nav-link-color:var(--me-text-2);--bs-nav-link-hover-color:#fff;--bs-nav-underline-link-active-color:#fff}
.nav-underline .nav-link.active{border-bottom-color:var(--me-brand-400)}

/* ---------- Dropdown ---------- */
.dropdown-menu{
  --bs-dropdown-bg:var(--me-surface-2);
  --bs-dropdown-border-color:var(--me-line-brand);
  --bs-dropdown-border-radius:var(--me-r-lg);
  --bs-dropdown-inner-border-radius:calc(var(--me-r-lg) - 1px);
  --bs-dropdown-color:var(--me-text-2);
  --bs-dropdown-link-color:var(--me-text);
  --bs-dropdown-link-hover-color:#fff;
  --bs-dropdown-link-hover-bg:rgba(var(--me-brand-rgb),.14);
  --bs-dropdown-link-active-color:#fff;
  --bs-dropdown-link-active-bg:var(--me-brand-700);
  --bs-dropdown-divider-bg:var(--me-line);
  --bs-dropdown-header-color:var(--me-text-3);
  --bs-dropdown-padding-x:.5rem;
  --bs-dropdown-padding-y:.5rem;
  --bs-dropdown-item-padding-x:1rem;
  --bs-dropdown-item-padding-y:.625rem;
  --bs-dropdown-item-border-radius:var(--me-r-md);
  --bs-dropdown-box-shadow:var(--me-sh-lg);
  --bs-dropdown-min-width:14rem;
  box-shadow:var(--bs-dropdown-box-shadow);
}
.dropdown-item{display:flex;align-items:center;gap:.5rem}
.dropdown-toggle::after{border:0;width:1em;height:1em;vertical-align:-.15em;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e") center/contain no-repeat;mask:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e") center/contain no-repeat}

/* ---------- Card ---------- */
.card{
  --bs-card-bg:var(--me-surface-1);
  --bs-card-border-color:var(--me-line-brand);
  --bs-card-border-radius:var(--me-r-md);
  --bs-card-inner-border-radius:calc(var(--me-r-md) - 1px);
  --bs-card-color:var(--me-text-2);
  --bs-card-title-color:var(--me-text);
  --bs-card-subtitle-color:var(--me-text-3);
  --bs-card-cap-bg:transparent;
  --bs-card-cap-color:var(--me-text);
  --bs-card-spacer-x:1.25rem;
  --bs-card-spacer-y:1.5rem;
}
.card-title{font-weight:700;font-size:var(--me-fs-lg)}
.card-ink{--bs-card-bg:transparent;--bs-card-border-color:var(--me-surface-ink-2);--bs-card-border-radius:var(--me-r-xl);background:var(--me-grad-ink);box-shadow:var(--me-sh-md)}
.card-form{--bs-card-bg:transparent;--bs-card-border-color:#1A1426;--bs-card-border-radius:var(--me-r-2xl);--bs-card-spacer-x:1.75rem;--bs-card-spacer-y:1.75rem;background:var(--me-grad-form)}
.card-glass{--bs-card-border-width:0;--bs-card-border-radius:var(--me-r-2xl);background:var(--me-grad-glass) padding-box,var(--me-grad-glass-line) border-box;border:1px solid transparent}
.card-violet{--bs-card-bg:var(--me-surface-violet);--bs-card-border-width:0;--bs-card-border-radius:var(--me-r-2xl);--bs-card-spacer-x:1.75rem;--bs-card-spacer-y:1.75rem}
.card-slate{--bs-card-bg:var(--me-surface-slate);--bs-card-border-width:0;--bs-card-border-radius:var(--me-r-xl)}
.card-hover{transition:border-color var(--me-dur),transform var(--me-dur) var(--me-ease)}
.card-hover:hover{border-color:var(--me-brand-500);transform:translateY(-4px)}

/* ---------- Badge ---------- */
.badge{--bs-badge-padding-x:.75em;--bs-badge-padding-y:.5em;--bs-badge-font-weight:700;--bs-badge-border-radius:var(--me-r-pill)}
.text-bg-danger{background-color:var(--me-danger) !important;color:#fff !important}
.text-bg-primary{background-image:var(--me-grad-brand);color:#fff !important}
.badge-glass{background:var(--me-scrim);backdrop-filter:blur(6px);color:#fff;font-weight:400}
.badge-glass .ti-star-filled{color:var(--me-star)}

/* ---------- Alert ---------- */
.alert{--bs-alert-border-radius:var(--me-r-sm);--bs-alert-padding-y:.875rem;--bs-alert-padding-x:1.25rem;display:flex;align-items:center;gap:.625rem}
.alert .ti{font-size:20px;flex:none}
.alert-promo{--bs-alert-color:var(--me-cyan);--bs-alert-bg:transparent;--bs-alert-border-color:var(--me-cyan-line);--bs-alert-link-color:var(--me-cyan);background:var(--me-grad-promo)}
.alert-promo b,.alert-promo strong{font-weight:900}

/* ---------- Accordion (FAQ) ---------- */
.accordion{
  --bs-accordion-color:var(--me-text);
  --bs-accordion-bg:transparent;
  --bs-accordion-border-color:var(--me-line);
  --bs-accordion-border-radius:var(--me-r-xl);
  --bs-accordion-inner-border-radius:calc(var(--me-r-xl) - 1px);
  --bs-accordion-btn-color:var(--me-text);
  --bs-accordion-btn-bg:transparent;
  --bs-accordion-active-color:var(--me-brand-500);
  --bs-accordion-active-bg:transparent;
  --bs-accordion-btn-focus-box-shadow:0 0 0 4px rgba(var(--me-brand-rgb),.18);
  --bs-accordion-btn-padding-x:1.25rem;
  --bs-accordion-btn-padding-y:1rem;
  --bs-accordion-body-padding-x:1.5rem;
}
.accordion-button{font-weight:700;font-size:var(--me-fs-md)}
[data-bs-theme="dark"] .accordion-button::after{
  --bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239C95AE' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
  --bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239360E9' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M6 9l6 6 6-6'/%3e%3c/svg%3e");
}

/* FAQ variant: separate glass cards, +/− icon, notched corner when open */
.accordion-faq{--bs-accordion-border-width:0;display:flex;flex-direction:column;gap:20px}
.accordion-faq .accordion-item{--notch:30px;position:relative;border-radius:var(--me-r-2xl) !important;background:var(--me-grad-glass) padding-box,var(--me-grad-glass-line) border-box;border:1px solid transparent}
.accordion-faq .accordion-button{min-height:84px;padding:1.25rem 2rem;font-size:var(--me-fs-lg);border-radius:var(--me-r-2xl) !important;gap:1rem;box-shadow:none}
.accordion-faq .accordion-button:not(.collapsed){min-height:auto;padding-top:1.75rem;padding-bottom:.75rem}
.accordion-faq .accordion-body{padding:0 2rem 1.75rem;font-size:var(--me-fs-md);line-height:var(--me-lh-prose)}
[data-bs-theme="dark"] .accordion-faq .accordion-button::after{
  --bs-accordion-btn-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237146BC' stroke-width='2' stroke-linecap='round'%3e%3cpath d='M12 5v14M5 12h14'/%3e%3c/svg%3e");
  --bs-accordion-btn-active-icon:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round'%3e%3cpath d='M7 12h10'/%3e%3c/svg%3e");
  --bs-accordion-btn-icon-transform:none;
  --bs-accordion-btn-icon-width:1.5rem;
  width:32px;height:32px;border-radius:50%;background-position:center;background-size:20px;
  border:1.5px solid transparent;
}
.accordion-faq .accordion-button:not(.collapsed)::after{border-color:var(--me-brand-500)}
.accordion-faq .accordion-item:has(.accordion-button:not(.collapsed)){clip-path:polygon(var(--notch) 0,100% 0,100% 100%,0 100%,0 var(--notch))}
.accordion-faq .accordion-item:has(.accordion-button:not(.collapsed))::before{content:"";position:absolute;left:0;top:0;z-index:2;width:calc(var(--notch)*1.414);height:2px;background:var(--me-brand-400);transform-origin:0 0;transform:translate(0,var(--notch)) rotate(-45deg)}

/* ---------- Modal / Offcanvas / Toast / Popover / Tooltip ---------- */
.modal{
  --bs-modal-bg:var(--me-surface-1);
  --bs-modal-border-color:var(--me-line-brand);
  --bs-modal-border-radius:var(--me-r-2xl);
  --bs-modal-inner-border-radius:calc(var(--me-r-2xl) - 1px);
  --bs-modal-header-border-color:var(--me-line-soft);
  --bs-modal-footer-border-color:var(--me-line-soft);
  --bs-modal-padding:1.75rem;
  --bs-modal-header-padding:1.5rem 1.75rem;
  --bs-modal-title-line-height:1.6;
  --bs-modal-box-shadow:var(--me-sh-lg);
}
.modal-title{color:var(--me-text);font-weight:900;font-size:var(--me-fs-lg)}
.modal-backdrop{--bs-backdrop-bg:#05000F;--bs-backdrop-opacity:.75}
.offcanvas,.offcanvas-lg,.offcanvas-md,.offcanvas-sm,.offcanvas-xl,.offcanvas-xxl{
  --bs-offcanvas-bg:var(--me-bg-alt);
  --bs-offcanvas-color:var(--me-text-2);
  --bs-offcanvas-border-color:var(--me-line-brand);
  --bs-offcanvas-padding-x:1.5rem;
  --bs-offcanvas-padding-y:1.5rem;
  --bs-offcanvas-box-shadow:var(--me-sh-lg);
}
.offcanvas-bottom{border-radius:var(--me-r-2xl) var(--me-r-2xl) 0 0;--bs-offcanvas-height:auto;max-height:90vh}
.toast{--bs-toast-bg:var(--me-surface-2);--bs-toast-color:var(--me-text-2);--bs-toast-border-color:var(--me-line-brand);--bs-toast-border-radius:var(--me-r-lg);--bs-toast-header-bg:transparent;--bs-toast-header-color:var(--me-text);--bs-toast-header-border-color:var(--me-line-soft);--bs-toast-box-shadow:var(--me-sh-lg)}
.popover{--bs-popover-bg:var(--me-surface-2);--bs-popover-border-color:var(--me-line-brand);--bs-popover-border-radius:var(--me-r-lg);--bs-popover-header-bg:transparent;--bs-popover-header-color:var(--me-text);--bs-popover-body-color:var(--me-text-2);--bs-popover-arrow-border:var(--me-line-brand);font-family:var(--me-font)}
.tooltip{--bs-tooltip-bg:var(--me-brand-700);--bs-tooltip-color:#fff;--bs-tooltip-border-radius:var(--me-r-sm);--bs-tooltip-font-size:var(--me-fs-xs);font-family:var(--me-font)}

/* ---------- List group / Table / Pagination / Breadcrumb / Progress / Spinner ---------- */
.list-group{--bs-list-group-bg:transparent;--bs-list-group-color:var(--me-text-2);--bs-list-group-border-color:var(--me-line);--bs-list-group-border-radius:var(--me-r-lg);--bs-list-group-item-padding-x:1.25rem;--bs-list-group-item-padding-y:.875rem;--bs-list-group-action-hover-bg:rgba(var(--me-brand-rgb),.08);--bs-list-group-action-hover-color:#fff;--bs-list-group-action-active-bg:rgba(var(--me-brand-rgb),.14);--bs-list-group-active-bg:var(--me-brand-700);--bs-list-group-active-border-color:var(--me-brand-700);--bs-list-group-active-color:#fff}
.table{--bs-table-bg:transparent;--bs-table-color:var(--me-text-2);--bs-table-border-color:var(--me-line);--bs-table-striped-bg:rgba(var(--me-brand-rgb),.05);--bs-table-hover-bg:rgba(var(--me-brand-rgb),.08);--bs-table-hover-color:#fff;--bs-table-striped-color:var(--me-text-2)}
.table>thead{color:var(--me-text)}
.pagination{--bs-pagination-bg:transparent;--bs-pagination-color:var(--me-text-2);--bs-pagination-border-color:var(--me-line);--bs-pagination-border-radius:var(--me-r-pill);--bs-pagination-hover-bg:rgba(var(--me-brand-rgb),.12);--bs-pagination-hover-color:#fff;--bs-pagination-hover-border-color:var(--me-brand-700);--bs-pagination-focus-bg:rgba(var(--me-brand-rgb),.12);--bs-pagination-focus-color:#fff;--bs-pagination-focus-box-shadow:0 0 0 4px rgba(var(--me-brand-rgb),.18);--bs-pagination-active-bg:var(--me-brand-400);--bs-pagination-active-border-color:var(--me-brand-400);--bs-pagination-disabled-bg:transparent;--bs-pagination-disabled-color:var(--me-text-4);--bs-pagination-disabled-border-color:var(--me-line);--bs-pagination-padding-x:1rem;--bs-pagination-padding-y:.5rem;gap:6px}
.pagination .page-link{border-radius:var(--me-r-pill) !important;min-width:44px;text-align:center}
.breadcrumb{--bs-breadcrumb-item-active-color:var(--me-text);--bs-breadcrumb-divider-color:var(--me-text-4);--bs-breadcrumb-font-size:var(--me-fs-sm)}
.breadcrumb a{color:var(--me-text-3)}
.breadcrumb a:hover{color:var(--me-brand-300)}
.progress,.progress-stacked{--bs-progress-bg:var(--me-surface-3);--bs-progress-border-radius:var(--me-r-pill);--bs-progress-bar-bg:var(--me-brand-400);--bs-progress-height:.625rem}
.progress-bar{background-image:var(--me-grad-brand)}
.spinner-border,.spinner-grow{color:var(--me-brand-400)}
.placeholder{background-color:var(--me-surface-3);opacity:1}
.placeholder-glow .placeholder{animation-duration:1.6s}
.btn-close{--bs-btn-close-opacity:.7;--bs-btn-close-hover-opacity:1;--bs-btn-close-focus-shadow:0 0 0 4px rgba(var(--me-brand-rgb),.25)}
.vr{background-color:var(--me-line);opacity:1}
hr{border-color:var(--me-line-soft);opacity:1}

/* ---------- Carousel (Bootstrap inverts controls in dark mode — undo) ---------- */
[data-bs-theme="dark"] .carousel .carousel-control-prev-icon,
[data-bs-theme="dark"] .carousel .carousel-control-next-icon{filter:none}
[data-bs-theme="dark"] .carousel .carousel-indicators [data-bs-target]{filter:none;background-color:var(--me-text-3)}
[data-bs-theme="dark"] .carousel .carousel-indicators .active{background-color:var(--me-brand-400)}
[data-bs-theme="dark"] .carousel .carousel-caption{color:#fff}
.carousel-indicators [data-bs-target]{width:24px;height:4px;border-radius:4px;border:0}


/* ---------- Typography (Bootstrap's defaults are sized for a light marketing page) ---------- */
h1,.h1{font-size:clamp(1.5rem,1.2rem + 1.1vw,2.125rem)}
h2,.h2{font-size:clamp(1.3rem,1.12rem + .7vw,1.75rem)}
h3,.h3{font-size:clamp(1.15rem,1.05rem + .45vw,1.5rem)}
h4,.h4{font-size:1.1875rem}
h5,.h5{font-size:1.0625rem}
h6,.h6{font-size:.9375rem}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-weight:700;line-height:1.5}
.display-1{font-size:calc(1.6rem + 3.2vw)}
.display-2{font-size:calc(1.5rem + 2.7vw)}
.display-3{font-size:calc(1.4rem + 2.2vw)}
.display-4{font-size:calc(1.3rem + 1.7vw)}
.display-5{font-size:calc(1.25rem + 1.3vw)}
.display-6{font-size:calc(1.2rem + .9vw)}
@media (min-width:1200px){.display-1{font-size:4.5rem}.display-2{font-size:4rem}.display-3{font-size:3.5rem}.display-4{font-size:3rem}.display-5{font-size:2.5rem}.display-6{font-size:2rem}}
.lead{font-size:var(--me-fs-lg);color:var(--me-text-2)}
.blockquote{font-size:var(--me-fs-lg);color:var(--me-text)}
.blockquote-footer{color:var(--me-text-3)}
mark,.mark{background:rgba(var(--me-brand-rgb),.3);color:#fff;border-radius:4px;padding:.1em .3em}
code{color:var(--me-brand-200)}
kbd{background:var(--me-surface-3);color:var(--me-text);border:1px solid var(--me-line)}

/* ---------- The remaining Bootstrap button colours ----------
   Bootstrap compiles these with fixed hex values, so they would stay stock-blue/green without this. */
.btn-success{--bs-btn-color:#061404;--bs-btn-bg:var(--me-success);--bs-btn-border-color:var(--me-success);--bs-btn-hover-color:#061404;--bs-btn-hover-bg:#52dd30;--bs-btn-hover-border-color:#52dd30;--bs-btn-active-color:#061404;--bs-btn-active-bg:#2fb00f;--bs-btn-active-border-color:#2fb00f;--bs-btn-disabled-color:#061404;--bs-btn-disabled-bg:var(--me-success);--bs-btn-disabled-border-color:var(--me-success)}
.btn-danger{--bs-btn-color:#fff;--bs-btn-bg:var(--me-danger-2,#B3121C);--bs-btn-border-color:#B3121C;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#CC1D28;--bs-btn-hover-border-color:#CC1D28;--bs-btn-active-color:#fff;--bs-btn-active-bg:var(--me-danger);--bs-btn-active-border-color:var(--me-danger);--bs-btn-disabled-color:#fff;--bs-btn-disabled-bg:#B3121C;--bs-btn-disabled-border-color:#B3121C}
.btn-warning{--bs-btn-color:#1A1200;--bs-btn-bg:var(--me-warning);--bs-btn-border-color:var(--me-warning);--bs-btn-hover-color:#1A1200;--bs-btn-hover-bg:#FFC52E;--bs-btn-hover-border-color:#FFC52E;--bs-btn-active-color:#1A1200;--bs-btn-active-bg:#D99F00;--bs-btn-active-border-color:#D99F00;--bs-btn-disabled-color:#1A1200;--bs-btn-disabled-bg:var(--me-warning);--bs-btn-disabled-border-color:var(--me-warning)}
.btn-info{--bs-btn-color:#002624;--bs-btn-bg:var(--me-cyan);--bs-btn-border-color:var(--me-cyan);--bs-btn-hover-color:#002624;--bs-btn-hover-bg:#5CFFF9;--bs-btn-hover-border-color:#5CFFF9;--bs-btn-active-color:#002624;--bs-btn-active-bg:#00D6CF;--bs-btn-active-border-color:#00D6CF;--bs-btn-disabled-color:#002624;--bs-btn-disabled-bg:var(--me-cyan);--bs-btn-disabled-border-color:var(--me-cyan)}
.btn-light{--bs-btn-color:var(--me-bg);--bs-btn-bg:#ECE7F7;--bs-btn-border-color:#ECE7F7;--bs-btn-hover-color:var(--me-bg);--bs-btn-hover-bg:#fff;--bs-btn-hover-border-color:#fff;--bs-btn-active-color:var(--me-bg);--bs-btn-active-bg:#D9D1EC;--bs-btn-active-border-color:#D9D1EC;--bs-btn-disabled-color:var(--me-bg);--bs-btn-disabled-bg:#ECE7F7;--bs-btn-disabled-border-color:#ECE7F7}
.btn-dark{--bs-btn-color:var(--me-text);--bs-btn-bg:var(--me-surface-ink);--bs-btn-border-color:var(--me-line);--bs-btn-hover-color:#fff;--bs-btn-hover-bg:var(--me-surface-1);--bs-btn-hover-border-color:var(--me-brand-700);--bs-btn-active-color:#fff;--bs-btn-active-bg:var(--me-surface-2);--bs-btn-active-border-color:var(--me-brand-500);--bs-btn-disabled-color:var(--me-text-3);--bs-btn-disabled-bg:var(--me-surface-ink);--bs-btn-disabled-border-color:var(--me-line)}
.btn-outline-secondary,.btn-outline-success,.btn-outline-danger,.btn-outline-warning,.btn-outline-info,.btn-outline-light,.btn-outline-dark{
  --me-o:var(--me-text-3);--me-o-rgb:var(--me-text-3-rgb);
  --bs-btn-color:var(--me-o);--bs-btn-border-color:var(--me-o);
  --bs-btn-hover-color:var(--me-o);--bs-btn-hover-bg:rgba(var(--me-o-rgb),.12);--bs-btn-hover-border-color:var(--me-o);
  --bs-btn-active-color:var(--me-o);--bs-btn-active-bg:rgba(var(--me-o-rgb),.2);--bs-btn-active-border-color:var(--me-o);
  --bs-btn-disabled-color:var(--me-o);--bs-btn-disabled-border-color:var(--me-o);
  border-width:1.5px}
.btn-outline-success{--me-o:var(--me-success);--me-o-rgb:var(--me-success-rgb)}
.btn-outline-danger{--me-o:var(--me-age);--me-o-rgb:var(--me-age-rgb)}
.btn-outline-warning{--me-o:var(--me-warning);--me-o-rgb:var(--me-warning-rgb)}
.btn-outline-info{--me-o:var(--me-cyan);--me-o-rgb:var(--me-cyan-rgb)}
.btn-outline-light{--me-o:#ECE7F7;--me-o-rgb:236,231,247}
.btn-outline-dark{--me-o:var(--me-text-3);--me-o-rgb:var(--me-text-3-rgb)}
.btn-group>.btn-check:checked+.btn-outline-brand,.btn-group>.btn-check:checked+.btn-outline-primary{background:var(--me-brand-700);border-color:var(--me-brand-700)}
.btn-group-vertical>.btn{justify-content:center}

/* ---------- Extra subtle palettes used by alerts / list-group / badges ---------- */
:root,[data-bs-theme="dark"]{
  --bs-light-text-emphasis:var(--me-text);
  --bs-light-border-subtle:var(--me-line);
  --bs-dark-text-emphasis:var(--me-text-2);
  --bs-dark-border-subtle:var(--me-line-soft);
}

/* ---------- Forms: odd cases ---------- */
.form-select[multiple],.form-select[size]:not([size="1"]){border-radius:var(--me-r-xl);padding:.5rem;background-image:none}
.form-select[multiple] option,.form-select[size]:not([size="1"]) option{padding:.375rem .75rem;border-radius:var(--me-r-sm)}
.form-select[multiple] option:checked{background:var(--me-brand-700)}
.form-control::file-selector-button{padding:.5rem 1.25rem;margin:-.5rem -1.25rem;margin-inline-end:1rem;background:var(--me-surface-3);color:var(--me-text);border-inline-end-width:1.5px;border-color:var(--me-line-input)}
.form-control:hover:not(:disabled):not([readonly])::file-selector-button{background:var(--me-surface-2)}
.form-control-lg::file-selector-button{padding:.6875rem 1.375rem;margin:-.6875rem -1.375rem;margin-inline-end:1rem}
.form-control-sm::file-selector-button{padding:.25rem .875rem;margin:-.25rem -.875rem;margin-inline-end:.75rem}
.form-control-color{width:4rem;padding:.375rem;border-radius:var(--me-r-md)}
.form-control-plaintext{color:var(--me-text);padding-inline:0}
.form-check-input[type=checkbox]:indeterminate{background-color:var(--me-brand-400);border-color:var(--me-brand-400)}
.input-group>.input-group-text:has(.form-check-input){padding-inline:1rem}
fieldset:disabled .btn{opacity:.45}

/* ---------- Tables: contextual rows (compiled as light pastels by Bootstrap) ---------- */
.table-primary,.table-secondary,.table-success,.table-danger,.table-warning,.table-info,.table-light,.table-dark{
  --bs-table-color:var(--me-text);--bs-table-border-color:var(--me-line);
  --bs-table-striped-color:var(--me-text);--bs-table-active-color:var(--me-text);--bs-table-hover-color:var(--me-text);
  --bs-table-striped-bg:rgba(255,255,255,.03);--bs-table-active-bg:rgba(255,255,255,.06);--bs-table-hover-bg:rgba(255,255,255,.05);
  border-color:var(--me-line)}
.table-primary{--bs-table-bg:rgba(var(--me-brand-rgb),.16)}
.table-secondary{--bs-table-bg:var(--me-surface-slate)}
.table-success{--bs-table-bg:rgba(var(--me-success-rgb),.12)}
.table-danger{--bs-table-bg:rgba(var(--me-age-rgb),.14)}
.table-warning{--bs-table-bg:rgba(var(--me-warning-rgb),.12)}
.table-info{--bs-table-bg:rgba(var(--me-cyan-rgb),.1)}
.table-light{--bs-table-bg:var(--me-surface-3)}
.table-dark{--bs-table-bg:var(--me-surface-ink)}
.table-active{--bs-table-bg-state:rgba(var(--me-brand-rgb),.14)}
.table>caption,caption{color:var(--me-text-3)}
.table-bordered>:not(caption)>*{border-color:var(--me-line)}

/* ---------- Misc Bootstrap pieces ---------- */
.img-thumbnail{background-color:var(--me-surface-1);border-color:var(--me-line);border-radius:var(--me-r-md)}
.figure-caption{color:var(--me-text-3)}
.navbar-collapse .form-control{min-height:38px}
.dropdown-menu-dark{--bs-dropdown-bg:var(--me-surface-ink);--bs-dropdown-border-color:var(--me-line)}
.dropdown-item-text{color:var(--me-text-3)}
.card-header,.card-footer{border-color:var(--me-line-soft)}
.list-group-numbered>.list-group-item::before{color:var(--me-brand-300);margin-inline-end:.5rem}
.list-group-item .form-check-input{margin-inline-end:.5rem}
.nav-link.disabled,.nav-link:disabled{color:var(--me-text-4)}
.progress{font-size:.6875rem}
.progress-bar.bg-success,.progress-bar.bg-info,.progress-bar.bg-warning,.progress-bar.bg-danger{background-image:none}
.toast-container{z-index:1090}
.scrollspy-box{position:relative;height:220px;overflow-y:auto;padding:1rem 1.25rem;border:1px solid var(--me-line);border-radius:var(--me-r-lg)}

/* =========================================================
   4 · MYESCAPE COMPONENTS
   ========================================================= */

/* ---------- Header bits ---------- */
.me-header{min-height:var(--me-header-h)}
/* the blur lives on a pseudo-element: backdrop-filter on the header itself would become the
   containing block of the position:fixed offcanvas inside it and push the page wider */
.me-header::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(var(--me-bg-rgb),.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.me-icon-btn{width:48px;height:48px;border-radius:50%;display:inline-grid;place-items:center;background:var(--me-bg-alt);color:var(--me-text);font-size:22px;border:0;flex:none;transition:background var(--me-dur)}
.me-icon-btn:hover{background:var(--me-surface-3);color:#fff}
.me-user{display:inline-flex;align-items:center;gap:10px;padding:4px 4px 4px 14px;background:var(--me-bg-alt);border-radius:var(--me-r-pill);color:var(--me-text);font-size:var(--me-fs-md);border:0;white-space:nowrap}
.me-avatar{width:42px;height:42px;border-radius:50%;display:inline-grid;place-items:center;background:var(--me-brand-700);color:#fff;font-size:20px;flex:none;overflow:hidden}
.me-avatar img{width:100%;height:100%;object-fit:cover}

/* ---------- Chips (room facts) ---------- */
.me-chip{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:0 16px;border:1.5px solid var(--me-line-brand-2);border-radius:var(--me-r-pill);background:var(--me-surface-2);color:var(--me-text);font-size:var(--me-fs-sm);white-space:nowrap}
.me-chip .ti{font-size:19px}
.me-chip-sm{min-height:34px;padding:0 12px;font-size:var(--me-fs-sm);gap:6px}

/* ---------- Stat line (icon + text) ---------- */
.me-stat{display:flex;align-items:center;gap:8px;color:var(--me-text);font-size:var(--me-fs-md)}
.me-stat .ti{font-size:20px;flex:none}

/* ---------- Price / score ---------- */
.me-price{display:flex;align-items:center;flex-wrap:wrap;gap:12px;color:var(--me-text)}
.me-price b{font-size:var(--me-fs-price);font-weight:900}
.me-price .per{display:flex;align-items:center;gap:6px;padding-inline-start:12px;border-inline-start:1px solid var(--me-line);font-size:var(--me-fs-md)}
.me-strike{color:var(--me-text-4);text-decoration:line-through;font-size:var(--me-fs-xs);font-weight:700}
.me-score small{display:block;color:var(--me-text-3);font-size:var(--me-fs-sm);font-weight:700}
.me-score b{color:var(--me-success);font-size:var(--me-fs-display);font-weight:900}

/* ---------- Poster ---------- */
.me-poster{position:relative;border-radius:var(--me-r-lg);overflow:hidden;border:1px solid var(--me-line)}
.me-poster img{width:100%;height:100%;object-fit:cover;display:block}
.me-poster-notch{border-radius:var(--me-r-sm) var(--me-r-2xl) var(--me-r-sm) var(--me-r-sm);border-color:var(--me-brand-700)}
.me-poster .badge{position:absolute;top:12px}
.me-poster .badge-start{inset-inline-start:14px}
.me-poster .badge-end{inset-inline-end:14px}

/* ---------- Horizontal scroller (date chips, genres, steps) ---------- */
.me-scroll-x{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:2px}
.me-scroll-x::-webkit-scrollbar{display:none}
.me-dates{gap:4px}
.me-dates .btn-date{position:relative}
.me-dates .btn-check+.btn-date::before{content:"";position:absolute;inset-inline-end:-3px;top:15px;bottom:15px;width:1px;background:var(--me-text-4)}
.me-dates .btn-check:checked+.btn-date::before{display:none}

/* ---------- Hero ---------- */
.me-hero{position:relative;min-height:clamp(360px,42vw,720px);display:flex;align-items:center;overflow:hidden;background-color:#0d0718;background-position:left center;background-size:auto 100%;background-repeat:no-repeat}
/* set the photo inline: style="background-image:url(...)" — a url() inside a custom property would resolve against this CSS file */
.me-hero::before{content:"";position:absolute;inset:0;background:var(--me-grad-hero)}
.me-hero>*{position:relative}
.me-hero-title{margin:0;color:var(--me-text);font-size:var(--me-fs-hero);font-weight:900;line-height:1.55}
.me-hero-lead{margin:10px 0 24px;color:var(--me-text);font-size:var(--me-fs-h3)}
@media (max-width:767.98px){
  .me-hero{align-items:flex-end;background-size:cover;background-position:30% center}
  .me-hero::before{background:linear-gradient(0deg,rgba(10,1,32,.95) 25%,rgba(10,1,32,.3))}
}

/* ---------- Grid pattern band ---------- */
.me-grid-bg{background:var(--me-grid-pattern),var(--me-bg)}

/* ---------- Search bar ---------- */
.me-search{display:flex;align-items:stretch;background:#070114;border:1px solid var(--me-line-brand);border-radius:var(--me-r-2xl) var(--me-r-xl) var(--me-r-xl) var(--me-r-2xl);overflow:hidden;box-shadow:var(--me-sh-md)}
.me-search-field{flex:1;min-width:0;padding:12px 22px;display:flex;flex-direction:column;gap:6px;position:relative;background:none;border:0;color:var(--me-text);text-align:start;font-family:inherit}
.me-search-field+.me-search-field::before{content:"";position:absolute;inset-inline-start:0;top:14px;bottom:14px;width:1px;background:linear-gradient(var(--me-brand-500),rgba(113,70,188,.25))}
.me-search-field .lbl{display:flex;align-items:center;gap:6px;font-size:var(--me-fs-md);font-weight:700}
.me-search-field .val{font-size:var(--me-fs-md)}
.me-search-field .form-select,.me-search-field .form-control{min-height:auto;padding:0;border:0;border-radius:0;background-color:transparent;box-shadow:none}
.me-search-btn{flex:none;width:88px;border:0;background:var(--me-grad-brand);color:#fff;font-size:28px;display:grid;place-items:center;cursor:pointer;border-radius:var(--me-r-2xl) 0 0 var(--me-r-2xl);transition:filter var(--me-dur)}
.me-search-btn:hover{filter:brightness(1.15)}
@media (max-width:767.98px){
  .me-search{flex-direction:column;border-radius:var(--me-r-xl)}
  .me-search-field+.me-search-field::before{inset:0 16px auto;width:auto;height:1px}
  .me-search-btn{width:100%;height:48px;border-radius:0;font-size:22px}
}

/* ---------- Section header ---------- */
.me-sec-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px}
.me-sec-title{display:flex;align-items:center;gap:16px;margin:0;color:var(--me-text);font-size:var(--me-fs-h2);font-weight:500}
.me-sec-title::before{content:"";width:6px;height:38px;border-radius:var(--me-r-xs);background:var(--me-brand-600);flex:none}
.me-sec-actions{display:flex;gap:16px;align-items:center}

/* ---------- Stats card (room facts + price) ---------- */
.me-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:22px 16px;padding-bottom:22px;border-bottom:1px solid var(--me-line-soft)}
.me-stats-foot{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:16px;padding-top:24px}

/* ---------- Room card ---------- */
.me-room{--bs-card-bg:transparent;--bs-card-border-color:#1E1530;--bs-card-border-radius:var(--me-r-xl);background:linear-gradient(180deg,#0B0614,#010001 60%);padding:10px 10px 12px;gap:10px;height:100%}
.me-room .me-poster{aspect-ratio:320/415}
.me-room-title{margin:4px 2px 0;color:var(--me-text);font-size:var(--me-fs-md);font-weight:700}
.me-room-meta{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;font-size:11px;color:var(--me-text);line-height:2}
.me-room-meta>div:first-child{border-inline-end:1px solid;border-image:linear-gradient(transparent,var(--me-brand-500),transparent) 1}
.me-room-foot{display:grid;grid-template-columns:1fr auto;align-items:end;gap:4px 8px;font-size:11px}
.me-room-foot .left{color:var(--me-lime);opacity:.85}
.me-room-foot .old{color:var(--me-text-4);text-decoration:line-through;text-align:end}
.me-room-foot .now{color:var(--me-text);font-size:var(--me-fs-sm);font-weight:900;text-align:end}
.me-room-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}
.me-room-actions .btn{min-height:42px;--bs-btn-padding-y:.5rem;--bs-btn-padding-x:.5rem;--bs-btn-font-size:var(--me-fs-xs)}

/* vertical «نمایش همه» */
.me-vtab{writing-mode:vertical-rl;transform:rotate(180deg);display:flex;align-items:center;justify-content:center;width:46px;min-height:300px;font-size:var(--me-fs-sm);border-radius:var(--me-r-pill);background:var(--me-grad-brand-v);color:#fff;font-weight:700;transition:filter var(--me-dur)}
.me-vtab:hover{filter:brightness(1.15);color:#fff}

/* ---------- Brand wordmark ---------- */
.me-brand-mark{display:flex;align-items:center;gap:10px;color:var(--me-text);font-family:"Inter",Arial,sans-serif;font-size:clamp(.95rem,.8rem + .55vw,1.375rem);direction:ltr;opacity:.9;transition:opacity var(--me-dur)}
.me-brand-mark:hover{opacity:1;color:#fff}
.me-brand-mark img,.me-brand-mark i{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-size:20px;font-style:normal;flex:none}

/* ---------- City card ---------- */
.me-city{position:relative;display:block;aspect-ratio:1;border-radius:var(--me-r-xl);overflow:hidden;border:1.5px solid var(--me-brand-700);transition:border-color var(--me-dur)}
.me-city img{width:100%;height:100%;object-fit:cover;display:block;transition:transform var(--me-dur-slow) var(--me-ease)}
.me-city:hover{border-color:var(--me-brand-400)}
.me-city:hover img{transform:scale(1.05)}
.me-city-label{position:absolute;inset-inline:6%;bottom:6%;height:15%;min-height:40px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0 14px;white-space:nowrap;overflow:hidden;border-radius:var(--me-r-md);background:rgba(18,14,10,.7);backdrop-filter:blur(4px);color:#fff;font-size:var(--me-fs-sm);font-weight:700}
.me-city-label em{flex:1;min-width:0;overflow:hidden;text-align:left;font-style:normal;font-family:Arial,sans-serif;font-weight:900;font-size:1.4em;color:rgba(255,255,255,.12);direction:ltr}

/* ---------- Testimonial ---------- */
.me-quote{position:relative;padding:40px 28px 28px;text-align:center;color:var(--me-text);font-size:var(--me-fs-lg);line-height:var(--me-lh-prose)}
.me-quote-icon{position:absolute;top:-30px;inset-inline-start:50%;transform:translateX(-50%);width:60px;height:60px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#4E278A 55%,#1A0B33 56%);box-shadow:0 0 0 4px var(--me-bg),0 0 0 5px rgba(var(--me-brand-rgb),.4);font-size:30px;color:#1A0B33}
[dir="rtl"] .me-quote-icon{transform:translateX(50%)}
.me-quote.is-side{opacity:.55;transform:scale(.88);font-size:var(--me-fs-sm)}
.me-quote.is-side .me-quote-icon{width:44px;height:44px;top:-22px;font-size:22px}
.me-quotes{display:grid;grid-template-columns:1fr 1.6fr 1fr;gap:24px;align-items:center}
.me-avatars{display:flex;align-items:center;justify-content:center;gap:clamp(12px,3vw,40px)}
.me-av{border-radius:50%;overflow:hidden;flex:none;padding:0;border:0;background:none;transition:transform var(--me-dur),opacity var(--me-dur)}
.me-av img{width:100%;height:100%;object-fit:cover;display:block}
.me-av.s0{width:88px;height:88px;border:2px solid var(--me-brand-500)}
.me-av.s1{width:66px;height:66px;opacity:.85}
.me-av.s2{width:50px;height:50px;opacity:.55}
@media (max-width:767.98px){
  .me-quotes{grid-template-columns:1fr}
  .me-quote.is-side,.me-av.s2{display:none}
  .me-av.s0{width:72px;height:72px}.me-av.s1{width:52px;height:52px}
  .me-quote{padding:44px 20px 24px}
}

/* ---------- Checkout stepper ---------- */
.me-steps{display:flex;align-items:center;justify-content:center;gap:clamp(16px,4vw,72px);overflow-x:auto;scrollbar-width:none;padding:6px 0;margin:0;list-style:none}
.me-steps::-webkit-scrollbar{display:none}
.me-step{display:flex;align-items:center;gap:8px;flex:none;color:var(--me-text);font-size:var(--me-fs-md);white-space:nowrap}
.me-step>i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--me-text-3);font-size:15px;font-style:normal}
.me-step.done{color:var(--me-lime)}
.me-step.done>i{background:var(--me-lime);border-color:var(--me-lime);color:#0A0120}
.me-step.current{color:var(--me-lime);opacity:.55}
.me-step.current>i{border-color:var(--me-lime-dim);color:var(--me-lime)}
.me-step-sep{color:#2A2742;font-size:22px;flex:none}

/* ---------- Calendar ---------- */
.me-cal-title{display:flex;align-items:center;gap:16px}
.me-cal-title .ico{width:54px;height:54px;border-radius:50%;background:var(--me-brand-400);display:grid;place-items:center;color:#fff;font-size:26px;flex:none}
.me-cal-title b{display:block;color:var(--me-text);font-size:var(--me-fs-lg);font-weight:900}
.me-cal-month{display:flex;align-items:center;gap:24px;color:var(--me-text);font-size:var(--me-fs-lg);font-weight:700}
.me-cal-month .btn{--bs-btn-color:var(--me-brand-400);--bs-btn-hover-color:var(--me-brand-200);--bs-btn-disabled-color:var(--me-text-4);--bs-btn-disabled-border-color:transparent;font-size:22px;width:40px;height:40px;padding:0}
.me-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);row-gap:10px;text-align:center}
.me-cal-grid .wd{color:var(--me-text);font-size:var(--me-fs-sm);padding-bottom:12px}
.me-day{height:50px;border:0;background:none;border-radius:var(--me-r-pill);font-family:inherit;font-size:var(--me-fs-md);color:var(--me-text-3);cursor:default;transition:background var(--me-dur)}
.me-day.past{color:var(--me-text)}
.me-day.has{color:var(--me-lime);cursor:pointer}
.me-day.has:hover{background:rgba(70,250,25,.08)}
.me-day.full{color:var(--me-gray)}
.me-day.future{color:var(--me-day-future)}
.me-day.sel,.me-day[aria-pressed="true"]{background:var(--me-brand-400);color:#fff;font-weight:900;box-shadow:var(--me-sh-glow)}
.me-legend{display:flex;flex-wrap:wrap;gap:12px 24px;margin:0;padding:0;list-style:none}
.me-legend li{display:flex;align-items:center;gap:8px}
.me-legend li::before{content:"";width:14px;height:14px;border-radius:50%;background:var(--c)}
@media (max-width:575.98px){.me-day{height:44px;font-size:var(--me-fs-sm)}.me-cal-grid .wd{font-size:11px}.me-cal-month{gap:12px}}

/* ---------- Booking bits ---------- */
.me-panel-violet{background:var(--me-grad-violet);border-radius:var(--me-r-2xl);padding:20px}
.me-meta-row{display:flex;flex-wrap:wrap;gap:6px 18px;color:var(--me-text);font-size:var(--me-fs-sm)}
.me-meta-row span{display:inline-flex;align-items:center;gap:6px}
.me-meta-row .ti{font-size:20px}
.me-total{text-align:center;color:var(--me-text-2);font-size:var(--me-fs-xs)}
.me-total b{color:var(--me-brand-400);font-weight:500}
.me-notice{display:flex;align-items:center;gap:8px;color:var(--me-cyan);font-size:var(--me-fs-md);margin:0}
.me-notice .ti{font-size:22px;flex:none}
.me-notice b{font-weight:900}
.me-inv-row{display:flex;justify-content:space-between;align-items:center;gap:12px;color:var(--me-text-2);font-size:var(--me-fs-md)}
.me-inv-row.disc{color:var(--me-text)}
.me-inv-row.disc b{color:var(--me-lime);font-weight:500}
.me-inv-total{display:flex;justify-content:space-between;align-items:center;color:var(--me-text)}
.me-inv-total b{font-size:var(--me-fs-price);font-weight:900}

/* benefit tile */
.me-benefit{background:#171628;border-radius:var(--me-r-md);padding:20px 16px;text-align:center;height:100%}
.me-benefit .ico{width:54px;height:54px;margin:0 auto 14px;border-radius:50%;border:2px solid var(--me-brand-400);display:grid;place-items:center;color:var(--me-text);font-size:24px}
.me-benefit h5{margin:0 0 12px;color:var(--me-text);font-size:var(--me-fs-lg);font-weight:500}
.me-benefit p{margin:0;color:var(--me-text-2);font-size:var(--me-fs-sm);line-height:1.9}

/* sticky checkout bar */
/* z-index below .sticky-top (1020): the header's offcanvas lives in that stacking context and must cover this bar */
.me-checkout-bar{position:sticky;bottom:0;z-index:1015;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding:18px clamp(16px,5vw,90px);background:linear-gradient(180deg,#0E0620,#050111);border-top:1px solid #1E1530;border-radius:var(--me-r-2xl) var(--me-r-2xl) 0 0;box-shadow:0 -16px 40px rgba(0,0,0,.45);padding-bottom:calc(18px + env(safe-area-inset-bottom))}
.me-checkout-bar .total small{display:block;color:var(--me-text);font-size:var(--me-fs-sm)}
.me-checkout-bar .total b{color:var(--me-text);font-size:var(--me-fs-h3);font-weight:900}
.me-checkout-bar .btn{white-space:nowrap}
@media (max-width:575.98px){.me-checkout-bar{padding:14px 16px calc(14px + env(safe-area-inset-bottom));gap:10px}.me-checkout-bar .acts{width:100%;flex-wrap:nowrap !important}.me-checkout-bar .acts .btn{--bs-btn-padding-x:.75rem;--bs-btn-padding-y:.875rem;font-size:var(--me-fs-sm)}.me-checkout-bar .acts .btn:first-child{flex:1}.me-checkout-bar .total{display:flex;width:100%;justify-content:space-between;align-items:center;order:-1}}

/* prose */
.me-prose{color:var(--me-text-2);font-size:var(--me-fs-lg);line-height:var(--me-lh-prose)}
.me-prose h2,.me-prose h3{color:var(--me-text);font-weight:500;margin:0 0 1rem}
.me-prose h2{font-size:var(--me-fs-h2)}


/* ---------- Header on scroll (toggled by myescape.js) ---------- */
.me-header{transition:box-shadow var(--me-dur)}
.me-header.is-scrolled{box-shadow:0 10px 30px rgba(0,0,0,.45)}

/* ---------- Horizontal track: scroll-snap carousel driven by myescape.js ----------
   <div class="me-track" id="x" style="--per:4"> … </div>  + buttons [data-me-prev="#x"] / [data-me-next="#x"] */
.me-track{--gap:16px;--per:1.2;display:flex;gap:var(--gap);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;overscroll-behavior-x:contain;scrollbar-width:none;padding-bottom:4px}
.me-track::-webkit-scrollbar{display:none}
.me-track>*{flex:0 0 calc((100% - (var(--per) - 1) * var(--gap)) / var(--per));scroll-snap-align:start;min-width:0}
@media (min-width:576px){.me-track{--per:2.2}}
@media (min-width:992px){.me-track{--per:3.2}}
@media (min-width:1400px){.me-track{--per:4}}
@media (min-width:1600px){.me-track{--per:4.3}}
[data-me-prev]:disabled,[data-me-next]:disabled{opacity:.35}
.me-track-empty{padding:3rem 1rem;text-align:center;color:var(--me-text-3);width:100%}
[data-me-filter-item][hidden]{display:none !important}

/* ---------- Testimonial switcher ---------- */
.me-quote-text{transition:opacity var(--me-dur) var(--me-ease),transform var(--me-dur) var(--me-ease)}
.me-quote-text.is-leaving{opacity:0;transform:translateY(6px)}
.me-av{cursor:pointer}
.me-av:focus-visible{outline:2px solid var(--me-brand-400);outline-offset:3px}

/* ---------- Calendar states set by myescape.js ---------- */
.me-day:disabled{cursor:default}
.me-day.is-today{box-shadow:inset 0 0 0 1.5px rgba(var(--me-brand-rgb),.6)}
.me-day:focus-visible{outline:2px solid var(--me-brand-400);outline-offset:2px}

/* ---------- Team member repeater ---------- */
.me-member{position:relative;padding:1.25rem;border:1px dashed var(--me-line-brand);border-radius:var(--me-r-xl);animation:me-in var(--me-dur-slow) var(--me-ease)}
.me-member-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:.75rem;color:var(--me-text);font-size:var(--me-fs-sm);font-weight:700}
@keyframes me-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---------- Countdown ---------- */
[data-me-countdown]{font-variant-numeric:tabular-nums}
[data-me-countdown].is-expired{color:var(--me-age)}

/* =========================================================
   5 · UTILITIES
   ========================================================= */
.text-brand{color:var(--me-brand-400) !important}
.text-brand-300{color:var(--me-brand-300) !important}
.text-brand-500{color:var(--me-brand-500) !important}
.text-lime{color:var(--me-lime) !important}
.text-cyan{color:var(--me-cyan) !important}
.text-age{color:var(--me-age) !important}
.text-star{color:var(--me-star) !important}
.text-me-1{color:var(--me-text) !important}
.text-me-2{color:var(--me-text-2) !important}
.text-me-3{color:var(--me-text-3) !important}
.text-me-4{color:var(--me-text-4) !important}
.text-gradient{background:linear-gradient(90deg,var(--me-brand-200),var(--me-brand-400));-webkit-background-clip:text;background-clip:text;color:transparent !important}

.bg-me{background-color:var(--me-bg) !important}
.bg-me-alt{background-color:var(--me-bg-alt) !important}
.bg-surface-1{background-color:var(--me-surface-1) !important}
.bg-surface-2{background-color:var(--me-surface-2) !important}
.bg-surface-3{background-color:var(--me-surface-3) !important}
.bg-violet{background-color:var(--me-surface-violet) !important}
.bg-slate{background-color:var(--me-surface-slate) !important}
.bg-grad-brand{background-image:var(--me-grad-brand) !important}
.bg-grad-ink{background-image:var(--me-grad-ink) !important}
.bg-grad-glass{background:var(--me-grad-glass) !important}
.bg-grad-violet{background-image:var(--me-grad-violet) !important}

.border-brand{border-color:var(--me-line-brand) !important}
.border-brand-2{border-color:var(--me-line-brand-2) !important}
.border-soft{border-color:var(--me-line-soft) !important}
.border-glass{background:var(--me-grad-glass) padding-box,var(--me-grad-glass-line) border-box !important;border:1px solid transparent !important}

.rounded-me-xl{border-radius:var(--me-r-xl) !important}
.rounded-me-2xl{border-radius:var(--me-r-2xl) !important}

.fs-hero{font-size:var(--me-fs-hero) !important}
.fs-display{font-size:var(--me-fs-display) !important}
.fs-h2{font-size:var(--me-fs-h2) !important}
.fs-h3{font-size:var(--me-fs-h3) !important}
.fs-price{font-size:var(--me-fs-price) !important}
.fs-lg{font-size:var(--me-fs-lg) !important}
.fs-sm{font-size:var(--me-fs-sm) !important}
.fs-xs{font-size:var(--me-fs-xs) !important}
.fs-2xs{font-size:var(--me-fs-2xs) !important}
.fw-black{font-weight:900 !important}
.lh-prose{line-height:var(--me-lh-prose) !important}

.shadow-glow{box-shadow:var(--me-sh-glow) !important}
.text-strike{text-decoration:line-through !important}
.ratio-poster{--bs-aspect-ratio:131.25%}   /* 320×420 */
.ratio-3x4{--bs-aspect-ratio:133.333%}
.min-w-0{min-width:0 !important}
/* extra breakpoint for the 1920 design width (Bootstrap stops at xxl=1400) */
@media (min-width:1600px){.row-cols-3xl-4>*{flex:0 0 auto;width:25%}.row-cols-3xl-5>*{flex:0 0 auto;width:20%}}
.w-sidebar{width:100%}
@media (min-width:1200px){.w-sidebar{width:var(--me-sidebar-w);flex:none}}
.sticky-under-header{position:sticky;top:calc(var(--me-header-h) + 16px)}

/* touch: hover lifts stick after tap — neutralise */
@media (hover:none){
  .card-hover:hover{transform:none}
  .me-city:hover img{transform:none}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:0s !important;animation-duration:0s !important}
}
