/* Muhan Ofset müşteri sitesi — yardımcı sınıflar */

/* ---------------------------------------------------------------------------
   ⚠️ FORM ALANLARINDA YAZI BOYU 16px'İN ALTINA İNMEZ.

   iOS Safari, 16 pikselden küçük yazılı bir alana dokunulduğunda sayfayı
   KENDİLİĞİNDEN yakınlaştırır ve geri çıkmaz. Burası 0.92rem (14.7px) idi;
   sonuç: telefondan adres yazan müşteri her alanda yakınlaşan, elle geri
   küçültmesi gereken bir sayfayla uğraşıyordu. 60 öğrencilik isim listesinde
   bu her satırda tekrarlanıyordu.

   Görsel denge için yazı büyürken dolgu bir tık azaltıldı.
--------------------------------------------------------------------------- */
.input, .select, .textarea {
  width: 100%;
  padding: 0.6rem 0.8rem;
  border-radius: 0.65rem;
  border: 1px solid rgb(203 213 225);
  background: #fff;
  font-size: 1rem;
  outline: none;
}
.input:focus, .select:focus, .textarea:focus {
  border-color: #8A1730;
  box-shadow: 0 0 0 3px rgba(138, 23, 48, 0.12);
}
.label {
  display: block;
  font-size: 0.82rem;
  font-weight: 600;
  margin-bottom: 0.35rem;
  color: rgb(71 85 105);
}

/* min-height: parmakla dokunulabilir en küçük ölçü 44px (Apple/Google ortak
   kılavuzu). Düğmeler 39px idi; telefonda "bastım ama olmadı" yaşanan yer. */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.65rem 1.25rem;
  min-height: 44px;
  border-radius: 0.75rem;
  font-weight: 700;
  font-size: 0.95rem;
  cursor: pointer;
  transition: transform .1s, opacity .15s;
}
.btn:hover { opacity: 0.92; }
.btn:active { transform: scale(.98); }
.btn:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-primary { background: #8A1730; color: #fff; }
.btn-accent  { background: #F4D35E; color: #5C0F20; }
.btn-outline { border: 2px solid #8A1730; color: #8A1730; background: transparent; }

.card {
  background: #fff;
  border: 1px solid rgb(226 232 240);
  border-radius: 1rem;
  box-shadow: 0 4px 20px rgba(17, 24, 39, 0.05);
}

/* Tasarım seçim kartı */
.tasarim-sec { cursor: pointer; border: 3px solid transparent; border-radius: 1rem; overflow: hidden; transition: border-color .15s; }
.tasarim-sec.secili { border-color: #8A1730; }
.tasarim-sec img { display: block; width: 100%; aspect-ratio: 3/4; object-fit: cover; }

/* Fotoğraf yükleme ızgarası */
.foto-kart { position: relative; }
.foto-kart img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 0.75rem; }
/* Silme düğmesi 26px idi ve fotoğrafın İÇİNDE duruyordu: parmakla silmeye
   çalışan, altındaki fotoğrafa basıp "değiştir" diyaloğunu açıyordu. Hem
   büyütüldü hem köşeden dışarı taşındı — iki hedef artık çakışmıyor. */
.foto-sil {
  position: absolute; top: -6px; right: -6px;
  background: rgba(220, 38, 38, .95); color: #fff;
  border: 2px solid #fff;
  border-radius: 9999px; width: 36px; height: 36px;
  font-size: 16px; line-height: 32px; text-align: center; cursor: pointer;
  z-index: 1;
}

.surukle-alan {
  border: 2px dashed rgb(203 213 225);
  border-radius: 1rem;
  padding: 2.5rem 1rem;
  text-align: center;
  color: rgb(100 116 139);
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.surukle-alan.aktif { border-color: #8A1730; background: #FCEEF1; }

/* Adım göstergesi */
.adimlar { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.adim { display: flex; align-items: center; gap: 0.4rem; font-size: 0.82rem; font-weight: 600; color: rgb(148 163 184); }
.adim .no {
  width: 26px; height: 26px; border-radius: 9999px;
  background: rgb(226 232 240); color: rgb(100 116 139);
  display: inline-flex; align-items: center; justify-content: center; font-size: 0.8rem;
}
.adim.aktif { color: #8A1730; }
.adim.aktif .no { background: #8A1730; color: #fff; }
.adim.tamam .no { background: #10b981; color: #fff; }

/* ---------------------------------------------------------------------------
   VİTRİN RAYI — kategori şeritlerindeki yatay ürün listesi

   Kaydırma çubuğu gizleniyor ama kaydırma ÇALIŞMAYA DEVAM EDİYOR: ray zaten
   ok düğmeleriyle ve telefonda parmakla sürükleyerek kullanılıyor, kalın gri
   çubuk kartların altında gereksiz bir çizgi bırakıyordu.

   scroll-snap: kaydırma bir kartın ortasında durmasın, kart kenarına otursun.
--------------------------------------------------------------------------- */
.ray { scrollbar-width: none; -ms-overflow-style: none; scroll-snap-type: x proximity; }
.ray::-webkit-scrollbar { display: none; }
.ray > * { scroll-snap-align: start; }