/* =========================================================
   Saudi Founding Day Theme Override (place LAST)
   Palette:
   #6B4E45 (Authenticity) | #F4EADA (Clarity)
   #231F20 (Determination) | #DEC9B2 (Land)
   ========================================================= */

:root{
  /* Core palette */
  --fd-ink:   #231F20;
  --fd-brown: #6B4E45;
  --fd-sand:  #DEC9B2;
  --fd-cream: #F4EADA;

  /* Helpful tints (hand-picked warm variants) */
  --fd-brown-dark:  #563D36;
  --fd-brown-darker:#46312B;
  --fd-brown-light: #8A6A60;

  --fd-sand-dark:   #C9B29A;
  --fd-sand-light:  #E9D8C6;

  --fd-cream-2:     #FBF5EC;

  /* ========================================
     BRAND (replace current site identity)
     ======================================== */
  --primary:           var(--fd-brown);
  --primary-dark:      var(--fd-brown-darker);

  /* (كان عندك برتقالي قوي.. نخليه رملي/بني كـ accent) */
  --secondary:         var(--fd-sand-dark);
  --secondary-dark:    var(--fd-brown-dark);
  --secondary-darker:  var(--fd-brown-darker);
  --secondary-darkest: var(--fd-ink);
  --secondary-hover:   var(--fd-brown-dark);

  /* (الـ tertiary كان أصفر.. نخليه كريمي/رملي للـ highlights) */
  --tertiary:          var(--fd-sand);
  --tertiary-dark:     var(--fd-sand-dark);
  --tertiary-hover:    var(--fd-sand-light);

  --quaternary:        var(--fd-brown-light);

  /* ========================================
     GLOBAL TEXT/BG (warm neutral base)
     ======================================== */
  --black:             var(--fd-ink);
  --black-hex6:        var(--fd-ink);
  --white:             var(--fd-cream);
  --white-hex6:        var(--fd-cream);
  --white-upper:       var(--fd-cream);
  --white-full:        var(--fd-cream);

  /* If you want “true white” sometimes, use this */
  --fd-true-white: #FFFFFF;

  /* ========================================
     MAP UI COLOR FAMILIES → Founding palette
     (so buttons/links/alerts don’t stay blue/red/yellow/green)
     ======================================== */

  /* Blues → brown family (links, buttons, UI accents) */
  --blue-50:  var(--fd-brown-darker);
  --blue-100: var(--fd-brown-darker);
  --blue-150: var(--fd-brown-dark);
  --blue-200: var(--fd-brown);
  --blue-250: var(--fd-brown);
  --blue-300: var(--fd-brown);
  --blue-350: var(--fd-brown);
  --blue-400: var(--fd-brown);
  --blue-450: var(--fd-brown-dark);
  --blue-500: var(--fd-brown);
  --blue-550: var(--fd-brown-darker);
  --blue-600: var(--fd-ink);
  --blue-650: var(--fd-ink);
  --blue-700: var(--fd-brown);
  --blue-750: var(--fd-ink);
  --blue-800: var(--fd-brown-dark);
  --blue-850: var(--fd-brown);
  --blue-900: var(--fd-brown-dark);
  --blue-950: var(--fd-brown);
  --blue-1000: var(--fd-brown);
  --blue-1050: var(--fd-brown-dark);
  --blue-1100: var(--fd-brown);
  --blue-1150: var(--fd-brown-dark);
  --blue-1200: var(--fd-brown);
  --blue-1250: var(--fd-brown);
  --blue-1300: var(--fd-brown);
  --blue-1350: var(--fd-brown);
  --blue-1400: var(--fd-brown-dark);
  --blue-1450: var(--fd-brown-darker);
  --blue-1500: var(--fd-brown);
  --blue-1550: var(--fd-brown);
  --blue-1600: var(--fd-brown-darker);
  --blue-1650: var(--fd-brown);
  --blue-1700: var(--fd-brown-dark);
  --blue-1750: var(--fd-brown-darker);
  --blue-1800: var(--fd-brown-dark);
  --blue-1850: var(--fd-brown);
  --blue-1900: var(--fd-brown);
  --blue-1950: var(--fd-brown);
  --blue-2000: var(--fd-brown-dark);
  --blue-2050: var(--fd-brown);
  --blue-2100: var(--fd-brown);
  --blue-2150: var(--fd-brown-darker);
  --blue-2200: var(--fd-brown-darker);
  --blue-2250: var(--fd-brown);
  --blue-2300: var(--fd-brown);
  --blue-2350: var(--fd-brown);
  --blue-2400: var(--fd-brown);
  --blue-2450: var(--fd-brown);
  --blue-2500: var(--fd-brown);
  --blue-2550: var(--fd-brown);
  --blue-2600: var(--fd-brown);
  --blue-2650: var(--fd-brown);
  --blue-2700: var(--fd-brown);
  --blue-2750: var(--fd-brown);
  --blue-2800: var(--fd-brown);
  --blue-2850: var(--fd-brown);
  --blue-2900: var(--fd-sand);
  --blue-2950: var(--fd-sand);
  --blue-3000: var(--fd-sand);
  --blue-3050: var(--fd-sand);
  --blue-3100: var(--fd-sand);
  --blue-3150: var(--fd-sand);
  --blue-3200: var(--fd-sand);
  --blue-3250: var(--fd-sand);
  --blue-3300: var(--fd-sand-light);
  --blue-3350: var(--fd-sand-light);
  --blue-3400: var(--fd-sand-light);
  --blue-3450: var(--fd-sand-light);
  --blue-3500: var(--fd-sand-light);
  --blue-3550: var(--fd-sand-light);
  --blue-3600: var(--fd-sand-light);
  --blue-3650: var(--fd-sand-light);
  --blue-3700: var(--fd-cream);
  --blue-3750: var(--fd-cream);
  --blue-3800: var(--fd-cream);
  --blue-3850: var(--fd-cream);

  /* Greens (success) → sand/brown (keep it “positive” but on-theme) */
  --green-50:  var(--fd-brown);
  --green-100: var(--fd-ink);
  --green-150: var(--fd-brown-dark);
  --green-200: var(--fd-brown-darker);
  --green-250: var(--fd-brown);
  --green-300: var(--fd-brown);
  --green-350: var(--fd-brown);
  --green-400: var(--fd-brown);
  --green-450: var(--fd-sand-dark);
  --green-500: var(--fd-sand);
  --green-550: var(--fd-brown-dark);
  --green-600: var(--fd-ink);
  --green-650: var(--fd-ink);
  --green-700: var(--fd-sand);
  --green-750: var(--fd-brown-dark);
  --green-800: var(--fd-brown-dark);
  --green-850: var(--fd-brown);
  --green-900: var(--fd-brown);
  --green-950: var(--fd-brown);
  --green-1000: var(--fd-brown);
  --green-1050: var(--fd-sand);
  --green-1100: var(--fd-sand);
  --green-1150: var(--fd-sand-light);
  --green-1200: var(--fd-sand-light);
  --green-1250: var(--fd-sand-light);
  --green-1300: var(--fd-cream);
  --green-1350: var(--fd-cream);
  --green-1400: var(--fd-cream);
  --green-1450: var(--fd-cream-2);
  --green-1500: var(--fd-cream-2);
  --green-1550: var(--fd-cream-2);

  /* Reds (error) → ink/brown (on-theme) */
  --red-50:  var(--fd-ink);
  --red-100: var(--fd-ink);
  --red-150: var(--fd-brown-darker);
  --red-200: var(--fd-brown-darker);
  --red-250: var(--fd-brown-dark);
  --red-300: var(--fd-brown);
  --red-350: var(--fd-brown);
  --red-400: var(--fd-brown-dark);
  --red-450: var(--fd-brown-darker);
  --red-500: var(--fd-brown-darker);
  --red-550: var(--fd-brown-dark);
  --red-600: var(--fd-ink);
  --red-650: var(--fd-ink);
  --red-700: var(--fd-ink);
  --red-750: var(--fd-brown-dark);
  --red-800: var(--fd-sand-dark);
  --red-850: var(--fd-brown-dark);
  --red-900: var(--fd-brown-darker);
  --red-950: var(--fd-brown-darker);
  --red-1000: var(--fd-ink);
  --red-1050: var(--fd-ink);
  --red-1100: var(--fd-brown-darker);
  --red-1150: var(--fd-brown-darker);
  --red-1200: var(--fd-brown-dark);
  --red-1250: var(--fd-brown-dark);
  --red-1300: var(--fd-brown-dark);
  --red-1350: var(--fd-brown-dark);
  --red-1400: var(--fd-brown);
  --red-1450: var(--fd-brown);
  --red-1500: var(--fd-sand-light);
  --red-1550: var(--fd-sand-light);
  --red-1600: var(--fd-brown);
  --red-1650: var(--fd-brown);
  --red-1700: var(--fd-brown);
  --red-1750: var(--fd-brown);
  --red-1800: var(--fd-brown);
  --red-1850: var(--fd-sand-light);
  --red-1900: var(--fd-sand-light);
  --red-1950: var(--fd-brown);
  --red-2000: var(--fd-sand-dark);
  --red-2050: var(--fd-ink);
  --red-2100: var(--fd-brown);
  --red-2150: var(--fd-cream);
  --red-2200: var(--fd-sand-light);
  --red-2250: var(--fd-sand-light);
  --red-2300: var(--fd-sand-light);
  --red-2350: var(--fd-cream);
  --red-2400: var(--fd-cream);
  --red-2450: var(--fd-ink);
  --red-2500: var(--fd-brown);
  --red-2550: var(--fd-brown);
  --red-2600: var(--fd-brown);

  /* Yellows/Oranges (warning/accent) → sand/cream */
  --yellow-50:  var(--fd-brown-darker);
  --yellow-100: var(--fd-sand-dark);
  --yellow-150: var(--fd-sand-dark);
  --yellow-200: var(--fd-sand-dark);
  --yellow-250: var(--fd-sand);
  --yellow-300: var(--fd-sand);
  --yellow-350: var(--fd-sand-dark);
  --yellow-400: var(--fd-sand-dark);
  --yellow-450: var(--fd-sand);
  --yellow-500: var(--fd-sand);
  --yellow-550: var(--fd-sand);
  --yellow-600: var(--fd-sand);
  --yellow-650: var(--fd-sand);
  --yellow-700: var(--fd-sand);
  --yellow-750: var(--fd-sand);
  --yellow-800: var(--fd-sand-dark);
  --yellow-850: var(--fd-brown);
  --yellow-900: var(--fd-cream);
  --yellow-950: var(--fd-cream);
  --yellow-1000: var(--fd-cream);
  --yellow-1050: var(--fd-cream);
  --yellow-1100: var(--fd-cream);
  --yellow-1150: var(--fd-sand-dark);
  --yellow-1200: var(--fd-cream);
  --yellow-1250: var(--fd-cream);
  --yellow-1300: var(--fd-cream-2);
  --yellow-1350: var(--fd-sand-dark);
  --yellow-1400: var(--fd-cream);
  --yellow-1450: var(--fd-cream);
  --yellow-1500: var(--fd-sand-dark);
  --yellow-1550: var(--fd-sand);
  --yellow-1600: var(--fd-sand);
  --yellow-1650: var(--fd-sand);
  --yellow-1700: var(--fd-sand-light);
}

/* Optional: make links/buttons feel consistent */
a{ color: var(--primary); }
a:hover{ color: var(--primary-dark); }

/* ================================
   Footer Adjustment (Updated)
   ================================ */

:root{
  --fd-footer-dark: #2A2423; /* بني مايل للسواد */
  --fd-black: #000000;       /* أسود صريح */
  --fd-cream: #F4EADA;
}

/* 1) الفوتر الأساسي */
#footer{
  background: var(--fd-footer-dark) !important;
  color: var(--fd-cream) !important;
}

#footer a{
  color: var(--fd-cream) !important;
}

#footer a:hover{
  color: rgba(244,234,218,.8) !important;
}

/* 2) شريط الكوبي رايت (اللي تحت) */
#bottom,
#bottom.style-3,
#bottom.style-3 #bottom-bar-inner,
#bottom.style-3 .bottom-bar-inner-wrap{
  background: var(--fd-black) !important;
}

#bottom,
#bottom *{
  color: var(--fd-cream) !important;
}

/* Darker brown overlay to fully cover edges */
.service-item .overlay{
  background: linear-gradient(
    to top,
    rgba(35, 31, 32, 0.95) 0%,   /* بني غامق جداً قريب من #231F20 */
    rgba(75, 52, 45, 0.85) 40%,
    rgba(75, 52, 45, 0.60) 65%,
    rgba(75, 52, 45, 0.0) 100%
  ) !important;
}


/* الهيدر الصغيىر */
#top-bar,
#top-bar.style-2{
  background: #6B4E45 !important;
  color: #ffffff !important;
}

#top-bar a,
#top-bar i,
#top-bar span{
  color: #F4EADA !important;
}

/* language button */
/* Change orange accent to #F4EADA */
#top-bar .wprt-button,
#top-bar .wprt-button:before,
#top-bar .wprt-button:after {
    background-color: #F4EADA !important;
    border-color: #F4EADA !important;
}

/* Change text color of "العربية" */
#top-bar a.wprt-button.small.Arabic-font {
    color: #231F20 !important;
}

/*devision*/
/* Change service icons from orange to #F4EADA */
.wprt-icon-box .dd-icon,
.wprt-icon-box .dd-icon span,
.wprt-icon-box .dd-icon i {
    color: #e2ccb3 !important;
}











/* =========================================
   FORCE WHO-WE-ARE to solid #6B4E45 (no blue)
   ========================================= */

/* العنصر نفسه */
body #who-we-are-v2.who-we-are-section-v2{
  background-color: #6B4E45 !important;
  background-image: none !important;
  background: #6B4E45 !important;
}

/* لو فيه overlay من before/after */
body #who-we-are-v2.who-we-are-section-v2::before,
body #who-we-are-v2.who-we-are-section-v2::after{
  background: transparent !important;
  background-image: none !important;
}

/* أحيانًا اللون الأزرق جاي من container داخل السكشن */
body #who-we-are-v2.who-we-are-section-v2 .container,
body #who-we-are-v2.who-we-are-section-v2 .container *{
  background-color: transparent !important;
  background-image: none !important;
}

/* =========================================
   FIX: Division icons color (you asked #F4EADA)
   ========================================= */
.wprt-icon-box .dd-icon,
.wprt-icon-box .dd-icon span,
.wprt-icon-box .dd-icon i{
  color: #F4EADA !important;  /* بدل e2ccb3 */
}

/* =========================================
   OPTIONAL: dd-link color (#ceb398) (حسب طلبك الأخير)
   ========================================= */
.wprt-content-box .dd-link a{
  color: #ceb398 !important;
}










/* =========================================
   HARD OVERRIDE: WHO WE ARE button (incl. :before/:after)
   Paste LAST (very last line)
   ========================================= */

body #who-we-are-v2.who-we-are-section-v2 a.btn-orange,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange,
body .who-we-are-section-v2 a.btn-orange,
body .who-we-are-section-v2 .btn-orange{
  background: #F4EADA !important;
  background-color: #F4EADA !important;
  color: #231F20 !important;
  border-color: transparent !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* THE KEY: كثير ثيمات تحط اللون هنا */
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange::before,
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange::after,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange::before,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange::after,
body .who-we-are-section-v2 a.btn-orange::before,
body .who-we-are-section-v2 a.btn-orange::after,
body .who-we-are-section-v2 .btn-orange::before,
body .who-we-are-section-v2 .btn-orange::after{
  background: #F4EADA !important;
  background-color: #F4EADA !important;
  border-color: transparent !important;
}

/* نص الزر لو الثيم يلوّنه بـ span */
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange *,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange *{
  color: #231F20 !important;
}

/* Hover واضح */
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange:hover,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange:hover{
  background: #DEC9B2 !important;
  background-color: #DEC9B2 !important;
}
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange:hover::before,
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange:hover::after,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange:hover::before,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange:hover::after{
  background: #DEC9B2 !important;
  background-color: #DEC9B2 !important;
}

/* Active (ضغط) */
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange:active,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange:active{
  background: #C9B29A !important;
  background-color: #C9B29A !important;
}
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange:active::before,
body #who-we-are-v2.who-we-are-section-v2 a.btn-orange:active::after,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange:active::before,
body #who-we-are-v2.who-we-are-section-v2 .btn-orange:active::after{
  background: #C9B29A !important;
  background-color: #C9B29A !important;
}