/* بوّابة رِزق — صفحة مفترق واحدة تقود لبوّابات الأدوار الثلاث.
   RTL، خط Tajawal، هوية رِزق الخضراء. كل التنسيق بكلاسات (CSP يحجب style=). */
:root {
  --brand: #12876A;
  --brand-deep: #0C5E4C;
  --ink: #10201B;
  --muted: #5B6B65;
  --bg: #EEF7F4;
  --card: #ffffff;
  --border: #D3E6DE;
  --user: #12876A;
  --partner: #1f6feb;
  --admin: #7a5b00;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: "Tajawal", system-ui, sans-serif; color: var(--ink); background: var(--bg); line-height: 1.6; }
a { text-decoration: none; color: inherit; }

.portal { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem 1.2rem; gap: 2rem; }
.portal-head { text-align: center; }
.logo { display: inline-block; font-size: 2.4rem; font-weight: 800; color: var(--brand); }
.tagline { margin-top: .3rem; color: var(--muted); font-size: 1.05rem; }

.cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.2rem; width: min(960px, 100%); }
.card {
  background: var(--card); border: 1px solid var(--border); border-radius: 18px; padding: 1.8rem 1.5rem;
  display: flex; flex-direction: column; gap: .6rem; text-align: center; align-items: center;
  box-shadow: 0 6px 24px rgba(16,32,27,.06); transition: transform .15s, box-shadow .15s, border-color .15s;
  border-top: 4px solid var(--brand);
}
.card:hover { transform: translateY(-4px); box-shadow: 0 14px 36px rgba(16,32,27,.12); }
.card-user   { border-top-color: var(--user); }
.card-partner{ border-top-color: var(--partner); }
.card-admin  { border-top-color: var(--admin); }
.card-ico { font-size: 2.6rem; line-height: 1; }
.card h2 { font-size: 1.3rem; }
.card p { color: var(--muted); font-size: .95rem; flex: 1; }
.card-cta { margin-top: .6rem; font-weight: 800; color: var(--brand); font-size: 1rem; }
.card-partner .card-cta { color: var(--partner); }
.card-admin .card-cta { color: var(--admin); }

.portal-foot { font-size: .95rem; }
.portal-foot a { color: var(--muted); font-weight: 700; }
.portal-foot a:hover { color: var(--brand); }

@media (max-width: 560px) {
  .logo { font-size: 2rem; }
  .cards { grid-template-columns: 1fr; }
}
