/* ===============================
   rtl.final.css — cleaned (no header CSS)
   Purpose: keep RTL page-wide helpers, forms, cards, and policy styles.
   Header/menu styles are handled by js/header-loader.js (scoped classes).
   =============================== */

/* RTL theme tokens (keep if used by cards/sections) */
:root{
  --ar-bg:#ffffff;
  --ar-fg:#2b3a3b;
  --ar-muted:#748c94;
  --ar-border:#e7edf0;
  --ar-primary:#2b737c;
  --ar-accent:#db9a2e;
  --ar-shadow:0 8px 24px rgba(0,0,0,.07);
}

/* ===== Page base ===== */
body{
  margin:0; color:#263238; background:#fff;
}
.container{ max-width:1100px; margin-inline:auto; padding:24px; }
section{ padding:40px 0; }
.hero{ padding:32px 0; }
.card{ background:#fff; border:1px solid var(--ar-border); border-radius:18px; padding:24px; box-shadow:var(--ar-shadow); }
.muted{ color:#748c94; }

/* Force RTL reading order inside cards (matches your earlier fix) */
[dir="rtl"] .card{ direction: rtl; }

/* ===== Forms (icons + inputs) ===== */
.input-icon{ position:relative; }
.input-icon .ifi-icon{
  position:absolute;
  inset-inline-end:12px;
  top:50%; transform:translateY(-50%);
  width:34px; height:34px;
  display:grid; place-items:center;
  border-radius:10px;
  background:linear-gradient(135deg,#3d7f86,#c4983c);
  color:#fff;
  opacity:.75;
  pointer-events:none;
  direction:ltr;
}

.input-icon input,
.input-icon select,
.input-icon textarea{
  width:100%;
  border:1px solid var(--ar-border);
  border-radius:14px;
  padding:12px 50px;
  font-size:1rem;
  background:#fff; color:#ar-fg;
}
/* Extra padding on RTL so text does not overlap the icon */
[dir="rtl"] .input-icon input,
[dir="rtl"] .input-icon select,
[dir="rtl"] .input-icon textarea{
  padding-inline-end:10px;
}

textarea{ min-height:140px; resize:vertical; }

.btn-grad{
  display:inline-flex; align-items:center; gap:.6rem;
  padding:14px 22px; border-radius:12px; border:0;
  background:linear-gradient(90deg,#3a828a,#c09338);
  color:#fff; font-weight:700; cursor:pointer;
}

/* ===== RTL page-wide helpers ===== */
[dir="rtl"] .container,
[dir="rtl"] .wrapper,
[dir="rtl"] .page,
[dir="rtl"] main {
  margin-inline: auto !important;
}
html, body { overflow-x: hidden; }

/* Optional helper: if you have a grid that must flip to RTL, add .rtl-grid to it */
[dir="rtl"] .rtl-grid { direction: rtl; }

/* ===== Policy pages (privacy / terms / cookies) ===== */
.notice-bar {
  background: #eef6f8;
  color: #1f3a44;
  padding: 10px 14px;
  text-align: center;
  font-size: 14px;
}
.policy-wrap {
  max-width: 960px;
  margin: 32px auto;
  padding: 0 16px;
}
.policy-header {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom: 12px;
}
.policy-header h1 {
  margin: 0;
  font-size: 28px;
  line-height: 1.4;
}
.submeta {
  color:#6b7280;
  margin: 0 0 16px 0;
}
.action-row {
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin: 8px 0 24px;
}
.btn {
  border: 1px solid var(--ar-border);
  background: linear-gradient(90deg, #4b9aa0, #c3923c);
  color:#fff;
  padding: 10px 14px;
  border-radius: 10px;
  cursor:pointer;
  font-weight:600;
}
.btn.secondary {
  background: #fff;
  color:#0f172a;
}
.secure-badge {
  display:inline-flex;
  align-items:center;
  gap:10px;
  background:#f4faf6;
  color:#166534;
  border:1px solid #bbf7d0;
  padding:8px 12px;
  border-radius: 10px;
  font-weight:600;
  margin-top:6px;
}
.secure-badge svg { flex: 0 0 auto; }
h2 {
  font-size: 20px;
  margin-top: 28px;
  margin-bottom: 12px;
}
.policy-wrap ul { padding-inline-start: 18px; }
.policy-wrap li { margin: 8px 0; }

@media print {
  .notice-bar,
  .action-row,
  .header-slot { display: none !important; }
  .policy-wrap { max-width: 100%; }
}

  .partner-form{
    background:#fff;
    border:1px solid var(--border);
    border-radius:18px;
    padding:24px;
    box-shadow:var(--shadow);
  }
  .contact-grid{ display:grid; gap:14px; }
  @media (min-width:768px){ .contact-grid{ grid-template-columns:1fr 1fr; } }
  .form-group{ display:flex; flex-direction:column; gap:6px; }

  .input, select, textarea{
    width:100%;
    border:1px solid var(--border);
    border-radius:12px;
    padding:12px 14px;
    background:#fff;
    color:var(--text);
    font:inherit;
  }
  textarea{ min-height:140px; resize:vertical; }

  .actions{
    display:flex;
    gap:10px;
    flex-wrap:wrap;
    align-items:center;
  }
  .small-hint{ font-size:12px; color:#6b7280; }

  @media print{
    .hero-actions, .note, #site-header, #footer-slot{ display:none !important; }
    .hero-partner, .section{ box-shadow:none; border:0; }
  }
  
  /* --- Fix: keep all form fields inside the rounded box --- */
.partner-form {
  border-radius: 18px;
  overflow: clip;            /* يقصّ أي تجاوز داخل الحاوية */
  /* في حال لم يدعم المتصفح overflow: clip */
}
@supports not (overflow: clip) {
  .partner-form { overflow: hidden; }
}

/* اجعل عناصر الشبكة لا تفرض عرضًا زائدًا */
.contact-grid > * { min-width: 0; }

/* أبقِ مقبض التحجيم داخل الصندوق */
.partner-form textarea {
  resize: vertical;
  background-clip: padding-box;
}




/* ============== Arabic typography fix ============== */
/* اجبار العناصر النصيّة على الوراثة (لمنع Inter/Montserrat إن كانت محددة سابقًا) */
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3,
html[lang="ar"] h4, html[lang="ar"] h5, html[lang="ar"] h6,
html[lang="ar"] p,  html[lang="ar"] li,  html[lang="ar"] a,
html[lang="ar"] blockquote, html[lang="ar"] small, html[lang="ar"] code,
[dir="rtl"] h1, [dir="rtl"] h2, [dir="rtl"] h3,
[dir="rtl"] h4, [dir="rtl"] h5, [dir="rtl"] h6,
[dir="rtl"] p,  [dir="rtl"] li,  [dir="rtl"] a,
[dir="rtl"] blockquote, [dir="rtl"] small, [dir="rtl"] code {
  font-family: inherit !important;
}