.cs2-sayfa {
    --cs2-sari: #ffc629;
    --cs2-sari-yazi: #1f1a05;
    --cs2-kart-bg: linear-gradient(180deg, #f4f6fa 0%, #ffffff 100%);
    --cs2-gorsel-bg: #eef1f6;
    --cs2-fn: #2e9e4d;
    --cs2-mw: #5cb85c;
    --cs2-ft: #f0a53a;
    --cs2-ww: #e0463c;
    --cs2-bs: #a9262e;
    --cs2-float-bant: linear-gradient(90deg, #2e9e4d 0 7%, #8bc34a 7% 15%, #f5b82e 15% 38%, #f07b3f 38% 45%, #c9343d 45% 100%);
    --cs2-oto: #15803d;
    --cs2-oto-bg: rgba(22, 163, 74, .12);
    padding: 14px 16px 48px;
    color: var(--text-primary);
}

[data-theme="dark"] .cs2-sayfa {
    --cs2-kart-bg: linear-gradient(180deg, #1c2536 0%, #151d2c 100%);
    --cs2-gorsel-bg: #111827;
    --cs2-oto: #4ade80;
    --cs2-oto-bg: rgba(74, 222, 128, .14);
}

.cs2-sayfa [hidden], .cs2-pencere[hidden] { display: none !important; }
.cs2-sayfa a { text-decoration: none; }

.cs2-ust { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.cs2-ust-sol { min-width: 0; }
.cs2-ust-sag { display: flex; gap: 8px; flex-wrap: wrap; }
.cs2-h1 { margin: 6px 0 0; font-size: var(--biger-font-size); font-weight: var(--font-weight-bold); color: var(--text-primary); display: flex; align-items: center; gap: 10px; }
.cs2-h1 i { color: var(--primary-color); font-size: .9em; }

.cs2-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    height: 40px; padding: 0 16px; border-radius: 10px; border: 1px solid transparent;
    font-family: inherit; font-size: 14px; font-weight: var(--font-weight-semibold); line-height: 1;
    cursor: pointer; white-space: nowrap; text-decoration: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .1s ease, opacity .15s ease;
}
.cs2-btn:active { transform: translateY(1px); }
.cs2-btn[disabled] { opacity: .5; cursor: not-allowed; }
.cs2-btn-sari { background: var(--primary-color); color: #fff; }
.cs2-btn-sari:hover { background: var(--primary-hover, var(--primary-color)); color: #fff; }
.cs2-btn-ikincil { background: var(--bg-secondary); color: var(--text-primary); border-color: var(--border-color); }
.cs2-btn-ikincil:hover { border-color: var(--primary-color); color: var(--primary-color); }
.cs2-btn-koyu { background: var(--bg-tertiary); color: var(--text-primary); border-color: var(--border-color); }
.cs2-btn-koyu:hover, .cs2-btn-koyu.active { color: var(--danger-color); border-color: var(--danger-color); }
.cs2-btn-yesil { background: var(--success-color); color: #fff; }
.cs2-btn-yesil:hover { filter: brightness(.95); color: #fff; }
.cs2-btn-mavi { background: var(--secondary-color); color: #fff; }
.cs2-btn-mavi:hover { filter: brightness(.95); color: #fff; }
.cs2-btn-steam { background: #171a21; color: #fff; border-color: #2a475e; }
.cs2-btn-steam:hover { background: #2a475e; color: #fff; }
.cs2-btn-ince { height: 34px; padding: 0 12px; font-size: 13px; background: transparent; color: var(--text-primary); border-color: var(--border-color); }
.cs2-btn-ince:hover { border-color: var(--primary-color); color: var(--primary-color); }
.cs2-btn-buyuk { height: 48px; padding: 0 22px; font-size: 15px; }
.cs2-btn-tam { width: 100%; }

.cs2-girdi, .cs2-secim {
    width: 100%; height: 40px; border-radius: 10px; border: 1px solid var(--border-color);
    background: var(--bg-primary); color: var(--text-primary); padding: 0 12px; font-size: 14px; font-family: inherit;
}
.cs2-girdi:focus, .cs2-secim:focus { outline: none; border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .15); }
.cs2-girdi::placeholder { color: var(--text-muted); }
.cs2-secim {
    width: auto; appearance: none; cursor: pointer; padding-right: 34px; background-color: var(--bg-secondary);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M2 4l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 12px center;
}
.cs2-secim-dar { min-width: 76px; }

.cs2-pazar { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 20px; align-items: start; }
.cs2-ana { min-width: 0; display: flex; flex-direction: column; gap: 14px; }

.cs2-filtre {
    background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 14px;
    box-shadow: var(--shadow-md);
}
.cs2-filtre::-webkit-scrollbar { width: 6px; }
.cs2-filtre::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 3px; }
.cs2-filtre-bas { display: none; align-items: center; justify-content: space-between; padding: 14px 18px; border-bottom: 1px solid var(--border-color); font-weight: var(--font-weight-bold); }
.cs2-filtre-bas i { color: var(--primary-color); }
.cs2-filtre-kapat { background: none; border: 0; color: var(--text-secondary); font-size: 20px; cursor: pointer; }
.cs2-fgrp { padding: 16px 18px; border-bottom: 1px solid var(--border-color); }
.cs2-fgrp-son { border-bottom: 0; display: flex; flex-direction: column; gap: 10px; align-items: stretch; text-align: center; }
.cs2-fbaslik { font-size: 15px; font-weight: var(--font-weight-bold); color: var(--text-primary); margin-bottom: 12px; }

.cs2-secili-liste { display: flex; flex-wrap: wrap; gap: 6px; }
.cs2-secili-rozet {
    display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px; border-radius: 999px;
    background: rgba(var(--primary-rgb), .1); color: var(--primary-color); font-size: 12.5px; font-weight: var(--font-weight-semibold);
    border: 1px solid rgba(var(--primary-rgb), .25);
}
.cs2-secili-rozet:hover { background: rgba(var(--primary-rgb), .18); }
.cs2-secili-rozet .fa-xmark { font-size: 11px; opacity: .8; }
.cs2-temizle { display: inline-block; margin-top: 10px; font-size: 13px; color: var(--text-secondary); }
.cs2-temizle:hover { color: var(--primary-color); text-decoration: underline; }
.cs2-renk-nokta { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--cs2-nr); }

.cs2-aralik-deger { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 12px; font-size: 13px; color: var(--text-secondary); }
.cs2-aralik-deger label { display: flex; align-items: center; gap: 4px; min-width: 0; white-space: nowrap; }
.cs2-aralik-deger input {
    flex: 1; width: 100%; min-width: 0; height: 28px; padding: 0 6px; border-radius: 6px; border: 1px solid var(--border-color);
    background: var(--bg-primary); color: var(--text-primary); font-size: 13px; font-family: inherit; -moz-appearance: textfield;
}
.cs2-aralik-deger input::-webkit-outer-spin-button, .cs2-aralik-deger input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.cs2-surgu { position: relative; height: 22px; }
.cs2-surgu-iz { position: absolute; left: 0; right: 0; top: 8px; height: 6px; border-radius: 3px; background: var(--bg-tertiary); overflow: hidden; }
.cs2-surgu-dolu { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background: var(--primary-color); }
.cs2-float-bant { background: var(--cs2-float-bant); }
.cs2-float-bant .cs2-surgu-dolu { background: transparent; box-shadow: 0 0 0 999px rgba(var(--bg-primary-rgb), .55); }
.cs2-surgu input[type=range] {
    position: absolute; left: 0; top: 0; width: 100%; height: 22px; margin: 0; background: none;
    pointer-events: none; -webkit-appearance: none; appearance: none;
}
.cs2-surgu input[type=range]::-webkit-slider-runnable-track { background: none; height: 22px; }
.cs2-surgu input[type=range]::-moz-range-track { background: none; height: 22px; }
.cs2-surgu input[type=range]::-webkit-slider-thumb {
    pointer-events: auto; -webkit-appearance: none; width: 18px; height: 18px; margin-top: 2px; border-radius: 50%;
    background: #fff; border: 3px solid var(--primary-color); box-shadow: var(--shadow-sm); cursor: grab;
}
.cs2-surgu input[type=range]::-moz-range-thumb {
    pointer-events: auto; width: 14px; height: 14px; border-radius: 50%;
    background: #fff; border: 3px solid var(--primary-color); box-shadow: var(--shadow-sm); cursor: grab;
}
.cs2-float-kisayol { display: flex; gap: 6px; margin-top: 10px; }
.cs2-float-kisayol .cs2-dis { flex: 1; cursor: pointer; border: 0; height: 24px; font-family: inherit; }
.cs2-float-kisayol .cs2-dis:hover { filter: brightness(1.1); }

.cs2-liste-ara { height: 34px; margin-bottom: 8px; font-size: 13px; }
.cs2-secenekler { display: flex; flex-direction: column; gap: 1px; max-height: 250px; overflow-y: auto; margin: 0 -6px; padding: 0 6px; }
.cs2-secenekler::-webkit-scrollbar { width: 6px; }
.cs2-secenekler::-webkit-scrollbar-thumb { background: var(--border-color); border-radius: 3px; }
.cs2-secenek { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 8px; cursor: pointer; font-size: 14px; color: var(--text-secondary); }
.cs2-secenek:hover { background: var(--bg-tertiary); color: var(--text-primary); }
.cs2-secenek input { width: 16px; height: 16px; accent-color: var(--primary-color); flex: 0 0 auto; cursor: pointer; }
.cs2-secenek span { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs2-secenek em { font-style: normal; color: var(--text-muted); font-size: 12px; font-variant-numeric: tabular-nums; }
.cs2-secenek:has(input:checked) { background: rgba(var(--primary-rgb), .1); color: var(--text-primary); font-weight: var(--font-weight-medium); }
.cs2-bos { opacity: .45; }

.cs2-renkler { display: flex; flex-wrap: wrap; gap: 10px; }
.cs2-renk { position: relative; cursor: pointer; }
.cs2-renk input { position: absolute; opacity: 0; pointer-events: none; }
.cs2-renk i { display: block; width: 26px; height: 26px; border-radius: 50%; background: var(--cs2-nr); border: 2px solid var(--bg-primary); box-shadow: 0 0 0 1px var(--border-color); }
.cs2-renk-hepsi i { background: conic-gradient(#b0c3d9, #5e98d9, #4b69ff, #8847ff, #d32ce6, #eb4b4b, #b0c3d9); }
.cs2-renk input:checked + i { box-shadow: 0 0 0 2px var(--primary-color); }
.cs2-renk input:focus-visible + i { box-shadow: 0 0 0 3px rgba(var(--primary-rgb), .5); }

.cs2-serit {
    display: flex; align-items: stretch; flex-wrap: wrap; gap: 2px; padding: 4px 8px; position: relative; z-index: 30;
    background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 14px; box-shadow: var(--shadow-md);
}
.cs2-serit-grup { position: relative; }
.cs2-serit-dugme {
    display: flex; align-items: center; gap: 6px; height: 46px; padding: 0 12px; background: none; border: 0;
    color: var(--text-primary); font-family: inherit; font-size: 15px; font-weight: var(--font-weight-bold); cursor: pointer; border-radius: 10px;
}
.cs2-serit-dugme i { font-size: 10px; color: var(--text-muted); transition: transform .15s ease; }
.cs2-serit-grup.aktif .cs2-serit-dugme { color: var(--primary-color); }
.cs2-serit-grup:hover .cs2-serit-dugme, .cs2-serit-grup.acik .cs2-serit-dugme { background: var(--bg-tertiary); }
.cs2-serit-grup.acik .cs2-serit-dugme i { transform: rotate(180deg); }
.cs2-serit-menu {
    display: none; position: absolute; top: calc(100% + 4px); left: 0; z-index: 50; width: 460px; max-height: 420px; overflow-y: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; padding: 10px;
    background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 12px; box-shadow: var(--shadow-xl);
}
.cs2-serit-grup.acik .cs2-serit-menu { display: grid; }
@media (hover: hover) and (min-width: 993px) {
    .cs2-serit-grup:hover .cs2-serit-menu { display: grid; }
    .cs2-serit-grup:hover .cs2-serit-dugme i { transform: rotate(180deg); }
    .cs2-serit-grup:hover .cs2-serit-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -8px; height: 8px; }
}
.cs2-serit-grup:nth-last-child(-n+2) .cs2-serit-menu { left: auto; right: 0; }
.cs2-serit-oge { display: flex; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 8px; color: var(--text-secondary); font-size: 13.5px; font-weight: var(--font-weight-medium); }
.cs2-serit-oge img { width: 48px; height: 36px; object-fit: contain; flex: 0 0 auto; }
.cs2-serit-oge i { width: 48px; text-align: center; color: var(--text-muted); }
.cs2-serit-oge span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs2-serit-oge:hover, .cs2-serit-oge.secili { background: var(--bg-tertiary); color: var(--text-primary); }
.cs2-serit-tumu { grid-column: 1 / -1; justify-content: center; font-weight: var(--font-weight-bold); color: var(--primary-color); border: 1px dashed var(--border-color); }

.cs2-arac {
    display: flex; align-items: center; gap: 18px; flex-wrap: wrap; padding: 10px 14px;
    background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 14px; box-shadow: var(--shadow-md);
}
.cs2-arac-sag { margin-left: auto; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs2-arac-baslik { margin: 0; font-size: 16px; font-weight: var(--font-weight-bold); }
.cs2-filtre-ac { display: none; }
.cs2-sonuc-say { color: var(--text-secondary); font-size: 13.5px; }
.cs2-sonuc-say b { color: var(--text-primary); }
.cs2-anahtar { display: inline-flex; align-items: center; gap: 10px; color: var(--text-primary); font-size: 14.5px; font-weight: var(--font-weight-semibold); }
.cs2-anahtar-iz { width: 40px; height: 22px; border-radius: 999px; background: var(--bg-tertiary); border: 1px solid var(--border-color); position: relative; transition: background .2s ease; }
.cs2-anahtar-iz::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: var(--shadow-sm); transition: left .2s ease; }
.cs2-anahtar.acik .cs2-anahtar-iz { background: var(--primary-color); border-color: var(--primary-color); }
.cs2-anahtar.acik .cs2-anahtar-iz::after { left: 20px; }

.cs2-magaza-serit {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 14px; border-radius: 12px;
    background: rgba(var(--primary-rgb), .07); border: 1px solid rgba(var(--primary-rgb), .25); color: var(--text-secondary); font-size: 14px;
}
.cs2-magaza-serit span { display: inline-flex; align-items: center; gap: 8px; }
.cs2-magaza-serit img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.cs2-magaza-serit a { color: var(--primary-color); font-weight: var(--font-weight-semibold); }
.cs2-onayli { color: var(--success-color); font-size: 13px; }

.cs2-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(206px, 1fr)); gap: 12px; }

.cs2-kart {
    position: relative; display: flex; flex-direction: column; min-width: 0; overflow: hidden;
    background: var(--cs2-kart-bg); border: 1px solid var(--border-color); border-radius: 12px;
    color: var(--text-primary); box-shadow: var(--shadow-sm);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.cs2-kart::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--cs2-nr, transparent); opacity: .85; }
.cs2-kart-hizli::after, .cs2-kart-oto::after { display: none; }
.cs2-kart:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); border-color: var(--cs2-nr, var(--primary-color)); color: var(--text-primary); }
.cs2-kart-ust { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 10px 0; min-height: 30px; }
.cs2-nadirlik { display: inline-flex; align-items: center; gap: 5px; min-width: 0; font-size: 11.5px; font-weight: var(--font-weight-semibold); color: var(--cs2-nr, var(--text-muted)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cs2-nadirlik::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: 0 0 auto; }
.cs2-nadirlik:empty::before { display: none; }
.cs2-dis {
    display: inline-flex; align-items: center; justify-content: center; min-width: 30px; height: 20px; padding: 0 6px; border-radius: 4px;
    font-size: 11px; font-weight: 800; letter-spacing: .02em; color: #fff; background: var(--text-muted); flex: 0 0 auto;
}
.cs2-dis-FN { background: var(--cs2-fn); }
.cs2-dis-MW { background: var(--cs2-mw); }
.cs2-dis-FT { background: var(--cs2-ft); }
.cs2-dis-WW { background: var(--cs2-ww); }
.cs2-dis-BS { background: var(--cs2-bs); }
.cs2-kart-gorsel {
    position: relative; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; padding: 6px 12px;
    background: radial-gradient(ellipse at 50% 70%, rgba(var(--primary-rgb), .06), transparent 70%);
}
.cs2-kart-gorsel img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .25)); transition: transform .25s ease; }
.cs2-kart:hover .cs2-kart-gorsel img { transform: scale(1.05); }
.cs2-cikartmalar { position: absolute; left: 10px; bottom: 4px; display: flex; gap: 3px; }
.cs2-cikartmalar img {
    width: 30px; height: 22px; object-fit: contain; filter: none; padding: 1px; border-radius: 4px;
    background: rgba(var(--bg-primary-rgb), .75); border: 1px solid var(--border-color);
}
.cs2-kart:hover .cs2-cikartmalar img { transform: none; }
.cs2-firsat-satir { display: block; margin-top: 4px; font-size: 13px; font-weight: var(--font-weight-semibold); color: #2fbf71; }
.cs2-faz { position: absolute; top: 4px; left: 8px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; line-height: 1.5; color: #fff; background: linear-gradient(135deg, #7b2ff7, #1fa2ff); white-space: nowrap; }
.cs2-firsat { position: absolute; top: 4px; right: 8px; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; line-height: 1.5; color: #0f5132; background: #75e0a1; white-space: nowrap; }
.cs2-kart-govde { display: flex; flex-direction: column; padding: 8px 12px 12px; flex: 1; min-width: 0; }
.cs2-st, .cs2-sv {
    align-self: flex-start; display: inline-block; padding: 2px 5px; margin-bottom: 3px; border-radius: 3px;
    font-size: 10.5px; font-weight: 800; line-height: 1.2; color: var(--cs2-sari-yazi); background: var(--cs2-sari);
}
.cs2-sv { background: #ffb300; }
.cs2-silah { font-size: 12.5px; font-weight: var(--font-weight-bold); color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs2-kaplama { font-size: 15px; font-weight: var(--font-weight-medium); color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top: 1px; }
.cs2-float { position: relative; height: 4px; border-radius: 2px; margin: 9px 0 3px; background: var(--cs2-float-bant); }
.cs2-float-imlec { position: absolute; top: -6px; width: 0; height: 0; transform: translateX(-50%); border-left: 4px solid transparent; border-right: 4px solid transparent; border-top: 6px solid var(--text-primary); }
.cs2-float-deger { font-size: 11px; color: var(--text-muted); font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs2-float-bos { display: block; height: 20px; }
.cs2-fiyat { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; margin-top: 6px; }
.cs2-fiyat-simdi { font-weight: 800; color: var(--text-primary); font-variant-numeric: tabular-nums; letter-spacing: -.02em; white-space: nowrap; }
.cs2-fiyat-simdi span { font-size: 21px; }
.cs2-fiyat-simdi sup { font-size: 11px; font-weight: 700; margin-left: 1px; top: -.7em; }
.cs2-fiyat-eski { font-size: 12px; color: var(--text-muted); }
.cs2-indirim { font-style: normal; font-size: 11.5px; font-weight: 800; color: #0f5132; background: #75e0a1; padding: 1px 7px; border-radius: 999px; margin-left: auto; }
.cs2-hizli-serit { display: flex; align-items: center; justify-content: center; gap: 6px; height: 28px; background: var(--cs2-sari); color: var(--cs2-sari-yazi); font-size: 13px; font-weight: var(--font-weight-semibold); }
.cs2-oto-serit { display: flex; align-items: center; justify-content: center; gap: 6px; height: 28px; background: var(--cs2-oto-bg); color: var(--cs2-oto); border-top: 1px solid rgba(22, 163, 74, .22); font-size: 13px; font-weight: var(--font-weight-semibold); }

.cs2-bos-sonuc {
    text-align: center; padding: 56px 24px; background: var(--bg-primary); border: 1px solid var(--border-color);
    border-radius: 14px; box-shadow: var(--shadow-sm);
}
.cs2-bos-sonuc > i { font-size: 40px; color: var(--text-muted); opacity: .6; }
.cs2-bos-sonuc h2, .cs2-bos-sonuc .cs2-h1 { justify-content: center; margin: 16px 0 6px; font-size: 19px; font-weight: var(--font-weight-bold); color: var(--text-primary); }
.cs2-bos-sonuc p { color: var(--text-secondary); font-size: 14px; margin: 0 auto 18px; max-width: 520px; }
.cs2-bos-sonuc .cs2-btn { margin: 0 4px; }

.cs2-sayfalama { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.cs2-sayfalama a, .cs2-sayfalama span {
    min-width: 42px; height: 42px; display: grid; place-items: center; padding: 0 12px;
    background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 10px;
    color: var(--text-secondary); font-size: 14px; font-weight: var(--font-weight-semibold); font-variant-numeric: tabular-nums;
}
.cs2-sayfalama a:hover { border-color: var(--primary-color); color: var(--primary-color); }
.cs2-sayfalama .cs2-aktif { background: var(--primary-color); border-color: var(--primary-color); color: #fff; }

.cs2-alt-icerik { grid-column: 2 / -1; margin: 10px 0 0; }

.cs2-kutu { background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 14px; box-shadow: var(--shadow-md); padding: 18px 20px; }
.cs2-kutu-baslik { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.cs2-kutu-baslik h2 { margin: 0; font-size: 17px; font-weight: var(--font-weight-bold); color: var(--text-primary); }
.cs2-donemler { display: flex; gap: 8px; flex-wrap: wrap; }
.cs2-donemler label {
    display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 10px; cursor: pointer;
    border: 1px solid var(--border-color); color: var(--text-secondary); font-size: 14px; font-weight: var(--font-weight-semibold);
}
.cs2-donemler input { accent-color: var(--primary-color); }
.cs2-donemler label:has(input:checked) { border-color: var(--primary-color); color: var(--text-primary); background: rgba(var(--primary-rgb), .07); }
.cs2-grafik { position: relative; height: 260px; }
.cs2-grafik-bos { margin: 0; padding: 26px 16px; text-align: center; color: var(--text-muted); font-size: 14px; border: 1px dashed var(--border-color); border-radius: 12px; }
.cs2-satis-gecmisi { margin-top: 16px; }
.cs2-satis-gecmisi .cs2-kutu-baslik small { color: var(--text-muted); font-size: 13px; }
.cs2-sg-donemler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.cs2-sg-donem { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--border-color); border-radius: 10px; background: var(--bg-secondary); }
.cs2-sg-donem span { font-size: 12px; color: var(--text-secondary); }
.cs2-sg-donem b { font-size: 16px; color: var(--text-primary); }
.cs2-sg-donem small { font-size: 13px; color: var(--text-muted); }
.cs2-sg-tablo-kap { overflow-x: auto; }
.cs2-sg-tablo { width: 100%; border-collapse: collapse; font-size: 14px; }
.cs2-sg-tablo th { text-align: left; font-weight: var(--font-weight-semibold); color: var(--text-secondary); font-size: 12px; padding: 6px 8px; border-bottom: 1px solid var(--border-color); }
.cs2-sg-tablo td { padding: 8px; border-bottom: 1px solid var(--border-color); color: var(--text-primary); white-space: nowrap; }
.cs2-sg-tablo tr:last-child td { border-bottom: 0; }
.cs2-sg-fiyat { font-weight: var(--font-weight-semibold); }
@media (max-width: 640px) {
    .cs2-sg-donemler { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.cs2-aciklama { margin: 0; color: var(--text-secondary); line-height: 1.7; font-size: 14px; }

.cs2-tur-kart {
    display: grid; grid-template-columns: minmax(0, 420px) minmax(0, 1fr); gap: 24px; margin-bottom: 18px; padding: 20px;
    background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 16px; box-shadow: var(--shadow-md);
}
.cs2-tur-gorsel, .cs2-detay-gorsel {
    position: relative; display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; border-radius: 14px; overflow: hidden;
    background: radial-gradient(circle at 50% 55%, rgba(var(--primary-rgb), .08), transparent 65%), var(--cs2-gorsel-bg);
    border: 1px solid var(--border-color);
}
.cs2-tur-gorsel::after, .cs2-detay-gorsel::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: var(--cs2-nr); }
.cs2-tur-gorsel img, .cs2-detay-gorsel img { width: 88%; height: 88%; object-fit: contain; filter: drop-shadow(0 10px 18px rgba(0, 0, 0, .3)); }
.cs2-tur-bilgi { min-width: 0; display: flex; flex-direction: column; gap: 12px; }
.cs2-tur-etiketler, .cs2-detay-rozetler { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs2-tur-etiketler .cs2-st, .cs2-tur-etiketler .cs2-sv, .cs2-detay-rozetler .cs2-st, .cs2-detay-rozetler .cs2-sv { margin: 0; }
.cs2-tur-h1, .cs2-detay-h1 { margin: 0; font-size: 24px; line-height: 1.3; font-weight: var(--font-weight-bold); color: var(--text-primary); word-break: break-word; }
.cs2-ozet { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 0 24px; }
.cs2-ozet > div { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--border-color); font-size: 14px; }
.cs2-ozet dt { color: var(--text-secondary); font-weight: var(--font-weight-medium); white-space: nowrap; }
.cs2-ozet dd { margin: 0; text-align: right; color: var(--text-primary); font-weight: var(--font-weight-semibold); min-width: 0; overflow-wrap: anywhere; }
.cs2-ozet dd small { color: var(--text-muted); font-weight: 400; }
.cs2-ozet dd a { color: var(--text-primary); }
.cs2-ozet dd a:hover { color: var(--primary-color); }
.cs2-vurgu { color: var(--primary-color) !important; }
.cs2-tur-dugmeler { display: flex; gap: 8px; flex-wrap: wrap; }
.cs2-kardesler { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; color: var(--text-secondary); }
.cs2-kardes { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px 4px 4px; border-radius: 8px; border: 1px solid var(--border-color); color: var(--text-primary); background: var(--bg-secondary); }
.cs2-kardes b { font-size: 12.5px; font-weight: var(--font-weight-semibold); }
.cs2-kardes:hover { border-color: var(--primary-color); }

.cs2-tur-duzen { grid-template-columns: 260px minmax(0, 1fr); }
.cs2-iki-girdi { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cs2-sekmeler { display: flex; gap: 2px; padding: 3px; border-radius: 10px; border: 1px solid var(--border-color); background: var(--bg-secondary); }
.cs2-sekmeler a { padding: 7px 12px; border-radius: 8px; color: var(--text-secondary); font-size: 13.5px; font-weight: var(--font-weight-semibold); }
.cs2-sekmeler a:hover { color: var(--text-primary); }
.cs2-sekmeler a.aktif { background: var(--bg-primary); color: var(--text-primary); box-shadow: var(--shadow-sm); }

.cs2-satirlar { display: flex; flex-direction: column; gap: 10px; }
.cs2-satir {
    display: grid; grid-template-columns: minmax(170px, 1.4fr) minmax(110px, .8fr) minmax(150px, 1.2fr) auto auto; align-items: center; gap: 16px;
    padding: 14px 18px; background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 14px; box-shadow: var(--shadow-sm);
}
.cs2-satir:hover { border-color: rgba(var(--primary-rgb), .45); }
.cs2-satir-hizli { box-shadow: inset 4px 0 0 var(--cs2-sari), var(--shadow-sm); }
.cs2-satir-satici { display: flex; align-items: center; gap: 12px; min-width: 0; }
.cs2-satir-satici img { width: 44px; height: 44px; border-radius: 10px; object-fit: cover; border: 1px solid var(--border-color); flex: 0 0 auto; }
.cs2-satir-satici > div { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; }
.cs2-satici-ad { color: var(--text-primary); font-weight: var(--font-weight-bold); font-size: 15px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
a.cs2-satici-ad:hover { color: var(--primary-color); }
.cs2-satir-satici small { flex-basis: 100%; color: var(--text-muted); font-size: 12.5px; }
.cs2-satir-fiyat { display: flex; align-items: center; gap: 8px; }
.cs2-satir-fiyat .cs2-fiyat-simdi span { font-size: 19px; }
.cs2-satir-fiyat .cs2-indirim { margin-left: 0; }
.cs2-satir-float { display: grid; grid-template-columns: auto minmax(80px, 1fr); align-items: center; gap: 4px 10px; font-size: 13.5px; font-variant-numeric: tabular-nums; min-width: 0; }
.cs2-satir-float .cs2-float { margin: 0; }
.cs2-cikartmalar-satir { position: static; grid-column: 1 / -1; }
.cs2-sepet-grup { display: inline-flex; }
.cs2-sepet-grup .cs2-btn:first-child { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.cs2-sepet-grup .cs2-hizli-al { border-top-left-radius: 0; border-bottom-left-radius: 0; padding: 0 14px; box-shadow: inset 1px 0 0 rgba(0, 0, 0, .15); filter: brightness(.93); }
.cs2-sepet-grup .cs2-hizli-al:hover { filter: brightness(.85); }

.cs2-uyari { display: flex; align-items: flex-start; gap: 12px; padding: 12px 16px; margin-bottom: 14px; border-radius: 12px; font-size: 14px; line-height: 1.6; border: 1px solid; }
.cs2-uyari > i { margin-top: 3px; flex: 0 0 auto; }
.cs2-uyari a { font-weight: var(--font-weight-semibold); text-decoration: underline; color: inherit; }
.cs2-uyari-bilgi { background: rgba(var(--secondary-rgb), .08); border-color: rgba(var(--secondary-rgb), .3); color: var(--text-primary); }
.cs2-uyari-bilgi > i { color: var(--secondary-color); }
.cs2-uyari-sari { background: rgba(var(--warning-rgb), .1); border-color: rgba(var(--warning-rgb), .4); color: var(--text-primary); }
.cs2-uyari-sari > i { color: var(--warning-color); font-size: 20px; margin-top: 1px; }
.cs2-uyari-kirmizi { background: rgba(var(--danger-rgb), .07); border-color: rgba(var(--danger-rgb), .35); color: var(--danger-color); }
.cs2-uyari-yesil { background: rgba(var(--success-rgb), .08); border-color: rgba(var(--success-rgb), .35); color: var(--text-primary); }
.cs2-uyari-yesil > i { color: var(--success-color); }

.cs2-detay {
    display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 28px; padding: 22px;
    background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 16px; box-shadow: var(--shadow-md);
}
.cs2-detay-sol, .cs2-detay-sag { min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.cs2-cikartmalar-buyuk { left: 14px; bottom: 12px; gap: 6px; }
.cs2-cikartmalar-buyuk img { width: 54px; height: 40px; }
.cs2-detay-float { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: 16px; font-size: 14px; font-weight: var(--font-weight-semibold); }
.cs2-detay-float .cs2-float { margin: 0; height: 6px; border-radius: 3px; }
.cs2-detay-dugmeler { display: flex; gap: 8px; flex-wrap: wrap; }
.cs2-alt-baslik { margin: 4px 0 -6px; font-size: 16px; font-weight: var(--font-weight-bold); color: var(--text-primary); }
.cs2-ozet-detay { grid-template-columns: 1fr; }
.cs2-kod { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; }
.cs2-ozet-cikartma dd { display: flex; flex-direction: column; gap: 2px; }
.cs2-hizli-rozet { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; background: var(--cs2-sari); color: var(--cs2-sari-yazi); font-size: 13.5px; font-weight: var(--font-weight-semibold); }
.cs2-oto-rozet { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 8px; background: var(--cs2-oto-bg); color: var(--cs2-oto); font-size: 13.5px; font-weight: var(--font-weight-semibold); cursor: help; }
.cs2-oto-kucuk { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; color: var(--cs2-oto); font-weight: var(--font-weight-semibold); white-space: nowrap; }
.cs2-detay-altad { color: var(--text-secondary); font-size: 15px; margin-top: -8px; }
.cs2-detay-aciklama { margin: 0; color: var(--text-secondary); font-size: 14px; line-height: 1.7; padding-bottom: 16px; border-bottom: 1px solid var(--border-color); }
.cs2-detay-satin { display: flex; align-items: center; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; padding: 4px 0 16px; border-bottom: 1px solid var(--border-color); }
.cs2-detay-fiyat { display: flex; flex-direction: column; gap: 2px; }
.cs2-detay-fiyat .cs2-indirim { margin-left: 4px; }
.cs2-fiyat-buyuk span { font-size: 32px; }
.cs2-fiyat-buyuk sup { font-size: 15px; }
.cs2-detay-eylem { display: flex; gap: 10px; flex-wrap: wrap; }
.cs2-detay-meta { display: flex; align-items: center; gap: 12px 28px; flex-wrap: wrap; padding-bottom: 16px; border-bottom: 1px solid var(--border-color); }
.cs2-detay-meta > div:not(.cs2-meta-kutu) { display: flex; flex-direction: column; gap: 2px; }
.cs2-detay-meta small { color: var(--text-muted); font-size: 12.5px; }
.cs2-detay-meta b { font-size: 14.5px; font-weight: var(--font-weight-semibold); font-variant-numeric: tabular-nums; }
.cs2-meta-kutu { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 10px; background: var(--bg-tertiary); font-size: 13.5px; font-weight: var(--font-weight-semibold); }
.cs2-satici-kart { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--border-color); background: var(--bg-secondary); }
.cs2-satici-kart > img { width: 48px; height: 48px; border-radius: 12px; object-fit: cover; flex: 0 0 auto; }
.cs2-satici-bilgi { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.cs2-satici-bilgi > div { display: flex; align-items: center; gap: 6px; min-width: 0; }
.cs2-satici-bilgi small { color: var(--text-muted); font-size: 12.5px; }
.cs2-satici-bilgi small .fa-star { color: var(--warning-color); }
.cs2-satici-eylem { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.cs2-guvence { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cs2-guvence li { position: relative; padding-left: 26px; font-size: 13.5px; color: var(--text-secondary); line-height: 1.5; }
.cs2-guvence li > i:first-child { position: absolute; left: 0; top: 3px; color: var(--success-color); width: 16px; text-align: center; }
.cs2-istatistik { padding-top: 4px; }
.cs2-detay-alt { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.cs2-detay-alt-sol { display: flex; gap: 8px; flex-wrap: wrap; }
.cs2-paylas { display: flex; align-items: center; gap: 12px; }
.cs2-paylas span { font-weight: var(--font-weight-bold); font-size: 14.5px; }
.cs2-paylas a, .cs2-paylas button { color: var(--text-secondary); font-size: 20px; background: none; border: 0; padding: 0; cursor: pointer; line-height: 1; }
.cs2-paylas a:hover, .cs2-paylas button:hover { color: var(--primary-color); }

.cs2-sorular { margin-top: 18px; }
.cs2-soru { padding: 10px 0; border-bottom: 1px solid var(--border-color); font-size: 14px; }
.cs2-soru:last-child { border-bottom: 0; }
.cs2-soru p { margin: 0; color: var(--text-secondary); line-height: 1.6; }
.cs2-soru b { color: var(--text-primary); }
.cs2-cevap { margin-top: 6px !important; padding-left: 14px; border-left: 3px solid var(--primary-color); }

.cs2-serit-blok { margin-top: 26px; }
.cs2-serit-baslik { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.cs2-serit-baslik h2 { margin: 0; font-size: 19px; font-weight: var(--font-weight-bold); }
.cs2-rozet-btn { padding: 5px 12px; border-radius: 8px; border: 1px solid var(--border-color); color: var(--text-primary); font-size: 12.5px; font-weight: var(--font-weight-semibold); }
.cs2-rozet-btn:hover { border-color: var(--primary-color); color: var(--primary-color); }
.cs2-serit-ok { margin-left: auto; display: flex; gap: 6px; }
.cs2-serit-ok button { width: 36px; height: 36px; border-radius: 10px; border: 1px solid var(--border-color); background: var(--bg-primary); color: var(--text-secondary); cursor: pointer; }
.cs2-serit-ok button:hover { color: var(--primary-color); border-color: var(--primary-color); }
.cs2-serit-kaydir { display: grid; grid-auto-flow: column; grid-auto-columns: 214px; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 4px 2px 10px; scrollbar-width: thin; }
.cs2-serit-kaydir > .cs2-kart { scroll-snap-align: start; }

.cs2-nasil { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 26px; }
.cs2-nasil ol { margin: 0 0 14px; padding-left: 20px; color: var(--text-secondary); font-size: 14px; line-height: 1.7; }
.cs2-nasil li { margin-bottom: 6px; }
.cs2-nasil b { color: var(--text-primary); }
.cs2-nasil .cs2-kutu { scroll-margin-top: 120px; }

.cs2-sat { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: start; }
.cs2-sat-ana { padding: 24px 26px; }
.cs2-sat-h1 { margin: 0 0 18px; font-size: 22px; font-weight: var(--font-weight-bold); }
.cs2-nasil-bulurum { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 12px; color: var(--secondary-color); font-weight: var(--font-weight-semibold); font-size: 15px; }
.cs2-nasil-bulurum:hover { text-decoration: underline; }
.cs2-alan { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--border-color); background: var(--bg-primary); }
.cs2-alan:focus-within { border-color: var(--primary-color); }
.cs2-alan > span { font-size: 12px; color: var(--text-secondary); font-weight: var(--font-weight-medium); }
.cs2-alan input, .cs2-alan select { border: 0; outline: 0; background: transparent; color: var(--text-primary); font-family: inherit; font-size: 15px; font-weight: var(--font-weight-semibold); padding: 0; width: 100%; min-width: 0; }
.cs2-alan select { cursor: pointer; }
.cs2-alan input:focus, .cs2-alan select:focus { box-shadow: none; border-radius: 0; }
.cs2-alan select option { background: var(--bg-primary); color: var(--text-primary); }
.cs2-alan input[readonly] { color: var(--text-secondary); }
.cs2-alan-buyuk { padding: 11px 18px; }
.cs2-alan-buyuk input, .cs2-alan-buyuk select { font-size: 16px; }
.cs2-trade-yeni { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.cs2-trade-yeni-dugme { display: flex; justify-content: flex-end; gap: 8px; }
.cs2-sat-dugmeler { display: flex; justify-content: flex-end; gap: 10px; margin: 18px 0 22px; padding-bottom: 22px; border-bottom: 1px solid var(--border-color); flex-wrap: wrap; }
.cs2-sat-dugmeler .cs2-btn { height: 48px; padding: 0 26px; font-size: 15.5px; }
.cs2-sat-mesaj { margin: -8px 0 16px; padding: 12px 16px; border-radius: 10px; font-size: 14px; line-height: 1.6; background: var(--bg-secondary); border: 1px solid var(--border-color); }
.cs2-sat-mesaj.hata { background: rgba(var(--danger-rgb), .07); border-color: rgba(var(--danger-rgb), .35); color: var(--danger-color); }
.cs2-sat-mesaj.ok { background: rgba(var(--success-rgb), .08); border-color: rgba(var(--success-rgb), .35); }
.cs2-kurallar { font-size: 13.5px; }
.cs2-envanter { margin-top: 22px; }
.cs2-env-arac { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.cs2-env-sekmeler { display: flex; gap: 6px; flex-wrap: wrap; }
.cs2-env-sekmeler label { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 10px; border: 1px solid var(--border-color); cursor: pointer; font-size: 14px; font-weight: var(--font-weight-semibold); color: var(--text-secondary); }
.cs2-env-sekmeler input { accent-color: var(--primary-color); }
.cs2-env-sekmeler label:has(input:checked) { border-color: var(--primary-color); color: var(--text-primary); }
.cs2-env-sag { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.cs2-env-sag .cs2-girdi { width: 180px; }
.cs2-env-sag .cs2-btn { width: 40px; padding: 0; }
.cs2-env-toplu { display: flex; align-items: center; gap: 10px 16px; flex-wrap: wrap; padding: 10px 12px; margin-bottom: 10px; border: 1px dashed var(--border-color); border-radius: 12px; }
.cs2-toplu-grup { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13.5px; color: var(--text-secondary); }
.cs2-toplu-grup .cs2-girdi { width: 120px; }
.cs2-toplu-grup .cs2-girdi-dar { width: 76px; }
.cs2-env-bilgi { font-size: 13px; color: var(--text-muted); margin-bottom: 12px; }
.cs2-env-izgara { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 14px; }
.cs2-env-kart { display: flex; flex-direction: column; border: 1px solid var(--border-color); border-radius: 14px; overflow: hidden; background: var(--cs2-kart-bg); transition: border-color .15s ease, box-shadow .15s ease; }
.cs2-env-kart.secili { border-color: var(--primary-color); box-shadow: 0 0 0 2px rgba(var(--primary-rgb), .25); }
.cs2-env-kart.kapali .cs2-env-gorsel img { opacity: .45; filter: grayscale(.6); }
.cs2-env-kart .cs2-kart-ust { padding: 10px 12px 0; }
.cs2-env-gorsel { position: relative; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; padding: 8px 14px; }
.cs2-env-gorsel img { width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .25)); }
.cs2-env-ust { padding: 0 14px 12px; border-bottom: 1px solid var(--border-color); min-height: 76px; display: flex; flex-direction: column; gap: 2px; }
.cs2-env-ad { font-size: 14.5px; font-weight: var(--font-weight-bold); line-height: 1.35; color: var(--text-primary); overflow-wrap: anywhere; }
.cs2-env-ust .cs2-float { margin: 8px 0 2px; }
.cs2-env-alt { padding: 12px 14px 14px; display: flex; flex-direction: column; gap: 10px; }
.cs2-yayinla { display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: var(--font-weight-semibold); cursor: pointer; }
.cs2-yayinla input { width: 20px; height: 20px; accent-color: var(--primary-color); cursor: pointer; }
.cs2-env-durum { font-size: 12.5px; font-weight: var(--font-weight-semibold); padding: 7px 10px; border-radius: 8px; background: var(--bg-tertiary); color: var(--text-secondary); line-height: 1.4; }
.cs2-env-durum a { color: var(--primary-color); }
.cs2-env-durum.ilanda { background: rgba(var(--success-rgb), .1); color: var(--success-color); }
.cs2-env-durum.yasak { background: rgba(var(--danger-rgb), .08); color: var(--danger-color); }
.cs2-env-piyasa { font-size: 12px; color: var(--text-muted); }
.cs2-env-hata { font-size: 12.5px; color: var(--danger-color); font-weight: var(--font-weight-semibold); }
.cs2-env-ok { font-size: 12.5px; color: var(--success-color); font-weight: var(--font-weight-semibold); }
.cs2-env-bos { grid-column: 1 / -1; text-align: center; padding: 40px 16px; color: var(--text-muted); border: 1px dashed var(--border-color); border-radius: 12px; }
.cs2-yukleniyor { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 50px 16px; color: var(--text-secondary); }

.cs2-teslim-ayar { margin: 4px 0 16px; padding: 14px 16px; border: 1px solid var(--border-color); border-radius: 12px; background: var(--bg-secondary); display: flex; flex-direction: column; gap: 12px; }
.cs2-teslim-ayar h2 { margin: 0; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--text-secondary); }
.cs2-teslim-satir { display: flex; align-items: flex-start; gap: 12px; }
.cs2-teslim-satir + .cs2-teslim-satir { padding-top: 12px; border-top: 1px solid var(--border-color); }
.cs2-teslim-satir > i { width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 9px; background: var(--bg-tertiary); color: var(--text-secondary); font-size: 14px; }
.cs2-teslim-satir[data-durum="acik"] > i { background: var(--cs2-oto-bg); color: var(--cs2-oto); }
.cs2-teslim-bilgi { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cs2-teslim-ad { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; font-size: 14.5px; color: var(--text-primary); }
.cs2-teslim-bilgi p { margin: 0; font-size: 13px; line-height: 1.55; color: var(--text-secondary); }
.cs2-teslim-bilgi p b { color: var(--text-primary); }
.cs2-teslim-uyum { padding: 7px 10px; border-radius: 8px; font-weight: var(--font-weight-semibold); }
.cs2-teslim-uyum.uyumlu { background: rgba(var(--success-rgb), .1); color: var(--success-color) !important; }
.cs2-teslim-uyum.uyumsuz { background: rgba(var(--warning-rgb), .12); color: var(--text-primary) !important; }
.cs2-teslim-satir > .cs2-btn { flex: 0 0 auto; align-self: center; }

.cs2-oto-ozet { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; padding: 12px 16px; }
.cs2-oto-ozet > i { width: 36px; height: 36px; flex: 0 0 auto; display: grid; place-items: center; border-radius: 10px; background: var(--bg-tertiary); color: var(--text-secondary); font-size: 15px; }
.cs2-oto-ozet[data-durum="acik"] > i { background: var(--cs2-oto-bg); color: var(--cs2-oto); }
.cs2-oto-ozet-bilgi { flex: 1; min-width: 0; font-size: 14.5px; color: var(--text-primary); }
.cs2-oto-ozet-bilgi p { margin: 3px 0 0; font-size: 13px; line-height: 1.55; color: var(--text-secondary); }
.cs2-oto-ozet-bilgi p b { color: var(--text-primary); }
.cs2-oto-ozet > .cs2-btn { flex: 0 0 auto; }

.cs2-sat-panel { position: sticky; top: 110px; padding: 22px; display: flex; flex-direction: column; gap: 16px; }
.cs2-sat-hesap { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; }
.cs2-sat-hesap img { width: 52px; height: 52px; border-radius: 10px; border: 2px solid var(--border-color); object-fit: cover; }
.cs2-sat-hesap b { font-size: 16px; }
.cs2-sat-hesap small { font-size: 12px; color: var(--text-muted); }
.cs2-sat-toplam { display: flex; flex-direction: column; padding: 12px 18px; border-radius: 12px; border: 1px solid var(--border-color); }
.cs2-sat-toplam small, .cs2-sat-aktarilacak small { font-size: 13.5px; color: var(--text-secondary); }
.cs2-sat-toplam b { font-size: 17px; }
.cs2-sat-aktarilacak { display: flex; flex-direction: column; gap: 2px; }
.cs2-sat-aktarilacak b { font-size: 26px; font-weight: 800; }
.cs2-link { align-self: flex-start; background: none; border: 0; padding: 0; color: var(--secondary-color); text-decoration: underline; cursor: pointer; font-family: inherit; font-size: 14.5px; }
.cs2-sat-secili { font-size: 13.5px; color: var(--text-secondary); }
.cs2-sat-onay { margin: 0; font-size: 12px; color: var(--text-muted); line-height: 1.5; }

.cs2-teklif-neden { font-size: 12.5px; color: var(--text-muted); }

.cs2-pencere { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(15, 23, 42, .55); }
.cs2-pencere-kutu { width: min(520px, 100%); max-height: 86vh; overflow-y: auto; background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 16px; box-shadow: var(--shadow-xl); }
.cs2-pencere-bas { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; border-bottom: 1px solid var(--border-color); }
.cs2-pencere-bas h2 { margin: 0; font-size: 17px; }
.cs2-pencere-kapat { background: none; border: 0; font-size: 20px; color: var(--text-secondary); cursor: pointer; }
.cs2-pencere-govde { padding: 18px 20px; display: flex; flex-direction: column; gap: 12px; font-size: 14px; color: var(--text-secondary); }
.cs2-pencere-govde p { margin: 0; }
.cs2-pencere-dugme { display: flex; justify-content: flex-end; gap: 8px; padding: 0 20px 18px; }
.cs2-tablo { width: 100%; border-collapse: collapse; font-size: 14px; }
.cs2-tablo th, .cs2-tablo td { padding: 9px 10px; border-bottom: 1px solid var(--border-color); text-align: left; }
.cs2-tablo th { color: var(--text-muted); font-size: 12.5px; font-weight: var(--font-weight-semibold); text-transform: uppercase; letter-spacing: .03em; }
.cs2-tablo td { color: var(--text-primary); }
.cs2-kucuk { font-size: 12.5px !important; color: var(--text-muted); line-height: 1.6; }
.cs2-sapma-liste { margin: 0; padding-left: 18px; }
.cs2-sapma-liste li { margin-bottom: 4px; }

@media (max-width: 1200px) {
    .cs2-satir { grid-template-columns: minmax(150px, 1fr) auto minmax(130px, 1fr); }
    .cs2-satir > .cs2-btn-ince { justify-self: start; }
    .cs2-satir-sepet { justify-self: end; }
}

@media (max-width: 992px) {
    .cs2-pazar, .cs2-tur-duzen { grid-template-columns: minmax(0, 1fr); }
    .cs2-filtre { display: none; position: fixed; inset: 0; z-index: 1500; top: 0; max-height: none; border-radius: 0; }
    .cs2-filtre.acik { display: block; }
    .cs2-filtre-bas { display: flex; position: sticky; top: 0; background: var(--bg-primary); z-index: 2; }
    .cs2-filtre-ac { display: inline-flex; }
    .cs2-alt-icerik { grid-column: 1 / -1; }
    .cs2-serit { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
    .cs2-serit::-webkit-scrollbar { display: none; }
    .cs2-serit-menu { position: fixed; left: 12px !important; right: 12px !important; top: auto; width: auto; max-height: 60vh; }
    .cs2-tur-kart, .cs2-detay { grid-template-columns: minmax(0, 1fr); }
    .cs2-sat { grid-template-columns: minmax(0, 1fr); }
    .cs2-sat-panel { position: static; order: -1; }
    .cs2-nasil { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 640px) {
    .cs2-teslim-satir { flex-wrap: wrap; }
    .cs2-teslim-satir > .cs2-btn { margin-left: 44px; }
    .cs2-oto-ozet { flex-wrap: wrap; align-items: flex-start; }
    .cs2-oto-ozet > .cs2-btn { margin-left: 50px; }
    .cs2-sayfa { padding: 10px 12px 40px; }
    .cs2-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .cs2-kart-govde { padding: 6px 9px 10px; }
    .cs2-kaplama { font-size: 13.5px; }
    .cs2-fiyat-simdi span { font-size: 17px; }
    .cs2-indirim { margin-left: 0; }
    .cs2-arac { gap: 10px 14px; }
    .cs2-arac-sag { margin-left: 0; width: 100%; }
    .cs2-arac-sag .cs2-secim:first-child { flex: 1; }
    .cs2-satir { grid-template-columns: minmax(0, 1fr) auto; gap: 10px 12px; padding: 12px; }
    .cs2-satir-float { grid-column: 1 / -1; }
    .cs2-satir > .cs2-btn-ince { grid-column: 1; }
    .cs2-satir-sepet { grid-column: 2; }
    .cs2-tur-kart, .cs2-detay { padding: 14px; gap: 16px; }
    .cs2-tur-h1, .cs2-detay-h1 { font-size: 20px; }
    .cs2-fiyat-buyuk span { font-size: 27px; }
    .cs2-sekmeler { width: 100%; overflow-x: auto; }
    .cs2-sekmeler a { white-space: nowrap; }
    .cs2-sat-ana { padding: 16px; }
    .cs2-sat-dugmeler .cs2-btn { flex: 1; padding: 0 12px; }
    .cs2-env-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .cs2-env-alt { padding: 10px; }
    .cs2-env-sag, .cs2-env-sag .cs2-girdi { width: 100%; }
    .cs2-env-sag .cs2-girdi { flex: 1; width: auto; }
    .cs2-serit-kaydir { grid-auto-columns: 172px; }
    .cs2-detay-satin { flex-direction: column; align-items: stretch; }
    .cs2-detay-eylem .cs2-sepet-grup { flex: 1; }
    .cs2-detay-eylem .cs2-sepet-grup .cs2-btn:first-child { flex: 1; }
}

.cs2-panel { padding: 0; display: flex; flex-direction: column; gap: 14px; }
.cs2-panel > .premium-page-header { margin-bottom: 0 !important; }
.cs2-panel .premium-header-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.cs2-panel .cs2-kutu { box-shadow: var(--shadow-sm); }
.cs2-panel .cs2-uyari { margin-bottom: 0; }
.cs2-btn-ince-dolu { height: 34px; padding: 0 12px; font-size: 13px; }
.cs2-btn-tehlike { color: var(--danger-color) !important; }
.cs2-btn-tehlike:hover { border-color: var(--danger-color) !important; }

.cs2-panel-sekmeler { display: flex; gap: 6px; flex-wrap: wrap; }
.cs2-panel-sekmeler a {
    display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border-radius: 10px;
    border: 1px solid var(--border-color); background: var(--bg-primary); color: var(--text-secondary);
    font-size: 14px; font-weight: var(--font-weight-semibold);
}
.cs2-panel-sekmeler a em { font-style: normal; font-size: 12px; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-grid; place-items: center; background: var(--bg-tertiary); color: var(--text-secondary); }
.cs2-panel-sekmeler a:hover { color: var(--text-primary); border-color: rgba(var(--primary-rgb), .5); }
.cs2-panel-sekmeler a.aktif { color: var(--primary-color); border-color: var(--primary-color); background: rgba(var(--primary-rgb), .06); }
.cs2-panel-sekmeler a.aktif em { background: var(--primary-color); color: #fff; }

.cs2-panel-filtre { display: flex; gap: 10px; align-items: center; padding: 14px 16px; flex-wrap: wrap; }
.cs2-panel-filtre .cs2-girdi { flex: 1; min-width: 200px; width: auto; }
.cs2-eylem-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 12px 16px; }
.cs2-hepsi { display: inline-flex; align-items: center; gap: 10px; font-size: 15px; font-weight: var(--font-weight-semibold); cursor: pointer; }
.cs2-hepsi input { width: 18px; height: 18px; accent-color: var(--primary-color); }
.cs2-hepsi span { color: var(--text-muted); font-weight: var(--font-weight-medium); font-size: 13.5px; }
.cs2-eylem-dugmeler { display: flex; gap: 8px; flex-wrap: wrap; }

.cs2-ilan-liste { display: flex; flex-direction: column; gap: 10px; }
.cs2-ilan-satir {
    display: grid; grid-template-columns: 26px 96px minmax(0, 1fr) auto minmax(130px, auto) auto; align-items: center; gap: 14px;
    padding: 12px 16px; background: var(--bg-primary); border: 1px solid var(--border-color); border-radius: 14px;
    color: var(--text-primary); box-shadow: var(--shadow-sm); transition: border-color .15s ease;
}
a.cs2-ilan-satir:hover, .cs2-ilan-satir:hover { border-color: rgba(var(--primary-rgb), .45); color: var(--text-primary); }
.cs2-ilan-satir.secili { border-color: var(--primary-color); box-shadow: 0 0 0 2px rgba(var(--primary-rgb), .15); }
.cs2-siparis-satir { grid-template-columns: 96px minmax(0, 1fr) auto minmax(110px, auto) auto; }
.cs2-ilan-sec input { width: 18px; height: 18px; accent-color: var(--primary-color); cursor: pointer; }
.cs2-ilan-sec input[disabled] { opacity: .3; cursor: not-allowed; }
.cs2-ilan-gorsel { display: flex; align-items: center; justify-content: center; width: 96px; height: 72px; border-radius: 10px; background: var(--cs2-gorsel-bg); border-bottom: 3px solid var(--cs2-nr, transparent); overflow: hidden; }
.cs2-ilan-gorsel img { width: 100%; height: 100%; object-fit: contain; padding: 4px; }
.cs2-ilan-bilgi { min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cs2-ilan-ust { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs2-ilan-ust .cs2-st, .cs2-ilan-ust .cs2-sv { margin: 0; }
.cs2-ilan-ad { font-size: 15px; font-weight: var(--font-weight-bold); color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
a.cs2-ilan-ad:hover { color: var(--primary-color); }
.cs2-ilan-meta { display: flex; gap: 4px 12px; flex-wrap: wrap; font-size: 12.5px; color: var(--text-muted); }
.cs2-ilan-not { font-size: 12.5px; font-weight: var(--font-weight-semibold); margin-top: 2px; }
.cs2-not-kirmizi { color: var(--danger-color); }
.cs2-ilan-durum { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; }
.cs2-ilan-fiyat { display: flex; flex-direction: column; align-items: flex-end; gap: 2px; text-align: right; }
.cs2-ilan-fiyat b { font-size: 16px; font-variant-numeric: tabular-nums; }
.cs2-ilan-fiyat small { font-size: 12px; color: var(--text-muted); }
.cs2-ilan-eylem { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }

.cs2-durum { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; font-size: 12px; font-weight: var(--font-weight-semibold); white-space: nowrap; background: var(--bg-tertiary); color: var(--text-secondary); }
.cs2-durum-yesil { background: rgba(var(--success-rgb), .14); color: var(--success-color); }
.cs2-durum-sari { background: rgba(var(--warning-rgb), .16); color: #b7791f; }
[data-theme="dark"] .cs2-durum-sari { color: var(--warning-color); }
.cs2-durum-mavi { background: rgba(var(--secondary-rgb), .12); color: var(--secondary-color); }
[data-theme="dark"] .cs2-durum-mavi { color: #60a5fa; }
.cs2-durum-kirmizi { background: rgba(var(--danger-rgb), .12); color: var(--danger-color); }
.cs2-geri-sayim { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: var(--font-weight-semibold); color: var(--text-secondary); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cs2-geri-sayim.az { color: var(--danger-color); }
.cs2-geri-sayim.bitti { color: var(--text-muted); }

.cs2-bekleyen { border-color: rgba(var(--warning-rgb), .45); }
.cs2-bekleyen .cs2-kutu-baslik h2 i { color: var(--warning-color); margin-right: 6px; }
.cs2-bekleyen-liste { display: flex; flex-direction: column; gap: 8px; }
.cs2-bekleyen-oge { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto auto auto; align-items: center; gap: 12px; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--border-color); background: var(--bg-secondary); color: var(--text-primary); }
.cs2-bekleyen-oge:hover { border-color: var(--primary-color); color: var(--text-primary); }
.cs2-bekleyen-oge img { width: 64px; height: 48px; object-fit: contain; }
.cs2-bekleyen-bilgi { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cs2-bekleyen-bilgi b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs2-bekleyen-bilgi small { font-size: 12.5px; color: var(--text-muted); }

.cs2-siparis-duzen { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 16px; align-items: start; }
.cs2-siparis-ana { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.cs2-siparis-yan { display: flex; flex-direction: column; gap: 12px; position: sticky; top: 110px; }
.cs2-siparis-ozet { display: grid; grid-template-columns: 220px minmax(0, 1fr); gap: 20px; }
.cs2-siparis-gorsel { display: flex; align-items: center; justify-content: center; aspect-ratio: 4 / 3; border-radius: 12px; background: var(--cs2-gorsel-bg); border-bottom: 4px solid var(--cs2-nr, transparent); }
.cs2-siparis-gorsel img { width: 90%; height: 90%; object-fit: contain; filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .25)); }
.cs2-siparis-bilgi { min-width: 0; display: flex; flex-direction: column; gap: 10px; }
.cs2-siparis-ad { margin: 0; font-size: 19px; font-weight: var(--font-weight-bold); line-height: 1.35; overflow-wrap: anywhere; }
.cs2-siparis-durum { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }

.cs2-adimlar { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.cs2-adimlar li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding-top: 2px; }
.cs2-adimlar li::before { content: ""; position: absolute; top: 17px; left: calc(-50% + 20px); right: calc(50% + 20px); height: 3px; border-radius: 2px; background: var(--border-color); }
.cs2-adimlar li:first-child::before { display: none; }
.cs2-adimlar li.tamam::before { background: var(--success-color); }
.cs2-adimlar li.iptal::before { background: var(--danger-color); }
.cs2-adim-nokta { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; background: var(--bg-tertiary); color: var(--text-muted); font-size: 13px; border: 2px solid var(--border-color); position: relative; z-index: 1; }
.cs2-adimlar li.tamam .cs2-adim-nokta { background: var(--success-color); border-color: var(--success-color); color: #fff; }
.cs2-adimlar li.iptal .cs2-adim-nokta { background: var(--danger-color); border-color: var(--danger-color); color: #fff; }
.cs2-adimlar li:not(.tamam):not(.iptal) .cs2-adim-nokta i { font-size: 7px; }
.cs2-adimlar b { font-size: 13px; font-weight: var(--font-weight-semibold); }
.cs2-adimlar small { font-size: 11.5px; color: var(--text-muted); min-height: 14px; }
.cs2-panel .cs2-adimlar + .cs2-uyari { margin-top: 14px; }

.cs2-adim-kutu.bitti { opacity: .8; }
.cs2-adim-no { display: inline-grid; place-items: center; width: 26px; height: 26px; margin-right: 8px; border-radius: 50%; background: var(--primary-color); color: #fff; font-size: 13px; vertical-align: 2px; }
.cs2-adim-kutu.bitti .cs2-adim-no { background: var(--success-color); }
.cs2-adim-kutu p, .cs2-iptal-kutu p, .cs2-geri-alma p { margin: 0 0 12px; font-size: 14px; color: var(--text-secondary); line-height: 1.6; }
.cs2-adim-not { margin: 0 !important; position: relative; padding-left: 26px; font-size: 14px; color: var(--text-primary) !important; line-height: 1.6; }
.cs2-adim-not > i:first-child { position: absolute; left: 0; top: 4px; width: 16px; text-align: center; color: var(--success-color); }
.cs2-adim-not a { color: var(--primary-color); font-weight: var(--font-weight-semibold); }
.cs2-satir-form { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.cs2-satir-form .cs2-girdi, .cs2-satir-form .cs2-secim { flex: 1; min-width: 220px; width: auto; }
.cs2-steam-kart { display: flex; align-items: center; gap: 14px; padding: 14px; border-radius: 12px; border: 1px solid var(--border-color); background: var(--bg-secondary); flex-wrap: wrap; }
.cs2-steam-kart > img { width: 64px; height: 64px; border-radius: 10px; object-fit: cover; flex: 0 0 auto; border: 2px solid var(--border-color); }
.cs2-steam-kart > div:not(.cs2-trade-eylem) { min-width: 0; flex: 1; display: flex; flex-direction: column; gap: 2px; }
.cs2-steam-kart b { font-size: 16px; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs2-steam-kart small { font-size: 12.5px; color: var(--text-muted); }
.cs2-steam-kart a:not(.cs2-btn) { font-size: 13px; color: var(--secondary-color); }
.cs2-guvence-uyari { margin-top: 12px; }
.cs2-guvence-uyari i { color: var(--warning-color) !important; }
.cs2-iptal-kutu details summary, .cs2-geri-alma summary { cursor: pointer; font-weight: var(--font-weight-semibold); color: var(--text-secondary); font-size: 14px; }
.cs2-iptal-kutu details[open] summary, .cs2-geri-alma[open] summary { margin-bottom: 10px; color: var(--text-primary); }
.cs2-geri-alma { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border-color); }
.cs2-acilir { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; padding: 12px; border-radius: 12px; border: 1px dashed var(--border-color); }
.cs2-metin { height: auto; min-height: 90px; padding: 10px 12px; resize: vertical; line-height: 1.5; }
.cs2-kisa-adim { margin: 0; padding-left: 18px; font-size: 13.5px; color: var(--text-secondary); line-height: 1.6; display: grid; gap: 6px; }
.cs2-yan-link { display: flex; align-items: center; gap: 10px; padding: 12px 16px; font-size: 14px; font-weight: var(--font-weight-semibold); color: var(--text-primary); }
.cs2-yan-link:hover { color: var(--primary-color); border-color: var(--primary-color); }
.cs2-yan-link i { color: var(--primary-color); }

.cs2-hesap-liste { display: flex; flex-direction: column; gap: 10px; margin-top: 12px; }
.cs2-panel-bos { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 26px 16px; text-align: center; color: var(--text-muted); border: 1px dashed var(--border-color); border-radius: 12px; margin-top: 12px; }
.cs2-panel-bos > i { font-size: 30px; }
.cs2-panel-bos p { margin: 0; }
.cs2-trade-kart > img { width: 48px; height: 48px; }
.cs2-trade-url { display: block; margin-top: 4px; font-size: 12px; color: var(--text-secondary); background: var(--bg-tertiary); padding: 4px 8px; border-radius: 6px; overflow-wrap: anywhere; }
.cs2-trade-eylem { display: flex; gap: 6px; flex-wrap: wrap; }
.cs2-trade-ekle { margin-top: 4px; }
.cs2-fiyat-ad { font-weight: var(--font-weight-semibold); color: var(--text-primary) !important; }

@media (max-width: 1100px) {
    .cs2-siparis-duzen { grid-template-columns: minmax(0, 1fr); }
    .cs2-siparis-yan { position: static; }
}
@media (max-width: 900px) {
    .cs2-ilan-satir { grid-template-columns: 22px 72px minmax(0, 1fr) auto; }
    .cs2-siparis-satir { grid-template-columns: 72px minmax(0, 1fr) auto; }
    .cs2-ilan-gorsel { width: 72px; height: 54px; }
    .cs2-ilan-satir .cs2-ilan-durum { grid-column: 3; align-items: flex-start; flex-direction: row; flex-wrap: wrap; }
    .cs2-ilan-satir .cs2-ilan-fiyat { grid-column: 4; grid-row: 1; }
    .cs2-siparis-satir .cs2-ilan-fiyat { grid-column: 3; }
    .cs2-siparis-satir .cs2-ilan-durum { grid-column: 2; }
    .cs2-ilan-satir .cs2-ilan-eylem { grid-column: 3 / -1; justify-content: flex-start; }
    .cs2-siparis-satir .cs2-ilan-eylem { grid-column: 2 / -1; }
    .cs2-bekleyen-oge { grid-template-columns: 56px minmax(0, 1fr) auto; }
    .cs2-bekleyen-oge .cs2-geri-sayim, .cs2-bekleyen-oge .cs2-btn { grid-column: 2 / -1; justify-self: start; }
}
@media (max-width: 640px) {
    .cs2-teklif-satir { grid-template-columns: 72px minmax(0, 1fr); }
    .cs2-teklif-satir .cs2-ilan-bilgi { grid-column: 2; }
    .cs2-teklif-satir .cs2-ilan-fiyat { grid-column: 2; grid-row: auto; align-items: flex-start; text-align: left; }
    .cs2-siparis-ozet { grid-template-columns: minmax(0, 1fr); }
    .cs2-siparis-gorsel { max-width: 260px; }
    .cs2-adimlar { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 14px; }
    .cs2-adimlar li:nth-child(3)::before { display: none; }
    .cs2-eylem-dugmeler .cs2-btn { flex: 1; padding: 0 10px; }
}

.cs2-oto-duzen { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 16px; align-items: start; }
.cs2-oto-ana { min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.cs2-oto-yan { display: flex; flex-direction: column; gap: 12px; position: sticky; top: 110px; }
.cs2-oto-ana .cs2-kutu > p { margin: 0 0 12px; font-size: 14px; color: var(--text-secondary); line-height: 1.6; }
.cs2-oto-ana .cs2-kutu > p.cs2-kucuk { margin: 12px 0 0; }
.cs2-oto-durum { margin: 0; display: grid; gap: 0; }
.cs2-oto-durum > div { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border-color); }
.cs2-oto-durum > div:last-child { border-bottom: 0; }
.cs2-oto-durum dt { font-size: 13px; font-weight: var(--font-weight-semibold); color: var(--text-muted); }
.cs2-oto-durum dd { margin: 0; font-size: 14px; color: var(--text-primary); line-height: 1.6; overflow-wrap: anywhere; }
.cs2-oto-durum dd a { color: var(--primary-color); font-weight: var(--font-weight-semibold); }
.cs2-oto-not { display: block; margin-top: 2px; font-size: 12.5px; color: var(--text-muted); }
.cs2-oto-nokta { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 4px; vertical-align: 1px; background: var(--text-muted); }
.cs2-oto-nokta.yesil { background: var(--success-color); box-shadow: 0 0 0 3px rgba(var(--success-rgb), .18); }
.cs2-oto-nokta.sari { background: var(--warning-color); }
.cs2-oto-nokta.kirmizi { background: var(--danger-color); }
.cs2-oto-nokta.gri { background: var(--text-muted); opacity: .6; }
.cs2-oto-dugmeler { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.cs2-oto-dugmeler span.cs2-btn { cursor: default; opacity: .65; }
.cs2-oto-sayfa #cs2OtoIpucu { margin: 10px 0 0; }
.cs2-oto-liste { display: flex; flex-direction: column; gap: 8px; }
.cs2-oto-satir { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--border-color); background: var(--bg-secondary); color: var(--text-primary); }
.cs2-oto-satir:hover { border-color: var(--primary-color); color: var(--text-primary); }
.cs2-oto-satir-ad { min-width: 0; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cs2-oto-satir small { grid-column: 1 / -1; font-size: 12.5px; color: var(--text-muted); overflow-wrap: anywhere; }
.cs2-oto-etiket { display: inline-flex; align-items: center; padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: var(--font-weight-semibold); white-space: nowrap; background: var(--bg-tertiary); color: var(--text-secondary); }
.cs2-oto-etiket-onay_bekliyor, .cs2-oto-etiket-gonderiliyor { background: rgba(var(--warning-rgb), .16); color: #b7791f; }
[data-theme="dark"] .cs2-oto-etiket-onay_bekliyor, [data-theme="dark"] .cs2-oto-etiket-gonderiliyor { color: var(--warning-color); }
.cs2-oto-etiket-aktif, .cs2-oto-etiket-kabul { background: var(--cs2-oto-bg); color: var(--cs2-oto); }
.cs2-oto-etiket-hata { background: rgba(var(--danger-rgb), .12); color: var(--danger-color); }
.cs2-oto-kutu { border-color: rgba(22, 163, 74, .35); }
.cs2-oto-kutu[data-oto="hata"] { border-color: rgba(var(--danger-rgb), .4); }
.cs2-oto-kutu[data-oto="onay_bekliyor"] { border-color: rgba(var(--warning-rgb), .5); }
.cs2-oto-kutu .cs2-kutu-baslik { margin-bottom: 8px; }
.cs2-oto-kutu .cs2-kutu-baslik h2 i { color: var(--cs2-oto); margin-right: 6px; }
.cs2-oto-mesaj { margin: 0; font-size: 14px; line-height: 1.6; color: var(--text-primary); }
.cs2-oto-kutu .cs2-oto-dugmeler { margin-top: 12px; }
.cs2-panel .cs2-oto-alici { margin-bottom: 12px !important; }
.cs2-adim-not.cs2-oto-alici > i:first-child { color: var(--cs2-oto); }

@media (max-width: 1100px) {
    .cs2-oto-duzen { grid-template-columns: minmax(0, 1fr); }
    .cs2-oto-yan { position: static; }
}
@media (max-width: 640px) {
    .cs2-oto-durum > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
    .cs2-oto-dugmeler .cs2-btn { flex: 1 1 100%; }
}