/* ============================================================
   İhlas Koleji — Tasarım Sistemi v1
   Tailwind utility'lerinin tek başına yapamadığı şeyler:
   keyframe animasyonlar, scroll-reveal, marka gradient metin,
   özel scrollbar ve KVKK modal tipografisi.
   Renk/spacing/tipografi kararları tailwind.config içindedir.
   ============================================================ */

/* Yumuşak kaydırma + sabit header için offset */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
}

/* ---------- Keyframes (bazıları main.js'te style.animation ile çağrılır) ---------- */
@keyframes float {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-18px); }
}
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: none; }
}
@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

/* ---------- Scroll reveal (IntersectionObserver ile .visible eklenir) ---------- */
.fade-on-scroll {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .7s ease, transform .7s ease;
}
.fade-on-scroll.visible {
  opacity: 1;
  transform: none;
}

/* ---------- Marka gradient yardımcıları ---------- */
.text-gradient-brand {
  background: linear-gradient(135deg, #2C296F 0%, #4C49A3 40%, #548ee6 80%, #A855F7 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.animate-float { animation: float 6s ease-in-out infinite; }

/* ---------- Özel scrollbar (KVKK modal gövdesi) ---------- */
.kvkk-scroll::-webkit-scrollbar { width: 8px; }
.kvkk-scroll::-webkit-scrollbar-track { background: #f1f1f4; border-radius: 8px; }
.kvkk-scroll::-webkit-scrollbar-thumb { background: #c7cbf0; border-radius: 8px; }
.kvkk-scroll::-webkit-scrollbar-thumb:hover { background: #9fa3de; }

/* ---------- KVKK ilerleme çubuğu dolgusu ---------- */
.kvkk-progress-fill {
  background: linear-gradient(90deg, #2C296F, #7C3AED);
  transition: width .15s ease, opacity .3s ease;
}

/* ---------- KVKK modal gövdesi tipografisi (küçük font → kısa scroll) ---------- */
#kvkkBody { font-size: .78rem; line-height: 1.5; color: #6B7280; }
#kvkkBody h3 { font-size: .95rem; font-weight: 600; color: #1F2937; margin: 0 0 .5rem; }
#kvkkBody h4 { font-size: .82rem; font-weight: 600; color: #2C296F; margin: .85rem 0 .3rem; }
#kvkkBody p  { margin: 0 0 .5rem; line-height: 1.5; }
#kvkkBody ul,
#kvkkBody ol { margin: 0 0 .6rem 1.05rem; padding: 0; line-height: 1.5; }
#kvkkBody ul { list-style: disc; }
#kvkkBody ol { list-style: decimal; }
#kvkkBody li { margin-bottom: .22rem; }
#kvkkBody a  { color: #4C49A3; text-decoration: underline; }
#kvkkBody table { width: 100%; border-collapse: collapse; margin: 0 0 .7rem; font-size: .72rem; }
#kvkkBody table td,
#kvkkBody table th { border: 1px solid #E5E7EB; padding: .4rem .5rem; vertical-align: top; }

/* ---------- Gövde scroll kilidi (modal açıkken) ---------- */
body.modal-open { overflow: hidden; }

/* ---------- Bölüm arka planı: yumuşak üstten gradient (modern derinlik) ---------- */
.section-soft {
  background-image: linear-gradient(180deg, #EEF0FB 0%, #F6F7FD 45%, #FAFBFF 100%);
}

/* Hafif noktalı doku (çok belirsiz) — bölümlere derinlik katar */
.section-dots {
  background-image: radial-gradient(rgba(44, 41, 111, 0.05) 1px, transparent 1px);
  background-size: 22px 22px;
}

/* ---------- Sticky header: scroll'da katı zemin ----------
   Not: arka plan elementin KENDİSİNE uygulanmalı; group-[.is-scrolled]
   varyantı yalnızca alt elemanlara (logo/menü rengi) etki ediyor. */
[data-header] {
  transition: background-color .3s ease, box-shadow .3s ease, border-color .3s ease;
  border-bottom: 1px solid transparent;
}
[data-header].is-scrolled {
  background-color: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-bottom-color: #E5E7EB;
  box-shadow: 0 6px 24px -12px rgba(44, 41, 111, 0.25);
}

/* ============================================================
   SweetAlert2 — marka teması (modern, tasarım sistemiyle uyumlu)
   ============================================================ */
.swal2-popup {
  border-radius: 1.5rem;
  font-family: inherit;
  padding: 2rem 1.75rem 1.75rem;
  box-shadow: 0 25px 60px -12px rgba(44, 41, 111, 0.35);
}
.swal2-title {
  font-size: 1.375rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  color: #1F2937;
}
.swal2-html-container { font-size: .95rem; color: #6B7280; }
.swal2-actions { gap: .6rem; margin-top: 1.5rem; }
.swal2-styled {
  border-radius: .85rem;
  padding: .7rem 1.6rem;
  font-size: .9rem;
  font-weight: 600;
  box-shadow: none;
  transition: background-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.swal2-styled:focus { box-shadow: 0 0 0 3px rgba(76, 73, 163, 0.25); outline: none; }
.swal2-styled.swal2-confirm { background-color: #2C296F; }
.swal2-styled.swal2-confirm:hover { background-color: #221F57; transform: translateY(-1px); box-shadow: 0 10px 20px -8px rgba(44, 41, 111, 0.5); }
.swal2-styled.swal2-cancel {
  background-color: #fff;
  color: #6B7280;
  border: 1px solid #E5E7EB;
}
.swal2-styled.swal2-cancel:hover { background-color: #F3F4F6; color: #1F2937; }

/* İkon renkleri — marka paleti */
.swal2-icon { border-width: 3px; }
.swal2-icon.swal2-success { border-color: #10B981; color: #10B981; }
.swal2-icon.swal2-success [class^='swal2-success-line'] { background-color: #10B981; }
.swal2-icon.swal2-success .swal2-success-ring { border-color: rgba(16, 185, 129, 0.3); }
.swal2-icon.swal2-error { border-color: #EF4444; color: #EF4444; }
.swal2-icon.swal2-error [class^='swal2-x-mark-line'] { background-color: #EF4444; }
.swal2-icon.swal2-question { border-color: #4C49A3; color: #4C49A3; }
.swal2-icon.swal2-warning { border-color: #F59E0B; color: #F59E0B; }
.swal2-timer-progress-bar { background: linear-gradient(90deg, #2C296F, #7C3AED); }

/* Toast (KVKK kabul bildirimi vb.) */
.swal2-toast { border-radius: 1rem !important; box-shadow: 0 10px 40px -10px rgba(44, 41, 111, 0.25) !important; }
.swal2-toast .swal2-title { font-size: .9rem; }