/* =====================================================================
   KATEGORI SAYFALARI > DEGERLENDIRMELER (yeni tasarim, Plan ed6af7ce, 03.11.2026)
   Kaynak: tasarim-uygulama/handoff_kategori_degerlendirmeler (koyu masaustu 1440, acik tema, mobil 390).
   Iki yuzey: ana kategori sayfasindaki #degerlendirmeler blogu (game-category-list) ve alt kategori
   sayfasindaki Degerlendirmeler sekmesinin ici (product-list). Dil ve token'lar urun detaydan paylasilir
   (K1/K2/K12): urun-degerlendirme.css (.ud* siniflari, --ud* token'lari) once yuklenir, bu dosya yalniz
   kategoriye ozgu parcalari ekler (.kd*). comments.css bu iki yuzeyde artik kullanilmaz.
   ===================================================================== */
.kdKok { --kdIc: #272834; --kdCubuk: #111117; --kdGolge: none; gap: 18px; scroll-margin-top: calc(var(--hdrPay, 0px) + 96px); }
body.light .kdKok { --kdIc: #F5F4EE; --kdCubuk: #ECEAE3; --kdGolge: 0 1px 2px rgba(31,30,29,.05); }
/* Mobil header sabit (.headerMobile 111px) ve --hdrPay orada 0: capa payi header + 14px. */
@media (max-width: 1099.98px) { .kdKok { scroll-margin-top: 125px; } }
.kdKok h2.kdBaslik { margin: 0; }
.kdSekme { padding: 8px; }
.kdEtiket { font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--udMetin3); }

/* ---- Ust: ozet | paketlere gore (K3) --------------------------------------- */
.kdUst { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 14px; align-items: stretch; }
.kdUst.tek { grid-template-columns: minmax(0, 1fr); }

/* Ozet karti */
.kdOzet {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px 10px; align-items: center;
    padding: 16px 18px; border-radius: 14px; background: var(--udKart); border: 1px solid var(--udKenar); box-shadow: var(--kdGolge);
}
.kdOzetEtiket { grid-column: 1; grid-row: 1; }
.kdOzet .kdKriter { grid-column: 2; grid-row: 1; justify-self: end; }
.kdOzetGovde { grid-column: 1 / -1; grid-row: 2; display: flex; align-items: center; gap: 24px; min-width: 0; }
.kdPuan { flex: none; min-width: 132px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.kdPuanSayi { font-size: 44px; font-weight: 800; line-height: 1; color: var(--udMetin0); font-variant-numeric: tabular-nums; }
.kdPuanAlt { font-size: 12.5px; color: var(--udMetin2); }
.kdDagilim { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.kdKok .udDagRow { grid-template-columns: 26px minmax(0, 1fr) 28px; font-size: 12px; }
.kdKok .udDagCubuk { background: var(--kdCubuk); }

/* Kriter (K9): tooltip urun detaydaki ile ayni (.udTip/.udTt), dugme altsiz, ikon accent */
.kdKok .udKriterDugme { text-decoration: none; min-height: 28px; padding: 0; font-size: 12px; }
.kdKok .udKriterDugme svg { color: var(--udAcc); }
.kdKok .udTt { width: 260px; font-weight: 600; color: var(--udMetin1); }
.kdKok .udTt a { display: inline; margin: 0; }

/* Paket kartlari: kaydirmali serit (ikinci handoff "Paketlere gore kaydirmali serit", 03.11): baslik satiri
   "PAKETLERE GORE (N)" + < > oklar; masaustunde ayni anda 2 kart (calc((100% - 10px) / 2)), mobilde 1 kart + yarim
   ipucu; scroll-snap; fareyle surukleme (js). Tasma yoksa oklar gizli (JS hidden), imlec normal. */
.kdSag { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.kdPaketler { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: 8px; }
.kdPaketBas { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-height: 28px; }
.kdPaketBas .kdEtiket span { letter-spacing: 0; font-variant-numeric: tabular-nums; }
.kdPaketOklar { display: flex; gap: 6px; }
.kdPaketOk {
    width: 28px; height: 28px; padding: 0; border-radius: 50%; border: 1px solid var(--udKenar); background: var(--udKart); color: var(--udMetin1);
    display: flex; align-items: center; justify-content: center; cursor: pointer; transition: opacity .15s, border-color .15s;
}
.kdPaketOk:hover:not(:disabled) { border-color: var(--udKenar3); color: var(--udMetin0); }
.kdPaketOk:disabled { opacity: .35; cursor: default; }
.kdPaketSerit {
    flex: 1; display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; -ms-overflow-style: none;
    cursor: default; -webkit-overflow-scrolling: touch;
}
.kdPaketSerit::-webkit-scrollbar { display: none; }
.kdPaketSerit.kayar { cursor: grab; }
.kdPaketSerit.surukleniyor { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; }
.kdPaketSerit.surukleniyor a { pointer-events: none; }
.kdKok a.kdPaket {
    flex: 0 0 calc((100% - 10px) / 2); min-width: 0; display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border-radius: 12px;
    background: var(--udKart); border: 1px solid var(--udKenar); box-shadow: var(--kdGolge); color: inherit; text-decoration: none; transition: border-color .16s;
    scroll-snap-align: start; user-select: none; -webkit-user-drag: none;
}
.kdKok a.kdPaket:hover { border-color: var(--udKenar3); color: inherit; text-decoration: none; }
.kdPaketAd { font-size: 13.5px; font-weight: 800; line-height: 1.35; color: var(--udMetin0); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 36px; }
.kdPaketPuan { display: flex; align-items: center; gap: 8px; }
.kdPaketPuan b { font-size: 18px; font-weight: 800; line-height: 1; color: var(--udMetin0); font-variant-numeric: tabular-nums; }
.kdPaketAlt { display: flex; align-items: center; justify-content: space-between; gap: 4px 8px; flex-wrap: wrap; margin-top: auto; }
.kdPaketAdet { font-size: 12px; color: var(--udMetin3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.kdPaketGor { display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 800; color: var(--udAcc); white-space: nowrap; }
.kdKok a.kdTumu { align-self: flex-start; min-height: 32px; display: inline-flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 800; color: var(--udAcc); text-decoration: underline; text-underline-offset: 3px; }

/* ---- Liste (K6/K8/K11) ------------------------------------------------------- */
.kdKok .udListe { gap: 10px; }
.kdKok .udListeBaslik { font-size: 17px; }
.kdKok .udListeBaslik span { font-weight: 700; color: var(--udMetin3); font-variant-numeric: tabular-nums; }
.kdKartlar { display: flex; flex-direction: column; gap: 10px; }
.kdKok .udKart { padding: 16px 18px; border-radius: 12px; background: var(--udKart); border: 1px solid var(--udKenar); box-shadow: var(--kdGolge); }
.kdKok .udKart + .udKart { border-top: 1px solid var(--udKenar); }
.kdKok .udAvatar { background: var(--kdIc); }
.kdKok .udKartGovde { gap: 6px; }
.kdKim { min-width: 0; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.kdKim b { font-size: 13.5px; font-weight: 800; color: var(--udMetin0); }
.kdKimAlt { display: inline-flex; align-items: center; gap: 8px; }
.kdKok a.kdYorumPaket { align-self: flex-start; min-height: 22px; display: inline-flex; align-items: center; gap: 3px; font-size: 12px; font-weight: 600; color: var(--udMetin3); text-decoration: none; }
.kdKok a.kdYorumPaket .kdYorumPaketAd { color: var(--udMetin2); }
.kdKok a.kdYorumPaket:hover { color: var(--udMetin3); text-decoration: none; }
.kdKok a.kdYorumPaket:hover .kdYorumPaketAd { color: var(--udMetin0); }
.kdKok .udAlt .udBtnCizgi { min-height: 40px; }

/* Bos hal: metinli yorum yok, yalniz yildiz (K8) */
.kdBos { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 28px 16px; border-radius: 12px; background: var(--udKart); border: 1px dashed var(--udKenar3); text-align: center; color: var(--udMetin3); }
.kdBos svg { display: block; }
.kdBos b { font-size: 14.5px; font-weight: 800; color: var(--udMetin1); }
.kdBos span { font-size: 12.5px; }

/* ---- Mobil (K10) ------------------------------------------------------------- */
@media (max-width: 767.98px) {
    .kdKok { gap: 14px; }
    .kdSekme { padding: 4px 2px; }
    .kdUst { grid-template-columns: minmax(0, 1fr); }
    .kdOzet { padding: 14px; grid-template-columns: minmax(0, 1fr); }
    .kdOzet .kdKriter { grid-column: 1; grid-row: 3; justify-self: start; }
    .kdOzetGovde { grid-row: 2; gap: 16px; }
    .kdPuan { min-width: 0; align-items: flex-start; }
    .kdPuanSayi { font-size: 36px; }
    .kdKok .udKriterDugme { min-height: 36px; }
    .kdKok .udTt { left: 0; right: auto; }
    .kdPaketler { flex: none; }
    .kdPaketOk { width: 36px; height: 36px; }
    .kdPaketSerit { flex: none; margin: 0 -12px; padding: 0 12px 2px; scroll-padding-left: 12px; }
    .kdKok a.kdPaket { flex: 0 0 82%; }
    .kdKok a.kdTumu { min-height: 40px; }
    .kdKok .udListeBaslik { font-size: 16px; }
    .kdKok .udAlt .udBtnCizgi { width: 100%; min-height: 44px; }
    .kdKok .udKart { padding: 14px 12px; }
    .kdKim { flex-direction: column; align-items: flex-start; gap: 2px; }
    .kdKok a.kdYorumPaket { min-height: 32px; }
}