/* kayseradar.com.tr — ihbar / şikâyet formu (/bildir, /sikayet). site.css'in üstüne yüklenir. */

.acil { margin: 0.9rem 0 0; font-size: 0.9375rem; color: var(--soluk); }
.acil a { color: var(--kirmizi-yazi); }

.ihbar { margin-top: 1.25rem; }
.ihbar-kart { background: var(--yuzey); border: 1px solid rgba(20, 20, 19, 0.06); border-radius: var(--kose); box-shadow: var(--golge); padding: 1.1rem; }
.ihbar-kart h2 { margin: 0 0 0.4rem; font-weight: 800; font-style: italic; font-size: 1.4rem; letter-spacing: -0.02em; color: var(--siyah); }
.ihbar-kart p { margin: 0 0 0.9rem; }
.ihbar-yukleniyor { display: flex; align-items: center; gap: 0.6rem; padding: 1.1rem; background: var(--yuzey); border-radius: var(--kose); box-shadow: var(--golge); color: var(--soluk); }
.donen { width: 1.2rem; height: 1.2rem; border-radius: 50%; border: 2px solid var(--cizgi); border-top-color: var(--kirmizi); flex: none; }
@media (prefers-reduced-motion: no-preference) { .donen { animation: don 0.8s linear infinite; } }
@keyframes don { to { transform: rotate(360deg); } }

.ihbar-uyari { margin: 0 0 1rem; padding: 0.75rem 0.9rem; border-radius: 10px; background: var(--kirmizi-acik); border: 1px solid #F5C9CB; color: #7A0B10; font-size: 0.96875rem; line-height: 1.45; }
.ihbar-uyari .dugme { margin-top: 0.6rem; min-height: 2.5rem; }
.ihbar-mesaj { margin: 0.75rem 0 0 !important; font-size: 0.9375rem; color: var(--soluk); }
.ihbar-mesaj:empty { display: none; }
.ihbar-mesaj.hata { color: var(--kirmizi-yazi); font-weight: 500; }

/* Giriş */
.giris-secenekleri { display: grid; gap: 0.6rem; }
.giris-secenekleri .dugme svg { width: 1.2rem; height: 1.2rem; }
.telefon-form { display: grid; gap: 0.75rem; }
.telefon-form .bag-dugme { justify-self: start; }
.kod-bolum { display: grid; gap: 0.75rem; padding-top: 0.25rem; border-top: 1px dashed var(--cizgi); }
.kod-bolum input { letter-spacing: 0.3em; font-variant-numeric: tabular-nums; font-size: 1.25rem; }
.recaptcha-yeri:empty { display: none; }

.oturum { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.25rem 0.75rem; margin: -0.25rem 0 0.9rem; padding: 0.35rem 0.75rem; border-radius: 10px; background: var(--yuzey-2); font-size: 0.9375rem; color: var(--soluk); }
.oturum strong { color: var(--metin); font-weight: 600; overflow-wrap: anywhere; }
.oturum .bag-dugme { min-height: 2.25rem; font-size: 0.875rem; }

/* Sözleşme */
.kisaca { margin: 0 0 0.9rem; padding: 0.8rem 0.9rem 0.8rem 2rem; border-radius: 10px; background: var(--yuzey-2); font-size: 0.96875rem; line-height: 1.45; }
.kisaca li + li { margin-top: 0.45rem; }

/* Form */
.ihbar-form { display: grid; gap: 1.15rem; }
.alan { display: grid; gap: 0.35rem; min-width: 0; }
.etiket { font-weight: 700; font-size: 0.96875rem; color: var(--siyah); }
.etiket small { font-weight: 400; color: var(--soluk); }
.yardim { font-size: 0.875rem; line-height: 1.4; color: var(--soluk); }
.ortali { text-align: center; margin: -0.4rem 0 0 !important; }
.ihbar input[type="text"], .ihbar input[type="tel"], .ihbar textarea {
  width: 100%; min-height: 3rem; padding: 0.65rem 0.85rem;
  border: 1px solid var(--cizgi-koyu); border-radius: 10px; background: var(--yuzey); color: var(--metin);
  font: 400 1.0625rem/1.4 Jost, "Century Gothic", sans-serif;
}
.ihbar textarea { min-height: 8rem; resize: vertical; }
.ihbar input::placeholder, .ihbar textarea::placeholder { color: #8A8A85; opacity: 1; }
.ihbar input:focus-visible, .ihbar textarea:focus-visible { outline: 3px solid var(--kirmizi); outline-offset: 0; border-color: transparent; }

.konu-sec { border: 0; margin: 0; padding: 0; min-width: 0; }
.konu-sec legend { padding: 0; margin-bottom: 0.45rem; }
.konular-liste { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.konu { position: relative; }
.konu input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.konu span { display: inline-flex; align-items: center; min-height: 2.5rem; padding: 0.4rem 0.9rem; border: 1px solid var(--cizgi-koyu); border-radius: 999px; background: var(--yuzey); font-weight: 600; font-size: 0.9375rem; cursor: pointer; }
.konu input:checked + span { background: var(--metin); border-color: var(--metin); color: #fff; }
.konu input:focus-visible + span { outline: 3px solid var(--kirmizi); outline-offset: 2px; }

.konum-satir { display: flex; flex-wrap: wrap; align-items: center; gap: 0.1rem 0.75rem; }
.konum-satir .bag-dugme svg { width: 1.1rem; height: 1.1rem; fill: var(--kirmizi); }

.dosya-sec { position: relative; display: block; cursor: pointer; }
.dosya-sec input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.dosya-sec input:disabled { cursor: default; }
.dosya-sec-yazi { display: grid; justify-items: center; gap: 0.2rem; padding: 1.1rem 0.75rem; border: 2px dashed var(--cizgi-koyu); border-radius: var(--kose); background: var(--yuzey-2); text-align: center; }
.dosya-sec-yazi svg { width: 1.8rem; height: 1.8rem; fill: var(--kirmizi); }
.dosya-sec-yazi small { color: var(--soluk); font-size: 0.875rem; }
.dosya-sec:hover .dosya-sec-yazi { border-color: var(--metin); }
.dosya-sec input:focus-visible + .dosya-sec-yazi { outline: 3px solid var(--kirmizi); outline-offset: 2px; }
.dosya-sec input:disabled + .dosya-sec-yazi { opacity: 0.6; }

.onizlemeler { list-style: none; margin: 0; padding: 0.4rem 0 0; display: flex; flex-wrap: wrap; gap: 0.6rem; }
.onizlemeler:empty { display: none; }
.onizleme { position: relative; width: 5.25rem; height: 5.25rem; border-radius: 10px; background: var(--yuzey-2); }
.onizleme img, .onizleme video { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 10px; }
.onizleme-video { position: absolute; left: 0.3rem; bottom: 0.3rem; padding: 0 0.35rem; border-radius: 6px; background: rgba(20, 20, 19, 0.75); color: #fff; font-size: 0.75rem; font-weight: 600; }
.onizleme-sil { position: absolute; top: -0.5rem; right: -0.5rem; display: grid; place-items: center; width: 1.75rem; height: 1.75rem; padding: 0; border: 1px solid var(--cizgi-koyu); border-radius: 50%; background: var(--yuzey); font: 700 1.1rem/1 Jost, sans-serif; color: var(--metin); cursor: pointer; }
.onizleme-sil:hover { background: var(--kirmizi-yazi); border-color: var(--kirmizi-yazi); color: #fff; }

.dogrulanmis { display: flex; gap: 0.6rem; align-items: flex-start; padding: 0.75rem 0.85rem; border-radius: 10px; background: #EAF5EE; }
.dogrulanmis .simge { fill: var(--yesil); width: 1.3rem; height: 1.3rem; margin-top: 0.1rem; }
.dogrulanmis small { display: block; color: var(--soluk); font-size: 0.875rem; line-height: 1.4; }

.onaylar { display: grid; gap: 0.6rem; }
.onay { display: flex; gap: 0.65rem; align-items: flex-start; font-size: 0.9375rem; line-height: 1.45; cursor: pointer; }
.onay input { width: 1.25rem; height: 1.25rem; margin: 0.12rem 0 0; flex: none; accent-color: var(--kirmizi-yazi); }
.ihbar-kart > .onay { margin-bottom: 0.9rem; }

.ilerleme { display: grid; gap: 0.35rem; }
.ilerleme-cubuk { height: 0.5rem; border-radius: 999px; background: var(--yuzey-2); overflow: hidden; }
.ilerleme-cubuk span { display: block; width: 0; height: 100%; background: var(--kirmizi); transition: width 0.2s; }

.dugme.genis { width: 100%; min-height: 3.25rem; font-size: 1.0625rem; }

/* Tamam */
.tamam { text-align: center; padding-block: 1.75rem; }
.tamam:focus { outline: none; }
.tamam-simge { width: 3.25rem; height: 3.25rem; fill: var(--yesil); margin-bottom: 0.4rem; }
.tamam p { max-width: 30rem; margin-inline: auto; }
.tamam-dugmeler { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.5rem; margin-top: 1rem; }

/* Yan sütun */
.adimlar { margin: 0; padding-left: 1.2rem; font-size: 0.96875rem; line-height: 1.45; }
.adimlar li + li { margin-top: 0.5rem; }
.wa-kutu { border-top: 4px solid var(--yesil); }

@media (min-width: 40rem) {
  .ihbar-kart { padding: 1.5rem; }
  .giris-secenekleri { grid-template-columns: 1fr 1fr; }
  .telefon-form { max-width: 24rem; }
}
