/* Shared "vaght-chi.ir" look for the utility pages (tracking, reviews, review). */
@font-face{font-family:'Vazirmatn';src:url('/static/fonts/Vazirmatn.woff2') format('woff2');font-weight:100 900;font-display:swap}

:root{
  --primary:#4F46E5; --primary-dark:#3730A3; --primary-light:#EEF2FF;
  --accent:#06B6D4; --accent2:#10B981;
  --text:#111827; --muted:#6B7280; --border:#E5E7EB; --bg:#F8F9FC;
  --radius:18px; --shadow:0 4px 24px rgba(79,70,229,.10); --shadow-lg:0 12px 40px rgba(79,70,229,.16);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Vazirmatn',Tahoma,sans-serif;direction:rtl;background:var(--bg);color:var(--text);line-height:1.85;min-height:100vh}
a{color:inherit;text-decoration:none}

/* top nav */
.site-top{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.85);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid rgba(79,70,229,.10)}
.site-top-inner{max-width:640px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;height:60px;padding:0 18px}
.brand{display:flex;align-items:center;gap:9px;font-weight:900;font-size:1.15rem;color:var(--primary)}
.brand-icon{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--accent));display:flex;align-items:center;justify-content:center;font-size:1rem}
.top-link{font-size:.88rem;font-weight:700;color:var(--primary);background:var(--primary-light);padding:8px 14px;border-radius:100px}

/* Tracking-page entry point — deliberately louder than .top-link (solid fill +
   glow + slow pulse) since every SMS/Telegram message tells the customer to
   "go to the tracking page" but Melipayamak patterns can't carry a link, so
   this is the one visual anchor they actually have to find their way there. */
.track-btn{font-size:.88rem;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--primary),var(--accent));padding:9px 16px;border-radius:100px;box-shadow:0 4px 16px rgba(79,70,229,.45);animation:track-pulse 2.4s ease-in-out infinite}
@keyframes track-pulse{0%,100%{box-shadow:0 4px 16px rgba(79,70,229,.45)}50%{box-shadow:0 4px 22px rgba(79,70,229,.75),0 0 0 5px rgba(79,70,229,.12)}}
@media (prefers-reduced-motion: reduce){.track-btn{animation:none}}

/* layout */
.container{max-width:640px;margin:0 auto;padding:22px 18px}
.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:24px;margin-bottom:16px}
h1{font-size:1.5rem;font-weight:800;letter-spacing:-.3px}
h2{font-size:1.25rem;font-weight:800;letter-spacing:-.2px}
.muted{color:var(--muted)}
.center{text-align:center}
.big-emoji{font-size:3rem;text-align:center}

/* buttons */
.btn{display:block;width:100%;text-align:center;background:linear-gradient(135deg,var(--primary),var(--accent));color:#fff;border:none;border-radius:14px;padding:15px;font-weight:800;font-size:1rem;font-family:inherit;cursor:pointer;box-shadow:0 8px 22px rgba(79,70,229,.30);transition:filter .15s}
.btn:hover{filter:brightness(1.06)}
.btn-ghost{display:block;width:100%;text-align:center;background:var(--primary-light);color:var(--primary);border:none;border-radius:14px;padding:14px;font-weight:800;font-size:1rem;font-family:inherit;cursor:pointer;margin-bottom:10px}
.btn-danger{background:linear-gradient(135deg,#EF4444,#DC2626);box-shadow:0 8px 22px rgba(239,68,68,.30)}

/* inputs */
.input{width:100%;border:1.5px solid var(--border);border-radius:14px;padding:14px 16px;font-family:inherit;font-size:1rem;background:#fff}
.input:focus{outline:none;border-color:var(--primary)}
.field-label{display:block;font-weight:700;font-size:.9rem;margin-bottom:6px}

/* misc */
.badge{display:inline-block;background:var(--primary-light);color:var(--primary);font-weight:700;font-size:.78rem;padding:5px 13px;border-radius:100px}
.pill{display:inline-block;font-weight:800;font-size:.85rem;padding:6px 16px;border-radius:100px}
.pill-confirmed{background:#DCFCE7;color:#15803D}
.pill-cancelled{background:#FEE2E2;color:#B91C1C}
.pill-pending{background:#FEF3C7;color:#B45309}
.row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #F1F1F4}
.row:last-child{border-bottom:none}
.row .label{color:var(--muted)}
.divider{border:none;border-top:1px solid var(--border);margin:18px 0}
.error-box{background:#FEE2E2;color:#B91C1C;border-radius:12px;padding:12px 14px;margin-bottom:14px;font-weight:600}
.footer{text-align:center;color:var(--muted);font-size:.82rem;padding:26px}
.footer a{color:var(--primary);font-weight:700}
.back-link{color:var(--primary);font-weight:700}

/* tracking code box */
.code-box{background:var(--primary-light);border-radius:16px;padding:16px;text-align:center;margin-bottom:16px}
.code-label{color:var(--muted);font-size:.85rem;margin-bottom:4px}
.code-row{display:flex;align-items:center;justify-content:center;gap:10px}
.code-val{font-size:1.7rem;font-weight:900;letter-spacing:3px;color:var(--primary-dark)}
.copy-btn{background:#fff;border:1px solid var(--border);border-radius:10px;padding:6px 10px;cursor:pointer;font-size:1rem;color:var(--primary)}
.copy-url{margin-top:10px;background:none;border:none;color:var(--primary);font-weight:700;font-size:.85rem;cursor:pointer;font-family:inherit}

/* star rating input (review form) — ordered 5→1 in markup */
.stars{display:inline-flex;direction:ltr;margin:8px 0 18px}
.stars input{display:none}
.stars label{font-size:2.7rem;color:#E5E7EB;cursor:pointer;padding:0 3px;transition:color .15s}
.stars label:hover,.stars label:hover ~ label{color:#F5A623}
.stars input:checked ~ label{color:#F5A623}
.stars-static{color:#F5A623;letter-spacing:2px}

/* reviews list */
.rev-avg{font-size:2.8rem;font-weight:900;color:#F5A623;line-height:1.1}
.chips{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:12px}
.chip{background:var(--primary-light);color:var(--primary);border-radius:100px;padding:6px 14px;font-size:.85rem;font-weight:700}
.rev{background:#fff;border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:16px 18px;margin-bottom:10px}
.rev-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rev-name{font-weight:800}
.rev-svc{color:var(--primary);font-size:.8rem;font-weight:700;background:var(--primary-light);border-radius:100px;padding:2px 10px}
.rev-date{margin-inline-start:auto;color:#aaa;font-size:.8rem}
.rev-txt{margin-top:6px}
.reply{margin-top:10px;background:#F6F7FB;border-radius:12px;padding:10px 12px;font-size:.92rem}
.reply b{color:var(--primary)}