/*
 * Robithoh Islamic Modern v2.0.4
 * Dark/light visual system inspired by the supplied Robithoh homepage reference.
 */

:root {
  --ro-dark-bg: #003b30;
  --ro-dark-surface: #00493a;
  --ro-dark-surface-2: #005442;
  --ro-dark-border: rgba(226, 245, 239, .11);
  --ro-dark-text: #f5fbf8;
  --ro-dark-muted: #b6d7cd;
  --ro-gold: #f6b51c;
  --ro-light-bg: #f6f8f5;
  --ro-light-surface: #ffffff;
  --ro-light-surface-2: #eef5f1;
  --ro-light-border: #d9e6e0;
  --ro-light-text: #0e2a23;
  --ro-light-muted: #55716a;
}

.robithoh-theme-toggle {
  width: 38px;
  height: 38px;
  border-radius: 12px;
  border: 1px solid rgba(6, 78, 59, .18);
  background: rgba(255,255,255,.92);
  color: #064e3b;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all .2s ease;
  flex: 0 0 auto;
}
.robithoh-theme-toggle:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(2,44,34,.10); }
html.robithoh-dark .robithoh-theme-toggle { background: #0b604d !important; color: #f6c34a !important; border-color: rgba(246,181,28,.35) !important; }
html.robithoh-light .robithoh-theme-icon-dark { display: none; }
html.robithoh-dark .robithoh-theme-icon-light { display: none; }

/* ---------- DARK MODE: matches the supplied dark reference ---------- */
html.robithoh-dark body.robithoh-theme {
  background: var(--ro-dark-bg) !important;
  color: var(--ro-dark-text) !important;
}
html.robithoh-dark body.robithoh-theme .bg-white,
html.robithoh-dark body.robithoh-theme .bg-\[\#FDFBF7\] {
  background-color: var(--ro-dark-surface) !important;
  color: var(--ro-dark-text) !important;
}
html.robithoh-dark body.robithoh-theme .bg-slate-100 { background-color: rgba(255,255,255,.06) !important; }
html.robithoh-dark body.robithoh-theme .bg-emerald-50 { background-color: rgba(16, 104, 82, .35) !important; }
html.robithoh-dark body.robithoh-theme .border-slate-200\/80,
html.robithoh-dark body.robithoh-theme .border-slate-200,
html.robithoh-dark body.robithoh-theme .border-slate-100 { border-color: var(--ro-dark-border) !important; }
html.robithoh-dark body.robithoh-theme .text-slate-900 { color: var(--ro-dark-text) !important; }
html.robithoh-dark body.robithoh-theme .text-slate-700 { color: #d9ebe6 !important; }
html.robithoh-dark body.robithoh-theme .text-slate-600 { color: var(--ro-dark-muted) !important; }
html.robithoh-dark body.robithoh-theme .text-slate-500 { color: #91b5aa !important; }
html.robithoh-dark body.robithoh-theme .text-emerald-900,
html.robithoh-dark body.robithoh-theme .text-emerald-800,
html.robithoh-dark body.robithoh-theme .text-emerald-700 { color: #66d3b4 !important; }
html.robithoh-dark body.robithoh-theme .hover\:bg-emerald-50:hover { background-color: rgba(28, 122, 96, .36) !important; }
html.robithoh-dark body.robithoh-theme .hover\:text-emerald-800:hover,
html.robithoh-dark body.robithoh-theme .hover\:text-emerald-700:hover { color: #8ce4ca !important; }

/* Header / navigation */
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome > header.bg-white { background: #00493a !important; border-color: rgba(255,255,255,.08) !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome .text-slate-900 { color: #f8fffc !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome .text-slate-500 { color: #9fc5ba !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome form.bg-slate-100 { background: #00352b !important; border-color: rgba(255,255,255,.10) !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome form input { color: #fff !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome form input::placeholder { color: #88aea3 !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome .group-hover\:bg-emerald-50:hover { background: rgba(21,107,85,.45) !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome .absolute.bg-white,
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome .absolute .bg-white { background: #00513f !important; color: #f4fbf8 !important; border-color: rgba(255,255,255,.10) !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome .absolute a { color: #e9f7f2 !important; }
html.robithoh-dark body.robithoh-theme .robithoh-site-chrome .absolute a:hover { background: #0b644f !important; color: #fff !important; }

/* Content cards and sections */
html.robithoh-dark body.robithoh-theme .site-main section { color: var(--ro-dark-text); }
html.robithoh-dark body.robithoh-theme .site-main article { background: var(--ro-dark-surface) !important; border-color: var(--ro-dark-border) !important; }
html.robithoh-dark body.robithoh-theme .site-main .shadow-sm,
html.robithoh-dark body.robithoh-theme .site-main .shadow-md { box-shadow: 0 12px 30px rgba(0,0,0,.16) !important; }
html.robithoh-dark body.robithoh-theme .site-main .border-b,
html.robithoh-dark body.robithoh-theme .site-main .border-t { border-color: var(--ro-dark-border) !important; }
html.robithoh-dark body.robithoh-theme .site-main .bg-emerald-950 { background-color: #002d24 !important; }
html.robithoh-dark body.robithoh-theme .site-main .bg-emerald-900 { background-color: #00523f !important; }
html.robithoh-dark body.robithoh-theme .site-main .bg-emerald-800 { background-color: #0a654f !important; }

/* Footer and CTA stay deep-green in dark mode */
html.robithoh-dark body.robithoh-theme footer.bg-emerald-950 { background: #00291f !important; border-color: rgba(246,181,28,.16) !important; }
html.robithoh-dark body.robithoh-theme footer .text-slate-300 { color: #bfd8d1 !important; }
html.robithoh-dark body.robithoh-theme footer .text-slate-400,
html.robithoh-dark body.robithoh-theme footer .text-slate-500 { color: #86a99f !important; }

/* ---------- LIGHT MODE ---------- */
html.robithoh-light body.robithoh-theme {
  background: var(--ro-light-bg) !important;
  color: var(--ro-light-text) !important;
}
html.robithoh-light body.robithoh-theme .bg-white { background-color: var(--ro-light-surface) !important; color: var(--ro-light-text) !important; }
html.robithoh-light body.robithoh-theme .bg-\[\#FDFBF7\] { background-color: #fbfcfa !important; color: var(--ro-light-text) !important; }
html.robithoh-light body.robithoh-theme .bg-slate-100 { background-color: #f0f4f2 !important; }
html.robithoh-light body.robithoh-theme .bg-emerald-50 { background-color: #e9f6f1 !important; }
html.robithoh-light body.robithoh-theme .text-slate-900 { color: var(--ro-light-text) !important; }
html.robithoh-light body.robithoh-theme .text-slate-700 { color: #27473f !important; }
html.robithoh-light body.robithoh-theme .text-slate-600 { color: var(--ro-light-muted) !important; }
html.robithoh-light body.robithoh-theme .text-slate-500 { color: #6e8882 !important; }
html.robithoh-light body.robithoh-theme .text-emerald-900,
html.robithoh-light body.robithoh-theme .text-emerald-800,
html.robithoh-light body.robithoh-theme .text-emerald-700 { color: #075842 !important; }
html.robithoh-light body.robithoh-theme .border-slate-200\/80,
html.robithoh-light body.robithoh-theme .border-slate-200,
html.robithoh-light body.robithoh-theme .border-slate-100 { border-color: var(--ro-light-border) !important; }
html.robithoh-light body.robithoh-theme .hover\:bg-emerald-50:hover { background-color: #e5f4ee !important; }

html.robithoh-light body.robithoh-theme .site-main .bg-emerald-950 { background-color: #064e3b !important; }
html.robithoh-light body.robithoh-theme .site-main .bg-emerald-900 { background-color: #0b7054 !important; }
html.robithoh-light body.robithoh-theme footer.bg-emerald-950 { background: #eef5f1 !important; color: #2d5148 !important; border-color: #d6e7df !important; }
html.robithoh-light body.robithoh-theme footer .text-white { color: #0e2a23 !important; }
html.robithoh-light body.robithoh-theme footer .text-slate-300 { color: #44645b !important; }
html.robithoh-light body.robithoh-theme footer .text-slate-400,
html.robithoh-light body.robithoh-theme footer .text-slate-500 { color: #668179 !important; }

/* Preserve brand gold in both modes. */
html.robithoh-dark body.robithoh-theme .text-amber-300,
html.robithoh-dark body.robithoh-theme .text-amber-400,
html.robithoh-dark body.robithoh-theme .text-amber-500 { color: #f8c243 !important; }
html.robithoh-light body.robithoh-theme .text-amber-300,
html.robithoh-light body.robithoh-theme .text-amber-400,
html.robithoh-light body.robithoh-theme .text-amber-500 { color: #bb7600 !important; }

@media (max-width: 767px) {
  .robithoh-theme-toggle { width: 36px; height: 36px; }
}

/* Quote section */
html.robithoh-light body.robithoh-theme .ro-quote-section {
  background:linear-gradient(180deg,#eff7f3 0%,#e8f2ed 100%);
  border-color:#d6e7df #d6e7df #e4a80f;
}
html.robithoh-light body.robithoh-theme .ro-quote-mark {
  background:#fff;
  border-color:rgba(187,118,0,.35);
  color:#bb7600;
  box-shadow:0 0 0 8px rgba(187,118,0,.035);
}
html.robithoh-light body.robithoh-theme .ro-quote-arabic { color:#bb7600; }
html.robithoh-light body.robithoh-theme .ro-quote-translation { color:#5f766f; }
html.robithoh-light body.robithoh-theme .ro-quote-reference {
  background:#fff;
  border-color:#bfe0d4;
  color:#9a6500;
}
html.robithoh-light body.robithoh-theme .ro-quote-eyebrow { color:#2f7d68; }