/* ============================================================================
   Donanım Akademi — HOVER / FOCUS YARDIMCI SINIFLARI

   Tasarımdaki `style-hover` (175 kullanım) ve `style-focus` (13 kullanım)
   nitelikleri Claude Design runtime'ına özgüdür ve production'da çalışmaz.
   Envanterde 175 kullanımın yalnızca ~35 farklı DEĞERE indiği görüldü; burada
   o değerler gerçek CSS sınıflarına çevrilmiştir.

   Kullanım:  <a class="da-h-red">   →  hover'da color:#D02026
   Özgüllük:  .da-app öneki (0,2,0) + buton kuralları :is() ile (0,3,0)
              → hello-elementor reset'inin (0,2,0) pembe dolgusunu yener.
   ========================================================================== */

/* --- Renk geçişleri ------------------------------------------------------ */
.da-app .da-h-red:hover                 { color: #D02026; }
.da-app .da-h-red-dark:hover            { color: #8F1218; }
.da-app .da-h-white:hover               { color: #fff; }
.da-app .da-h-light:hover               { color: #FFE0E0; }
.da-app .da-h-text:hover                { color: #18181B; }

/* --- Dolgu değişimleri --------------------------------------------------- */
/* Solid CTA'lar: reset'in şeffaflaştırmasına karşı :is() + açık marka hover'ı */
.da-app :is(a,button).da-h-red-fill:hover,
.da-app :is(a,button).da-h-red-fill:focus {
	background-color: #b91d22;
	color: #fff;
	border-color: #b91d22;
}
.da-app :is(a,button).da-h-red-solid:hover,
.da-app :is(a,button).da-h-red-solid:focus {
	background-color: #D02026;
	color: #fff;
	border-color: #D02026;
}
.da-app :is(a,button).da-h-soft:hover,
.da-app :is(a,button).da-h-soft:focus {
	background-color: #FFF1F1;
	color: #D02026;
}
.da-app :is(a,button).da-h-soft-warm:hover,
.da-app :is(a,button).da-h-soft-warm:focus {
	background-color: #FFF6F4;
}
.da-app :is(a,button).da-h-white-fill:hover,
.da-app :is(a,button).da-h-white-fill:focus {
	background-color: #fff;
	color: #D02026;
}
.da-app :is(a,button).da-h-wa:hover,
.da-app :is(a,button).da-h-wa:focus {
	background-color: #1FB855;
	color: #fff;
}

/* --- Kenarlık + metin (secondary buton) ---------------------------------- */
.da-app :is(a,button).da-h-outline:hover,
.da-app :is(a,button).da-h-outline:focus {
	border-color: #D02026;
	color: #D02026;
	background-color: #FFF6F6;
}
.da-app :is(a,button).da-h-outline-white:hover,
.da-app :is(a,button).da-h-outline-white:focus {
	border-color: #fff;
	color: #fff;
	background-color: rgba(255,255,255,.10);
}

/* --- Yükselme / gölge ---------------------------------------------------- */
.da-app .da-h-lift:hover        { transform: translateY(-1px); }
.da-app .da-h-lift-2:hover      { transform: translateY(-2px); }
.da-app .da-h-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 20px 44px rgba(24,24,27,.10);
}
.da-app .da-h-shadow:hover      { box-shadow: 0 14px 34px rgba(24,24,27,.12); }

/* --- Ok kayması (linklerde "gap" artışı) --------------------------------- */
.da-app .da-h-gap:hover         { gap: 12px; }
.da-app .da-h-gap-lg:hover      { gap: 11px; }
.da-app .da-h-slide:hover       { transform: translateX(3px); }

/* --- Bileşik: menü linki (renk + kayma) ---------------------------------- */
.da-app .da-h-navlink:hover     { color: #D02026; transform: translateX(3px); }

/* Geçiş süresi — tüm hover yardımcıları için tek yerden */
.da-app [class*="da-h-"] {
	transition: color .2s ease, background-color .25s ease, border-color .25s ease,
	            transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease, gap .25s ease;
}


/* ============================================================================
   FOCUS — form alanları (tasarımdaki style-focus karşılıkları)
   Tema reset'i `input:focus{border-color:#333}` (0,2,1) ile basar; buradaki
   `.da-app :is(...)` (0,3,1) onu yener.
   ========================================================================== */
.da-app :is(input,select,textarea).da-f-red:focus {
	border-color: #D02026;
	background: #fff;
}
.da-app :is(input,select,textarea).da-f-ring:focus {
	border-color: #D02026;
	box-shadow: 0 0 0 3px rgba(208,32,38,.14);
	background: #fff;
}

@media (prefers-reduced-motion: reduce) {
	.da-app [class*="da-h-"] { transition: none; }
	.da-app .da-h-lift:hover,
	.da-app .da-h-lift-2:hover,
	.da-app .da-h-card:hover,
	.da-app .da-h-slide:hover,
	.da-app .da-h-navlink:hover { transform: none; }
}
