/* TFSF Portal — özel stiller (utility-olmayan; tokenlar tailwind.config.js'de).
   Yalnız portal sayfalarında <link> ile yüklenir. */

:root {
  --brand: #C8202E;
  --brand-700: #A8121F;
}

::selection { background: var(--brand); color: #fff; }

.font-display { font-feature-settings: 'ss01'; }

/* Hero/section dokusu */
.grain::before {
  content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .06; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.nice-scroll::-webkit-scrollbar { height: 8px; width: 8px; }
.nice-scroll::-webkit-scrollbar-thumb { background: #DCDFE8; border-radius: 4px; }

/* Sayfa giriş animasyonu */
.page-enter { animation: pageIn .35s cubic-bezier(.2,.7,.2,1); }
@keyframes pageIn {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* Form girdileri (şikayet vb.) */
.form-input {
  width: 100%;
  height: 48px;
  padding: 0 14px;
  font-size: 14px;
  background: #FBFAF7;
  border: 1px solid #DCDFE8;
  color: #0A0F1F;
  outline: none;
  transition: border-color .15s, background .15s;
}
textarea.form-input { height: auto; padding: 14px; }
.form-input:focus { border-color: var(--brand); }
.form-input::placeholder { color: #B8BDCC; }

/* Görsel placeholder deseni */
.placeholder-img {
  background-image:
    repeating-linear-gradient(135deg, rgba(0,0,0,.04) 0 1px, transparent 1px 14px),
    linear-gradient(180deg, #EFEBE2, #E3DDCF);
}

/* ── Hero Slider ────────────────────────────────────────────────── */

/* Progress bar animasyonu (6.5s autoplay ile eşleşmeli) */
@keyframes heroProgress {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
[data-slide-dot] { position: relative; overflow: hidden; }
[data-slide-dot] [data-progress] {
  position: absolute; inset: 0;
  background: var(--brand);
  transform: scaleX(0);
  transform-origin: left;
}
[data-slide-dot] [data-progress].running {
  animation: heroProgress 6500ms linear forwards;
}

/* Metin giriş animasyonu */
@keyframes heroTextIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
/* Metin slide'ları: JS tarafından aktif olan görünür yapılır */
[data-slide-text] { transition: opacity .5s ease; }
[data-slide-text].active > *:nth-child(1) { animation: heroTextIn .55s .00s cubic-bezier(.22,.8,.22,1) both; }
[data-slide-text].active > *:nth-child(2) { animation: heroTextIn .55s .07s cubic-bezier(.22,.8,.22,1) both; }
[data-slide-text].active > *:nth-child(3) { animation: heroTextIn .55s .14s cubic-bezier(.22,.8,.22,1) both; }
[data-slide-text].active > *:nth-child(4) { animation: heroTextIn .55s .21s cubic-bezier(.22,.8,.22,1) both; }
[data-slide-text].active > *:nth-child(5) { animation: heroTextIn .55s .28s cubic-bezier(.22,.8,.22,1) both; }

/* ── Legacy içerik: inline stil ezme (font/renk/arka plan) ─────────────────── */
.page-article span,
.page-article p {
  font-family: inherit !important;
  font-size: inherit !important;
  color: inherit !important;
  background: none !important;
  background-image: none !important;
}

/* ── Legacy içerik tablosu (portal_page.description HTML) ──────────────────── */
.legacy-table table {
  width: 100% !important;
  border-collapse: collapse;
  margin: 0;
}
.legacy-table td {
  width: auto !important;  /* inline style="width:..." ezilir */
  padding: 13px 16px;
  border: none !important;
  border-bottom: 1px solid #EAECF2 !important;
  vertical-align: top;
  font-size: 14.5px;
  line-height: 1.65;
  color: #0A0F1F;
}
.legacy-table tr:last-child td { border-bottom: none !important; }
.legacy-table tr:nth-child(even) td { background: #FAFAF8; }
.legacy-table td:first-child {
  width: 32% !important;
  font-size: 11.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.09em;
  color: #6B7190;
  padding-right: 20px;
  white-space: nowrap;
}
@media (max-width: 640px) {
  .legacy-table td { display: block; padding: 8px 0; border: none !important; }
  .legacy-table td:first-child { width: auto !important; white-space: normal; border-bottom: none !important; padding-bottom: 2px; }
  .legacy-table tr { border-bottom: 1px solid #EAECF2; display: block; padding: 10px 0; }
  .legacy-table tr:last-child { border-bottom: none; }
  .legacy-table tr:nth-child(even) td { background: transparent; }
}