/* ==========================================================================
   HostForge — Lagom Shop | قالب سفارش مدرن، فارسی، راست‌چین
   طراحی مستقل و متمایز؛ روی موتور Standard Cart سوار است (منطق دست‌نخورده).
   ========================================================================== */

#order-standard_cart.lagom,
.lagom-order{
  --lg-ink:#0F1729; --lg-ink-2:#1B2438; --lg-line:#E6E9F2; --lg-paper:#FFFFFF;
  --lg-paper-2:#F6F8FC; --lg-muted:#6B7488; --lg-accent:#2D5BFF; --lg-accent-ink:#1E40D8;
  --lg-teal:#11B886; --lg-gold:#FFB020; --lg-radius:16px;
  font-family:'Vazirmatn',sans-serif; direction:rtl; text-align:right; color:var(--lg-ink);
}
.lagom-order *{box-sizing:border-box;letter-spacing:normal!important}
.lagom-order a{text-decoration:none}

/* ---------- نوار مراحل (استپر) ---------- */
.lg-steps{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0 26px;padding:16px 20px;background:#fff;border:1px solid var(--lg-line);border-radius:var(--lg-radius);box-shadow:0 12px 34px -28px rgba(15,23,41,.45)}
.lg-step{display:flex;align-items:center;gap:10px;color:var(--lg-muted);font-weight:600;font-size:13.5px}
.lg-step .n{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--lg-paper-2);color:var(--lg-muted);font-size:13px;font-weight:700;border:1px solid var(--lg-line)}
.lg-step.on{color:var(--lg-ink)}
.lg-step.on .n{background:var(--lg-accent);color:#fff;border-color:var(--lg-accent)}
.lg-step.done .n{background:var(--lg-teal);color:#fff;border-color:var(--lg-teal)}
.lg-step-sep{flex:1;height:2px;background:var(--lg-line);min-width:20px;border-radius:2px}

/* ---------- عنوان صفحه ---------- */
.lg-head{margin:6px 0 20px}
.lg-head .eyebrow{color:var(--lg-accent);font-weight:700;font-size:13px}
.lg-head h1{font-size:30px;font-weight:800;color:var(--lg-ink);margin:6px 0 4px}
.lg-head p{color:var(--lg-muted);font-size:15px;margin:0}

/* ---------- چیدمان دوستونه ---------- */
.lg-layout{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:start}
@media(max-width:991px){.lg-layout{grid-template-columns:1fr}}

/* ---------- کارت‌ها ---------- */
.lg-card{background:#fff;border:1px solid var(--lg-line);border-radius:var(--lg-radius);box-shadow:0 14px 40px -30px rgba(15,23,41,.5);overflow:hidden;margin-bottom:20px}
.lg-card-head{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--lg-line);background:var(--lg-paper-2)}
.lg-card-head .ico{width:30px;height:30px;border-radius:9px;background:#eaf0ff;color:var(--lg-accent);display:grid;place-items:center;font-size:14px}
.lg-card-head h3{font-size:15.5px;font-weight:700;margin:0;color:var(--lg-ink)}
.lg-card-body{padding:20px}

/* ---------- گرید محصولات (لیست فروشگاه) ---------- */
.lg-products{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media(max-width:1100px){.lg-products{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.lg-products{grid-template-columns:1fr}}
.lg-product{background:#fff;border:1px solid var(--lg-line);border-radius:var(--lg-radius);padding:24px;display:flex;flex-direction:column;transition:.18s ease;position:relative}
.lg-product:hover{border-color:var(--lg-accent);transform:translateY(-4px);box-shadow:0 22px 50px -28px rgba(45,91,255,.5)}
.lg-product .lg-ico{width:52px;height:52px;border-radius:13px;background:linear-gradient(135deg,#eaf0ff,#dfe7ff);display:grid;place-items:center;color:var(--lg-accent);font-size:22px;margin-bottom:16px}
.lg-product h3{font-size:19px;font-weight:800;color:var(--lg-ink);margin:0 0 8px}
.lg-product .desc{font-size:13.5px;color:var(--lg-muted);line-height:1.9;flex:1;margin-bottom:16px}
.lg-product .lg-price{font-size:24px;font-weight:800;color:var(--lg-ink)}
.lg-product .lg-price small{font-size:13px;color:var(--lg-muted);font-weight:400}
.lg-product .lg-cta{display:block;text-align:center;margin-top:16px;background:var(--lg-accent);color:#fff;font-weight:700;padding:12px;border-radius:11px;transition:.16s}
.lg-product .lg-cta:hover{background:var(--lg-accent-ink);color:#fff}
.lg-product .lg-ribbon{position:absolute;top:-9px;inset-inline-start:20px;background:var(--lg-gold);color:#3a2700;font-size:11px;font-weight:700;padding:3px 10px;border-radius:6px}

/* ---------- چرخه‌ی صورت‌حساب (قرص‌ها) ---------- */
.lg-cycles{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px}
.lg-cycle{position:relative;cursor:pointer;display:block}
.lg-cycle input{position:absolute;opacity:0;inset:0}
.lg-cycle .box{border:1.5px solid var(--lg-line);border-radius:13px;padding:15px;background:#fff;transition:.16s;text-align:center}
.lg-cycle .box .name{font-size:13px;color:var(--lg-muted);font-weight:600}
.lg-cycle .box .amt{font-size:16px;font-weight:800;color:var(--lg-ink);margin-top:5px}
.lg-cycle input:checked + .box{border-color:var(--lg-accent);background:#f6f9ff;box-shadow:0 0 0 3px rgba(45,91,255,.12)}
.lg-cycle input:focus-visible + .box{outline:2px solid var(--lg-accent);outline-offset:2px}
.lg-cycle .tag{position:absolute;top:-9px;inset-inline-end:14px;background:var(--lg-teal);color:#04221a;font-size:10.5px;font-weight:700;padding:2px 8px;border-radius:6px;z-index:1}

/* ---------- فیلدها ---------- */
.lg-grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:600px){.lg-grid2{grid-template-columns:1fr}}
.lg-field label{display:block;font-size:13px;font-weight:700;color:var(--lg-ink);margin-bottom:6px}
.lagom-order .form-control,.lagom-order select,.lagom-order input[type=text],
.lagom-order input[type=password],.lagom-order input[type=email],.lagom-order input[type=number]{
  width:100%;padding:11px 13px;border:1px solid var(--lg-line);border-radius:11px;font-family:inherit;font-size:14px;background:#fff;color:var(--lg-ink)
}
.lagom-order .form-control:focus,.lagom-order select:focus,.lagom-order input:focus{outline:none;border-color:var(--lg-accent);box-shadow:0 0 0 3px rgba(45,91,255,.12)}

/* ---------- افزونه‌ها ---------- */
.lg-addons{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:600px){.lg-addons{grid-template-columns:1fr}}
.lg-addon{position:relative;border:1.5px solid var(--lg-line);border-radius:13px;padding:16px 16px 16px 48px;cursor:pointer;transition:.16s;background:#fff}
.lg-addon:hover{border-color:var(--lg-accent)}
.lg-addon input{position:absolute;inset-inline-end:16px;top:18px;width:18px;height:18px;accent-color:var(--lg-accent)}
.lg-addon .aname{font-weight:700;font-size:14px;color:var(--lg-ink)}
.lg-addon .adesc{font-size:12.5px;color:var(--lg-muted);margin-top:3px}
.lg-addon .aprice{font-size:12.5px;color:var(--lg-teal);font-weight:700;margin-top:7px}
.lg-addon.on{border-color:var(--lg-accent);background:#f6f9ff;box-shadow:0 0 0 3px rgba(45,91,255,.10)}

/* ---------- آیتم‌های سبد خرید ---------- */
.lg-items{border:1px solid var(--lg-line);border-radius:var(--lg-radius);overflow:hidden;background:#fff}
.lg-item{display:flex;align-items:flex-start;gap:16px;padding:18px 20px;border-bottom:1px solid var(--lg-line)}
.lg-item:last-child{border-bottom:0}
.lg-item .lg-ico{width:46px;height:46px;border-radius:12px;background:linear-gradient(135deg,#eaf0ff,#dfe7ff);color:var(--lg-accent);display:grid;place-items:center;font-size:19px;flex-shrink:0}
.lg-item .lg-main{flex:1;min-width:0}
.lg-item .lg-main .t{font-weight:700;color:var(--lg-ink);font-size:15px}
.lg-item .lg-main .meta{font-size:12.5px;color:var(--lg-muted);margin-top:4px;line-height:1.9}
.lg-item .lg-main .meta .lg-badge{display:inline-block;background:var(--lg-paper-2);border:1px solid var(--lg-line);border-radius:20px;padding:1px 9px;margin-inline-end:5px}
.lg-item .lg-end{text-align:left;flex-shrink:0}
.lg-item .lg-end .p{font-weight:800;color:var(--lg-ink);font-size:15px;white-space:nowrap}
.lg-item .lg-end .rm{display:inline-block;margin-top:8px;color:#c0392b;font-size:12px;cursor:pointer}
.lg-item .lg-end .rm:hover{text-decoration:underline}
.lg-empty{padding:64px 24px;text-align:center;color:var(--lg-muted)}
.lg-empty .ico{font-size:46px;color:var(--lg-line);margin-bottom:14px}
.lg-empty h3{color:var(--lg-ink);font-weight:700;margin:0 0 6px}

/* ---------- کوپن تخفیف ---------- */
.lg-promo{display:flex;gap:10px;margin-top:18px}
.lg-promo input{flex:1}
.lg-promo .btn{background:var(--lg-ink);color:#fff;border:0;border-radius:11px;padding:0 20px;font-weight:700;font-family:inherit;cursor:pointer}
.lg-promo .btn:hover{background:var(--lg-ink-2)}

/* ---------- خلاصه‌ی سفارش (چسبان) ---------- */
.lg-summary{position:sticky;top:88px}
.lg-summary .lg-card-body{padding:22px}
.lg-sum-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px dashed var(--lg-line);font-size:14px;color:var(--lg-ink-2)}
.lg-sum-row .amt{font-weight:700}
.lg-sum-total{display:flex;align-items:center;justify-content:space-between;margin-top:16px;padding-top:16px;border-top:2px solid var(--lg-line)}
.lg-sum-total .lbl{font-weight:700;color:var(--lg-ink)}
.lg-sum-total .val{font-weight:800;font-size:26px;color:var(--lg-accent)}
.lg-checkout{display:block;width:100%;text-align:center;background:var(--lg-accent);color:#fff;font-weight:800;font-size:16px;padding:16px;border-radius:13px;margin-top:18px;border:0;cursor:pointer;transition:.16s}
.lg-checkout:hover{background:var(--lg-accent-ink);color:#fff}
.lg-checkout.disabled,.lg-checkout[disabled]{opacity:.5;pointer-events:none}
.lg-guarantee{margin-top:16px;display:flex;flex-direction:column;gap:9px}
.lg-guarantee div{display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--lg-ink-2)}
.lg-guarantee i{color:var(--lg-teal)}

/* ---------- دکمه‌های عمومی ---------- */
.lg-btn{display:inline-flex;align-items:center;gap:8px;background:var(--lg-accent);color:#fff;font-weight:700;font-size:15px;padding:13px 24px;border-radius:12px;border:0;cursor:pointer;font-family:inherit;transition:.16s}
.lg-btn:hover{background:var(--lg-accent-ink);color:#fff}
.lg-btn.ghost{background:#fff;color:var(--lg-ink);border:1px solid var(--lg-line)}
.lg-btn.ghost:hover{border-color:var(--lg-accent);color:var(--lg-accent)}
.lg-links{display:flex;gap:16px;justify-content:center;margin-top:16px;font-size:13.5px}
.lg-links a:not(.lg-btn){color:var(--lg-accent)}
/* keep .lg-btn's own colors — the generic .lg-links a rule above used to override
   the filled button's white text with the accent colour (same as its background),
   making the label invisible until hover darkened the bg. */
.lg-links a.lg-btn{color:#fff}
.lg-links a.lg-btn.ghost{color:var(--lg-ink)}
.lg-links a.lg-btn.ghost:hover{color:var(--lg-accent)}

/* ---------- تکمیل سفارش ---------- */
.lg-complete{max-width:640px;margin:20px auto;text-align:center;background:#fff;border:1px solid var(--lg-line);border-radius:var(--lg-radius);padding:56px 32px;box-shadow:0 20px 50px -34px rgba(15,23,41,.5)}
.lg-complete .check{width:84px;height:84px;border-radius:50%;background:#e6f7ef;color:var(--lg-teal);display:grid;place-items:center;font-size:40px;margin:0 auto 22px}
.lg-complete h1{font-size:26px;font-weight:800;color:var(--lg-ink);margin:0 0 10px}
.lg-complete p{color:var(--lg-muted);font-size:15px;line-height:2;margin:0 0 8px}

/* ---------- هشدارها ---------- */
.lagom-order .alert{border-radius:12px;border:1px solid var(--lg-line);font-size:13.5px}
.lagom-order .alert-danger{background:#fdecec;border-color:#f3b7b7;color:#a11}
.lagom-order .alert-success{background:#e6f7ef;border-color:#9fe0c4;color:#0a6b45}

/* بارگذاری */
.lg-loader{display:none;color:var(--lg-muted);font-size:13px;padding:8px 0}
.lg-loader.show{display:block}