/* =========================================================
   Ibrahim Quotes — Mint Light
   ========================================================= */

:root{
  --q-bg:#f3fcf9;
  --q-surface:#ffffff;
  --q-soft:#edf9f5;

  --q-text:#173f3a;
  --q-heading:#073f39;
  --q-muted:#5d7c76;

  --q-primary:#087f71;
  --q-primary-dark:#05675e;
  --q-primary-light:#29ad97;

  --q-line:rgba(8,127,113,.17);
  --q-line-strong:rgba(8,127,113,.31);

  --q-shadow:
    0 18px 46px rgba(18,83,73,.10),
    0 4px 14px rgba(18,83,73,.05);
}

html{
  color-scheme:light !important;
}

body{
  background:
    radial-gradient(
      circle at 8% 8%,
      rgba(65,199,173,.14),
      transparent 27%
    ),
    radial-gradient(
      circle at 92% 12%,
      rgba(123,225,205,.13),
      transparent 29%
    ),
    linear-gradient(
      180deg,
      #f9fffd,
      #edf9f5 52%,
      #f8fffc
    ) !important;

  color:var(--q-text) !important;
}

.topBar{
  background:rgba(255,255,255,.92) !important;
  border-bottom-color:var(--q-line) !important;
  box-shadow:0 8px 28px rgba(18,83,73,.07) !important;
}

.crumb,
.crumb a{
  color:var(--q-muted) !important;
}

.miniBtn,
.btn,
.iconBtn{
  background:#ffffff !important;
  color:var(--q-primary-dark) !important;
  border-color:var(--q-line-strong) !important;
  box-shadow:0 6px 17px rgba(18,83,73,.06);
}

.btn.primary{
  background:
    linear-gradient(
      135deg,
      var(--q-primary-dark),
      var(--q-primary-light)
    ) !important;

  color:#ffffff !important;
  border-color:transparent !important;
}

.btn.secondary{
  background:rgba(8,127,113,.09) !important;
  color:var(--q-primary-dark) !important;
  border-color:rgba(8,127,113,.25) !important;
}

.heroContent,
.heroInfoCard,
.panel,
.quoteCard,
.bridgeCard,
.metric{
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.99),
      rgba(247,255,252,.97)
    ) !important;

  border-color:var(--q-line) !important;
  color:var(--q-text) !important;
  box-shadow:var(--q-shadow) !important;
}

.heroContent{
  background:
    radial-gradient(
      circle at top left,
      rgba(8,127,113,.13),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #ffffff,
      #edf9f5
    ) !important;
}

.heroContent h1,
.sectionHead h2,
.heroInfoCard strong,
.bridgeCard h3,
.quoteTitle,
.emptyState strong,
.modalMeta h3{
  color:var(--q-heading) !important;
}

.heroContent p,
.heroInfoCard p,
.bridgeCard p,
.quoteAuthor,
.emptyState p,
.modalMeta p,
.metric span{
  color:var(--q-muted) !important;
}

.eyebrow,
.sectionKicker,
.heroTrust span,
.quoteTag,
.modalTag{
  background:rgba(8,127,113,.09) !important;
  border-color:rgba(8,127,113,.22) !important;
  color:var(--q-primary-dark) !important;
}

.metric strong{
  color:var(--q-primary-dark) !important;
}

/* استرجاع صورة إبراهيم داخل بطاقة التعريف */
.heroInfoCard{
  position:relative !important;
  overflow:hidden !important;
  min-height:475px !important;
  padding-bottom:310px !important;
}

.heroInfoCard::after{
  content:"";
  position:absolute;
  right:18px;
  left:18px;
  bottom:18px;
  height:275px;

  background:
    url("/assets/ibrahim-zidan.webp")
    center 22% / cover no-repeat;

  border-radius:18px;
  border:1px solid var(--q-line-strong);

  box-shadow:
    0 12px 28px rgba(18,83,73,.13);

  pointer-events:none;
}

.searchField input{
  background:#ffffff !important;
  color:var(--q-text) !important;
  border-color:var(--q-line-strong) !important;
}

.searchField input::placeholder{
  color:#78928e !important;
}

.chip{
  background:#ffffff !important;
  color:var(--q-primary-dark) !important;
  border-color:var(--q-line) !important;
}

.chip.active{
  background:
    linear-gradient(
      135deg,
      var(--q-primary-dark),
      var(--q-primary-light)
    ) !important;

  color:#ffffff !important;
  border-color:transparent !important;
}

.quoteCard{
  overflow:hidden;
}

.quoteImageWrap{
  background:var(--q-soft) !important;
}

.quoteOverlay{
  background:
    linear-gradient(
      180deg,
      transparent 58%,
      rgba(6,63,57,.25)
    ) !important;
}

.quoteBody{
  background:#ffffff !important;
}

.siteFooter{
  background:
    linear-gradient(
      180deg,
      rgba(230,247,242,.90),
      rgba(215,241,234,.98)
    ) !important;

  border-top-color:var(--q-line) !important;
}

.footerInner{
  color:var(--q-muted) !important;
}

.toast{
  background:#ffffff !important;
  color:var(--q-heading) !important;
  border-color:var(--q-line-strong) !important;
}

.modalContent{
  background:#ffffff !important;
  border-color:var(--q-line) !important;
}

.modalMeta{
  background:#ffffff !important;
}

.modalClose{
  background:rgba(5,103,94,.94) !important;
}

@media (max-width:620px){
  .heroInfoCard{
    min-height:430px !important;
    padding-bottom:275px !important;
  }

  .heroInfoCard::after{
    height:240px;
  }
}