/* ألوان وهوية */
:root{
  --brand-blue:#2563eb;      /* أزرق */
  --brand-blue-dark:#1e40af;
  --brand-teal:#14b8a6;      /* فيروزي */
  --brand-red:#ef4444;       /* أحمر (احتياطي) */
  --ink:#0f172a;
  --muted:#64748b;
  --bg:#f5f7fb;
  --card-bg:#ffffff;
  --card-accent: linear-gradient(135deg, #eef2ff, #ecfeff);
  --radius:16px;
}

/* أساسيات */
*{box-sizing:border-box}
body{font-family:Tahoma,Arial,sans-serif;margin:0;background:linear-gradient(180deg,#eef6ff,#f8fafc);color:var(--ink)}
.wrap{max-width:820px;margin:22px auto;padding:0 14px}
.card{
  background:var(--card-bg);border-radius:var(--radius);
  box-shadow:0 10px 28px rgba(2,8,23,.08);padding:18px 18px 20px;margin-bottom:14px
}
.card.center{text-align:center}
.card--accent{background:var(--card-accent);border:1px solid rgba(37,99,235,.15)}

.brand{display:flex;align-items:center;gap:12px;margin-bottom:8px}
.brand .sun{font-size:26px}
.title{font-weight:800;color:var(--ink);font-size:22px;margin:0}
.muted{color:var(--muted);font-size:13px}
.section-title{margin:2px 0 10px;font-size:18px}

.hint{margin-top:6px;color:#6b7280;font-size:12px}

/* بانر دعائي ملوّن */
.banner{
  border-radius: 16px; padding:14px 16px; margin: 14px 0;
  color:#fff; box-shadow:0 12px 26px rgba(37, 99, 235, .18);
}
.banner--promo{
  background: linear-gradient(90deg, var(--brand-blue), var(--brand-teal));
}
.banner__title{font-weight:900; font-size:16px}
.banner__sub{opacity:.95; font-size:13px; margin-top:4px}

/* معلومات الفرع */
.nearest-info{
  background:#fff; border:1px dashed rgba(37,99,235,.35);
  padding:12px 14px; border-radius:14px; margin:10px 0 14px;
  box-shadow:0 6px 16px rgba(2,8,23,.06);
}

/* Chips للاختيارات */
.options--chips{display:flex; gap:10px; margin:12px 0 16px; flex-wrap:wrap}
.chip{
  appearance:none; border:none; cursor:pointer;
  padding:10px 14px; border-radius:999px; font-weight:800;
  box-shadow:0 6px 14px rgba(2,8,23,.08); transition:transform .08s ease, box-shadow .2s ease, background .2s, color .2s, border .2s;
  background:#e2e8f0; color:#0f172a; border:1px solid #cbd5e1;
}
.chip:hover{transform:translateY(-1px)}
.chip.active{color:#fff}
.chip--blue.active   {background:var(--brand-blue); border-color:var(--brand-blue-dark)}
.chip--teal.active   {background:var(--brand-teal); border-color:#0f766e}

/* حقول */
label{display:block;margin:12px 0 6px;font-weight:700}
input,textarea{width:100%;padding:12px;border:1px solid #cbd5e1;border-radius:12px;font-size:15px;outline:none;background:#fff}
input:focus,textarea:focus{border-color:var(--brand-blue);box-shadow:0 0 0 3px rgba(37,99,235,.15)}
textarea{min-height:84px}

/* أزرار */
.btn{width:100%;padding:14px;border:none;border-radius:14px;font-size:16px;font-weight:900;cursor:pointer}
.btn-lg{padding:16px 18px; font-size:18px}
.btn-primary{
  background:var(--brand-blue); color:#fff; border:none;
  box-shadow:0 10px 18px rgba(37,99,235,.22); transition:filter .15s ease, transform .08s ease
}
.btn-primary:hover{filter:brightness(1.03); transform:translateY(-1px)}
.btn-success{background:#16a34a;color:#fff}

@keyframes glowPulse{
  0%  { box-shadow:0 0 0 0 rgba(37, 99, 235, .45) }
  70% { box-shadow:0 0 0 18px rgba(37, 99, 235, 0) }
  100%{ box-shadow:0 0 0 0 rgba(37, 99, 235, 0) }
}
.btn-glow{animation: glowPulse 1.6s infinite}

.error{color:#dc2626;margin-top:8px;font-size:14px}

/* توست */
.toast{
  position:fixed;top:16px;left:50%;transform:translateX(-50%);
  background:#111827;color:#fff;padding:12px 16px;border-radius:12px;
  box-shadow:0 10px 24px rgba(0,0,0,.2);opacity:0;pointer-events:none;
  transition:opacity .25s ease, transform .25s ease;z-index:9999
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* فوتر */
.footer{margin:10px 0 18px;text-align:center;color:#6b7280;font-size:12px}