/*
 Theme Name: Astra Child
 Template: astra
*/


/* ===================================================================
   SINGLE CLEAN CSS (NO DESIGN CHANGE INTENDED)
   - Cleaning only: grouping + removing true duplicates/redundant overrides
   - Values preserved exactly as your current effective state
   =================================================================== */


/* ===== GLOBAL VARS (ONE PLACE) ===== */
:root{
  /* site width */
  --site-w: 1200px;

  /* fixed header height + content gap */
  --hdr-fixed-h-desktop: 150px;
  --hdr-fixed-h-mobile:  120px;
  --hdr-gap: 70px;

  /* header pattern */
  --hdr-bg: transparent;
  --hdr-em: 1,158,149;
  --hdr-line-a: 0.08;
  --hdr-line-b: 0.01;
  --hdr-gap-1: 3px;
  --hdr-gap-2: 8px;
  --hdr-line-w: 2px;

  /* quote box */
  --q-w: 380px;
  --q-h: 140px;
  --q-r: 14px;
  --q-rail-w: 25px;
  --q-text: rgb(0 81 77);
  --q-rail-text-color: rgba(247,244,238,.92);

  /* LUX BOX SYSTEM */
  --lux-r: 18px;
  --lux-b: rgba(0,0,0,0.07);
  --lux-s: 0 18px 45px rgba(0,0,0,.08);
  --lux-in: inset 0 1px 0 rgba(255,255,255,.65);
  --lux-em: rgba(13,148,136,0.12);
  --lux-em2: rgba(13,148,136,0.06);
  --lux-g: rgba(212,175,55,0.42);
  --lux-bg: rgba(255,255,255,0.86);
  --lux-pad: 18px;
  --lux-rail: 4px;

  /* LUX OVERRIDES (NO VERTICAL RAIL) */
  --em-rgb: 13,148,136;
  --em-top-a: 0.6;
  --em-bot-a: 0.6;
  --em-glow-a: 0.9;
  --inner-bd-a: 0.06;
  --card-radius: 16px;
  --rule-inset: 18px;

  /* COMPACT-ON-SCROLL */
  --c-h: 100px;
  --c-gap: 16px;

  /* MAIN HEADER BAR (PATTERN + GLOW) */
  --hdr-em-rgb: 13,148,136;
  --hdr-gold: rgba(218,195,124,0.78);
  --hdr-bar-min-h: 130px;
  --hdr-menu-bottom-pad: 10px;
  --hdr-glow-h: 50px;
  --hdr-glow-a1: 0.20;
  --hdr-glow-a2: 0.10;
  --hdr-glow-a3: 0.00;
  --hdr-pat-a1: 0.050;
  --hdr-pat-a2: 0.028;
}


/* ===== BODY BACKGROUND ===== */
html, body{ height:100%; }

body{
  background-color: #ffffff !important;

  background-image:
    repeating-linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.03) 0px,
      rgba(0, 0, 0, 0.03) 1px,
      transparent 1px,
      transparent 3px
    ),
    linear-gradient(to bottom, #c8c8c8 0px, #94f5ff63 2px, #efeffc 600px);

  background-repeat: repeat, no-repeat;
  background-attachment: fixed, fixed;
  background-position: top left, top center;
}


/* ===== SITE CONTAINER (#page) + pattern + frame ===== */
#page{
  max-width: var(--site-w);
  margin-left: auto;
  margin-right: auto;

  background-color: #ffffff !important;

  background-image:
    linear-gradient(45deg,
      rgba(13,148,136,0.020) 25%,
      transparent 25%,
      transparent 75%,
      rgba(13,148,136,0.020) 75%
    ),
    linear-gradient(45deg,
      rgba(13,148,136,0.025) 25%,
      transparent 25%,
      transparent 75%,
      rgba(13,148,136,0.025) 75%
    );

  background-size: 25px 25px;
  background-position: 0 0, 11px 11px;
  background-attachment: fixed;

  box-shadow: 0 18px 50px rgba(0,0,0,.10);
  border-left: 1px solid rgba(0,0,0,.08);
  border-right: 1px solid rgba(0,0,0,.08);

  overflow: visible !important;

  /* (kept as-is by effect: later we push .site-content, not #page) */
  padding-top: 0 !important;
  margin-top: 0 !important;
}

#page .site-header,
#page .site-footer{ width: 100%; }


/* ===== FIXED HEADER (single definitive rule) ===== */
#masthead{
  position: fixed !important;
  top: 0 !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;

  width: min(100%, var(--site-w)) !important;
  max-width: var(--site-w) !important;

  margin: 0 !important;
  z-index: 999999 !important;

  box-shadow: none !important;
  overflow: visible !important;
}

/* Admin bar offset */
body.admin-bar #masthead{ top: 32px !important; }
@media (max-width: 782px){
  body.admin-bar #masthead{ top: 46px !important; }
}

/* DO NOT use sticky when fixed is active */
.ast-main-header-wrap{
  position: static !important;
  top: auto !important;
  z-index: auto !important;
}


/* ===== RESTORE TOP BAR COLOR (emerald) ===== */
.ast-above-header-bar,
.ast-above-header-wrap,
.ast-above-header{
  background-color: #0D9488 !important;
}


/* ===== HEADER PATTERN (logo row / main header bar) ===== */
.main-header-bar{
  background-color: var(--hdr-bg) !important;

  border-top: 2px solid rgba(218, 195, 124, 0.7);
  border-bottom: 2px solid rgba(218, 195, 124, 0.7);

  background-image:
    repeating-linear-gradient(
      to bottom,
      rgba(var(--hdr-em), var(--hdr-line-a)) 0,
      rgba(var(--hdr-em), var(--hdr-line-a)) var(--hdr-line-w),
      rgba(0,0,0,0) var(--hdr-line-w),
      rgba(0,0,0,0) var(--hdr-gap-1)
    ),
    repeating-linear-gradient(
      to bottom,
      rgba(var(--hdr-em), var(--hdr-line-b)) 0,
      rgba(var(--hdr-em), var(--hdr-line-b)) 1px,
      rgba(0,0,0,0) 1px,
      rgba(0,0,0,0) var(--hdr-gap-2)
    );

  background-position: 0 0, 0 7px;
  background-size: auto auto;

  backdrop-filter: blur(10px) saturate(1.08);
  -webkit-backdrop-filter: blur(10px) saturate(1.08);
}


/* ===== UNDER-HEADER GLOW (masthead::after) ===== */
#masthead::after{
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;

  height: 240px;
  pointer-events: none;
  z-index: 0;

  background: radial-gradient(
    ellipse at top center,
    rgba(13,148,136,0.22) 0%,
    rgba(13,148,136,0.12) 28%,
    rgba(13,148,136,0.05) 48%,
    rgba(247,244,238,0.00) 72%
  );
}

/* keep header content above the glow */
#masthead .main-header-bar{
  position: relative;
  z-index: 1;
}


/* ===== DROPDOWNS ABOVE CONTENT ===== */
#masthead,
.ast-main-header-wrap,
.ast-above-header-wrap,
.ast-below-header-wrap,
.main-header-bar,
.main-navigation{
  overflow: visible !important;
}

.main-navigation .sub-menu,
.ast-nav-menu .sub-menu,
.main-header-menu .sub-menu{
  position: absolute;
  z-index: 9999999 !important;
}


/* ===== LOGO IDENTITY ===== */
.ast-logo-title-inline .ast-site-identity{
  padding: 0;
  display: inline-flex;
  vertical-align: middle;
  align-items: center;
  transition: all .2s linear;
}


/* ===== QUOTE BOX ===== */
.quote-box{
  height: var(--q-h);
  width: var(--q-w);
  min-width: 320px;
  max-width: 440px;

  padding: 16px 18px;
  display: flex;
  align-items: center;

  border-radius: var(--q-r);
  border: 1px solid rgba(0, 60, 55, .11);

  backdrop-filter: blur(18px) saturate(0.55) contrast(0.88) !important;
  -webkit-backdrop-filter: blur(18px) saturate(0.55) contrast(0.88) !important;

  box-shadow:
    inset 25px 0px 0px 0px rgb(1 158 149),
    inset 0px 0px 0 rgb(186 150 79 / 14%),
    inset 0px 0px 1px 0px rgb(163 255 250),
    inset 0 0 50px 50px rgb(178 228 224 / 21%);

  overflow: hidden !important;
  position: relative;
}

.quote-box::after{
  content: "اقـتـبــاســــــات";
  position: absolute;
  left: 0;
  top: 0;
  width: var(--q-rail-w);
  height: 100%;

  writing-mode: vertical-rl;
  text-orientation: mixed;
  direction: rtl;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 15px;
  font-weight: 700;
  line-height: 1.05;

  color: var(--q-rail-text-color);
  text-shadow: 0 1px 0 rgba(0,0,0,.28);

  transform: rotate(180deg);
  transform-origin: center;

  padding: 10px 0;

  pointer-events: none;
  white-space: nowrap;
}

.quote-content{
  height: 100%;
  width: 100%;
  overflow: hidden !important;

  padding-left: var(--q-rail-w) !important;

  display: flex;
  align-items: center;
  justify-content: center;

  color: var(--q-text);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.55;
  font-family: inherit;

  text-shadow: 0 1px 0 rgba(0,0,0,0.24);
}

/* long quotes: start at top */
.quote-content.long{ align-items: flex-start !important; }
.quote-content.long .quote-inner{ justify-content: flex-start !important; }

.quote-inner{
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  will-change: transform, opacity;

  max-height: 100% !important;
  overflow: hidden !important;
}

/* fade */
.quote-content.fade-out{ opacity: 0; transition: opacity 900ms ease; }
.quote-content.fade-in{  opacity: 1; transition: opacity 900ms ease; }

/* enter */
.quote-inner.enter{
  animation: quoteEnter 950ms cubic-bezier(.2,.9,.2,1) both;
}
@keyframes quoteEnter{
  from{ opacity: 0; transform: translateY(16px); }
  to  { opacity: 1; transform: translateY(0); }
}

/* scroll */
.quote-inner.scroll{
  animation: quoteScroll var(--scroll-dur, 6s) linear forwards;
}
@keyframes quoteScroll{
  from { transform: translateY(0); }
  to   { transform: translateY(calc(-1px * var(--scroll-px, 0))); }
}

/* Poetry layout */
.q-bayt{ width: 100%; margin: 0 0 16px 0; }
.q-sadr{ display:block; width: 100%; text-align: right; padding-right: 10px; }
.q-ajuz{ display:block; width: 100%; text-align: left;  padding-left: 10px; margin-top: 2px !important; opacity: .90; }
.q-prose{ width: 100%; text-align: center; margin: 0 0 12px 0; }

/* Hide quote box on mobile */
@media (max-width: 980px){
  .quote-box{ display:none; }
}


/* ===== Buttons ===== */
button, .button, .ast-button{
  background-color: #0D9488 !important;
  border: 1px solid #D4AF37 !important;
  transition: all 0.3s ease;
}
button:hover, .button:hover{
  background-color: #14B8A6 !important;
  box-shadow: 0 0 15px rgba(212, 175, 55, 0.4);
  transform: translateY(-2px);
}


/* ===== Mobile header visibility + top bar compact ===== */
@media (max-width: 980px){
  #masthead,
  .site-header,
  .main-header-bar,
  .ast-primary-header-bar,
  .ast-mobile-header-wrap{
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .ast-mobile-header-wrap .ast-above-header,
  .ast-mobile-header-wrap .ast-top-header{
    min-height: 32px !important;
    padding-top: 4px !important;
    padding-bottom: 4px !important;
  }

  .ast-mobile-header-wrap .ast-social-icons a{
    font-size: 14px !important;
    line-height: 1 !important;
  }
}

/* tighter top bar override */
.ast-mobile-header-wrap .ast-above-header,
.ast-mobile-header-wrap .ast-top-header{
  min-height: 22px !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}


/* ===== Border glow under bars ===== */
.ast-below-header-bar{
  position: relative;
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: rgba(23,142,121,0.12);
}
.ast-below-header-bar::after{
  content: "";
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  height: 80px;

  background: linear-gradient(
    to bottom,
    rgba(23,142,121,0.15) 0%,
    rgba(23,142,121,0.08) 35%,
    rgba(23,142,121,0.03) 65%,
    rgba(23,142,121,0.00) 100%
  );

  pointer-events: none;
  z-index: 0;
}

.ast-header-break-point .ast-primary-header-bar{
  position: relative;
  border-bottom-width: 3px;
  border-bottom-style: solid;
  border-bottom-color: rgb(245 192 47 / 95%);
}
.ast-header-break-point .ast-primary-header-bar::after{
  content: "";
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  height: 40px;

  background: linear-gradient(
    to bottom,
    rgba(23,142,121,0.22) 0%,
    rgba(23,142,121,0.14) 35%,
    rgba(23,142,121,0.06) 65%,
    rgba(23,142,121,0.00) 100%
  );

  pointer-events: none;
  z-index: 0;
}


/* ===== Astra Transparent Header OVERRIDE ===== */
.ast-theme-transparent-header #masthead .main-header-bar{
  background: transparent !important;

  background-color: var(--hdr-bg) !important;
  background-image:
    repeating-linear-gradient(
      to bottom,
      rgba(var(--hdr-em), var(--hdr-line-a)) 0,
      rgba(var(--hdr-em), var(--hdr-line-a)) var(--hdr-line-w),
      rgba(0,0,0,0) var(--hdr-line-w),
      rgba(0,0,0,0) var(--hdr-gap-1)
    ),
    repeating-linear-gradient(
      to bottom,
      rgba(var(--hdr-em), var(--hdr-line-b)) 0,
      rgba(var(--hdr-em), var(--hdr-line-b)) 1px,
      rgba(0,0,0,0) 1px,
      rgba(0,0,0,0) var(--hdr-gap-2)
    ) !important;

  background-position: 0 0, 0 7px !important;
  background-size: auto auto !important;

  backdrop-filter: blur(10px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.08) !important;
}

.ast-theme-transparent-header #masthead .ast-below-header,
.ast-theme-transparent-header #masthead .ast-below-header.ast-below-header-bar,
.ast-theme-transparent-header #ast-desktop-header > .ast-below-header-wrap > .ast-below-header{
  background: transparent !important;

  background-color: rgba(255,255,255,0.92) !important;
  backdrop-filter: blur(10px) saturate(1.05) !important;
  -webkit-backdrop-filter: blur(10px) saturate(1.05) !important;
}

.ast-theme-transparent-header #masthead .ast-above-header-bar,
.ast-theme-transparent-header #masthead .ast-above-header-wrap,
.ast-theme-transparent-header #masthead .ast-above-header{
  background-color: #0D9488 !important;
}


/* ===== GLOBAL CONTENT OFFSET under fixed header ===== */
#page .site-content{
  padding-top: calc(var(--hdr-fixed-h-desktop) + var(--hdr-gap)) !important;
}
@media (max-width: 980px){
  #page .site-content{
    padding-top: calc(var(--hdr-fixed-h-mobile) + var(--hdr-gap)) !important;
  }
}
@media (max-width: 980px){
  body.home{
    --hdr-gap: 0px;
  }
}


/* =========================================================
   LUX BOX SYSTEM (BODY ONLY)
   ========================================================= */
.lux-card,
.sidebar-main .widget,
.ast-sidebar-widget,
#secondary .widget,
.ast-archive-post,
.ast-article-post,
article.post,
article.page,
.single .site-content article,
.comments-area,
.comment-respond,
.ast-single-post-order,
.ast-author-box{
  position: relative;
  border-radius: var(--lux-r);
  border: 1px solid var(--lux-b);
  background: var(--lux-bg);
  box-shadow: var(--lux-in), var(--lux-s);
  backdrop-filter: blur(6px) saturate(1.02);
  -webkit-backdrop-filter: blur(6px) saturate(1.02);
  overflow: hidden;
}

/* emerald rail (quiet) */
.lux-card::before,
.sidebar-main .widget::before,
.ast-sidebar-widget::before,
#secondary .widget::before,
.ast-archive-post::before,
.ast-article-post::before,
article.post::before,
article.page::before,
.single .site-content article::before,
.comments-area::before,
.comment-respond::before{
  content:"";
  position:absolute;
  top: 14px;
  bottom: 14px;
  left: 14px;
  width: var(--lux-rail);
  border-radius: 999px;
  background: linear-gradient(to bottom, rgba(13,148,136,0.00), rgba(13,148,136,0.55), rgba(13,148,136,0.00));
  opacity: .55;
  pointer-events: none;
}

/* soft inner glow */
.lux-card::after,
.sidebar-main .widget::after,
.ast-sidebar-widget::after,
#secondary .widget::after,
.ast-archive-post::after,
.ast-article-post::after,
article.post::after,
article.page::after,
.single .site-content article::after{
  content:"";
  position:absolute;
  inset: 0;
  background:
    radial-gradient(1200px 220px at 50% 0%,
      var(--lux-em) 0%,
      var(--lux-em2) 32%,
      rgba(255,255,255,0.00) 70%),
    linear-gradient(135deg,
      rgba(212,175,55,0.00) 0%,
      rgba(212,175,55,0.05) 35%,
      rgba(212,175,55,0.00) 70%);
  opacity: .55;
  pointer-events: none;
}

/* padding */
.sidebar-main .widget,
.ast-sidebar-widget,
#secondary .widget{
  padding: var(--lux-pad);
  margin: 0 0 16px 0;
}

.ast-archive-post,
.ast-article-post{
  padding: 18px;
  margin-bottom: 18px;
}

.single .site-content article,
article.post,
article.page{
  padding: 26px;
  margin-bottom: 20px;
}

/* titles */
.sidebar-main .widget-title,
#secondary .widget-title,
.ast-archive-post .entry-title,
.ast-article-post .entry-title,
.single .entry-title{
  margin: 0 0 12px 0;
  padding-bottom: 12px;
  border-bottom: 1px solid rgba(0,0,0,0.06);
  letter-spacing: .2px;
}

/* links */
.lux-card a,
.sidebar-main .widget a,
#secondary .widget a,
.ast-archive-post a,
.ast-article-post a,
.single .site-content article a{
  text-decoration: none;
  box-shadow: inset 0 -1px 0 rgba(13,148,136,0.18);
}
.lux-card a:hover,
.sidebar-main .widget a:hover,
#secondary .widget a:hover,
.ast-archive-post a:hover,
.ast-article-post a:hover,
.single .site-content article a:hover{
  box-shadow: inset 0 -2px 0 rgba(13,148,136,0.38);
}

/* hover lift */
.sidebar-main .widget:hover,
#secondary .widget:hover,
.ast-archive-post:hover,
.ast-article-post:hover{
  transform: translateY(-2px);
  transition: transform 240ms ease, box-shadow 240ms ease;
  box-shadow: var(--lux-in), 0 22px 55px rgba(0,0,0,.10);
}

/* last-child spacing clean */
.sidebar-main .widget > *:last-child,
#secondary .widget > *:last-child,
.ast-archive-post > *:last-child,
.ast-article-post > *:last-child,
.single .site-content article > *:last-child{
  margin-bottom: 0;
}

/* forms/comments */
.comments-area,
.comment-respond{
  padding: 18px;
  margin-top: 18px;
}

/* mobile: reduce heavy blur */
@media (max-width: 980px){
  .sidebar-main .widget,
  #secondary .widget,
  .ast-archive-post,
  .ast-article-post,
  .single .site-content article{
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
}


/* =========================================================
   LUX OVERRIDES (v2): NO VERTICAL RAIL
   ========================================================= */

/* Ensure cards/widgets can host pseudo-elements cleanly */
.sidebar-main .widget,
#secondary .widget,
.ast-sidebar-widget,
.ast-archive-post,
.ast-article-post,
article.post,
article.page,
.single .site-content article{
  position: relative !important;
  border-radius: var(--card-radius) !important;
}

/* Kill old rail geometry (kept exactly) */
.sidebar-main .widget::before,
.sidebar-main .widget::after,
#secondary .widget::before,
#secondary .widget::after,
.ast-sidebar-widget::before,
.ast-sidebar-widget::after,
.ast-archive-post::before,
.ast-archive-post::after,
.ast-article-post::before,
.ast-article-post::after,
article.post::before,
article.post::after,
article.page::before,
article.page::after,
.single .site-content article::before,
.single .site-content article::after{
  left: auto !important;
  right: auto !important;
  top: auto !important;
  bottom: auto !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
}

/* Horizontal accents TOP */
.sidebar-main .widget::before,
#secondary .widget::before,
.ast-sidebar-widget::before,
.ast-archive-post::before,
.ast-article-post::before,
article.post::before,
article.page::before,
.single .site-content article::before{
  content: "" !important;
  position: absolute !important;
  left: var(--rule-inset) !important;
  right: var(--rule-inset) !important;
  top: 0px !important;
  height: 1px !important;

  background: linear-gradient(
    to left,
    rgba(255,255,255,0.00),
    rgba(var(--em-rgb), var(--em-top-a)),
    rgba(255,255,255,0.00)
  ) !important;

  box-shadow: 0 0 18px rgba(var(--em-rgb), var(--em-glow-a)) !important;
  pointer-events: none !important;
}

/* Horizontal accents BOTTOM */
.sidebar-main .widget::after,
#secondary .widget::after,
.ast-sidebar-widget::after,
.ast-archive-post::after,
.ast-article-post::after,
article.post::after,
article.page::after,
.single .site-content article::after{
  content: "" !important;
  position: absolute !important;
  left: var(--rule-inset) !important;
  right: var(--rule-inset) !important;
  bottom: 0px !important;
  height: 2px !important;

  background: linear-gradient(
    to left,
    rgba(255,255,255,0.00),
    rgba(var(--em-rgb), var(--em-bot-a)),
    rgba(255,255,255,0.00)
  ) !important;

  box-shadow: 0 0 14px rgba(var(--em-rgb), calc(var(--em-glow-a) * 0.85)) !important;
  pointer-events: none !important;
}

/* Turn OFF accents for inner/nested boxes */
.entry-content .wp-block-group::before,
.entry-content .wp-block-group::after,
.entry-content .wp-block-columns::before,
.entry-content .wp-block-columns::after,
.entry-content .wp-block-column::before,
.entry-content .wp-block-column::after,
.entry-content .wp-block-cover::before,
.entry-content .wp-block-cover::after,
.entry-content .wp-block-media-text::before,
.entry-content .wp-block-media-text::after,
.comments-area::before,
.comments-area::after,
.comment-respond::before,
.comment-respond::after{
  content: none !important;
  box-shadow: none !important;
}

/* Inner blocks quiet */
.entry-content .wp-block-group,
.entry-content .wp-block-columns,
.entry-content .wp-block-column,
.entry-content .wp-block-cover,
.entry-content .wp-block-media-text,
.comments-area,
.comment-respond{
  box-shadow: none !important;
  background: transparent !important;
  border: 1px solid rgba(var(--em-rgb), var(--inner-bd-a)) !important;
  border-radius: 14px !important;
}

/* Reduce padding for inner blocks */
.entry-content .wp-block-group,
.entry-content .wp-block-columns,
.entry-content .wp-block-column,
.entry-content .wp-block-cover,
.entry-content .wp-block-media-text{
  padding: 14px !important;
}

/* Hero card (single post) */
.single .site-content article{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 22px 55px rgba(0,0,0,.10) !important;
}

/* Archive cards */
.ast-archive-post,
.ast-article-post{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 16px 40px rgba(0,0,0,.08) !important;
}

/* Comments flatten */
.comments-area,
.comment-respond{
  background: rgba(255,255,255,0.55) !important;
}

/* Grid paddings */
.ast-separate-container .ast-blog-layout-4-grid .ast-article-post{
  padding: 0;
}
.ast-row .blog-layout-4 .post-content,
.blog-layout-4 .post-thumb{
  padding-right: 10px;
  padding-left: 0;
}


/* =========================================================
   COMPACT-ON-SCROLL (SAFE VERSION - CLONE MENU)  [CSS PART ONLY]
   ========================================================= */

/* Default: do nothing */
#masthead{ position: relative; }

/* Slot for cloned menu inside the middle bar */
#masthead .main-header-bar .compact-menu-slot{
  display: none;
  align-items: center;
  gap: 10px;
}

/* Compact mode triggers */
body.hdr-compact .ast-above-header-wrap{ display: none !important; }
body.hdr-compact .ast-below-header-wrap{ display: none !important; }
body.hdr-compact .quote-box{ display: none !important; }

/* Fix ONLY middle bar in compact mode */
body.hdr-compact #masthead .main-header-bar{
  position: fixed !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  width: min(100%, var(--site-w)) !important;
  max-width: var(--site-w) !important;

  height: var(--c-h) !important;
  display: flex !important;
  align-items: center !important;

  z-index: 999999 !important;
}

/* Admin bar offset */
body.admin-bar.hdr-compact #masthead .main-header-bar{ top: 32px !important; }
@media (max-width: 782px){
  body.admin-bar.hdr-compact #masthead .main-header-bar{ top: 46px !important; }
}


/* Layout inside fixed middle bar */
body.hdr-compact #masthead .main-header-bar .main-header-bar-wrap{
  width: 100%;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

/* Force: menu left (slot), logo right */
body.hdr-compact #masthead .main-header-bar .compact-menu-slot{ order: 1 !important; }
body.hdr-compact #masthead .main-header-bar .site-branding,
body.hdr-compact #masthead .main-header-bar .ast-site-identity{ order: 2 !important; }

/* Fit logo into 100px */
body.hdr-compact #masthead .main-header-bar .custom-logo,
body.hdr-compact #masthead .main-header-bar .site-logo-img img{
  max-height: calc(var(--c-h) - 28px) !important;
  width: auto !important;
}

/* Push content only while compact is active */
body.hdr-compact #page .site-content{
  padding-top: calc(var(--c-h) + var(--c-gap)) !important;
}

/* Dropdowns above content */
body.hdr-compact #masthead,
body.hdr-compact #masthead .main-header-bar,
body.hdr-compact #masthead .main-navigation{ overflow: visible !important; }
body.hdr-compact .main-header-menu .sub-menu,
body.hdr-compact .ast-nav-menu .sub-menu{ z-index: 9999999 !important; }


/* =========================================================
   MAIN HEADER BAR — GOLD BORDERS + EMERALD UNDER-GLOW + PATTERN
   ========================================================= */

.main-header-bar{
  position: relative !important;

  border-top: 3px solid var(--hdr-gold) !important;
  border-bottom: 3px solid var(--hdr-gold) !important;

  backdrop-filter: blur(10px) saturate(1.08);
  -webkit-backdrop-filter: blur(10px) saturate(1.08);

  min-height: var(--hdr-bar-min-h) !important;

  background-color: rgba(255,255,255,0.92) !important;
  overflow: visible !important;
}

.main-header-bar::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 0;

  background-image:
    linear-gradient(45deg,
      rgba(var(--hdr-em-rgb), var(--hdr-pat-a1)) 25%,
      transparent 25%,
      transparent 75%,
      rgba(var(--hdr-em-rgb), var(--hdr-pat-a1)) 75%
    ),
    linear-gradient(45deg,
      rgba(var(--hdr-em-rgb), var(--hdr-pat-a2)) 25%,
      transparent 25%,
      transparent 75%,
      rgba(var(--hdr-em-rgb), var(--hdr-pat-a2)) 75%
    ),
    radial-gradient(circle at 12px 12px,
      rgba(var(--hdr-em-rgb), 0.040) 1.2px,
      transparent 1.4px
    ),
    radial-gradient(circle at 0 0,
      rgba(var(--hdr-em-rgb), 0.025) 0.8px,
      transparent 1px
    ),
    repeating-linear-gradient(
      to bottom,
      rgba(var(--hdr-em-rgb), 0.055) 0,
      rgba(var(--hdr-em-rgb), 0.055) 1px,
      rgba(0,0,0,0) 1px,
      rgba(0,0,0,0) 7px
    );

  background-size:
    22px 16px,
    44px 44px,
    4px 4px,
    4px 4px,
    auto;

  background-position:
    0 0,
    11px 11px,
    0 0,
    12px 12px,
    0 0;

  opacity: 1;
}

/* Ensure real header content is above pattern */
.main-header-bar > *{
  position: relative;
  z-index: 1;
}

.main-header-bar::after{
  content: "";
  position: absolute;
  left: 0; right: 0;
  top: 100%;
  height: var(--hdr-glow-h);
  pointer-events: none;
  z-index: 0;

  background: linear-gradient(
    to bottom,
    rgba(var(--hdr-em-rgb), var(--hdr-glow-a1)) 0%,
    rgba(var(--hdr-em-rgb), var(--hdr-glow-a2)) 40%,
    rgba(var(--hdr-em-rgb), var(--hdr-glow-a3)) 100%
  );
}
.ast-builder-menu-1 .menu-item > .menu-link {
    color: #005f4f;
    transform: translateY(50px);
}
/* =========================================================
   MAIN HEADER BAR: unified gold borders + emerald under-glow
   (no background/pattern damage)
   ========================================================= */

/* عدّل القيم فقط إذا أردت */
:root{
  --hdr-gold-w: 2px;
  --hdr-gold-solid: #D4AF37;

  --hdr-glow-h: 50px;      /* ارتفاع الإضاءة */
  --hdr-glow-a1: 0.22;     /* شدة البداية */
  --hdr-glow-a2: 0.10;     /* شدة المنتصف */
  --hdr-glow-a3: 0.00;     /* شدة النهاية */
  --hdr-em-rgb: 13,148,136;
}

/* 1) حدود ذهبية “مرسومة” كـ inset shadow (لا تؤثر على الخلفية/الباترن) */
#masthead .main-header-bar{
  border-top: 0 !important;
  border-bottom: 0 !important;

  /* خطين داخل الشريط نفسه */
  box-shadow:
    inset 0 var(--hdr-gold-w) 0 0 var(--hdr-gold-solid),
    inset 0 calc(-1 * var(--hdr-gold-w)) 0 0 var(--hdr-gold-solid) !important;

  position: relative !important;
  overflow: visible !important;
}

/* 2) الإضاءة الزمردية تحت الحد السفلي — خلف الحدود (لا تغيّر لون الذهب) */
#masthead .main-header-bar::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;

  /* تبدأ بعد قاع الشريط مباشرة */
  top: 100% !important;
  height: var(--hdr-glow-h) !important;

  pointer-events: none !important;

  /* أهم شيء: تحت أي خطوط/حدود داخل الشريط */
  z-index: 0 !important;

  background: linear-gradient(
    to bottom,
    rgba(var(--hdr-em-rgb), var(--hdr-glow-a1)) 0%,
    rgba(var(--hdr-em-rgb), var(--hdr-glow-a2)) 40%,
    rgba(var(--hdr-em-rgb), var(--hdr-glow-a3)) 100%
  ) !important;
}

/* 3) اجعل محتوى الشريط فوق الإضاءة دائمًا */
#masthead .main-header-bar > *{
  position: relative;
  z-index: 1;
}

/* =========================================================
   FIX COMPACT (body.hdrCompact)
   ========================================================= */

/* 3) ثبّت القائمة فوق الحد السفلي (بدون قص) */
body.hdrCompact #masthead .main-header-bar .ast-builder-menu-1 .menu-item > .menu-link{
  position: relative !important;
  top: 0 !important;
  transform: none !important;

  /* هذا يمنع ملامسة النص للحد السفلي */
  padding-bottom: 10px !important; /* عدّلها 8–14 حسب الذوق */
  line-height: 1.2 !important;
}



body.hdrCompact #masthead .compact-menu-slot {
    display: none !important;
}
/* ===== Fixed header only (compact) ===== */
body.hdrCompact .ast-builder-menu .main-navigation > ul{
  transform: translateY(33px);
}

/* ===== Normal header only (non-compact) ===== */
body:not(.hdrCompact) .ast-builder-menu .main-navigation > ul{
  transform: none;
}








/* =========================================================
   hdrCompact: FIX DOUBLE TRANSPARENT STRIP by fixing #masthead only
   - #masthead fixed as ONE block (topbar 30 + mainbar 100)
   - main-header-bar NOT fixed anymore in compact
   ========================================================= */

:root{
  --compact-topbar-h: 30px;
}

/* 1) Fix the whole masthead as one unit */
body.hdrCompact #masthead{
  position: fixed !important;
  top: 0 !important;
  left: 50% !important;
  transform: translateX(-50%) !important;

  width: min(100%, var(--site-w)) !important;
  max-width: var(--site-w) !important;

  z-index: 999999 !important;
  overflow: visible !important;
}

/* Admin bar offset (keeps everything aligned) */
body.admin-bar.hdrCompact #masthead{ top: 32px !important; }
@media (max-width: 782px){
  body.admin-bar.hdrCompact #masthead{ top: 46px !important; }
}

/* 2) Show the real emerald top bar INSIDE masthead (icons/search stay) */
body.hdrCompact #masthead .ast-above-header-wrap{
  display: block !important;
  position: relative !important;
  height: var(--compact-topbar-h) !important;
  min-height: var(--compact-topbar-h) !important;
  overflow: hidden !important;
}

/* 3) Main bar becomes NORMAL flow inside masthead (NOT fixed) */
body.hdrCompact #masthead .main-header-bar{
  position: relative !important;
  top: 0 !important;
  left: auto !important;
  right: auto !important;
  transform: none !important;

  height: var(--c-h) !important;
  min-height: var(--c-h) !important;
  width: 100% !important;

  z-index: 1 !important;
}

/* 4) Push page content exactly under (topbar + mainbar) */
body.hdrCompact #page .site-content{
  padding-top: calc(var(--compact-topbar-h) + var(--c-h) + var(--c-gap)) !important;
}