/* Kulüp ekranları (0.101.0): Haftanın Görevi (kg-), Puanlar (kp-), Akış yan kartları. */

/* ---------- Ortak ---------- */
.kg,.kp{display:flex;flex-direction:column;gap:20px;min-width:0}
.kg-ust{margin:0 0 4px;font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-text);display:flex;align-items:center;gap:6px}
.kg-kart{display:flex;flex-direction:column;gap:14px;min-width:0}
.kg-kart h3,.kg-bolum h3{margin:0;font-size:18px;line-height:1.3}
.kg-kart-bas,.kg-bolum-bas{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap}
.kg-kart-bas h3{display:flex;align-items:center;gap:8px}
.kg-cipler{display:flex;flex-wrap:wrap;gap:6px}
.kg-cip{display:inline-flex;align-items:center;height:26px;padding:0 10px;border-radius:999px;background:var(--surface-2);border:1px solid var(--line);font-size:12px;font-weight:700;color:var(--dim)}
.kg-cip-vurgu{background:var(--accent-soft);border-color:transparent;color:var(--accent-text)}
.kg-kalan{display:inline-flex;align-items:center;gap:6px;margin:0;font-size:13px;font-weight:700;color:var(--accent-text);white-space:nowrap}
.kg-not{margin:0;padding:12px 14px;border-radius:12px;background:var(--surface-2);font-size:13px;line-height:19px;color:var(--dim)}
.kg-not b{color:var(--accent-text);margin-right:4px}
.kg-eylem{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.kg-kisit{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:20px;color:var(--dim)}

/* ---------- Başlık ve adımlar ---------- */
.kg-bas{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap}
.kg-bas h2{margin:0;font-size:24px}
.kg-odul{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:999px;background:var(--accent-soft);color:var(--accent-text);font-size:13px;font-weight:800}
.kg-adimlar{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.kg-adim{display:flex;gap:10px;align-items:flex-start;padding:12px;border-radius:14px;border:1px solid var(--line);background:var(--surface);min-width:0}
.kg-adim span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.kg-adim b{font-size:13.5px;color:var(--text)}
.kg-adim small{font-size:12px;line-height:16px;color:var(--faint)}
.kg-adim-no{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:var(--surface-2);font-size:12px;font-weight:800;color:var(--dim)}
.kg-adim-simdi{border-color:var(--accent-text);box-shadow:inset 0 0 0 1px var(--accent-text)}
.kg-adim-simdi .kg-adim-no{background:var(--accent);color:var(--on-accent)}
.kg-adim-gecti .kg-adim-no{background:var(--accent-soft);color:var(--accent-text)}
.kg-bekle{flex-direction:row;align-items:flex-start;gap:16px}
.kg-bekle h3{margin:0 0 6px}
.kg-bekle p{margin:0 0 12px;color:var(--dim);font-size:14px;line-height:21px}
.kg-aday-liste{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:20px}

/* ---------- Görev oylaması ---------- */
.kg-adaylar{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.kg-aday{display:flex;flex-direction:column;gap:10px;padding:16px;border-radius:14px;border:1px solid var(--line);background:var(--surface-2);min-width:0}
.kg-aday h4{margin:0;font-size:16px;line-height:1.3}
.kg-aday p{margin:0;font-size:13.5px;line-height:20px;color:var(--dim)}
.kg-aday .kg-oy-dugme{margin-top:auto}
.kg-oyum{border-color:var(--accent-text);box-shadow:inset 0 0 0 1px var(--accent-text)}

/* ---------- Görev ve teslim ---------- */
.kg-izgara{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}
.kg-yan{display:flex;flex-direction:column;gap:16px;min-width:0}
.kg-gorev-baslik{font-size:22px!important}
.kg-gorev>p{margin:0;font-size:15px;line-height:23px;color:var(--dim)}
.kg-ozellik{margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.kg-ozellik div{padding:10px 12px;border-radius:12px;background:var(--surface-2);min-width:0}
.kg-ozellik dt{font-size:11.5px;color:var(--faint)}
.kg-ozellik dd{margin:2px 0 0;font-size:14px;font-weight:800;color:var(--text)}
.kg-teslim-alan{display:flex;flex-direction:column;gap:14px;padding-top:16px;border-top:1px solid var(--line)}
.kg-benim{display:flex;flex-direction:column;gap:10px}
.kg-benim p{margin:0;font-size:14px}
.kg-form{display:flex;flex-direction:column;gap:14px}
.kg-form h4{margin:0;font-size:16px}
.kg-yukleme{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.kg-slot{display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:14px;border:1px dashed var(--line-strong);background:var(--surface-2);cursor:pointer;min-width:0}
.kg-slot:hover,.kg-slot:focus-within{border-color:var(--accent-text)}
.kg-slot-dolu{border-style:solid}
.kg-slot-yukleniyor{opacity:.6;pointer-events:none}
.kg-slot-on{aspect-ratio:16/9;border-radius:10px;background:var(--surface);display:grid;place-items:center;color:var(--faint);overflow:hidden}
.kg-slot-on img{width:100%;height:100%;object-fit:cover}
.kg-slot-metin{display:flex;flex-direction:column;gap:2px}
.kg-slot-metin b{font-size:13px;color:var(--text)}
.kg-slot-metin small{font-size:11.5px;line-height:15px;color:var(--faint)}
.kg-form .tk-onay,.kg .tk-onay{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:19px;color:var(--dim);cursor:pointer}
.kg .tk-onay input{margin-top:2px;width:18px;height:18px;flex:none;accent-color:var(--accent)}
.kg-hata{margin:0;padding:10px 12px;border-radius:10px;background:color-mix(in srgb,var(--danger) 12%,transparent);color:var(--danger);font-size:13.5px}
.kg-takvim{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.kg-takvim li{display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px;font-size:13px;line-height:18px;color:var(--dim)}
.kg-takvim b{color:var(--text)}
.kg-takvim .kg-gecti{opacity:.55}
.kg-yuzler{display:flex;flex-wrap:wrap;gap:4px}

/* ---------- Teslim kartları ---------- */
.kg-bolum{display:flex;flex-direction:column;gap:12px;scroll-margin-top:100px}
.kg-bolum>.tk-soluk{margin:0;font-size:14px;line-height:20px}
.kg-teslimler{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.kg-teslim{display:flex;flex-direction:column;gap:10px;padding:12px;min-width:0}
.kg-elendi{opacity:.55}
.kg-teslim-gorseller{display:grid;grid-template-columns:2fr 1fr;grid-auto-rows:minmax(0,auto);gap:6px}
.kg-teslim-gorseller .kg-gorsel:first-child{grid-row:span 2}
.kg-benim .kg-teslim-gorseller{grid-template-columns:repeat(3,minmax(0,1fr))}
.kg-benim .kg-teslim-gorseller .kg-gorsel:first-child{grid-row:auto}
.kg-gorsel{position:relative;display:block;padding:0;border:0;border-radius:10px;overflow:hidden;background:var(--surface-2);cursor:zoom-in;aspect-ratio:4/3;min-width:0}
.kg-teslim-gorseller .kg-gorsel:first-child:not(:only-child){aspect-ratio:auto}
.kg-gorsel img{width:100%;height:100%;object-fit:cover;display:block}
.kg-gorsel small{position:absolute;left:6px;bottom:6px;padding:2px 7px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font-size:10.5px;font-weight:700}
.kg-teslim-alt{display:flex;align-items:center;gap:10px;min-width:0}
.kg-teslim-kim{flex:1;min-width:0;display:flex;flex-direction:column}
.kg-teslim-kim a{color:var(--text)}
.kg-teslim-kim b{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.kg-teslim-kim small{font-size:12px;color:var(--faint)}
.kg-teslim-aciklama,.kg-teslim-ai{margin:0;font-size:13px;line-height:19px;color:var(--dim);overflow-wrap:anywhere}
.kg-teslim-ai b{color:var(--text)}
.kg-buyuk img{display:block;max-width:100%;max-height:78vh;margin:0 auto;border-radius:12px}

/* ---------- Sonuç ---------- */
.kg-kazanan{display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr);gap:18px;align-items:center}
.kg-kazanan h4{margin:0 0 4px;font-size:20px}
.kg-kazanan h4 a{color:var(--text)}
.kg-kazanan p{margin:0 0 6px;font-size:14px;color:var(--dim)}
.kg-kredi{font-size:24px!important;font-weight:800;color:var(--accent-text)!important}
.kg-sira-kart{padding:0;overflow-x:auto}
.kg-sira{width:100%;border-collapse:collapse;font-size:14px}
.kg-sira th,.kg-sira td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.kg-sira th{font-size:12px;font-weight:700;color:var(--faint)}
.kg-sira tr:last-child td{border-bottom:0}
.kg-sira td a{color:var(--text);font-weight:700}
.kg-sira td small{display:block;font-size:12px;color:var(--faint)}
.kg-diger td{color:var(--faint)}
.kg-tum summary{list-style:none;width:max-content}
.kg-tum summary::-webkit-details-marker{display:none}
.kg-tum[open] summary{margin-bottom:12px}
.kg-gecmis{list-style:none;margin:0;padding:0}
.kg-gecmis li{display:grid;grid-template-columns:150px minmax(0,1fr) auto;gap:12px;align-items:center;padding:12px 16px;border-bottom:1px solid var(--line);font-size:14px}
.kg-gecmis li:last-child{border-bottom:0}
.kg-gecmis .kg-ust{margin:0}
.kg-gecmis span:last-child{color:var(--dim);font-size:13px}

/* ---------- Akış yan kartları ---------- */
.kg-yan-gorev .tk-yan-bas h3,.tk-yan-kart .tk-yan-bas h3{display:flex;align-items:center;gap:6px}
.kg-yan-baslik{margin:0;font-size:15px;font-weight:800;line-height:21px;color:var(--text)}
.kg-yan-sayi{margin:0;font-size:12.5px;color:var(--faint)}
.kg-yan-alt{display:flex;flex-direction:column;gap:6px;padding-top:12px;border-top:1px solid var(--line)}
.kg-yan-alt p{margin:0;font-size:13px;color:var(--dim)}
.kp-orta{margin:0;display:flex;align-items:baseline;gap:8px}
.kp-orta b{font-size:24px}
.kp-orta small{font-size:12px;color:var(--faint)}
.kp-kural{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:4px;font-size:13px;line-height:19px;color:var(--dim)}

/* ---------- Puanlar ---------- */
.kp-ust{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:16px}
.kp-rutbe,.kp-kulup{display:flex;flex-direction:column;gap:10px}
.kp-rutbe h2{margin:0;font-size:22px}
.kp-rutbe-bas{display:flex;align-items:center;gap:14px}
.kp-rutbe-bas b{font-size:14px;color:var(--dim)}
.kp-rozet{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:var(--surface-2);color:var(--faint)}
.kp-rutbeler .kp-rozet{width:30px;height:30px;border-radius:9px}
.kp-r1{color:#b08d57;background:color-mix(in srgb,#b08d57 14%,transparent)}
.kp-r2{color:#9fb3c8;background:color-mix(in srgb,#9fb3c8 16%,transparent)}
.kp-r3{color:var(--accent-text);background:var(--accent-soft)}
.kp-r4{color:var(--mor);background:color-mix(in srgb,var(--mor) 16%,transparent)}
.kp-cubuk{height:8px;border-radius:999px;background:var(--surface-2);overflow:hidden}
.kp-cubuk span{display:block;height:100%;border-radius:inherit;background:var(--accent)}
.kp-rutbe p,.kp-kulup p{margin:0;font-size:13.5px;line-height:19px}
.kp-ay{color:var(--dim)}
.kp-buyuk{font-size:36px!important;font-weight:800;line-height:1!important;color:var(--text)}
.kp-esik-cubuk{position:relative;height:10px;border-radius:999px;background:var(--surface-2);margin:4px 0}
.kp-esik-cubuk span{position:absolute;left:0;top:0;bottom:0;border-radius:inherit;background:linear-gradient(90deg,var(--accent),#ff7a3d)}
.kp-esik-cubuk i{position:absolute;top:-3px;bottom:-3px;width:2px;margin-left:-1px;background:var(--text);opacity:.5;border-radius:2px}
.kp-esikler{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.kp-esikler li{display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:10px;align-items:center;font-size:13.5px;color:var(--dim)}
.kp-esikler b{color:var(--text)}
.kp-esikler small{font-size:12px;color:var(--faint)}
.kp-esikler .kp-acik small{color:var(--success);font-weight:700}
.kp-esikler-dar li{grid-template-columns:52px minmax(0,1fr);font-size:12.5px}
.kp-esikler-dar small{grid-column:2}
.kp-izgara{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.kp-tablo{padding:0;overflow:hidden}
.kp-tablo .kg-kart-bas{padding:18px 20px 6px}
.kp-tablo .tk-sinif-not{padding:12px 20px 18px;margin:0}
.kp-p{font-weight:800;color:var(--accent-text);white-space:nowrap}
.kp-yan{display:flex;flex-direction:column;gap:16px;min-width:0}
.kp-lider,.kp-rutbeler{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.kp-lider li{display:flex;align-items:center;gap:10px;padding:4px 6px;border-radius:10px;min-width:0}
.kp-lider .tk-ayni-ad{flex:1}
.kp-no{width:18px;font-size:12px;font-weight:800;color:var(--faint);text-align:center}
.kp-ben{background:var(--accent-soft)}
.kp-rutbeler li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;padding:4px 6px;border-radius:10px;font-size:13.5px}
.kp-rutbeler small{font-size:12px;color:var(--faint)}

/* ---------- Dar ekran ---------- */
@media (max-width:1100px){
	.kg-izgara,.kp-izgara{grid-template-columns:minmax(0,1fr)}
	.kg-yan,.kp-yan{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
}
@media (max-width:760px){
	.kg-adimlar{grid-template-columns:repeat(2,minmax(0,1fr))}
	.kg-ozellik{grid-template-columns:repeat(2,minmax(0,1fr))}
	.kg-yukleme{grid-template-columns:minmax(0,1fr)}
	.kg-slot{flex-direction:row;align-items:center}
	.kg-slot-on{width:96px;flex:none}
	.kp-ust{grid-template-columns:minmax(0,1fr)}
	.kg-kazanan{grid-template-columns:minmax(0,1fr)}
	.kg-gecmis li{grid-template-columns:minmax(0,1fr);gap:2px}
	.kg-bekle{flex-direction:column}
	.kg-sira th,.kg-sira td{padding:10px 12px}
}
@media (max-width:480px){
	.kg-adim{padding:10px}
	.kg-adim small:last-child{display:none}
	.kg-teslimler{grid-template-columns:minmax(0,1fr)}
}