/* Kanal öner sayfası (2026-09) — yayın akışları sayfasıyla aynı görsel dil */
.ko{
	--kart:#141414; --kenar:#2a2a2a; --alan:#0c0c0c; --alan-k:#353535;
	--kir1:#9c0b12; --kir2:#6a050b; --kir-k:#c8202a; --yesil:#20d06a; --hata:#ff6b6b;
	width:980px; margin:14px auto 24px; color:#e8e8e8;
	font-family:"Segoe UI","Open Sans",Tahoma,Arial,sans-serif; font-size:14px; line-height:1.45;
}
.ko *{box-sizing:border-box;}
.ko [hidden]{display:none !important;}
.ko a{color:#ff5a61; text-decoration:none;}
.ko a:hover{text-decoration:underline;}

.ko-ust{margin-bottom:14px;}
.ko h1{margin:0; font-size:30px; font-weight:600; line-height:1.15; color:#fff;}
.ko-ust p{margin:4px 0 0; font-size:13px; color:#bdbdbd; max-width:720px;}

.ko-izgara{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:16px; align-items:start;}
.ko-kart{background:var(--kart); border:1px solid var(--kenar); border-radius:6px; padding:18px 20px 20px;}
.ko-kart-baslik{margin:0 0 14px; font-size:15px; font-weight:600; color:#fff; padding-bottom:10px; border-bottom:1px solid var(--kenar); position:relative;}
.ko-kart-baslik::after{content:""; position:absolute; left:0; bottom:-1px; width:48px; height:2px; background:var(--kir-k);}

/* form */
.ko-satir{display:grid; grid-template-columns:1fr 1fr; gap:0 14px;}
.ko-alan{margin-bottom:14px; min-width:0;}
.ko-alan label, .ko-tur legend{display:block; font-size:13px; font-weight:600; color:#ddd; margin-bottom:5px;}
.ko-alan label em, .ko-not em{font-style:normal; color:var(--kir-k);}
.ko-alan label small{font-weight:normal; color:#888;}
.ko input[type=text], .ko input[type=email], .ko select, .ko textarea{
	display:block; width:100%; height:40px; padding:0 12px; margin:0;
	background:var(--alan); color:#fff; border:1px solid var(--alan-k); border-radius:4px;
	font:inherit; font-size:14px; outline:none; transition:border-color .15s, box-shadow .15s;
}
.ko textarea{height:auto; min-height:96px; padding:9px 12px; resize:vertical; line-height:1.45;}
.ko select{appearance:none; -webkit-appearance:none; padding-right:34px; cursor:pointer;
	background:var(--alan) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23aaa' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 12px center;}
.ko select option, .ko select optgroup{background:#1a1a1a; color:#fff;}
.ko input::placeholder, .ko textarea::placeholder{color:#6d6d6d;}
.ko input:hover, .ko select:hover, .ko textarea:hover{border-color:#4a4a4a;}
.ko input:focus, .ko select:focus, .ko textarea:focus{border-color:var(--kir-k); box-shadow:0 0 0 3px rgba(200,32,42,.25);}
.ko [aria-invalid=true]{border-color:var(--hata) !important;}
.ko-hata{display:block; font-size:12.5px; color:var(--hata); margin-top:4px; min-height:0;}
.ko-hata:empty{display:none;}
.ko-alt{display:flex; justify-content:space-between; gap:10px;}
.ko-sayac{margin-left:auto; font-size:12px; color:#777; margin-top:4px; white-space:nowrap;}
.ko-sayac.dolu{color:#e0a030;}

/* tür seçimi */
.ko-tur{border:0; padding:0; margin:0 0 14px; min-width:0;}
.ko-tur label{display:inline-block; margin-right:8px; cursor:pointer;}
.ko-tur input{position:absolute; opacity:0; pointer-events:none;}
.ko-tur span{display:flex; align-items:center; gap:8px; height:40px; padding:0 18px 0 14px; border:1px solid var(--alan-k); border-radius:4px; background:var(--alan); color:#bbb; font-size:13.5px; transition:background .15s, border-color .15s, color .15s;}
.ko-tur svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;}
.ko-tur label:hover span{border-color:#4a4a4a; color:#fff;}
.ko-tur input:checked + span{background:linear-gradient(var(--kir1),var(--kir2)); border-color:var(--kir-k); color:#fff; font-weight:600;}
.ko-tur input:focus-visible + span{box-shadow:0 0 0 3px rgba(200,32,42,.35);}

.ko-gizli{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden;}

.ko-ozet{background:rgba(255,107,107,.1); border:1px solid rgba(255,107,107,.45); color:#ffb3b3; border-radius:4px; padding:9px 12px; margin-bottom:14px; font-size:13px;}

.ko-gonder-alan{display:flex; align-items:center; gap:16px; margin-top:4px;}
.ko-gonder{flex-shrink:0; min-width:170px; height:44px; padding:0 26px; border:1px solid var(--kir-k); border-radius:4px; cursor:pointer;
	background:linear-gradient(#b50d16,var(--kir2)); color:#fff; font:inherit; font-size:15px; font-weight:600; letter-spacing:.2px; transition:filter .15s;}
.ko-gonder:hover{filter:brightness(1.15);}
.ko-gonder:focus-visible{outline:none; box-shadow:0 0 0 3px rgba(200,32,42,.4);}
.ko-gonder[disabled]{cursor:wait; filter:saturate(.6) brightness(.85);}
.ko-gonder[disabled] span::before{content:""; display:inline-block; width:14px; height:14px; margin:0 8px -2px 0; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; border-radius:50%; animation:ko-don .7s linear infinite;}
@keyframes ko-don{to{transform:rotate(360deg);}}
.ko-not{margin:0; font-size:12px; color:#8a8a8a;}

/* teşekkür */
.ko-tamam{text-align:center; padding:26px 10px 16px; outline:none;}
.ko-tamam-ikon{width:64px; height:64px; margin:0 auto 14px; border-radius:50%; background:rgba(32,208,106,.12); border:2px solid var(--yesil); display:flex; align-items:center; justify-content:center; animation:ko-bel .35s ease-out;}
.ko-tamam-ikon svg{width:34px; height:34px; fill:none; stroke:var(--yesil); stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round;}
@keyframes ko-bel{from{transform:scale(.6); opacity:0;}}
.ko-tamam h3{margin:0 0 8px; font-size:20px; font-weight:600; color:#fff;}
.ko-tamam p{margin:0 auto 10px; max-width:460px; color:#bdbdbd;}
.ko-mevcut{background:#1d1d1d; border:1px solid var(--kenar); border-radius:4px; padding:8px 12px; display:inline-block;}
.ko-mevcut b{color:#fff;}
.ko-yeni{display:inline-block; margin-top:8px; padding:9px 18px; border:1px solid #444; border-radius:4px; color:#ddd !important; background:#1d1d1d;}
.ko-yeni:hover{border-color:var(--kir-k); text-decoration:none !important; color:#fff !important;}

/* bilgi kartı */
.ko-bilgi{font-size:13px; color:#bdbdbd;}
.ko-adimlar{list-style:none; counter-reset:ko; margin:0 0 20px; padding:0;}
.ko-adimlar li{counter-increment:ko; position:relative; padding:0 0 12px 38px;}
.ko-adimlar li::before{content:counter(ko); position:absolute; left:0; top:0; width:26px; height:26px; border-radius:50%; background:linear-gradient(var(--kir1),var(--kir2)); border:1px solid var(--kir-k); color:#fff; font-size:12.5px; font-weight:600; text-align:center; line-height:24px;}
.ko-adimlar li:not(:last-child)::after{content:""; position:absolute; left:13px; top:28px; bottom:2px; width:1px; background:#3a3a3a;}
.ko-adimlar b, .ko-adimlar span{display:block;}
.ko-adimlar b{color:#fff; font-weight:600; font-size:13.5px; line-height:26px;}
.ko-ipucu{margin:0; padding:0 0 0 16px;}
.ko-ipucu li{margin-bottom:8px;}
.ko-ipucu li::marker{color:var(--kir-k);}
.ko-ipucu b{color:#e8e8e8; font-weight:600;}

/* mobil */
.ko-mobil{width:auto; margin:12px 12px 20px;}
.ko-mobil h1{font-size:24px;}
.ko-mobil .ko-izgara{grid-template-columns:1fr; gap:12px;}
.ko-mobil .ko-kart{padding:14px 14px 16px;}
.ko-mobil .ko-satir{grid-template-columns:1fr;}
.ko-mobil .ko-tur label{margin-right:4px;}
.ko-mobil .ko-tur span{padding:0 14px 0 11px;}
.ko-mobil .ko-gonder-alan{flex-direction:column; align-items:stretch; gap:10px;}
.ko-mobil .ko-gonder{width:100%;}
.ko-mobil input[type=text], .ko-mobil input[type=email], .ko-mobil select, .ko-mobil textarea{font-size:16px;} /* iOS yakınlaştırmasın */
@media (max-width:1000px){
	.ko:not(.ko-mobil){width:auto; margin-left:12px; margin-right:12px;}
}
@media (max-width:760px){
	.ko-izgara{grid-template-columns:1fr;}
	.ko-satir{grid-template-columns:1fr;}
}
