/* ============================================================================
   Chic Theme — Base (Reset + Typography + Buttons + Inputs)
   خصائص منطقية فقط (inset-inline-*, margin-inline-*, text-align:start) — لا
   left/right صريحة ولا شروط $isRtl، بحيث نفس الملف يخدم RTL/LTR تلقائيًا حسب
   dir على <html> (راجع § ٨ من Design Handoff).
   ========================================================================= */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: hidden; } /* overflow-x:hidden على html فقط، نفس سبب Minimog التوثيقي (position:fixed + transform لا يكسر sticky) */

body.chic-theme {
  margin: 0;
  font-family: var(--chic-font-family);
  font-weight: var(--chic-fw-regular);
  font-size: var(--chic-fs-body);
  line-height: var(--chic-lh-tight);
  color: rgb(var(--chic-ink));
  background: rgb(var(--chic-surface-page));
  -webkit-font-smoothing: antialiased;
}
/* قواعد التهيئة داخل :where() بخصوصية صفرية — حتى تتغلّب عليها أي قاعدة كلاس (مثلًا لون نصّ
   <a class="chic-btn-primary"> الأبيض)، ولا تطغى على أنماط الأجزاء المشتركة مع Classic (ودجت
   التواصل، الشريط السفلي) الموجودة داخل نفس body.chic-theme. */
:where(.chic-theme) img { max-width: 100%; display: block; }
:where(.chic-theme) a { color: inherit; text-decoration: none; }
:where(.chic-theme) ul { margin: 0; padding: 0; list-style: none; }
:where(.chic-theme) :is(button, input, select, textarea) { font-family: inherit; }
.chic-theme *:focus-visible { outline: 2px solid rgb(var(--chic-ink)); outline-offset: 2px; } /* PENDING بالمرجع — قرار وصولية إلزامي، راجع § ٩ */
.chic-theme [hidden] { display: none !important; } /* أي display:flex/grid على الكلاس لا يُلغي hidden */

/* ── العناوين ── */
:where(.chic-theme) :is(h1, h2, h3, h4) {
  font-weight: var(--chic-fw-semibold);
  color: rgb(var(--chic-ink));
  line-height: var(--chic-lh-heading);
  margin: 0;
}
:where(.chic-theme) h1 { font-size: var(--chic-fs-page-title); }
:where(.chic-theme) :is(h2, h3) { font-size: var(--chic-fs-section-title); }
:where(.chic-theme) p { margin: 0 0 12px; line-height: var(--chic-lh-loose); color: rgb(var(--chic-ink-soft)); }

/* ── الحاوية وإيقاع الصفحة ── */
.chic-container { width: 100%; padding-inline: var(--chic-page-pad); }
.chic-section { padding-block: var(--chic-space-section); }
.chic-ltr-nums { direction: ltr; unicode-bidi: isolate; } /* أرقام/أسعار/عملة/هاتف/بريد/SKU داخل dir=ltr دائمًا حتى في نص عربي */

/* ============================================================================
   Buttons — § ٥ من Handoff
   ========================================================================= */
.chic-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font-family: inherit; font-size: var(--chic-fs-btn); font-weight: var(--chic-fw-medium);
  letter-spacing: normal; border-radius: var(--chic-radius);
  cursor: pointer; transition: opacity var(--chic-duration-default) ease;
  text-decoration: none; white-space: nowrap;
}
.chic-btn:hover { opacity: .82; } /* PENDING بالمرجع — قرار مؤقت بانتظار الموافقة */
/* تباعد .1em للاتينية فقط (Handoff §٢ «قاعدة عربية إلزامية») */
.chic-btn-primary:lang(en), .chic-btn-secondary:lang(en) { letter-spacing: var(--chic-ls-btn); }
.chic-btn-primary {
  background: rgb(var(--chic-ink-max)); color: rgb(var(--chic-on-dark)); border: none;
  height: 52px; padding-inline: 34px;
}
.chic-btn-primary.chic-btn-pdp { width: 240px; height: 38px; } /* صفحة المنتج — مقاس مقيس خاص */
.chic-btn-secondary {
  background: rgb(var(--chic-surface-card)); color: rgb(var(--chic-ink));
  border: var(--chic-border-width) solid rgb(var(--chic-ink)); height: 44px; padding-inline: 28px;
}
.chic-btn-quiet {
  background: rgb(var(--chic-surface-band)); color: rgb(var(--chic-ink));
  border: var(--chic-border-width) solid rgb(var(--chic-border)); height: 44px; padding-inline: 28px;
  letter-spacing: normal; font-weight: var(--chic-fw-regular);
}
.chic-btn-text {
  background: none; border: none; padding: 0; color: rgb(var(--chic-ink));
  text-decoration: underline; text-underline-offset: 3px; letter-spacing: normal;
  font-weight: var(--chic-fw-regular); height: auto;
}
.chic-btn-icon {
  width: 44px; height: 44px; padding: 0; background: none;
  border: var(--chic-border-width) solid rgb(var(--chic-border)); color: rgb(var(--chic-ink));
}
.chic-btn[disabled], .chic-btn.is-loading {
  background: rgb(var(--chic-ink-soft)); color: rgb(var(--chic-on-dark)); border-color: transparent;
  cursor: progress; opacity: 1; pointer-events: none;
}
@media (max-width: 767px) {
  .chic-btn-secondary { height: 52px; }
}

/* دوّار التحميل داخل الأزرار/عام */
.chic-spinner { width: 17px; height: 17px; border: 2px solid rgba(var(--chic-on-dark),.35); border-top-color: rgb(var(--chic-on-dark)); border-radius: 50%; animation: chic-spin .9s linear infinite; display: inline-block; }
.chic-spinner-lg { width: 26px; height: 26px; border-width: 2px; border-color: rgba(var(--chic-ink),.2); border-top-color: rgb(var(--chic-ink)); }
@keyframes chic-spin { to { transform: rotate(360deg); } }

/* ============================================================================
   Inputs · Select · Radio — § ٥ من Handoff
   ========================================================================= */
.chic-field-label { display: block; font-size: var(--chic-fs-secondary); font-weight: var(--chic-fw-regular); color: rgb(var(--chic-ink-soft)); margin-bottom: 8px; }
.chic-input, .chic-select {
  width: 100%; height: 44px; background: rgb(var(--chic-surface-card));
  border: var(--chic-border-width) solid rgb(var(--chic-border)); border-radius: var(--chic-radius);
  padding-inline: 12px; font-size: var(--chic-fs-body); color: rgb(var(--chic-ink)); font-family: inherit;
}
.chic-input:focus, .chic-select:focus { outline: none; border-color: rgb(var(--chic-ink)); }
.chic-input.has-error, .chic-select.has-error { border-color: rgb(var(--chic-danger)); }
.chic-field-error { font-size: 13px; color: rgb(var(--chic-danger)); margin-top: 8px; }
textarea.chic-input { height: auto; padding-block: 10px; resize: vertical; }
.chic-select-wrap { position: relative; }
.chic-select-wrap .chic-select { appearance: none; padding-inline-end: 34px; }
.chic-select-wrap::after {
  content: ''; position: absolute; inset-inline-end: 12px; top: 50%; transform: translateY(-50%);
  width: 10px; height: 7px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7' fill='none'%3E%3Cpath d='M1 1.5 5 5.5l4-4' stroke='%231F1E1E' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
:where(.chic-theme) input:is([type="radio"], [type="checkbox"]) { width: 17px; height: 17px; accent-color: rgb(var(--chic-ink-max)); }
.chic-otp-input { width: 100%; height: 44px; text-align: center; letter-spacing: 8px; font-weight: var(--chic-fw-semibold); font-size: 16px; }

@media (max-width: 767px) {
  .chic-input, .chic-select, .chic-otp-input { height: 48px; }
  .chic-field-label { font-size: 13px; }
}

/* ============================================================================
   بدائيات مشتركة صغيرة
   ========================================================================= */
.chic-badge-discount {
  position: absolute; top: 0; inset-inline-start: 0; background: rgb(var(--chic-ink-max));
  color: rgb(var(--chic-on-dark)); font-size: var(--chic-fs-badge); font-weight: var(--chic-fw-semibold);
  line-height: 1; padding: 8px 11px;
}
.chic-divider-v { width: 1px; align-self: stretch; background: rgb(var(--chic-border)); }
.chic-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* هياكل التحميل (Skeleton) */
.chic-skeleton { background: rgb(var(--chic-skeleton)); animation: chic-shimmer 1.4s ease-in-out infinite; }
@keyframes chic-shimmer { 0%,100% { opacity: .55; } 50% { opacity: 1; } }

/* الحالة الفارغة */
/* الحالة الفارغة — «Storefront 3» لوحة الحالات: مربّع 64 بحدّ (radius 0، ليس دائرة) ← 22 ←
   عنوان 19/600 ← 12 ← شرح 15 muted سطر 1.9 ← 26 ← زر أساسي 52 */
.chic-empty { background: rgb(var(--chic-surface-card)); padding: 56px 32px; text-align: center; display: flex; flex-direction: column; align-items: center; }
.chic-empty-icon { width: 64px; height: 64px; border: var(--chic-border-width) solid rgb(var(--chic-border)); display: flex; align-items: center; justify-content: center; font-size: 24px; color: rgb(var(--chic-muted)); margin-bottom: 22px; }
.chic-empty h2, .chic-empty h3 { font-size: 19px; font-weight: var(--chic-fw-semibold); }
.chic-empty p { margin: 12px 0 0; font-size: var(--chic-fs-body); color: rgb(var(--chic-muted)); line-height: 1.9; max-width: 420px; }
.chic-empty .chic-btn { margin-top: 26px; }
@media (max-width: 767px) { .chic-empty { padding: 40px 18px; } }

/* تنبيه خطأ عام */
.chic-alert-error { border: var(--chic-border-width) solid rgb(var(--chic-danger)); background: rgb(var(--chic-danger-bg)); color: rgb(var(--chic-danger)); font-size: 14px; padding: 14px 16px; }
.chic-alert-success { border: var(--chic-border-width) solid rgb(var(--chic-success)); background: rgba(var(--chic-success),.08); color: rgb(var(--chic-ink)); font-size: 14px; padding: 14px 16px; }