/**
 * Jaezah Brand Identity — جائزة التميز في العمل الأهلي
 * Palette derived from official visual identity.
 */
:root {
  --jz-accent: #00dc80;
  --jz-accent-bright: #01dc80;
  --jz-accent-soft: #10a261;
  --jz-forest: #00664e;
  --jz-forest-deep: #004d3a;
  --jz-dark: #091c1a;
  --jz-dark-soft: #0d2420;
  --jz-ink: #0f1f1c;
  --jz-muted: #5a6b66;
  --jz-surface: #f4f8f6;
  --jz-surface-alt: #e8f2ed;
  --jz-white: #ffffff;
  --jz-gradient: linear-gradient(135deg, #00e676 0%, #008454 55%, #00664e 100%);
  --jz-gradient-soft: linear-gradient(135deg, rgba(0, 220, 128, 0.95) 0%, rgba(0, 102, 78, 0.95) 100%);
  --jz-shadow: 0 12px 40px rgba(9, 28, 26, 0.12);
  --jz-radius: 12px;
  --jz-font: "Tajawal", "IBM Plex Sans Arabic", "notosansarabic", sans-serif;
}

/* —— Typography —— */
html {
  scroll-behavior: smooth;
}

body,
body.js-jox {
  font-family: var(--jz-font) !important;
  color: var(--jz-muted);
  background: var(--jz-white);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.f_p, .sec_title h2, .h_head, .t_color, .t_color2, .t_color3 {
  font-family: var(--jz-font) !important;
}

.t_color,
.sec_title h2,
.event_about_content h2,
.h_blog_content h3,
.f_600.t_color {
  color: var(--jz-ink) !important;
}

a:hover {
  color: var(--jz-accent-soft);
}

/* —— Header / Nav —— */
.header_area .navbar-brand img {
  max-height: 52px;
  width: auto;
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.header_area .navbar-brand:hover img {
  transform: translateY(-1px);
}

.menu_one .btn_get,
.btn_get {
  font-family: var(--jz-font) !important;
  color: var(--jz-dark) !important;
  border: 2px solid var(--jz-dark) !important;
  border-radius: 999px !important;
  background: transparent;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.menu_one .btn_get:hover,
.btn_get:hover,
.btn_hover:hover {
  background: var(--jz-gradient) !important;
  border-color: transparent !important;
  color: var(--jz-white) !important;
  box-shadow: 0 10px 28px rgba(0, 220, 128, 0.28);
}

.menu_four .event_btn,
.event_btn {
  border-radius: 999px !important;
  border-color: var(--jz-accent) !important;
  color: var(--jz-white) !important;
  background: transparent;
  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.menu_four .event_btn:hover,
.event_btn:hover {
  background: var(--jz-gradient) !important;
  border-color: transparent !important;
  box-shadow: 0 10px 28px rgba(0, 220, 128, 0.35);
}

.header_area.navbar_fixed .menu_four .event_btn {
  border-color: var(--jz-forest) !important;
  color: var(--jz-forest) !important;
}

.header_area.navbar_fixed .menu_four .event_btn:hover {
  background: var(--jz-gradient) !important;
  color: var(--jz-white) !important;
  border-color: transparent !important;
}

.menu > .nav-item .nav-link:hover,
.menu > .nav-item.active .nav-link,
.w_menu .nav-item .nav-link:hover {
  color: var(--jz-accent-soft) !important;
}

.header_area.navbar_fixed .menu_one {
  box-shadow: 0 8px 30px rgba(9, 28, 26, 0.08);
}

.header_area.navbar_fixed .w_menu .nav-item .nav-link:hover,
.header_area.navbar_fixed .menu > .nav-item .nav-link:hover {
  color: var(--jz-accent-soft) !important;
}

.dropdown-menu .nav-link:hover {
  color: var(--jz-accent-soft) !important;
  background: var(--jz-surface) !important;
}

/* —— Buttons —— */
.btn_hover,
.slider_btn,
.saas_banner_btn,
.btn-primary,
.custom-btn,
.e_features_btn,
.software_banner_btn {
  font-family: var(--jz-font) !important;
}

.slider_btn,
.saas_banner_area_three .slider_item .slidet_content .slider_btn {
  background: var(--jz-gradient) !important;
  border: none !important;
  color: var(--jz-white) !important;
  border-radius: 999px !important;
  padding: 12px 28px !important;
  box-shadow: 0 10px 28px rgba(0, 220, 128, 0.3);
  transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

.slider_btn:hover,
.saas_banner_area_three .slider_item .slidet_content .slider_btn:hover {
  filter: brightness(1.05);
  transform: translateY(-2px);
  color: var(--jz-white) !important;
  box-shadow: 0 14px 36px rgba(0, 220, 128, 0.4);
}

.btn-primary,
.custom-btn,
.btn.btn-primary {
  background: var(--jz-gradient) !important;
  border-color: transparent !important;
  color: var(--jz-white) !important;
  border-radius: 10px !important;
  box-shadow: 0 8px 22px rgba(0, 102, 78, 0.22);
}

.btn-primary:hover,
.custom-btn:hover,
.btn.btn-primary:hover {
  filter: brightness(1.06);
  color: var(--jz-white) !important;
}

.e_features_btn {
  color: var(--jz-forest) !important;
  font-weight: 600 !important;
  transition: color 0.2s ease;
}

.e_features_btn:hover,
.e_features_btn:hover i {
  color: var(--jz-accent-bright) !important;
}

.bg-primary,
.badge-primary,
.progress-bar.bg-primary {
  background: var(--jz-gradient) !important;
  border-color: transparent !important;
}

/* —— Hero / Banner —— */
.saas_banner_area_three .slider_item {
  position: relative;
}

.saas_banner_area_three .slider_item .slidet_content h2 {
  font-family: var(--jz-font) !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em;
}

.jz-hero-overlay {
  background: linear-gradient(to left, rgba(9, 28, 26, 0.88), rgba(0, 102, 78, 0.35), transparent) !important;
}

/* —— Sections —— */
.jz-section-tint,
.event_counter_area.jz-brand-section,
.event_features_area.jz-brand-section,
.breadcrumb_area.jz-brand-section {
  background: var(--jz-surface) !important;
}

.event_features_item {
  border-radius: var(--jz-radius) !important;
  box-shadow: var(--jz-shadow) !important;
  border: 1px solid rgba(0, 102, 78, 0.06);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.event_features_item:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 48px rgba(9, 28, 26, 0.14) !important;
}

.event_features_item h5:hover {
  color: var(--jz-accent-soft) !important;
}

.event_schedule_inner .media {
  border-radius: var(--jz-radius);
  transition: background 0.2s ease;
}

.event_schedule_inner .media:hover {
  background: var(--jz-surface);
}

.event_schedule_inner .media-left a i,
.event_schedule_inner .media-left a {
  color: var(--jz-forest) !important;
}

.h_blog_item {
  border-radius: var(--jz-radius);
  overflow: hidden;
  box-shadow: var(--jz-shadow);
  transition: transform 0.25s ease;
}

.h_blog_item:hover {
  transform: translateY(-3px);
}

/* Brand accent replacements (legacy purple / blue) */
[style*="#663b8f"],
[style*="color: #663b8f"],
[style*="color:#663b8f"] {
  color: var(--jz-forest) !important;
}

.menu_four .event_btn:hover,
.header_area.navbar_fixed .menu_four .event_btn:hover {
  background: var(--jz-gradient) !important;
  border-color: transparent !important;
}

.event_features_item h5:hover,
.event_features_item .e_features_btn:hover,
.footer_area_two .footer_top_two .f_widget.about-widget .f_list li a:hover,
.footer_area_two .footer_bottom p a,
.footer_area_two .footer_bottom .f_menu li a:hover {
  color: var(--jz-accent) !important;
}

.footer_area_two .footer_top_two .f_widget.about-widget .f_list li a:before {
  background: var(--jz-accent) !important;
}

.btn_get_two,
.agency_banner_btn,
.hosting_btn {
  background: var(--jz-gradient) !important;
  border-color: transparent !important;
  color: var(--jz-white) !important;
}

/* Override common theme blues/purples from style2 */
.menu_five .menu > .nav-item.submenu .dropdown-menu .nav-item:hover > .nav-link,
.menu_five .menu > .nav-item.submenu .dropdown-menu .nav-item.active > .nav-link,
.header_area.navbar_fixed .menu_five .btn_get {
  color: var(--jz-accent-soft) !important;
  border-color: var(--jz-accent-soft) !important;
}

.post_time,
.post-info-comments,
.post-info-comments i,
.post_time i {
  color: var(--jz-forest) !important;
}

/* —— Footer —— */
.footer_area_two {
  background: var(--jz-dark) !important;
  color: rgba(255, 255, 255, 0.72);
}

.footer_area_two .footer_top_two {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 90px 0 60px;
}

.footer_area_two .f-title,
.footer_area_two .t_color2,
.footer_area_two h3 {
  color: var(--jz-white) !important;
}

.footer_area_two .f_list li a,
.footer_area_two .f_menu li,
.footer_area_two .f_menu li a,
.footer_area_two .footer_bottom p,
.footer_area_two .footer_bottom p a {
  color: rgba(255, 255, 255, 0.7) !important;
}

.footer_area_two .f_list li a:hover,
.footer_area_two .f_menu li a:hover,
.footer_area_two .footer_bottom p a:hover {
  color: var(--jz-accent) !important;
}

.footer_area_two .footer_top_two .f_widget.about-widget .f_list li a:before {
  background: var(--jz-accent) !important;
}

.footer_area_two .footer_top_two .f_widget.about-widget .f_list li a:hover {
  color: var(--jz-accent) !important;
}

.footer_area_two .footer_bottom {
  border-top: 0;
  padding: 22px 0 28px;
}

.footer_area_two .navbar-brand img {
  max-height: 56px;
  width: auto;
  filter: none;
}

.footer_area_two .company_widget h2 {
  color: rgba(255, 255, 255, 0.55) !important;
}

.f_social_icon a {
  background: rgba(255, 255, 255, 0.06) !important;
  color: var(--jz-accent) !important;
  border: 1px solid rgba(0, 220, 128, 0.25) !important;
  border-radius: 50% !important;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.f_social_icon a:hover {
  background: var(--jz-gradient) !important;
  color: var(--jz-white) !important;
  border-color: transparent !important;
  transform: translateY(-2px);
}

/* —— Forms / member area accents —— */
.form-control:focus,
.form-control:focus-visible {
  border-color: var(--jz-accent-soft) !important;
  box-shadow: 0 0 0 0.2rem rgba(0, 220, 128, 0.2) !important;
}

.text-primary,
a.text-primary {
  color: var(--jz-accent-soft) !important;
}

/* —— Partners —— */
.shop_partner_logo_area {
  background: var(--jz-surface);
}

/* —— Preloader —— */
#preloader {
  background: var(--jz-dark);
}

/* —— Soft motion —— */
@media (prefers-reduced-motion: no-preference) {
  .event_features_item,
  .h_blog_item,
  .slider_btn,
  .f_social_icon a,
  .header_area .navbar-brand img {
    will-change: transform;
  }
}

/* —— Mobile —— */
@media (max-width: 991px) {
  .header_area .navbar-brand img {
    max-height: 42px;
  }

  .footer_area_two .footer_top_two {
    padding: 60px 0 40px;
  }
}