/* ==========================================================================
   KO-FOX v1.2 — Footer ve Reklam Alanları sayfası
   ========================================================================== */

/* ================================================================ FOOTER */
footer.kfFooter { margin-top: 15px; }
footer.v2 .sticky { display: none; }

.fSponsors { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 20px; }
.fSponsors a, .fSponsors span { padding: 6px 14px; border-radius: 2px; background: var(--card); font-size: 13px; font-weight: 600; }
.fSponsors a:hover { color: var(--blue); }

.fMain { background: #363849; color: #a3a6ba; }
body.night .fMain { background: #232533; }
.fSection { padding: 25px 0; }
.fSection + .fSection { border-top: 1px solid #45485e; }
body.night .fSection + .fSection { border-top-color: #2f3144; }

.fIcon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 44px; height: 44px; border-radius: 2px; background: #2d2f40; color: #fff; font-size: 21px; }
.fIcon.green { background: #32ab52; }
.fTxt { display: flex; flex-direction: column; min-width: 0; font-size: 13.5px; line-height: 20px; color: #a3a6ba; }
.fTxt b { color: #e4e5ef; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fTxt b a { color: #e4e5ef; }
.fTxt b a:hover { color: #fff; text-decoration: underline; }

/* ---- İstatistik satırı */
.fStatsGrid { display: grid; grid-template-columns: minmax(0, 1.3fr) repeat(2, minmax(0, 1fr)); gap: 6px; }
.fBox { display: flex; align-items: center; gap: 15px; min-width: 0; min-height: 70px; padding: 0 20px; border-radius: 2px; background: #3f4257; }
body.night .fBox { background: #2a2c3f; }
.fOnline { grid-row: span 2; flex-direction: column; align-items: stretch; justify-content: center; gap: 14px; padding: 18px 20px; }
.fOnlineTop { display: flex; align-items: center; gap: 15px; min-width: 0; }
.fOnlineBtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 2px; background: #2d2f40; color: #fff !important; font-size: 14px; font-weight: 600; white-space: nowrap; transition: background .2s; }
.fOnlineBtn i { font-size: 18px; }
.fOnlineBtn:hover { background: var(--blue); }

/* ---- Yasal bilgi + logo */
.fInfoRow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.fInfoBox { display: flex; align-items: center; gap: 20px; min-width: 0; padding: 15px; border-radius: 2px; background: #3f4257; }
body.night .fInfoBox { background: #2a2c3f; }
.fBigIcon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; align-self: stretch; width: 96px; min-height: 96px; border-radius: 2px; background: #2d2f40; color: #a3a6ba; font-size: 28px; }
body.night .fBigIcon { background: #232533; }
.fBigIcon .fBrandFox { width: 58px; height: 58px; }
.fInfoText { min-width: 0; }
.fInfoText p { margin: 0; color: #a3a6ba; font-size: 13.5px; line-height: 1.6; }
.fInfoText strong { color: #e4e5ef; }
.fInfoTitle { display: block; margin-bottom: 4px; color: #e4e5ef; font-size: 15px; }
.fBrand .footerLogo { margin-bottom: 6px; }
.fBrand .footerLogo .foxMark { display: none; }
.fBrand .footerLogo .txt { flex-direction: row; align-items: baseline; gap: 10px; }
.fBrand .footerLogo .txt b { font-size: 20px; }
.fBrand .footerLogo .txt small { margin-top: 0; }
.fSocial { display: flex; gap: 6px; margin-top: 10px; }
.fSocial a { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 2px; background: #2d2f40; color: #d9dae9; font-size: 15px; transition: background .2s, color .2s; }
.fSocial a:hover { background: var(--orange); color: #fff; }

/* ---- İletişim kutuları */
.fContacts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.fContacts.cols-1 { grid-template-columns: minmax(0, 380px); }
.fContacts.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fContacts.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.fContact { display: flex; align-items: center; min-width: 0; height: 60px; border-radius: 2px; background: #3f4257; transition: background .2s; }
body.night .fContact { background: #2a2c3f; }
.fContact:hover { background: #46495f; }
.fCIcon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 52px; height: 100%; border-right: 1px solid #494c62; color: #a3a6ba; font-size: 20px; }
.fCLabel { flex: 0 1 auto; padding: 0 12px; color: #a3a6ba; font-size: 12.5px; line-height: 17px; max-width: 110px; }
.fCMail { margin-left: auto; padding-right: 14px; color: #e4e5ef; font-size: 13px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fContact:hover .fCMail { color: #fff; }

/* ---- Alt bar */
.fBar { background: #2b2c3b; }
body.night .fBar { background: #191a26; }
.fBar .container { padding: 18px 0 16px; text-align: center; }
.fBarLinks { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 4px 6px; }
.fBarLinks a, .fBarLinks button { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border: 0; border-radius: 2px; background: none; color: #a3a6ba; font-size: 13px; cursor: pointer; transition: background .2s, color .2s; }
.fBarLinks a:hover, .fBarLinks button:hover { background: #363849; color: #fff; }
.fCopy { margin-top: 8px; color: #6f7290; font-size: 12px; }

/* ================================================================ REKLAM ALANLARI */
.adsPage .cpLeft { top: 15px; }
.adsSummary { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid #5a5e76; }
.adsSummary > div { padding: 12px 6px; text-align: center; }
.adsSummary > div + div { border-left: 1px solid #5a5e76; }
.adsSummary b { display: block; color: #fff; font-size: 20px; line-height: 1.2; }
.adsSummary b.ok { color: #42e07c; }
.adsSummary b.bad { color: #ff6b8e; }
.adsSummary span { color: #a3a6ba; font-size: 11px; text-transform: uppercase; font-weight: 700; letter-spacing: .3px; }
.adsMenu a { padding: 8px 14px 8px 18px; font-size: 13px; }
.adsMenu .slotName { display: block; min-width: 0; line-height: 1.35; }
.slotDot { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; font-size: 11px; font-style: normal; font-weight: 700; }
.slotDot::before { content: ""; width: 8px; height: 8px; border-radius: 50%; }
.slotDot.free { color: #42e07c; }
.slotDot.free::before { background: #2bd768; box-shadow: 0 0 0 3px rgba(43, 215, 104, .2); }
.slotDot.full { color: #ff6b8e; }
.slotDot.full::before { background: #ee0743; box-shadow: 0 0 0 3px rgba(238, 7, 67, .2); }
.cpHelpBtn i { margin-right: 4px; }

.adBox { margin-bottom: 25px; overflow: hidden; border-radius: 2px; background: var(--card); border: 1px solid var(--panel-border); }
.adBoxHead { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; padding: 20px 22px; border-bottom: 1px solid var(--line); }
.adGroupTag { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; }
.adGroupTag i { color: var(--orange); font-size: 14px; }
.adBoxTitle h1 { margin: 4px 0 8px; font-size: 22px; font-weight: 800; }
.adState { display: inline-flex; align-items: center; gap: 5px; padding: 3px 10px; border-radius: 12px; font-size: 12px; font-weight: 700; }
.adState.free { background: rgba(43, 215, 104, .14); color: #14953f; }
.adState.full { background: rgba(238, 7, 67, .1); color: #d40a3e; }
body.night .adState.free { color: #42e07c; }
body.night .adState.full { color: #ff6b8e; }
.priceBtn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 3px; background: #2e7cf6; color: #fff !important; font-size: 15px; font-weight: 700; box-shadow: 0 4px 12px rgba(46, 124, 246, .3); transition: background .2s, transform .15s; }
.priceBtn:hover { background: #1f68dc; transform: translateY(-1px); }
.priceBtn i { font-size: 18px; }

.adFacts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-bottom: 1px solid var(--line); background: var(--panel); }
.adFacts > div { display: grid; grid-template-columns: 38px minmax(0, 1fr); column-gap: 10px; align-items: center; padding: 14px 18px; }
.adFacts > div + div { border-left: 1px solid var(--line); }
.adFacts i { grid-row: span 2; display: flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: 2px; background: rgba(46, 124, 246, .1); color: #2e7cf6; font-size: 19px; }
.adFacts span { color: var(--muted); font-size: 12px; }
.adFacts b { color: var(--text-strong); font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.adInfo { padding: 16px 22px; border-bottom: 1px solid var(--line); }
.adInfo p { margin: 0; font-size: 13.5px; line-height: 1.7; }
.adInfo p + p { margin-top: 6px; font-size: 12.5px; }

.adPreviewTabs { padding: 18px 22px 22px; }
.adPreviewTabs > ul { display: flex; gap: 4px; margin: 0; padding: 0; list-style: none; }
.adPreviewTabs > ul li a { display: inline-flex; align-items: center; gap: 6px; padding: 9px 16px; border-radius: 3px 3px 0 0; background: var(--panel); color: var(--text); font-size: 13px; font-weight: 600; }
.adPreviewTabs > ul li.active a { background: #2e7cf6; color: #fff; }
.adPreviewBody { padding: 22px; border-radius: 0 3px 3px 3px; background: #2e7cf6; background: linear-gradient(135deg, #2e7cf6, #1f62d6); }
.adPreviewBody .tab-pane.active { display: flex; justify-content: center; }

.adOrderBox { display: flex; align-items: stretch; gap: 0; border-top: 1px solid var(--line); background: var(--panel); scroll-margin-top: 16px; }
.adOrderSum { display: flex; flex-direction: column; justify-content: center; width: 260px; flex-shrink: 0; padding: 18px 22px; border-right: 1px solid var(--line); }
.adOrderSum span { color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; }
.adOrderSum > b { margin-top: 2px; font-size: 14.5px; }
.adOrderPrice { margin-top: 8px; }
.adOrderPrice strong { color: var(--text-strong); font-size: 26px; font-weight: 800; }
.adOrderPrice small { margin-left: 6px; color: var(--muted); font-size: 12.5px; }
.adOrderAct { flex: 1; min-width: 0; padding: 18px 22px; }
.adOrderAct form { margin: 0; }
.adOrderAct textarea { min-height: 62px; }
.adOrderBtns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px; }
.adGuest { padding: 12px 14px; border-radius: 2px; background: var(--card); border: 1px dashed var(--panel-border); color: var(--muted); font-size: 13.5px; }
.adGuest a { color: var(--blue); font-weight: 700; }

.adPriceTable .groupRow td { padding: 8px 15px; background: var(--panel); color: var(--muted); font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; }
.adPriceTable .groupRow i { color: var(--orange); }
.adPriceTable td i.ri-computer-line, .adPriceTable td i.ri-smartphone-line { color: var(--muted); font-size: 15px; }
.adPriceTable .adminTable td:first-child, .adPriceTable .adminTable th:first-child { padding-left: 15px; }

/* ---- Canlı önizleme: tarayıcı çerçevesi */
.pvBrowser { width: 100%; max-width: 900px; overflow: hidden; border-radius: 8px; background: #fff; box-shadow: 0 16px 40px rgba(10, 30, 80, .4); }
.pvBar { display: flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; background: #f1f3f7; border-bottom: 1px solid #e2e6e9; }
.pvBar i { width: 10px; height: 10px; border-radius: 50%; background: #ff5f57; }
.pvBar i:nth-child(2) { background: #febc2e; }
.pvBar i:nth-child(3) { background: #28c840; }
.pvBar span { flex: 0 1 260px; height: 18px; margin-left: 12px; padding: 0 12px; border-radius: 9px; background: #fff; color: #6a6e86; font-size: 11px; line-height: 18px; overflow: hidden; white-space: nowrap; }
.livePreview { position: relative; width: 100%; height: 420px; overflow: hidden; background: #e8eaec; }
.livePreview iframe { position: absolute; top: 0; left: 0; border: 0; transform-origin: 0 0; pointer-events: none; background: #e8eaec; }
.pvLoading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 8px; color: #6a6e86; font-size: 13px; font-weight: 600; background: #e8eaec; transition: opacity .3s; }
.pvLoading i { font-size: 22px; animation: pvSpin 1s linear infinite; }
@keyframes pvSpin { to { transform: rotate(360deg); } }
.livePreview.loaded .pvLoading { opacity: 0; pointer-events: none; }

/* ---- Canlı önizleme: telefon çerçevesi */
.adPhone { position: relative; width: 260px; padding: 38px 10px 22px; border-radius: 36px; background: #1c1d27; box-shadow: 0 16px 40px rgba(10, 30, 80, .45), inset 0 0 0 2px #3a3c4e; }
.adPhoneNotch { position: absolute; top: 14px; left: 50%; width: 76px; height: 11px; border-radius: 6px; background: #2d2f3e; transform: translateX(-50%); }
.adPhone .livePreview { border-radius: 18px; }

/* ---- Önizleme modu (iframe içindeki gerçek sayfa) */
html:has(body.adPvMode) { overflow: hidden; scrollbar-width: none; }
body.adPvMode { pointer-events: none; user-select: none; }
body.adPvMode .scrollToTop, body.adPvMode footer.v2 .sticky, body.adPvMode .kfModal { display: none !important; }
.adPvHl { position: relative; z-index: 60; border-radius: 3px; box-shadow: 0 0 0 4px #fff, 0 0 0 8px #ff7a1f, 0 0 0 100vmax rgba(20, 22, 35, .5) !important; animation: pvGlow 1.8s ease-in-out infinite; }
li.adPvHl { display: block; }
@keyframes pvGlow { 50% { box-shadow: 0 0 0 4px #fff, 0 0 0 14px rgba(255, 122, 31, .55), 0 0 0 100vmax rgba(20, 22, 35, .5); } }
.adPvLabel { position: absolute; z-index: 3; bottom: calc(100% + 14px); left: 50%; transform: translateX(-50%); display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 20px; background: #ff5e3a; color: #fff; font-size: 15px; font-weight: 800; white-space: nowrap; box-shadow: 0 6px 16px rgba(0, 0, 0, .3); }
.adPvLabel.below { top: calc(100% + 14px); bottom: auto; }
.adPvNotify .notificationList { opacity: 1 !important; visibility: visible !important; }
.adPvNotify .notificationList.adPvHl { position: absolute; }
.adPvNotify .inner .count { position: absolute; top: -2px; left: calc(50% - 2px); }
.adPvMode .adRow { overflow: visible; }
.adCell > .adPvHl { display: flex; justify-content: center; width: 100%; }
.adInList .adCell > .adPvHl .kfAd { max-width: none; }

/* ================================================================ DUYARLI */
@media (max-width: 1300px) {
    .fContacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fCLabel { max-width: none; }
    .adFacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .adFacts > div:nth-child(3) { border-left: 0; }
    .adFacts > div:nth-child(n+3) { border-top: 1px solid var(--line); }
}
@media (max-width: 1100px) {
    .adsMenu a { flex: 1 1 calc(50% - 4px) !important; }
    .adsMenu .slotDot { font-size: 0; gap: 0; }
}
@media (max-width: 991px) {
    .fStatsGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .fOnline { grid-row: auto; grid-column: 1 / -1; }
    .fInfoRow { grid-template-columns: 1fr; }
    .fBigIcon { width: 64px; min-height: 64px; font-size: 24px; }
    .fBigIcon .fBrandFox { width: 42px; height: 42px; }
    .fBar .container { padding-bottom: 76px; }
    .adOrderBox { flex-direction: column; }
    .adOrderSum { width: auto; border-right: 0; border-bottom: 1px solid var(--line); }
    .adPriceTable .adminTable th:nth-child(3), .adPriceTable .adminTable td:nth-child(3),
    .adPriceTable .adminTable th:nth-child(4), .adPriceTable .adminTable td:nth-child(4) { display: none; }
}
@media (max-width: 600px) {
    .fStatsGrid { grid-template-columns: 1fr; }
    .fOnline { grid-row: auto; }
    .fContacts, .fContacts.cols-2, .fContacts.cols-3 { grid-template-columns: 1fr; }
    .fInfoBox { align-items: flex-start; gap: 14px; }
    .adsMenu a { flex: 1 1 100% !important; }
    .adsMenu .slotDot { font-size: 11px; gap: 5px; }
    .adBoxHead, .adInfo, .adPreviewTabs, .adOrderSum, .adOrderAct { padding-left: 14px; padding-right: 14px; }
    .adFacts { grid-template-columns: 1fr; }
    .adFacts > div { border-left: 0 !important; }
    .adFacts > div + div { border-top: 1px solid var(--line); }
    .priceBtn { width: 100%; justify-content: center; }
    .adPreviewBody { padding: 12px; }
}

/* Önizleme modunda vurgu etiketi header'ın üstünde kalsın */
body.adPvMode header.v2 { z-index: 1; }
body.adPvMode header.v2:has(.adPvNotify) { z-index: 100; }

/* ---- Footer sağ tarafındaki beyaz tilki detayı */
.fMain { position: relative; overflow: hidden; }
.fMain > .fSection { position: relative; z-index: 1; }
.fMain::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 1.2%;
    width: 330px;
    height: 330px;
    background: url("../img/fox-white.svg") center / contain no-repeat;
    opacity: .13;
    transform: translateY(-50%) rotate(-10deg);
    pointer-events: none;
}
@media (max-width: 1100px) { .fMain::after { width: 240px; height: 240px; opacity: .07; } }
@media (max-width: 600px) { .fMain::after { right: -60px; opacity: .05; } }



/* ---- Beyaz KO-FOX tanıtım ve sosyal medya bölümü (koyu footer'ın üstünde) */
.fMisc { display: flex; gap: 20px; margin-bottom: 25px; }
.fMiscBrand { flex: 1; display: flex; align-items: stretch; min-width: 0; border-radius: 2px; background: var(--card); box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.fMiscFox { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 150px; border-right: 1px solid var(--panel-border); }
.fMiscFox svg { width: 96px; height: 96px; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, .1)); }
.fMiscText { display: flex; flex-direction: column; justify-content: center; gap: 8px; min-width: 0; padding: 24px 28px; }
.fMiscLogo { display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.fMiscLogo b { color: var(--dark-1); font-size: 34px; font-weight: 800; letter-spacing: -.5px; line-height: 1; }
body.night .fMiscLogo b { color: #fff; }
.fMiscLogo b em { font-style: normal; color: var(--orange); margin: 0 1px; }
.fMiscLogo small { color: #616579; font-size: 15px; font-weight: 600; }
body.night .fMiscLogo small { color: #b4b6c9; }
.fMiscLogo small i { color: var(--red); font-size: 13px; }
.fMiscLogo small span { background: linear-gradient(90deg, #ff5e3a, #f2a03c); -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 700; }
.fMiscText p { margin: 0; color: var(--text); font-size: 15px; line-height: 1.65; }
.fMiscFollow { display: flex; align-items: stretch; width: 500px; flex-shrink: 0; border-radius: 2px; background: var(--card); box-shadow: 0 1px 2px rgba(0, 0, 0, .04); }
.fFollowTitle { display: flex; flex-direction: column; justify-content: center; width: 190px; flex-shrink: 0; padding: 0 22px; border-right: 1px solid var(--panel-border); }
.fFollowTitle b { color: var(--text-strong); font-size: 16px; }
.fFollowTitle span { color: var(--muted); font-size: 12.5px; margin-top: 3px; }
.fFollowIcons { flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 22px; }
.fFollowIcons a { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 2px; color: #fff; font-size: 20px; transition: transform .2s, filter .2s; }
.fFollowIcons a:hover { transform: translateY(-3px); filter: brightness(1.1); color: #fff; }
.fFollowIcons a.disabled { opacity: .3; pointer-events: none; }
.fFollowIcons .s-discord { background: #5865f2; }
.fFollowIcons .s-youtube { background: #ff0000; }
.fFollowIcons .s-instagram { background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); }
.fFollowIcons .s-telegram { background: #0088cc; }
.fFollowIcons .s-x { background: #111; }
@media (max-width: 1100px) {
    .fMisc { flex-direction: column; }
    .fMiscFollow { width: auto; }
}
@media (max-width: 600px) {
    .fMiscBrand, .fMiscFollow { flex-direction: column; }
    .fMiscFox { width: auto; padding: 18px; border-right: 0; border-bottom: 1px solid var(--panel-border); }
    .fMiscText { padding: 18px; }
    .fMiscLogo b { font-size: 28px; }
    .fFollowTitle { width: auto; padding: 14px 18px; border-right: 0; border-bottom: 1px solid var(--panel-border); }
    .fFollowIcons { padding: 14px 18px; justify-content: flex-start; flex-wrap: wrap; }
}

/* ================================================================ 2. NAVBAR (sitedeki koyu sekme çubuğu tarzında) */
header.v2 .headerBottom { background: var(--dark-1); box-shadow: 0 2px 6px rgba(31, 33, 48, .12); }
header.v2 .headerBottom > .container { display: flex; align-items: stretch; justify-content: space-between; gap: 10px; height: 48px; }
.hbMain, .hbRight { display: flex; align-items: stretch; margin: 0; padding: 0; list-style: none; }
.hbMain > li, .hbRight > li { position: relative; display: flex; }
.hbMain > li { border-right: 1px solid var(--dark-2); }
.hbMain > li:first-child { border-left: 1px solid var(--dark-2); }
.hbMain > li > a { position: relative; display: flex; align-items: center; gap: 7px; padding: 0 16px; color: #d9dae9; font-size: 13.5px; font-weight: 600; white-space: nowrap; transition: background .2s, color .2s; }
.hbMain > li > a > i:first-child { color: #c2c7cc; font-size: 16px; transition: color .2s; }
.hbMain > li > a .fa-angle-down { margin-left: 2px; color: var(--orange); font-size: 13px; transition: transform .2s; }
.hbMain > li:hover > a { background: var(--dark-2); color: #fff; }
.hbMain > li:hover > a > i:first-child { color: #fff; }
.hbMain > li.parent:hover > a .fa-angle-down { transform: rotate(180deg); }
.hbMain > li.active > a { color: #fff; }
.hbMain > li.active > a > i:first-child { color: var(--orange); }
.hbMain > li.active > a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--orange); }

.hbDrop { position: absolute; top: 100%; left: -1px; z-index: 1120; min-width: 240px; margin: 0; padding: 6px 0; list-style: none; background: var(--card); border-top: 2px solid var(--orange); border-radius: 0 0 2px 2px; box-shadow: 0 10px 34px rgba(31, 33, 48, .25); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .2s, visibility .2s, transform .2s; }
.hbMain > li.parent:hover > .hbDrop, .hbMain > li.parent:focus-within > .hbDrop { opacity: 1; visibility: visible; transform: none; }
.hbDrop > li > a, .hbCol > a { display: flex; align-items: center; gap: 9px; padding: 9px 18px; color: var(--text); font-size: 13.5px; font-weight: 600; white-space: nowrap; transition: background .15s, color .15s; }
.hbDrop > li > a:hover, .hbCol > a:hover { background: var(--hover); color: var(--blue); }
.hbDrop i { color: var(--muted); font-size: 16px; }
.hbDrop a:hover i { color: var(--orange); }
.hbMega { display: grid; width: max-content; max-width: min(1000px, 92vw); grid-template-columns: repeat(var(--hb-cols, 4), auto); padding: 0; }
.hbMega.cols-1 { --hb-cols: 1; }
.hbMega.cols-2 { --hb-cols: 2; }
.hbMega.cols-3 { --hb-cols: 3; }
.hbCol { min-width: 0; padding-bottom: 8px; }
.hbCol + .hbCol { border-left: 1px solid var(--line); }
.hbCol > a { padding: 7px 18px; font-weight: 500; }
.hbCol > a.hbCat { margin-bottom: 6px; padding: 12px 18px; background: var(--dark-2); color: #fff; font-size: 12.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; }
.hbCol > a.hbCat:hover { background: var(--dark-1); color: #fff; }

.hbRight > li > a, .hbRight > li > button { display: flex; align-items: center; gap: 6px; padding: 0 14px; border: 0; border-left: 1px solid var(--dark-2); background: none; color: #d9dae9; font-size: 13.5px; font-weight: 600; cursor: pointer; transition: background .2s, color .2s; }
.hbRight > li:last-child > a, .hbRight > li:last-child > button { border-right: 1px solid var(--dark-2); }
.hbRight > li > a i, .hbRight > li > button i { color: #c2c7cc; font-size: 17px; }
.hbRight > li > a:hover, .hbRight > li > button:hover { background: var(--dark-2); color: #fff; }
.hbRight > li > a:hover i, .hbRight > li > button:hover i { color: var(--orange); }

@media (max-width: 1300px) {
    .hbMain > li > a { padding: 0 12px; font-size: 13px; }
    .hbRight span { display: none; }
}
@media (max-width: 991px) {
    header.v2 .headerBottom > .container { height: 44px; gap: 0; width: 100%; }
    .hbMain { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
    .hbMain::-webkit-scrollbar { display: none; }
    .hbMain > li:first-child { border-left: 0; }
    .hbMain > li > a { padding: 0 12px; font-size: 12.5px; }
    .hbMain > li > a .fa-angle-down, .hbDrop { display: none; }
    .hbRight > li > a, .hbRight > li > button { padding: 0 11px; }
}

/* ================================================================ ALINTI KUTUSU */
.postContent .quote, .sigBody .quote { position: relative; margin: 12px 0 16px; padding: 14px 54px 14px 58px; background: var(--quote); border-radius: 2px; }
.postContent .quote::before, .sigBody .quote::before { content: "\f10d"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; left: 14px; top: 12px; font-size: 30px; line-height: 1; color: var(--quote-icon); }
.postContent .quote::after, .sigBody .quote::after { content: "\f10e"; font-family: "Font Awesome 6 Free"; font-weight: 900; position: absolute; right: 14px; bottom: 10px; font-size: 26px; line-height: 1; color: var(--quote-icon); }
.quoteHead { display: flex; flex-direction: column; margin: 0 0 10px; line-height: 1.3; }
.quoteHead .quoteWho { color: #e8304f; font-size: 14px; font-weight: 700; }
.postContent .quoteHead .quoteLink, .sigBody .quoteHead .quoteLink { align-self: flex-start; margin-top: 2px; color: var(--blue); font-size: 12px; font-style: italic; font-weight: 600; }
.postContent .quoteHead .quoteLink:hover { text-decoration: underline; }
.quote .quote { background: var(--panel); }
body.night .postContent .quote { background: #3a3d54; }
body.night .postContent .quote .quote { background: #2f3247; }
body.night .postContent .quote::before, body.night .postContent .quote::after { color: #555872; }
.postContent a.mention, .sigBody a.mention { color: #e8304f; font-weight: 700; }
.postContent a.mention:hover { text-decoration: underline; }
.postList .post .postContent a.mention { color: #e8304f; }
.postList .post .postContent .quoteHead a.quoteLink { color: var(--blue); font-weight: 600; }

/* ================================================================ UYGULAMALAR BUTONU (9 nokta) */
header.v2 .headerTop .tools { width: 44px; height: 44px; margin-right: 18px; border-radius: 2px; background: var(--dark-1); transition: background .2s; }
header.v2 .headerTop .tools .icon { border: 0; }
header.v2 .headerTop .tools .icon svg { width: 20px; height: 20px; }
header.v2 .headerTop .tools .icon svg circle { fill: #d9dae9; transition: fill .2s; }
header.v2 .headerTop .tools:hover, header.v2 .headerTop .tools:focus-within, header.v2 .headerTop .tools.open { background: var(--orange); }
header.v2 .headerTop .tools:hover .icon svg circle, header.v2 .headerTop .tools.open .icon svg circle { fill: #fff; }
header.v2 .headerTop .tools .menu { top: 54px; }
header.v2 .headerTop .tools .menu::before { left: 15px; }
body.night header.v2 .headerTop .tools { background: #3a3d55; }
body.night header.v2 .headerTop .tools:hover, body.night header.v2 .headerTop .tools.open { background: var(--orange); }

/* ================================================================ AÇIK RENK NAVBAR + UYGULAMALAR BUTONU */
header.v2 .headerBottom { background: var(--panel); border-bottom: 1px solid var(--header-border); box-shadow: none; }
.hbMain > li { border-right-color: var(--line); }
.hbMain > li:first-child { border-left-color: var(--line); }
.hbMain > li > a { color: var(--text); }
.hbMain > li > a > i:first-child { color: var(--muted); }
.hbMain > li:hover > a { background: var(--card); color: var(--blue); }
.hbMain > li:hover > a > i:first-child { color: var(--blue); }
.hbMain > li.active > a { background: var(--card); color: var(--text-strong); }
.hbMain > li.active > a > i:first-child { color: var(--orange); }
.hbRight > li > a, .hbRight > li > button { border-left-color: var(--line); color: var(--text); }
.hbRight > li:last-child > a, .hbRight > li:last-child > button { border-right-color: var(--line); }
.hbRight > li > a i, .hbRight > li > button i { color: var(--muted); }
.hbRight > li > a:hover, .hbRight > li > button:hover { background: var(--card); color: var(--blue); }
.hbRight > li > a:hover i, .hbRight > li > button:hover i { color: var(--orange); }

header.v2 .headerTop .tools, body.night header.v2 .headerTop .tools { background: var(--header-soft); }
header.v2 .headerTop .tools .icon svg circle { fill: var(--header-icon); }
header.v2 .headerTop .tools:hover, header.v2 .headerTop .tools:focus-within, header.v2 .headerTop .tools.open,
body.night header.v2 .headerTop .tools:hover, body.night header.v2 .headerTop .tools.open { background: var(--orange); }
header.v2 .headerTop .tools:hover .icon svg circle, header.v2 .headerTop .tools.open .icon svg circle { fill: #fff; }

/* ---- Navbar: ayraçsız, sade bağlantılar */
.hbMain > li, .hbMain > li:first-child { border: 0; }
.hbMain > li > a { padding: 0 14px; }
.hbMain > li:first-child > a { padding-left: 0; }
.hbMain > li:hover > a, .hbMain > li.active > a { background: none; }
.hbMain > li:hover > a { color: var(--blue); }
.hbMain > li.active > a { color: var(--text-strong); }
.hbMain > li.active > a::after { left: 14px; right: 14px; height: 2px; border-radius: 2px 2px 0 0; }
.hbMain > li:first-child.active > a::after { left: 0; }
.hbRight > li > a, .hbRight > li > button,
.hbRight > li:last-child > a, .hbRight > li:last-child > button { border: 0; background: none; padding: 0 10px; }
.hbRight > li:last-child > a, .hbRight > li:last-child > button { padding-right: 0; }
.hbRight > li > a:hover, .hbRight > li > button:hover { background: none; color: var(--blue); }
.hbMain > li.active > a::after { display: none; }

/* ------------------------------------------------------------------ */
/*  Logo yazı tipi                                                     */
/* ------------------------------------------------------------------ */
.kfLogo .txt b, .fMiscLogo b { font-family: 'Exo 2', 'Open Sans', Arial, sans-serif; font-weight: 800; letter-spacing: -.3px; }
.kfLogo .txt b { font-size: 27px; }
.kfLogo .txt b em, .fMiscLogo b em { margin: 0 2px; }
@media (max-width: 767px) { .kfLogo .txt b { font-size: 21px; } }

/* ------------------------------------------------------------------ */
/*  CKEditor 4 (r10 editörü)                                           */
/* ------------------------------------------------------------------ */
.bbEditor.ckActive { overflow: visible; border: 0; background: transparent; }
.bbEditor.ckActive > .toolbar { display: none; }
.bbEditor.ckActive:focus-within { box-shadow: none; }
.bbEditor .cke_chrome { border: 1px solid var(--input-border); border-radius: 3px; box-shadow: none; padding: 0; overflow: hidden; }
.bbEditor .cke_chrome.cke_focus { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(56, 169, 255, .15); }

/* Araç çubuğu */
.bbEditor .cke_top { padding: 6px 8px; background: var(--toolbar); border-bottom: 1px solid var(--input-border); box-shadow: none; }
.bbEditor .cke_toolbox { display: flex; flex-wrap: wrap; align-items: center; row-gap: 4px; }
.bbEditor .cke_toolbar { display: flex; align-items: center; float: none; height: auto; margin: 0 6px 0 0; padding-right: 6px; border-right: 1px solid var(--input-border); }
.bbEditor .cke_toolbar:nth-last-child(2) { border-right: 0; }
.bbEditor .cke_toolbar:last-child { margin: 0 0 0 auto; padding: 0; border: 0; float: none; }
.bbEditor .cke_toolbar_start, .bbEditor .cke_toolbar_end, .bbEditor .cke_toolbar_separator { display: none; }
.bbEditor .cke_toolgroup { display: flex; align-items: center; gap: 2px; float: none; margin: 0; border: 0; background: transparent; }
.bbEditor .cke_toolgroup a.cke_button:last-child::after { display: none; }

.bbEditor a.cke_button { display: inline-flex; align-items: center; justify-content: center; float: none; width: 30px; height: 30px; padding: 0; margin: 0; border: 0; border-radius: 3px; color: var(--text); transition: background .15s, color .15s; }
.bbEditor a.cke_button .cke_button_icon.kfIcon { display: flex; align-items: center; justify-content: center; float: none; width: auto; height: auto; margin: 0; background: none !important; }
.bbEditor .kfIcon i { font-size: 17px; line-height: 1; color: inherit; }
.bbEditor a.cke_button .cke_button_label { display: none; }
.bbEditor a.cke_button .cke_button_arrow { display: none; }
.bbEditor a.cke_button_off:hover, .bbEditor a.cke_button_off:focus { background: var(--card); color: var(--orange); border: 0; box-shadow: none; }
.bbEditor a.cke_button_on, .bbEditor a.cke_button_on:hover { background: rgba(255, 94, 58, .12); color: var(--orange); border: 0; box-shadow: none; }
.bbEditor a.cke_button_disabled .kfIcon { opacity: .35; }
.bbEditor a.cke_button_disabled:hover { background: transparent; color: var(--text); }
.bbEditor a.cke_button__kfyoutube_off:hover { color: #e62117; }

/* Yazı boyutu kutusu */
.bbEditor .cke_combo { display: flex; align-items: center; float: none; margin: 0 0 0 4px; padding: 0; }
.bbEditor .cke_combo::after { display: none; }
.bbEditor a.cke_combo_button { display: flex; align-items: center; float: none; height: 30px; margin: 0; padding: 0 8px 0 10px; border: 1px solid var(--input-border); border-radius: 3px; background: var(--input-bg); box-shadow: none; }
.bbEditor .cke_combo_off a.cke_combo_button:hover, .bbEditor .cke_combo_off a.cke_combo_button:focus, .bbEditor .cke_combo_on a.cke_combo_button { border-color: var(--orange); background: var(--input-bg); }
.bbEditor .cke_combo_text { float: none; width: 64px; padding: 0; line-height: 28px; color: var(--text); font: 600 12px/28px 'Open Sans', Arial, sans-serif; }
.bbEditor .cke_combo_open { float: none; margin: 0 0 0 4px; height: auto; }
.bbEditor .cke_combo_arrow { margin: 0; border-top-color: var(--muted); }
.bbEditor .cke_combo_disabled a.cke_combo_button { opacity: .4; }

/* BBCode anahtarı */
.bbEditor a.cke_button__kfbbcode { width: auto; gap: 6px; padding: 0 12px; border: 1px solid var(--input-border); background: var(--input-bg); }
.bbEditor a.cke_button__kfbbcode .kfIcon i { font-size: 15px; }
.bbEditor a.cke_button__kfbbcode .cke_button_label { display: inline; float: none; margin: 0; padding: 0; font: 700 12px/1 'Open Sans', Arial, sans-serif; color: inherit; cursor: pointer; opacity: 1; }
.bbEditor a.cke_button__kfbbcode.cke_button_off:hover { border-color: var(--orange); background: var(--input-bg); }
.bbEditor a.cke_button__kfbbcode.cke_button_on, .bbEditor a.cke_button__kfbbcode.cke_button_on:hover { background: var(--orange); border-color: var(--orange); color: #fff; }

/* Temanın üzerine gelme/odak stillerindeki padding-border değişimi butonları kaydırıyordu: ölçüler her durumda sabit */
.bbEditor .cke_top a.cke_button, .bbEditor .cke_top a.cke_button:hover, .bbEditor .cke_top a.cke_button:focus, .bbEditor .cke_top a.cke_button:active { padding: 0 !important; margin: 0 !important; border: 0 !important; outline: 0; }
.bbEditor .cke_top a.cke_button__kfbbcode, .bbEditor .cke_top a.cke_button__kfbbcode:hover, .bbEditor .cke_top a.cke_button__kfbbcode:focus, .bbEditor .cke_top a.cke_button__kfbbcode:active { padding: 0 12px !important; border: 1px solid var(--input-border) !important; }
.bbEditor .cke_top a.cke_button__kfbbcode.cke_button_off:hover { border-color: var(--orange) !important; }
.bbEditor .cke_top a.cke_button__kfbbcode.cke_button_on { border-color: var(--orange) !important; }
.bbEditor .cke_top a.cke_button:focus-visible { box-shadow: 0 0 0 2px rgba(255, 94, 58, .35); }
.bbEditor .cke_top a.cke_combo_button, .bbEditor .cke_top .cke_combo_on a.cke_combo_button, .bbEditor .cke_top .cke_combo_off a.cke_combo_button:hover, .bbEditor .cke_top .cke_combo_off a.cke_combo_button:focus, .bbEditor .cke_top .cke_combo_off a.cke_combo_button:active { padding: 0 8px 0 10px !important; margin: 0 !important; border: 1px solid var(--input-border) !important; outline: 0; }
.bbEditor .cke_top .cke_combo_on a.cke_combo_button, .bbEditor .cke_top .cke_combo_off a.cke_combo_button:hover, .bbEditor .cke_top .cke_combo_off a.cke_combo_button:focus { border-color: var(--orange) !important; }
/* Yazı alanı ve BBCode (kaynak) görünümü */
.bbEditor .cke_contents { background: var(--input-bg); }
.bbEditor textarea.cke_source { padding: 12px 14px; background: var(--input-bg); color: var(--text); font: 13px/1.7 Consolas, 'Courier New', monospace; white-space: pre-wrap; }
.bbEditor .cke_bottom { padding: 0 2px 2px; background: var(--input-bg); border-top: 0; box-shadow: none; }
.bbEditor .cke_resizer { margin-top: 0; border-color: transparent var(--muted) transparent transparent; }
.cke_notifications_area .cke_notification { border-radius: 3px; font-family: 'Open Sans', Arial, sans-serif; }
.cke_reset_all .cke_dialog_ui_input_text input, .cke_dialog_body { font-family: 'Open Sans', Arial, sans-serif; }

/* ------------------------------------------------------------------ */
/*  Spoiler                                                            */
/* ------------------------------------------------------------------ */
details.spoiler { margin: 12px 0; border: 1px solid var(--input-border); border-left: 3px solid var(--orange); border-radius: 3px; background: var(--quote); text-align: left; overflow: hidden; }
details.spoiler > summary { display: flex; align-items: center; gap: 12px; padding: 10px 12px; cursor: pointer; list-style: none; user-select: none; }
details.spoiler > summary::-webkit-details-marker { display: none; }
details.spoiler > summary:hover .spBtn { background: #f04a26; }
.spoiler .spIcon { display: flex; align-items: center; justify-content: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 50%; background: rgba(255, 94, 58, .12); color: var(--orange); font-size: 17px; }
.spoiler .spIcon .ri-eye-line, details.spoiler[open] .spIcon .ri-eye-off-line { display: none; }
details.spoiler[open] .spIcon .ri-eye-line { display: inline; }
.spoiler .spText { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.spoiler .spText b { overflow: hidden; color: var(--text-strong); font-size: 13.5px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.spoiler .spText small { color: var(--muted); font-size: 12px; }
.spoiler .spBtn { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; margin-left: auto; padding: 6px 14px; border-radius: 3px; background: var(--orange); color: #fff; font-size: 12px; font-weight: 700; transition: background .15s; }
.spoiler .spBtn::before { content: "Göster"; }
details.spoiler[open] .spBtn { background: var(--dark-2); }
details.spoiler[open] .spBtn::before { content: "Gizle"; }
details.spoiler[open] > summary .spText small { visibility: hidden; height: 0; }
details.spoiler > .spBody { padding: 12px 15px; border-top: 1px dashed var(--input-border); background: var(--card); }
body.night details.spoiler > .spBody { background: #2f3247; }
body.night details.spoiler[open] .spBtn { background: #3a3d55; }

/* Kısa bilgi mesajı */
#kfToast { position: fixed; left: 50%; bottom: 28px; z-index: 9999; max-width: calc(100% - 32px); padding: 10px 18px; border-radius: 3px; background: var(--dark-1); color: #fff; font-size: 13px; font-weight: 600; box-shadow: var(--shadow); opacity: 0; pointer-events: none; transform: translate(-50%, 10px); transition: opacity .2s, transform .2s; }
#kfToast.show { opacity: 1; transform: translate(-50%, 0); }
body.night #kfToast { background: #3a3d55; }
.robtn.like.own { cursor: default; }

/* Numaralı liste */
.postContent ol { margin: 8px 0 8px 22px; padding: 0; }
.postContent ol li { margin: 2px 0; }

/* ------------------------------------------------------------------ */
/*  Logo (navbar) — daha büyük                                         */
/* ------------------------------------------------------------------ */
header.v2 .kfLogo { gap: 10px; }
header.v2 .kfLogo .foxMark { width: 56px; height: 56px; }
header.v2 .kfLogo .txt b { font-size: 32px; }
header.v2 .kfLogo .txt small { margin-top: 5px; font-size: 14px; }
header.v2 .kfLogo .txt small i { font-size: 12px; }
@media (max-width: 767px) {
    header.v2 .kfLogo .foxMark { width: 42px; height: 42px; }
    header.v2 .kfLogo .txt b { font-size: 24px; }
    header.v2 .kfLogo .txt small { font-size: 12px; }
}

/* ------------------------------------------------------------------ */
/*  Rütbe kartları (r10 tarzı, 159x38)                                 */
/* ------------------------------------------------------------------ */
.kfRank {
    --k1: #8d99ae; --k2: #5c677d;
    position: relative; display: inline-flex; align-items: center; gap: 8px;
    min-width: 159px; height: 38px; padding: 0 30px 0 50px;
    border-radius: 6px; overflow: hidden; vertical-align: middle;
    background: linear-gradient(105deg, var(--k1) 0%, var(--k2) 100%);
    box-shadow: 0 2px 6px rgba(0, 0, 0, .12);
    color: #fff; font-family: 'Exo 2', 'Open Sans', Arial, sans-serif; white-space: nowrap;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .18); user-select: none;
}
/* Sağ kenardaki süs halkaları */
.kfRank::after {
    content: ""; position: absolute; top: 0; right: 0; width: 24px; height: 38px; opacity: .45;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 38'%3E%3Cg fill='none' stroke='%23fff' stroke-width='1.6'%3E%3Ccircle cx='17' cy='7' r='3.6'/%3E%3Ccircle cx='9' cy='19' r='3.6'/%3E%3Ccircle cx='19' cy='29' r='3.6'/%3E%3Ccircle cx='26' cy='18' r='3.6'/%3E%3C/g%3E%3C/svg%3E") no-repeat right center / 24px 38px;
}
/* Hafif parlama */
.kfRank::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 255, 255, .14), rgba(255, 255, 255, 0) 55%); pointer-events: none; }
.kfRank .krFox { position: absolute; left: 0; top: 0; width: 46px; height: 46px; filter: drop-shadow(1px 0 2px rgba(0, 0, 0, .18)); }
.kfRank b { position: relative; font-size: 17px; font-weight: 800; letter-spacing: -.1px; line-height: 1; }
.kfRank em { position: relative; padding: 3px 6px 2px; border: 1.5px solid rgba(255, 255, 255, .85); border-radius: 4px; font-size: 10.5px; font-style: normal; font-weight: 800; letter-spacing: .8px; line-height: 1; }

/* Küçük boy (üye listesi vb.) */
.kfRank.kr-sm { min-width: 0; height: 24px; padding: 0 20px 0 32px; border-radius: 4px; gap: 6px; box-shadow: none; }
.kfRank.kr-sm::after { width: 16px; height: 24px; background-size: 16px 24px; }
.kfRank.kr-sm .krFox { left: 0; top: 0; width: 29px; height: 29px; }
.kfRank.kr-sm b { font-size: 12.5px; }
.kfRank.kr-sm em { padding: 2px 4px 1px; font-size: 9px; }

/* Rütbeler */
.kfRank.kr-new    { --k1: #97a3b8; --k2: #5d6880; }
.kfRank.kr-member { --k1: #4fb3ff; --k2: #1e6fd0; }
.kfRank.kr-active { --k1: #3ddc84; --k2: #13994d; }
.kfRank.kr-senior { --k1: #a57bff; --k2: #6236d1; }
.kfRank.kr-legend { --k1: #ffa54a; --k2: #e3401f; }
.kfRank.kr-mod    { --k1: #20d0bd; --k2: #0a8379; }
.kfRank.kr-admin  { --k1: #ff4d73; --k2: #b8002c; }
/* Üyelik paketleri */
.kfRank.kr-pkg-silver  { --k1: #4cd860; --k2: #1d9a2d; }
.kfRank.kr-pkg-gold    { --k1: #3d9bff; --k2: #1652c4; }
.kfRank.kr-pkg-platin  { --k1: #f0c330; --k2: #b8860b; }
.kfRank.kr-pkg-maxi    { --k1: #5f637d; --k2: #2c2f42; }
.kfRank.kr-pkg-ultra   { --k1: #3a4c8f; --k2: #18204a; }
.kfRank.kr-pkg-sponsor { --k1: #ff8a3d; --k2: #e8361c; }
.kfRank.kr-pkg-featured { --k1: #ff4d73; --k2: #c4003a; }
.kfRank.kr-pkg-nickchange, .kfRank.kr-pkg-notificationad { --k1: #4b4f68; --k2: #2c2e40; }

.postList .post .postUser .userLeft .smallInfo .rank { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.profileHead .who .kfRank, .who > .kfRank { margin: 6px 6px 0 0; }
.memberList .title .kfRank, .title .kfRank.kr-sm { margin-left: 6px; }

/* ------------------------------------------------------------------ */
/*  Ana sayfa sekmeleri: Daha Fazla Yükle                              */
/* ------------------------------------------------------------------ */
.featuredTabs .featuredThreads .list > ul > li:last-child ol li { padding-bottom: 6px; }
.tabMore { padding: 4px 15px 15px; text-align: center; }
.tabMore .rbtn { cursor: pointer; }
.tabMore .rbtn.loading > span:first-child i { display: inline-block; animation: kfSpin .8s linear infinite; }
.tabMore .rbtn.loading > span:first-child i::before { content: "\eec6"; }
.tabMore .rbtn:disabled { cursor: wait; }
@keyframes kfSpin { to { transform: rotate(360deg); } }

/* CKEditor'ün ".cke_reset_all *" siyah rengi ikonlara geçmesin: renk her zaman butondan gelir */
.bbEditor .cke_top a.cke_button { color: var(--text); }
.bbEditor .cke_top a.cke_button .kfIcon, .bbEditor .cke_top a.cke_button .kfIcon i, .bbEditor .cke_top a.cke_button .cke_button_label { color: inherit !important; }
.bbEditor .cke_top a.cke_button_off:hover, .bbEditor .cke_top a.cke_button_off:focus, .bbEditor .cke_top a.cke_button_on { color: var(--orange); }
.bbEditor .cke_top a.cke_button_disabled, .bbEditor .cke_top a.cke_button_disabled:hover { color: var(--text); }
.bbEditor .cke_top a.cke_button__kfyoutube_off:hover { color: #e62117; }
.bbEditor .cke_top a.cke_button__kfbbcode.cke_button_on { color: #fff; }
.bbEditor .cke_top .cke_combo_text { color: var(--text) !important; }
body.night .bbEditor .cke_top .cke_combo_arrow { border-top-color: #b4b6c9; }

/* ------------------------------------------------------------------ */
/*  Knight Online rozetleri (kullanıcı adının yanında, 24px arma)      */
/* ------------------------------------------------------------------ */
.koBadges { display: inline-flex; align-items: center; gap: 3px; margin-left: 4px; vertical-align: middle; }
.koBadge { position: relative; display: inline-flex; width: 24px; height: 24px; flex-shrink: 0; cursor: default; filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, .25)); }
.koShield {
    display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; padding-bottom: 2px;
    background: linear-gradient(160deg, var(--b1) 0%, var(--b2) 100%); color: #fff;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 .8 22 4.2v7.3c0 6-4.2 10.2-10 11.9C6.2 21.7 2 17.5 2 11.5V4.2Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 .8 22 4.2v7.3c0 6-4.2 10.2-10 11.9C6.2 21.7 2 17.5 2 11.5V4.2Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
    position: relative;
}
/* Armanın içindeki ince kenar ve parlama */
.koShield::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, 0) 45%); }
.koShield i { position: relative; font-size: 10.5px; line-height: 1; text-shadow: 0 1px 1px rgba(0, 0, 0, .25); }
.koShield b { position: relative; font: 800 11px/1 'Exo 2', 'Open Sans', Arial, sans-serif; text-shadow: 0 1px 1px rgba(0, 0, 0, .25); }
/* Açıklama balonu */
.koBadge::after {
    content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); z-index: 60;
    padding: 6px 10px; border-radius: 3px; background: #26283b; color: #fff;
    font: 600 11.5px/1.3 'Open Sans', Arial, sans-serif; white-space: nowrap; letter-spacing: 0;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .25); opacity: 0; pointer-events: none;
    transform: translate(-50%, 4px); transition: opacity .15s, transform .15s;
}
.koBadge::before {
    content: ""; position: absolute; left: 50%; bottom: calc(100% + 2px); z-index: 60;
    border: 6px solid transparent; border-top-color: #26283b; border-bottom: 0;
    opacity: 0; transform: translate(-50%, 4px); transition: opacity .15s, transform .15s;
}
.koBadge:hover::after, .koBadge:hover::before { opacity: 1; transform: translate(-50%, 0); }
body.night .koBadge::after { background: #3a3d55; }
body.night .koBadge::before { border-top-color: #3a3d55; }
.postList .post .postUser .userLeft .smallInfo .name { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.profileHead h1 .koBadges, .who h1 .koBadges { margin-left: 8px; }

/* Ayarlar: ırk / sınıf seçimi */
.koPick { display: flex; flex-wrap: wrap; gap: 8px; }
.koPick label { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px 0 10px; border: 1px solid var(--input-border); border-radius: 3px; background: var(--input-bg); color: var(--text); font-weight: 600; cursor: pointer; transition: border-color .15s; }
.koPick label:hover { border-color: var(--orange); }
.koPick input { position: absolute; opacity: 0; pointer-events: none; }
.koPick input:checked + label, .koPick label.on { border-color: var(--orange); box-shadow: 0 0 0 3px rgba(255, 94, 58, .14); color: var(--text-strong); }
.koPick input:focus-visible + label { outline: 2px solid var(--orange); outline-offset: 1px; }
.badgeChecks { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px; }
.badgeChecks label { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 1px solid var(--input-border); border-radius: 3px; cursor: pointer; }
.badgeChecks label small { display: block; color: var(--muted); font-size: 11.5px; line-height: 1.3; }
.badgeChecks label b { display: block; color: var(--text-strong); font-size: 13px; }

/* Yönetim: üye detayı — sütunlar içerik kadar uzar, boşluk bırakmaz */
.adminGrid.alignTop { align-items: start; }
.adminGrid.alignTop > div > .rPanel:last-child { margin-bottom: 25px; }
.rPanel.ipList .adminList { max-height: 264px; overflow-y: auto; }

/* Ayarlar: kullanıcı adı değiştirme */
.nickForm { margin-top: 25px; padding-top: 20px; border-top: 1px solid var(--line); }
.nickForm h3 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; color: var(--text-strong); font-size: 14px; }

/* ==========================================================================
   Konu önekleri — renkli etiketler (prefix_html, yönetim: Konu Önekleri)
   Renkler satır içi değişkenlerden gelir: --pb arka plan, --pf yazı rengi.
   ========================================================================== */
.prefixPill {
    display: inline-block; position: relative; top: -1px; vertical-align: middle;
    max-width: 180px; height: 18px; margin-right: 1px; padding: 0 6px;
    border-radius: 3px; background: var(--pb, #7c7fc6); color: var(--pf, #fff);
    font: 700 11px/18px 'Open Sans', Arial, sans-serif; letter-spacing: .2px; text-transform: uppercase;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-decoration: none;
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .12);
}
.prefixPill[hidden] { display: none; }
a .prefixPill, a:hover .prefixPill { color: var(--pf, #fff); text-decoration: none; }
body.night .prefixPill { box-shadow: inset 0 -1px 0 rgba(0, 0, 0, .25); filter: brightness(.93); }
/* Konu sayfası başlığı (h1) */
.breadCrumb .top .left h1 .prefixPill { top: -2px; height: 20px; padding: 0 7px; font-size: 11.5px; line-height: 20px; }
/* Profil konu listesi ve yönetim tabloları: başlıkla aynı hizada */
.userThreads li .thread > a .prefixPill, .adminTable td .prefixPill { top: -1px; }
/* Konu açma / düzenleme: etiketin yanındaki önizleme */
.prefixGroup label .prefixPill { top: -1px; margin-left: 6px; }
.prefixGroup label .prefix { margin-left: 6px; }
/* Yönetim: önek listesi ve formu */
.prefixTable td.ops:first-child { width: 1%; }
.prefixTable td.ops:first-child .robtn { width: 30px; padding: 0; justify-content: center; font-size: 16px; }
.prefixTable td.ops:first-child .robtn[disabled] { opacity: .35; cursor: default; pointer-events: none; }
.prefixTable code { font-size: 11.5px; }
.colorDot { display: inline-block; width: 14px; height: 14px; margin-right: 5px; border: 1px solid rgba(0, 0, 0, .15); border-radius: 3px; vertical-align: middle; }
.pillPreview { display: flex; align-items: center; gap: 2px; height: 40px; padding: 0 12px; border: 1px dashed var(--input-border); border-radius: 3px; overflow: hidden; white-space: nowrap; font-size: 14px; color: var(--text-strong); font-weight: 600; }
.pillPreview .prefixPill { top: 0; }

/* ------------------------------------------------------------------ */
/*  Paket yetkileri: renkli ad, vurgulu konu, öne çıkan, yetki tablosu */
/* ------------------------------------------------------------------ */
a.username.nameColor, .username.nameColor { color: var(--pkg) !important; font-weight: 700; }
.threadList .thread.hlThread { position: relative; background: linear-gradient(90deg, color-mix(in srgb, var(--pkg) 9%, transparent), transparent 60%); }
.threadList .thread.hlThread::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--pkg); }
.threadList .thread.featuredThread { background: linear-gradient(90deg, rgba(255, 94, 58, .1), transparent 65%); }
.featuredLabel { color: var(--orange) !important; }
.featuredLabel i { font-size: 12px; }
.fSponsors a.spMember { display: inline-flex; align-items: center; gap: 4px; }
.fSponsors a.spMember i { color: #f2a03c; }

.permTable th, .permTable td { white-space: nowrap; vertical-align: middle; }
.permTable td:first-child { white-space: normal; min-width: 220px; }
.permTable th.mine, .permTable td.mine { background: rgba(56, 169, 255, .08); }
.permTable .permYes { color: var(--green); font-weight: 600; }
.permTable .permNo { color: var(--muted); }
.permTable .pkgDot { margin-right: 6px; }
.perkUse .formRow { align-items: center; }
.perkTeaser { display: none; }
.svcSelect { margin: 8px 0 0; font-size: 12.5px; }
.svcNote { margin: 8px 0 0; color: var(--muted); font-size: 12px; }

/* Yönetim: yetki matrisi */
.permMatrix input[type=number] { width: 90px; height: 32px; padding: 0 8px; }
.permMatrix .unit { margin-left: 4px; color: var(--muted); font-size: 11.5px; }
.permMatrix td.colBase { background: rgba(56, 169, 255, .06); }
.helpList { margin: 0; padding-left: 18px; }
.helpList li { margin: 6px 0; line-height: 1.55; }
.permMatrix td { white-space: nowrap; }
.permMatrix td:first-child { white-space: normal; }
.permMatrix input[type=number] { display: inline-block; vertical-align: middle; }
.controlBlock .perkUse { padding: 15px 18px 5px; }
.controlBlock .perkUse p { margin: 0 0 12px; }

/* Yalnızca ekran okuyucular ve arama motorları için (görsel olarak gizli) */
.srOnly{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}

/* Ana menü: renkli ikon kutuları */
.hbMain > li > a > i.navIc, .hbRight > li > a > i.navIc { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 7px; font-size: 15px; line-height: 1; color: var(--ic); background: var(--ic-bg); transition: transform .2s, background .2s, color .2s; }
.hbMain > li:hover > a > i.navIc, .hbRight > li:hover > a > i.navIc, .hbMain > li.active > a > i.navIc { color: #fff; background: var(--ic); transform: translateY(-1px); }
.navIc.ic-blue   { --ic: #2f80ed; --ic-bg: rgba(47, 128, 237, .12); }
.navIc.ic-purple { --ic: #8e44ec; --ic-bg: rgba(142, 68, 236, .12); }
.navIc.ic-red    { --ic: #f2453d; --ic-bg: rgba(242, 69, 61, .12); }
.navIc.ic-green  { --ic: #1fb36b; --ic-bg: rgba(31, 179, 107, .13); }
.navIc.ic-pink   { --ic: #e8457c; --ic-bg: rgba(232, 69, 124, .12); }
.navIc.ic-teal   { --ic: #12a5b8; --ic-bg: rgba(18, 165, 184, .13); }
.navIc.ic-orange { --ic: #f58a07; --ic-bg: rgba(245, 138, 7, .14); }
body.night .navIc { --ic-bg: rgba(255, 255, 255, .08); }
@media (max-width: 767px) {
    .hbMain > li > a > i.navIc { width: 22px; height: 22px; font-size: 13px; border-radius: 6px; }
}