/*
Theme Name: MAWT
Theme URI: https://mozzammel-akidatrust.org
Author: Mozzammel-Akida Welfare Trust
Author URI: https://mozzammel-akidatrust.org
Description: Official WordPress theme for Mozzammel-Akida Welfare Trust (Mozammel Akida Hakkani Welfare Trust, Est. 1987). Supporting rural education, orphan care, girls' schools, and community healthcare in Kushtia, Bangladesh.
Version: 1.0.0
Requires at least: 6.4
Tested up to: 7.1
Requires PHP: 7.4
Text Domain: mawt
*/

/* ================= DYNAMIC THEME VARIABLES ================= */
:root {
  --theme-from: #1d4ed8;
  --theme-via: #0284c7;
  --theme-to: #1e40af;
  --theme-glow: rgba(56, 189, 248, 0.4);
  --theme-border: rgba(56, 189, 248, 0.35);
  --theme-badge-from: #1d4ed8;
  --theme-badge-to: #0369a1;
  --theme-subtle: rgba(2, 132, 199, 0.15);
  --theme-cta-from: #2563eb;
  --theme-cta-via: #0284c7;
  --theme-cta-to: #1d4ed8;
  --theme-cta-hover-from: #3b82f6;
  --theme-cta-hover-to: #0ea5e9;
  --theme-accent-text: #7dd3fc;
}

/* Global gradient synchronization with theme palette */
.theme-gradient-bg,
footer.bg-gradient-to-br,
.bg-gradient-to-br.from-blue-700.via-sky-600.to-blue-800,
.bg-gradient-to-r.from-blue-700.via-sky-600.to-blue-800,
.bg-gradient-to-br.from-blue-600.via-sky-600.to-blue-700,
.bg-gradient-to-r.from-blue-600.via-sky-600.to-blue-700 {
  background: linear-gradient(135deg, var(--theme-from) 0%, var(--theme-via) 50%, var(--theme-to) 100%) !important;
}

.theme-cta-btn {
  background: linear-gradient(90deg, var(--theme-cta-from) 0%, var(--theme-cta-via) 50%, var(--theme-cta-to) 100%) !important;
  transition: all 0.3s ease !important;
}

.theme-cta-btn:hover {
  background: linear-gradient(90deg, var(--theme-cta-hover-from) 0%, var(--theme-cta-hover-to) 100%) !important;
  box-shadow: 0 10px 25px -5px var(--theme-glow) !important;
}

.theme-border {
  border-color: var(--theme-border) !important;
}

.theme-badge,
.bg-gradient-to-r.from-blue-700.to-sky-700 {
  background: linear-gradient(135deg, var(--theme-badge-from) 0%, var(--theme-badge-to) 100%) !important;
}

.theme-accent-text {
  color: var(--theme-accent-text) !important;
}

#scroll-progress-bar {
  background: linear-gradient(90deg, var(--theme-from) 0%, var(--theme-via) 60%, var(--theme-accent-text) 100%) !important;
}

.w-24.h-1.bg-gradient-to-r,
.w-20.h-1.bg-gradient-to-r {
  background: linear-gradient(90deg, var(--theme-from) 0%, var(--theme-accent-text) 100%) !important;
}

.text-md {
  font-size: 1rem;
  line-height: 1.5rem;
}

.custom-scrollbar {
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 #f1f5f9;
  -webkit-overflow-scrolling: touch;
}
.custom-scrollbar::-webkit-scrollbar {
  width: 5px;
}
.custom-scrollbar::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #94a3b8;
  border-radius: 4px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: #64748b;
}

.trustee-filter-btn {
  background-color: #ffffff;
  color: #334155;
  border: 1px solid #e2e8f0;
  transition: all 0.2s ease;
}
.trustee-filter-btn:hover:not(.active) {
  background-color: #f1f5f9;
  color: #0f172a;
  border-color: #cbd5e1;
}
.trustee-filter-btn.active {
  background-color: #061325 !important;
  color: #ffffff !important;
  border-color: #061325 !important;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
}
.trustee-filter-btn.active:hover {
  background-color: #0c203b !important;
  color: #ffffff !important;
  border-color: #0c203b !important;
}

body {
  font-family: 'Outfit', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Preserve WordPress Admin Bar and Dashicons styling */
#wpadminbar,
#wpadminbar * {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}
#wpadminbar .ab-icon,
#wpadminbar .ab-icon:before,
#wpadminbar .ab-item:before,
#wpadminbar .dashicons {
  font-family: dashicons !important;
}

/* ================= REMOVE UNWANTED WORDPRESS WP-BLOCK SPACING & PADDING ================= */
:root {
  --wp--style--block-gap: 0px !important;
}

body {
  margin: 0 !important;
  padding: 0 !important;
}

.wp-site-blocks {
  padding: 0 !important;
  margin: 0 !important;
}

.wp-site-blocks > *,
:where(.wp-site-blocks) > *,
:where(.wp-site-blocks) > :first-child,
:where(.wp-site-blocks) > :last-child,
:where(.is-layout-flow) > *,
:where(.is-layout-constrained) > * {
  margin-block-start: 0 !important;
  margin-block-end: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.wp-block-template-part,
header.wp-block-template-part,
footer.wp-block-template-part,
:root :where(.wp-block-template-part.has-background) {
  margin: 0 !important;
  padding: 0 !important;
}

header.wp-block-template-part,
.wp-site-blocks > header {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  width: 100% !important;
}
.font-arabic {
  font-family: 'Amiri', serif !important;
}
.hero-glow {
  background: radial-gradient(circle at 50% 30%, rgba(56, 189, 248, 0.22) 0%, rgba(6, 19, 37, 0.95) 75%);
}
.gold-gradient-text,
.sapphire-gradient-text {
  background: linear-gradient(135deg, #ffffff 0%, #e0f2fe 30%, #38bdf8 65%, #0284c7 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.silver-gradient-text {
  background: linear-gradient(135deg, #ffffff 0%, #e2e8f0 50%, #94a3b8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.glass-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.dark-glass {
  background: rgba(7, 19, 34, 0.85);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.lift-on-hover {
  transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.lift-on-hover:hover {
  transform: translateY(-5px);
  box-shadow: 0 20px 35px -10px rgba(7, 21, 43, 0.18);
}

/* ================= CINEMATIC HERO FLOWING SLIDER ================= */
#hero-slider {
  position: relative;
  overflow: hidden;
  background-color: #07152b;
}

.hero-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translate3d(100%, 0, 0);
  will-change: transform;
  z-index: 1;
}

.hero-slide img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: brightness(1.05) contrast(1.08) saturate(1.12);
  image-rendering: -webkit-optimize-contrast;
  transform: translate3d(0, 0, 0);
  will-change: transform;
  z-index: 1;
}

.hero-slide.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: 10;
  transform: translate3d(0, 0, 0);
  transition: none;
}

.hero-slide.active img {
  animation: none !important;
  transform: translate3d(0, 0, 0) scale(1) !important;
}

.hero-slide.slide-prep-right {
  opacity: 1;
  visibility: visible;
  z-index: 12;
  transform: translate3d(100%, 0, 0) !important;
  transition: none !important;
}
.hero-slide.slide-prep-right img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: none !important;
  animation: none !important;
}

.hero-slide.slide-prep-left {
  opacity: 1;
  visibility: visible;
  z-index: 12;
  transform: translate3d(-100%, 0, 0) !important;
  transition: none !important;
}
.hero-slide.slide-prep-left img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: none !important;
  animation: none !important;
}

.hero-slide.slide-glide-in {
  opacity: 1;
  visibility: visible;
  z-index: 12;
  transform: translate3d(0, 0, 0) !important;
  transition: transform 0.95s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.hero-slide.slide-glide-in img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: none !important;
  animation: none !important;
}

.hero-slide.slide-glide-out-left {
  opacity: 1;
  visibility: visible;
  z-index: 8;
  transform: translate3d(-100%, 0, 0) !important;
  transition: transform 0.95s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.hero-slide.slide-glide-out-left img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: none !important;
  animation: none !important;
}

.hero-slide.slide-glide-out-right {
  opacity: 1;
  visibility: visible;
  z-index: 8;
  transform: translate3d(100%, 0, 0) !important;
  transition: transform 0.95s cubic-bezier(0.16, 1, 0.3, 1) !important;
}
.hero-slide.slide-glide-out-right img {
  transform: translate3d(0, 0, 0) scale(1) !important;
  transition: none !important;
  animation: none !important;
}

.hero-content-fade {
  transition: opacity 0.32s cubic-bezier(0.4, 0, 0.2, 1), transform 0.32s cubic-bezier(0.4, 0, 0.2, 1), filter 0.32s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform, opacity, filter;
}

#hero-title {
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.85), 0 4px 16px rgba(0, 0, 0, 0.65), 0 0 25px rgba(6, 19, 37, 0.55);
}
@media (min-width: 640px) {
  #hero-title {
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
  }
}

/* ================= SMOOTH SCROLL & SCROLL PADDING ================= */
html {
  scroll-behavior: smooth !important;
  scroll-padding-top: 5.5rem;
}
@media (min-width: 640px) {
  html {
    scroll-padding-top: 6rem;
  }
}
html.lenis, html.lenis body {
  height: auto;
}
.lenis.lenis-smooth {
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}
.lenis.lenis-stopped {
  overflow: clip;
}

/* ================= SCROLL REVEAL & PROGRESS BAR ================= */
#scroll-progress-bar {
  transform-origin: 0% 50%;
  will-change: transform;
  box-shadow: 0 0 12px rgba(56, 189, 248, 0.6);
}
@supports (animation-timeline: scroll()) {
  @keyframes scrollProgressAnim {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
  }
  #scroll-progress-bar {
    animation: scrollProgressAnim auto linear;
    animation-timeline: scroll();
  }
}

.reveal,
.reveal-left,
.reveal-right,
.reveal-scale {
  opacity: 0;
  will-change: transform, opacity;
  transition: opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
}

.reveal {
  transform: translateY(32px);
}

.reveal-left {
  transform: translateX(-36px);
}

.reveal-right {
  transform: translateX(36px);
}

.reveal-scale {
  transform: scale(0.92);
}

.revealed {
  opacity: 1 !important;
  transform: translate(0, 0) scale(1) !important;
}

.delay-75 { transition-delay: 75ms; }
.delay-100 { transition-delay: 100ms; }
.delay-150 { transition-delay: 150ms; }
.delay-200 { transition-delay: 200ms; }
.delay-250 { transition-delay: 250ms; }
.delay-300 { transition-delay: 300ms; }
.delay-400 { transition-delay: 400ms; }
.delay-500 { transition-delay: 500ms; }

#main-header.header-scrolled {
  box-shadow: 0 10px 25px -5px rgba(2, 44, 95, 0.4), 0 8px 10px -6px rgba(2, 44, 95, 0.3);
  border-color: rgba(56, 189, 248, 0.35);
}

@keyframes subtleFloat {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-6px); }
}
.animate-float {
  animation: subtleFloat 3.8s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce) {
  .reveal,
  .reveal-left,
  .reveal-right,
  .reveal-scale,
  .animate-float {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
  #scroll-progress-bar {
    display: none !important;
  }
}

@media (max-width: 767.98px) {
  input,
  select,
  textarea {
    font-size: 16px !important;
  }
  #theme-palette-tab,
  #theme-palette-panel,
  #social-dock-body,
  #social-show-tab {
    display: none !important;
  }
}

/* ================= PAGINATION STYLING ================= */
.events-pagination-item {
  display: inline-flex;
}
.page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  height: 2.75rem;
  padding: 0 1rem;
  border-radius: 0.75rem;
  font-weight: 600;
  font-size: 0.875rem;
  text-decoration: none;
  transition: all 0.25s ease;
}
.page-numbers.current {
  background: linear-gradient(135deg, #1d4ed8 0%, #0284c7 100%) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(2, 132, 199, 0.3) !important;
}

/* ================= CONTACT FORM 7 STYLING ================= */
.wpcf7 {
  position: relative;
  width: 100%;
}
.wpcf7-form {
  margin: 0;
}
.wpcf7-form-control-wrap {
  display: block;
  width: 100%;
  position: relative;
}
.wpcf7 input[type="text"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"],
.wpcf7 select,
.wpcf7 textarea {
  width: 100%;
  font-size: 1rem;
  color: #0f172a;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 0.75rem;
  padding: 0.75rem 1rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  outline: none;
}
.wpcf7 input[type="text"]:focus,
.wpcf7 input[type="email"]:focus,
.wpcf7 input[type="tel"]:focus,
.wpcf7 select:focus,
.wpcf7 textarea:focus {
  outline: none !important;
  border-color: #2563eb !important;
  box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.15) !important;
}
.wpcf7 select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%2364748b' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
  background-position: right 0.875rem center;
  background-repeat: no-repeat;
  background-size: 1.25rem 1.25rem;
  padding-right: 2.5rem;
}
.wpcf7-not-valid {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.12) !important;
}
.wpcf7-not-valid-tip {
  display: block;
  font-size: 0.8125rem;
  font-weight: 500;
  color: #dc2626;
  margin-top: 0.375rem;
  line-height: 1.25;
}
.wpcf7-spinner {
  visibility: hidden;
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  margin: 0 0 0 0.5rem;
  border: 2px solid rgba(255, 255, 255, 0.35);
  border-top-color: #ffffff;
  border-radius: 50%;
  animation: wpcf7-spin 0.75s linear infinite;
  vertical-align: middle;
}
@keyframes wpcf7-spin {
  to { transform: rotate(360deg); }
}
.wpcf7 form.submitting .wpcf7-spinner {
  visibility: visible;
}
.wpcf7-response-output {
  margin: 1.25rem 0 0 0 !important;
  padding: 0.875rem 1.25rem !important;
  border-radius: 0.75rem !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  text-align: center !important;
  display: none !important;
  transition: all 0.3s ease !important;
}
.wpcf7 form.sent .wpcf7-response-output,
.wpcf7 form[data-status="sent"] .wpcf7-response-output {
  display: block !important;
  background-color: #eff6ff !important;
  border: 1px solid #bfdbfe !important;
  color: #1e40af !important;
}
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output,
.wpcf7 form[data-status="invalid"] .wpcf7-response-output,
.wpcf7 form[data-status="failed"] .wpcf7-response-output,
.wpcf7 form[data-status="spam"] .wpcf7-response-output {
  display: block !important;
  background-color: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  color: #991b1b !important;
}

