/* Tasarım 5 · yenilenmiş arayüz katmanı
   style.css'ten sonra yüklenir. Eski görsel butonların ve ikonların yerine CSS butonlar ve SVG ikonlar (zp-ikonlar.css,
   araclar/tema-ikonlar.py üretir). Bütün renkler temanın düzenleyici değişkenlerinden gelir (--zp-…); bu yüzden
   admin → Site teması → Düzenleyici'deki her renge, palete ve koyu/açık moda kendiliğinden uyar.
   Sık kullanılanlar: vurgu --zp-vurgu-metin-ffc345 · açık vurgu --zp-vurgu-metin-ffdf86 · koyu vurgu --zp-vurgu-kenar-6a4f15
   panel --zp-panel-zemin-091731 / -0b1d3d / -10264f / -070911 · panel kenarı --zp-panel-kenar-13336c
   metin --zp-metin-metin-ffffff · soluk metin --zp-metin-metin-a8a8a8 · çizgi --zp-kenar-kenar-323232
   zemin (vurgu üstündeki yazı için de) --zp-zemin-zemin-000000 */

/* ---- İkon yardımcısı: ikon maskesi + renk ---- */
#main #head_topbar #head_topbar_container .button::before,
#main #head_topbar #head_topbar_container #topbar_time::before,
#middle_panel_down_button .t5-indir-ikon::before,
#middle_panel_user_panel_notmember .middle_panel_user_panel_button::before,
#middle_panel_user_panel_member .middle_panel_userpanel_link a::before,
#middle_panel_links .middle_panel_links_button::before,
#main #middle_panel #middle_panel_social .social_button::before,
#main #index_followus #index_followus_socialmedia ul li a::before,
#chardetail_container #chardetail_buttons .chardetail_button::before {
    content: "";
    display: block;
    background-color: currentColor;
    -webkit-mask: var(--t5-ikon) center / contain no-repeat;
    mask: var(--t5-ikon) center / contain no-repeat;
}

/* ---- Üst çubuk ---- */
#main #head_topbar #head_topbar_container .button {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    width: auto;
    height: 28px;
    margin-top: 5px;
    padding: 0 14px;
    border: 1px solid var(--zp-kenar-kenar-4b4b4b, #4b4b4b);
    border-radius: 999px;
    background: transparent !important;
    color: var(--zp-metin-metin-ffffff, #ffffff);
    font-size: 12px;
    line-height: 1;
    letter-spacing: .3px;
    text-shadow: none;
    transition: transform .15s ease, border-color .15s ease, background-color .15s ease, filter .15s ease;
}
#main #head_topbar #head_topbar_container .button::before { width: 14px; height: 14px; }
#main #head_topbar #head_topbar_container .button:hover { transform: translateY(-1px); border-color: var(--zp-vurgu-kenar-ffc345, #ffc345); }
#main #head_topbar #head_topbar_container #button_charge {
    border-color: transparent;
    background: linear-gradient(180deg, var(--zp-vurgu-metin-ffdf86, #ffdf86), var(--zp-vurgu-metin-ffc345, #ffc345)) !important;
    color: var(--zp-zemin-zemin-000000, #000000);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .25);
    --t5-ikon: var(--t5-ikon-cuzdan);
}
#main #head_topbar #head_topbar_container #button_charge:hover { filter: brightness(1.08); }
#main #head_topbar #head_topbar_container #button_login { border-color: var(--zp-vurgu-kenar-ffc345, #ffc345); color: var(--zp-vurgu-metin-ffc345, #ffc345); --t5-ikon: var(--t5-ikon-giris); }
#main #head_topbar #head_topbar_container #button_reg { --t5-ikon: var(--t5-ikon-kayit); }
#main #head_topbar #head_topbar_container #button_logout { --t5-ikon: var(--t5-ikon-cikis); }
#main #head_topbar #head_topbar_container #topbar_time { display: flex; align-items: center; gap: 8px; padding-left: 0; background: none; }
#main #head_topbar #head_topbar_container #topbar_time::before { width: 16px; height: 16px; color: var(--zp-vurgu-metin-ffc345, #ffc345); --t5-ikon: var(--t5-ikon-saat); }
#main #head_topbar #head_topbar_container #topbar_time .time { font-variant-numeric: tabular-nums; }

/* Ana sayfa ikonu (menünün solunda) */
.home_button {
    background: var(--zp-vurgu-metin-ffc345, #ffc345) !important;
    -webkit-mask: var(--t5-ikon-ev) center / 24px no-repeat;
    mask: var(--t5-ikon-ev) center / 24px no-repeat;
    transition: transform .15s ease;
}
.home_button:hover { transform: translateY(-2px); }

/* ---- Sol panel: indirme butonu ---- */
#middle_panel_down_button {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 0 18px;
    box-sizing: border-box;
    border-radius: 10px;
    background: linear-gradient(135deg, var(--zp-vurgu-metin-ffdf86, #ffdf86) 0%, var(--zp-vurgu-metin-ffc345, #ffc345) 55%, var(--zp-vurgu-metin-d2a13e, #d2a13e) 100%) !important;
    color: var(--zp-zemin-zemin-000000, #000000);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 22px rgba(0, 0, 0, .35);
    overflow: hidden;
    transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
#middle_panel_down_button::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, .28) 45%, transparent 60%);
    transform: translateX(-100%);
    transition: transform .6s ease;
    pointer-events: none;
}
#middle_panel_down_button:hover { transform: translateY(-2px); filter: brightness(1.05); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 12px 26px rgba(0, 0, 0, .4); }
#middle_panel_down_button:hover::after { transform: translateX(100%); }
#middle_panel_down_button .t5-indir-ikon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 50px;
    height: 50px;
    border: 2px solid currentColor;
    border-radius: 50%;
    opacity: .9;
}
#middle_panel_down_button .t5-indir-ikon::before { width: 26px; height: 26px; --t5-ikon: var(--t5-ikon-indir); }
#middle_panel_down_button .t5-indir-metin { display: flex; flex-direction: column; line-height: 1; min-width: 0; }
#middle_panel_down_button .t5-indir-metin b { font-size: 24px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; }
#middle_panel_down_button .t5-indir-metin small { margin-top: 6px; font-size: 11.5px; font-weight: 700; letter-spacing: 1.2px; text-transform: uppercase; opacity: .8; }

/* ---- Sol panel: üye olmayan kutuları ---- */
#middle_panel_user_panel_notmember {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 1fr;
    gap: 6px;
}
#middle_panel_user_panel_notmember > a { display: block; text-decoration: none !important; }
#middle_panel_user_panel_notmember .middle_panel_user_panel_button {
    float: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    width: auto;
    height: 100%;
    padding: 0;
    box-sizing: border-box;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 9px;
    background: linear-gradient(180deg, var(--zp-panel-zemin-10264f, #10264f), var(--zp-panel-zemin-091731, #091731)) !important;
    color: var(--zp-metin-metin-ffffff, #ffffff);
    font-size: 12px;
    letter-spacing: .6px;
    text-shadow: none;
    transition: transform .15s ease, border-color .15s ease, box-shadow .15s ease;
}
#middle_panel_user_panel_notmember .middle_panel_user_panel_button::before { width: 24px; height: 24px; color: var(--zp-vurgu-metin-ffc345, #ffc345); }
#middle_panel_user_panel_notmember .middle_panel_user_panel_button:hover {
    transform: translateY(-2px);
    border-color: var(--zp-vurgu-kenar-ffc345, #ffc345);
    box-shadow: 0 6px 16px rgba(0, 0, 0, .3), inset 0 0 0 1px var(--zp-vurgu-kenar-ffc345, #ffc345);
}
#middle_panel_user_panel_login_button { --t5-ikon: var(--t5-ikon-giris); }
#middle_panel_user_panel_register_button { --t5-ikon: var(--t5-ikon-kayit); }
#middle_panel_user_panel_buysilk_button { --t5-ikon: var(--t5-ikon-canta); }
#middle_panel_user_panel_support_button { --t5-ikon: var(--t5-ikon-destek); }

/* ---- Sol panel: üye paneli (giriş yapmışken) ---- */
#middle_panel_user_panel_member .middle_panel_userpanel_link { background-image: none !important; }
#middle_panel_user_panel_member .middle_panel_userpanel_link a { display: inline-flex; align-items: center; gap: 8px; }
#middle_panel_user_panel_member .middle_panel_userpanel_link a::before { width: 16px; height: 16px; color: var(--zp-vurgu-metin-ffc345, #ffc345); }
#middle_panel_user_panel_buysilk { --t5-ikon: var(--t5-ikon-cuzdan); }
#middle_panel_user_panel_buyitem { --t5-ikon: var(--t5-ikon-canta); }
#middle_panel_user_panel_support { --t5-ikon: var(--t5-ikon-destek); }
#middle_panel_user_panel_myaccount { --t5-ikon: var(--t5-ikon-ayar); }
#middle_panel_user_panel_logout { --t5-ikon: var(--t5-ikon-cikis); }
#middle_panel_user_panel_member #middle_panel_user_panel_silkbalance { background-image: none !important; }

/* ---- Sol panel: bağlantılar ---- */
/* solmenu.php öğeye satır içi top:250px veriyor; kutularla arasında nefes payı */
#middle_panel_links { display: flex; flex-direction: column; gap: 8px; top: 260px !important; height: auto; }
#middle_panel_links > a { display: block; text-decoration: none !important; }
#middle_panel_links .middle_panel_links_button {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 46px;
    padding: 0 14px;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 9px;
    background: linear-gradient(180deg, var(--zp-panel-zemin-10264f, #10264f), var(--zp-panel-zemin-091731, #091731)) !important;
    color: var(--zp-metin-metin-ffffff, #ffffff);
    font-size: 13.5px;
    opacity: 1;
    transition: border-color .15s ease, box-shadow .15s ease;
}
#middle_panel_links .middle_panel_links_button::before {
    position: static;
    top: auto;
    left: auto;
    width: 20px;
    height: 20px;
    background-image: none;
    color: var(--zp-vurgu-metin-ffc345, #ffc345);
}
#middle_panel_links .middle_panel_links_button::after {
    content: "";
    width: 16px;
    height: 16px;
    margin-left: auto;
    background-color: var(--zp-metin-metin-a8a8a8, #a8a8a8);
    -webkit-mask: var(--t5-ikon-ok-sag) center / contain no-repeat;
    mask: var(--t5-ikon-ok-sag) center / contain no-repeat;
    transition: transform .15s ease;
}
#middle_panel_links .middle_panel_links_button:hover { border-color: var(--zp-vurgu-kenar-ffc345, #ffc345); box-shadow: 0 6px 16px rgba(0, 0, 0, .3); }
#middle_panel_links .middle_panel_links_button:hover::after { transform: translateX(3px); background-color: var(--zp-vurgu-metin-ffc345, #ffc345); }
#middle_panel_links_stats_button { --t5-ikon: var(--t5-ikon-grafik); }
#middle_panel_links_forum_button { --t5-ikon: var(--t5-ikon-simsek); }
#middle_panel_links_guide_button { --t5-ikon: var(--t5-ikon-dukkan); }
#middle_panel_banner img { border-radius: 8px; }

/* ---- Ana sayfa: sosyal medya kutusu ---- */
#main #middle_panel #middle_panel_social .social_button {
    display: grid;
    place-items: center;
    width: 54px;
    height: 54px;
    margin: 6px 4px;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 12px;
    background: var(--zp-panel-zemin-091731, #091731) !important;
    color: var(--zp-vurgu-metin-ffc345, #ffc345);
    transition: transform .15s ease, background-color .15s ease, color .15s ease;
}
#main #middle_panel #middle_panel_social .social_button::before { width: 24px; height: 24px; }
#main #middle_panel #middle_panel_social .social_button:hover { transform: translateY(-2px); background: var(--zp-vurgu-zemin-ffc345, #ffc345) !important; color: var(--zp-zemin-zemin-000000, #000000); }
#social_button_fb { --t5-ikon: var(--t5-ikon-facebook); }
#social_button_ds { --t5-ikon: var(--t5-ikon-discord); }
#social_button_ig { --t5-ikon: var(--t5-ikon-instagram); }
#social_button_tw { --t5-ikon: var(--t5-ikon-twitter); }
#social_button_yt { --t5-ikon: var(--t5-ikon-youtube); }
#social_button_fr { --t5-ikon: var(--t5-ikon-forum); }

/* Bizi takip edin bölümü */
#main #index_followus #index_followus_socialmedia ul li a {
    display: inline-grid;
    place-items: center;
    width: 72px;
    height: 72px;
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 18px;
    background: rgba(0, 0, 0, .35) !important;
    color: var(--zp-vurgu-metin-ffc345, #ffc345);
    backdrop-filter: blur(4px);
    transition: transform .15s ease, background-color .15s ease, color .15s ease;
}
#main #index_followus #index_followus_socialmedia ul li a::before { width: 30px; height: 30px; }
#main #index_followus #index_followus_socialmedia ul li a:hover { transform: translateY(-3px); background: var(--zp-vurgu-zemin-ffc345, #ffc345) !important; color: var(--zp-zemin-zemin-000000, #000000); }
#main #index_followus #index_followus_socialmedia ul li a.facebook { --t5-ikon: var(--t5-ikon-facebook); }
#main #index_followus #index_followus_socialmedia ul li a.instagram { --t5-ikon: var(--t5-ikon-instagram); }
#main #index_followus #index_followus_socialmedia ul li a.youtube { --t5-ikon: var(--t5-ikon-youtube); }
#main #index_followus #index_followus_socialmedia ul li a.twitter { --t5-ikon: var(--t5-ikon-twitter); }

/* ---- Ana sayfa: haber sekmeleri ---- */
#main #middle_panel #middle_panel_news .middle_panel_news_tab { transition: background-color .15s ease, color .15s ease; }
#main #middle_panel #middle_panel_news .middle_panel_news_tab:hover { color: var(--zp-vurgu-metin-ffc345, #ffc345); }
#main #middle_panel #middle_panel_news .middle_panel_news_tab.selectedtab { box-shadow: inset 0 -2px 0 var(--zp-vurgu-kenar-ffc345, #ffc345); color: var(--zp-vurgu-metin-ffc345, #ffc345); }

/* ---- Genel buton (yeni işaretleme: .t5-buton) ---- */
.t5-buton {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 34px;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(180deg, var(--zp-vurgu-metin-ffdf86, #ffdf86), var(--zp-vurgu-metin-ffc345, #ffc345));
    color: var(--zp-zemin-zemin-000000, #000000) !important;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .3px;
    text-decoration: none !important;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 3px 10px rgba(0, 0, 0, .25);
    transition: transform .15s ease, filter .15s ease;
}
.t5-buton:hover { transform: translateY(-1px); filter: brightness(1.07); }
.t5-buton-kucuk { height: 26px; padding: 0 14px; font-size: 12px; border-radius: 6px; }

/* ---- Eşya mağazası kutuları ve butonlar ---- */
.item_box .item_box_price { display: flex; align-items: center; justify-content: center; gap: 6px; }
.item_box .t5-fiyat-ikon {
    width: 16px;
    height: 16px;
    background-color: var(--zp-vurgu-metin-ffc345, #ffc345);
    -webkit-mask: var(--t5-ikon-cuzdan) center / contain no-repeat;
    mask: var(--t5-ikon-cuzdan) center / contain no-repeat;
}
.item_box .item_box_buybutton { height: auto; }
/* Vitrin kaydırma okları (owl carousel) */
#item_mall_prew .owl-prev, #item_mall_prew .owl-next {
    display: grid !important;
    place-items: center;
    width: 44px !important;
    height: 44px !important;
    top: 62px !important;
    border: 1px solid var(--zp-vurgu-kenar-6a4f15, #6a4f15) !important;
    border-radius: 50% !important;
    background: rgba(0, 0, 0, .45) !important;
    font-size: 0 !important;
    color: var(--zp-vurgu-metin-ffc345, #ffc345) !important;
    backdrop-filter: blur(4px);
    transition: transform .15s ease, background-color .15s ease, color .15s ease;
}
#item_mall_prew .owl-prev::before, #item_mall_prew .owl-next::before {
    content: "";
    width: 20px;
    height: 20px;
    background-color: currentColor;
    -webkit-mask: var(--t5-ikon-ok-sol) center / contain no-repeat;
    mask: var(--t5-ikon-ok-sol) center / contain no-repeat;
}
#item_mall_prew .owl-next::before { -webkit-mask-image: var(--t5-ikon-ok-sag); mask-image: var(--t5-ikon-ok-sag); }
#item_mall_prew .owl-prev:hover, #item_mall_prew .owl-next:hover { background: var(--zp-vurgu-zemin-ffc345, #ffc345) !important; color: var(--zp-zemin-zemin-000000, #000000) !important; transform: scale(1.06); }
#item_mall_prew .owl-prev span, #item_mall_prew .owl-next span { display: none; }
.item_box {
    border: 1px solid var(--zp-vurgu-kenar-6a4f15, #6a4f15);
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .04), rgba(0, 0, 0, .25));
    transition: border-color .15s ease, box-shadow .15s ease;
}
/* Kaydırıcı (owl) taşan kısmı kestiği için kart yukarı kalkmaz; çerçeve ve iç parıltı yeter */
.item_box:hover { border-color: var(--zp-vurgu-kenar-ffc345, #ffc345); box-shadow: inset 0 0 0 1px var(--zp-vurgu-kenar-ffc345, #ffc345), inset 0 -40px 50px -30px color-mix(in srgb, var(--zp-vurgu-kenar-ffc345, #ffc345) 22%, transparent); }
.item_box .item_box_buybutton .button, .item_box .item_box_buybutton a, .item_box .item_box_buybutton button, .item_box .item_box_buybutton img { border-radius: 6px; }
.button1 {
    border-radius: 8px;
    border: 1px solid var(--zp-vurgu-kenar-ffc345, #ffc345);
    transition: background-color .15s ease, color .15s ease, transform .15s ease;
}
.button1:hover { transform: translateY(-1px); border-color: transparent; }

/* ---- Sıralama ---- */
.table_rank { border-collapse: separate; border-spacing: 0; border-radius: 8px; overflow: hidden; }
.table_rank tbody tr { transition: background-color .12s ease; }
.table_rank tbody tr:hover td { background-color: var(--zp-panel-zemin-0b1d3d, #0b1d3d); }
#rankLabelDiv { border-radius: 8px 8px 0 0; letter-spacing: .5px; }

/* ---- Karakter sayfası ---- */
#chardetail_container #chardetail_label {
    background: linear-gradient(120deg, var(--zp-panel-zemin-10264f, #10264f) 0%, var(--zp-panel-zemin-091731, #091731) 55%, var(--zp-panel-zemin-070911, #070911) 100%) !important;
    color: var(--zp-metin-metin-ffffff, #ffffff);
}
#chardetail_container #chardetail_label #chardetail_label_charname { color: var(--zp-metin-metin-ffffff, #ffffff); letter-spacing: .3px; }
#chardetail_container #chardetail_label #chardetail_label_charpoint { color: var(--zp-metin-metin-a8a8a8, #a8a8a8); }
#chardetail_container #chardetail_label #chardetail_label_charimage { border-radius: 6px; box-shadow: 0 4px 14px rgba(0, 0, 0, .4); }
#chardetail_container #chardetail_buttons .chardetail_button {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    height: 120px;
    padding: 0;
    box-sizing: border-box;
    background: var(--zp-panel-zemin-091731, #091731) !important;
    color: var(--zp-metin-metin-a8a8a8, #a8a8a8);
    transition: background-color .15s ease, color .15s ease;
}
#chardetail_container #chardetail_buttons .chardetail_button::before { width: 40px; height: 40px; }
#chardetail_container #chardetail_buttons .chardetail_button:hover { color: var(--zp-metin-metin-ffffff, #ffffff); background: var(--zp-panel-zemin-0b1d3d, #0b1d3d) !important; }
#chardetail_container #chardetail_buttons .chardetail_button.chardetail_button_selected {
    color: var(--zp-vurgu-metin-ffc345, #ffc345);
    background: var(--zp-panel-zemin-10264f, #10264f) !important;
    box-shadow: inset 0 -3px 0 var(--zp-vurgu-kenar-ffc345, #ffc345);
}
#chardetail_button_profile { --t5-ikon: var(--t5-ikon-kalkan); }
#chardetail_button_global { --t5-ikon: var(--t5-ikon-mesaj); }
#chardetail_button_unique { --t5-ikon: var(--t5-ikon-kiliclar); }
#chardetail_container #chardetail_info_container {
    height: auto;
    min-height: 128px;
    display: flex !important; /* öğede satır içi display:block var */
    box-sizing: border-box;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 10px;
    background: var(--zp-panel-zemin-091731, #091731) !important;
    overflow: hidden;
}
#chardetail_container #chardetail_info_container .chardetail_hpmpbox,
#chardetail_container #chardetail_info_container .chardetail_strintbox { flex: 1 1 0; width: auto; height: auto; padding-bottom: 12px; }
#chardetail_container #chardetail_info_container .chardetail_hpmpbox + .chardetail_strintbox { border-left: 1px solid var(--zp-panel-kenar-13336c, #13336c); }
#chardetail_container #chardetail_info_container .chardetail_strintbox_right { color: var(--zp-metin-metin-a8a8a8, #a8a8a8); }
.table_chardetail_details td { border-bottom: 1px solid var(--zp-kenar-kenar-323232, #323232); }

/* ---- Sıralama menüsü (siralama.php: #ranking-menu, Bootstrap .btn) ---- */
#ranking-menu { gap: 6px; }
#ranking-menu h4 {
    border-radius: 8px;
    background: linear-gradient(180deg, var(--zp-panel-zemin-10264f, #10264f), var(--zp-panel-zemin-091731, #091731)) !important;
    color: var(--zp-vurgu-metin-ffc345, #ffc345);
    letter-spacing: .6px;
    text-transform: uppercase;
    font-size: 13px !important;
}
#ranking-menu a.btn {
    margin: 0 !important;
    padding: 9px 12px;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c) !important;
    border-radius: 8px;
    background: var(--zp-panel-zemin-091731, #091731) !important;
    color: var(--zp-metin-metin-ffffff, #ffffff) !important;
    font-size: 13px;
    font-weight: 600;
    text-align: left;
    box-shadow: none !important;
    transition: transform .15s ease, border-color .15s ease, background-color .15s ease;
}
#ranking-menu a.btn:hover { transform: translateX(3px); border-color: var(--zp-vurgu-kenar-ffc345, #ffc345) !important; background: var(--zp-panel-zemin-10264f, #10264f) !important; }
#ranking-menu a.btn.active {
    border-color: transparent !important;
    background: linear-gradient(180deg, var(--zp-vurgu-metin-ffdf86, #ffdf86), var(--zp-vurgu-metin-ffc345, #ffc345)) !important;
    color: var(--zp-zemin-zemin-000000, #000000) !important;
}

/* ---- Formlar: giriş, kayıt, şifremi unuttum, e-pin, arama ---- */
.gg_input_div, .gg_input_epinserial_div {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 445px;
    height: 50px;
    padding: 0 16px;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 10px;
    background: var(--zp-panel-zemin-070911, #070911) !important;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.gg_input_div:focus-within, .gg_input_epinserial_div:focus-within {
    border-color: var(--zp-vurgu-kenar-ffc345, #ffc345);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--zp-vurgu-kenar-ffc345, #ffc345) 22%, transparent);
}
.gg_input { width: 100%; height: 100%; color: var(--zp-metin-metin-ffffff, #ffffff); outline: none; }
.gg_input::placeholder { color: var(--zp-metin-metin-a8a8a8, #a8a8a8); opacity: 1; }
.gg_input_epin, .search_content #searchBoxDiv .gg_input_searchbox {
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c) !important;
    border-radius: 10px;
    background: var(--zp-panel-zemin-070911, #070911) !important;
    outline: none;
}
.gg_input_epin:focus, .search_content #searchBoxDiv .gg_input_searchbox:focus { border-color: var(--zp-vurgu-kenar-ffc345, #ffc345) !important; }

/* Büyük işlem butonu (Giriş Yap, Kayıt Ol, Gönder…) */
#login_button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 306px;
    height: 52px;
    margin: 25px auto;
    border-radius: 10px;
    background: linear-gradient(180deg, var(--zp-vurgu-metin-ffdf86, #ffdf86), var(--zp-vurgu-metin-ffc345, #ffc345)) !important;
    color: var(--zp-zemin-zemin-000000, #000000);
    font-size: 17px;
    font-weight: 800;
    letter-spacing: .6px;
    line-height: 1;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 20px rgba(0, 0, 0, .3);
    transition: transform .15s ease, filter .15s ease;
}
#login_button:hover { transform: translateY(-2px); filter: brightness(1.06); }
#login_label { display: flex; align-items: center; justify-content: center; gap: 10px; }
.login_icon, .register_icon {
    position: static;
    width: 26px;
    height: 26px;
    background: var(--zp-vurgu-metin-ffc345, #ffc345) !important;
    -webkit-mask: var(--t5-ikon-giris) center / contain no-repeat;
    mask: var(--t5-ikon-giris) center / contain no-repeat;
}
.register_icon { -webkit-mask-image: var(--t5-ikon-kayit); mask-image: var(--t5-ikon-kayit); }
.sifre_icon { -webkit-mask-image: var(--t5-ikon-kalkan); mask-image: var(--t5-ikon-kalkan); }
.support_icon, .download_icon {
    background: var(--zp-vurgu-metin-ffc345, #ffc345) !important;
    -webkit-mask: var(--t5-ikon-destek) center / contain no-repeat;
    mask: var(--t5-ikon-destek) center / contain no-repeat;
}
.download_icon { width: 18px; height: 18px; -webkit-mask-image: var(--t5-ikon-indir); mask-image: var(--t5-ikon-indir); }
.login_link_text a { color: var(--zp-metin-metin-ffffff, #ffffff); text-underline-offset: 3px; }
.login_link_text a:hover { color: var(--zp-vurgu-metin-ffc345, #ffc345); }

/* İndirme sayfası */
#down_logo2 {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    width: 320px;
    height: 58px;
    border-radius: 12px;
    background: linear-gradient(135deg, var(--zp-vurgu-metin-ffdf86, #ffdf86), var(--zp-vurgu-metin-ffc345, #ffc345) 60%, var(--zp-vurgu-metin-d2a13e, #d2a13e)) !important;
    color: var(--zp-zemin-zemin-000000, #000000);
    font-size: 18px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 8px 22px rgba(0, 0, 0, .35);
    transition: transform .15s ease, filter .15s ease;
}
#down_logo2:hover { transform: translateY(-2px); filter: brightness(1.06); }
#down_logo2 .t5-ikon-kutu {
    width: 24px;
    height: 24px;
    background: currentColor;
    -webkit-mask: var(--t5-ikon-indir) center / contain no-repeat;
    mask: var(--t5-ikon-indir) center / contain no-repeat;
}
.button4, .button2 {
    border-radius: 8px;
    border-color: var(--zp-vurgu-kenar-6a4f15, #6a4f15);
    transition: transform .15s ease, background-color .15s ease, border-color .15s ease;
}
.button4:hover, .button2:hover { transform: translateY(-1px); border-color: var(--zp-vurgu-kenar-ffc345, #ffc345); }
.button3 { border-radius: 8px; transition: transform .15s ease, filter .15s ease; }
.button3:hover { transform: translateY(-1px); filter: brightness(1.06); }
/* Boş durum: indirme dosyası yok */
.dmn-download-button.btn-danger {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 10px 0 20px;
    padding: 14px 18px;
    border: 1px dashed var(--zp-panel-kenar-13336c, #13336c) !important;
    border-radius: 10px;
    background: var(--zp-panel-zemin-091731, #091731) !important;
    color: var(--zp-metin-metin-a8a8a8, #a8a8a8) !important;
    font-size: 14px;
    text-align: left;
    box-shadow: none !important;
    cursor: default;
}
.dmn-download-button.btn-danger::before {
    content: "";
    width: 20px;
    height: 20px;
    background: var(--zp-vurgu-metin-ffc345, #ffc345);
    -webkit-mask: var(--t5-ikon-indir) center / contain no-repeat;
    mask: var(--t5-ikon-indir) center / contain no-repeat;
}

/* ---- İçerik alanı ve haber kartları ---- */
#main #content #content_container #content_container_inside { border-color: var(--zp-vurgu-kenar-6a4f15, #6a4f15); border-radius: 10px; }
.newsBox { transition: background-color .15s ease; }
.newsBox:hover { background-color: var(--zp-panel-zemin-071124, #071124); }
.newsBox .newsBox_image { overflow: hidden; border-radius: 8px; transition: transform .2s ease, box-shadow .2s ease; }
.newsBox:hover .newsBox_image { transform: translateY(-2px); box-shadow: 0 8px 18px rgba(0, 0, 0, .4); }
.newsBox .newsBox_title { transition: color .15s ease; }
.newsBox:hover .newsBox_title { color: var(--zp-vurgu-metin-ffdf86, #ffdf86); }

/* Sunucu durumu çubuğu: zemini iki modda da panel rengi */
#main .progress { border-radius: 999px; background: var(--zp-panel-zemin-0e2043, #0e2043) !important; box-shadow: inset 0 0 0 1px var(--zp-panel-kenar-13336c, #13336c); }
#main .progress .progress-bar { border-radius: 999px; }

/* ---- Sahne görselli koyu bantlar ----
   Yazılar renklerini gövdeden miras alıyor; açık modda gövde yazısı koyu olduğu için bantta da koyu kalıyordu.
   Bant kendi rengini tanımlayınca, açık modun "koyu bölge" değişkenleriyle (Tema.php zpTemaKoyuBolgeCss) açık yazı olur. */
#item_mall_prew, #index2, #index3, #index_multimedia, #index_followus { color: var(--zp-metin-metin-ffffff, #ffffff); }

/* ---- Arka plan: sahne görselinin altı ve yanları zemine yumuşakça erir ----
   Görsel background/background_chars2.png (2200x945; eskiden footer.php jQuery ile atıyordu); altında düz renk
   başlıyordu (açık modda beyaz çizgi gibi). Üstteki iki degrade görseli sayfa
   zeminine (--zp-panel-zemin-070911) eritir; açık modda zemin açık olduğu için görsel beyaza erir.
   Panelden özel arka plan yüklenirse onun kuralı (Tema.php) bu katmanların yerine geçer. */
body {
    background-image:
        linear-gradient(to bottom, transparent 0, transparent 520px, color-mix(in srgb, var(--zp-panel-zemin-070911, #070911) 60%, transparent) 760px, var(--zp-panel-zemin-070911, #070911) 945px),
        linear-gradient(to right, var(--zp-panel-zemin-070911, #070911) calc(50% - 1100px), transparent calc(50% - 860px), transparent calc(50% + 860px), var(--zp-panel-zemin-070911, #070911) calc(50% + 1100px)),
        url('../images/background/background_chars2.png');
    background-size: 100% 945px, 100% 945px, auto;
    background-position: center 0, center 0, center 0;
    background-repeat: no-repeat;
}

/* ---- Sayfa iskeleti: başlık, iç boşluk, boş durum ---- */
#main #content #content_container #content_container_inside:has(> .t5-sayfa),
#main #content #content_container #content_container_inside:has(> .general_label) {
    box-sizing: border-box;
    padding: 34px 40px 48px;
}
.t5-sayfa-bas {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 26px;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--zp-kenar-kenar-323232, #323232);
}
.t5-sayfa-ikon, .t5-bos-ikon {
    flex: 0 0 auto;
    display: grid;
    place-items: center;
    width: 52px;
    height: 52px;
    border: 1px solid color-mix(in srgb, var(--zp-vurgu-kenar-ffc345, #ffc345) 35%, transparent);
    border-radius: 14px;
    background: color-mix(in srgb, var(--zp-vurgu-kenar-ffc345, #ffc345) 12%, transparent);
}
.t5-sayfa-ikon::before, .t5-bos-ikon::before {
    content: "";
    width: 26px;
    height: 26px;
    background: var(--zp-vurgu-metin-ffc345, #ffc345);
    -webkit-mask: var(--t5-ikon) center / contain no-repeat;
    mask: var(--t5-ikon) center / contain no-repeat;
}
.t5-sayfa-bas h1 { margin: 0; font-size: 26px; font-weight: 800; color: var(--zp-vurgu-metin-ffc345, #ffc345); letter-spacing: .2px; }
.t5-sayfa-bas p { margin: 6px 0 0; font-size: 14px; color: var(--zp-metin-metin-a8a8a8, #a8a8a8); }
.t5-bos {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    padding: 46px 20px;
    border: 1px dashed var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 14px;
    background: var(--zp-panel-zemin-071124, #071124);
    color: var(--zp-metin-metin-a8a8a8, #a8a8a8);
    font-size: 14px;
    text-align: center;
}

/* Eski sayfa başlığı (download, galeri, haber detayı): .general_label + .general_text/.general_text2 */
.download_icon, .news_icon { display: none !important; }
.general_label {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 52px;
    margin: 0 !important;
    padding-left: 68px;
    font-size: 26px;
    font-weight: 800;
    letter-spacing: .2px;
    --t5-ikon: var(--t5-ikon-haber);
}
.download_icon + .general_label { --t5-ikon: var(--t5-ikon-indir); }
.general_label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 52px;
    height: 52px;
    box-sizing: border-box;
    border: 1px solid color-mix(in srgb, var(--zp-vurgu-kenar-ffc345, #ffc345) 35%, transparent);
    border-radius: 14px;
    background: color-mix(in srgb, var(--zp-vurgu-kenar-ffc345, #ffc345) 12%, transparent);
}
.general_label::after {
    content: "";
    position: absolute;
    left: 13px;
    top: 13px;
    width: 26px;
    height: 26px;
    background: var(--zp-vurgu-metin-ffc345, #ffc345);
    -webkit-mask: var(--t5-ikon) center / contain no-repeat;
    mask: var(--t5-ikon) center / contain no-repeat;
}
.general_label + .general_text { margin-top: 24px !important; padding-top: 24px; border-top: 1px solid var(--zp-kenar-kenar-323232, #323232); }
.general_text { margin: 34px 0 0 !important; font-size: 18px; font-weight: 700; }
.general_text2 { margin: 6px 0 0 !important; font-size: 13px; color: var(--zp-metin-metin-a8a8a8, #a8a8a8); line-height: 1.55; }

/* ---- Arama sayfası ---- */
.t5-arama {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 60px;
    padding: 0 20px;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 14px;
    background: var(--zp-panel-zemin-070911, #070911);
    cursor: text;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.t5-arama:focus-within { border-color: var(--zp-vurgu-kenar-ffc345, #ffc345); box-shadow: 0 0 0 4px color-mix(in srgb, var(--zp-vurgu-kenar-ffc345, #ffc345) 20%, transparent); }
.t5-arama-ikon {
    flex: 0 0 auto;
    width: 22px;
    height: 22px;
    background: var(--zp-vurgu-metin-ffc345, #ffc345);
    -webkit-mask: var(--t5-ikon-ara) center / contain no-repeat;
    mask: var(--t5-ikon-ara) center / contain no-repeat;
}
.t5-arama input { flex: 1 1 auto; min-width: 0; height: 100%; border: 0; background: transparent; color: var(--zp-metin-metin-ffffff, #ffffff); font-size: 17px; outline: none; }
.t5-arama input::placeholder { color: var(--zp-metin-metin-a8a8a8, #a8a8a8); }
#search #results { margin-top: 22px; }

/* ---- Haberler ---- */
.t5-haber-liste .newsBox { border-radius: 12px; border-bottom: 0; margin-bottom: 8px; }
.t5-haber-liste .newsBox:hover { background-color: var(--zp-panel-zemin-071124, #071124); }

/* ---- İç sayfa iskeleti: dış çerçeveler şeffaf ----
   Sol menü (#left_menu_container, sabit 570px) ve içerik (#content_container) zeminleri farklı yükseklikte bittiği için
   arka plan görselinin üstünde ve açık modda beyaz zeminde basamaklı bir kutu oluşuyordu. Çerçeveler şeffaf; zemini
   yalnızca içerik kartı (#content_container_inside) ve sol menüdeki kartlar taşıyor. */
#main #content #left_menu_container,
#main #content #content_container { background: transparent !important; margin-bottom: 70px; }
#main #content #content_container #content_container_inside {
    background-color: var(--zp-zemin-zemin-000000, #000000);
    box-shadow: 0 10px 30px color-mix(in srgb, var(--zp-zemin-zemin-000000, #000000) 25%, transparent);
}

/* ---- Kayıt, giriş, şifremi unuttum: solda form, sağda çerçeveli sahne görseli ----
   Eskiden görsel tüm kutunun arkasındaydı ve aşağıda zemine eriyordu; açık modda koyu görsel beyaza eriyip bulanık gri
   oluyor, açıklama ve linkler koyu üstünde koyu kalıyordu. Görsel artık kendi kartında: form her modda düz zeminde. */
#main #content #content_container #content_container_inside.loginbg {
    box-sizing: border-box;
    min-height: 620px;
    padding: 56px calc(42% + 48px) 48px 52px;
    background-image: none !important;
}
.loginbg::before {
    content: "";
    position: absolute;
    top: 12px;
    right: 12px;
    bottom: 12px;
    width: 42%;
    border-radius: 10px;
    background: linear-gradient(to top, rgba(3, 6, 16, .7), transparent 45%), url(../images/silkroad-tr-login.png) 100% 0 / cover no-repeat;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
}
.loginbg #login_label { justify-content: flex-start; margin: 0; font-size: 28px; font-weight: 800; }
.loginbg #login_text { margin: 8px 0 0; text-align: left; font-size: 15px; line-height: 1.5; color: var(--zp-metin-metin-a8a8a8, #a8a8a8); }
.loginbg #login_form { margin-top: 32px; }
.loginbg .gg_input_div { width: auto; margin: 0 0 14px; }
.loginbg #login_links { margin-top: 4px; }
.loginbg #login_links_container { width: auto; height: auto; display: flex; justify-content: space-between; text-align: left; }
.loginbg .login_link_text { padding: 0; }
.loginbg .login_link_text a { color: var(--zp-metin-metin-a8a8a8, #a8a8a8); text-decoration: none; font-weight: 600; }
.loginbg .login_link_text a:hover { color: var(--zp-vurgu-metin-ffc345, #ffc345); text-decoration: underline; }
.loginbg #login_button { width: 100%; margin: 26px 0 0 !important; }
.loginbg div#login_button { height: auto; padding: 14px; margin: 0 0 24px !important; text-transform: none; font-weight: 400; }
.gg_input_div.t5-dogrulama { gap: 10px; padding-right: 8px; }
.gg_input_div.t5-dogrulama #image-captcha { height: 36px; width: auto; border-radius: 6px; cursor: pointer; flex: 0 0 auto; }
.t5-yenile {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 8px;
    background: var(--zp-panel-zemin-0b1d3d, #0b1d3d);
    color: var(--zp-vurgu-metin-ffc345, #ffc345);
    cursor: pointer;
    transition: transform .3s ease;
}
.t5-yenile::before {
    content: "";
    display: block;
    width: 18px;
    height: 18px;
    margin: auto;
    background: currentColor;
    -webkit-mask: var(--t5-ikon-yenile) center / contain no-repeat;
    mask: var(--t5-ikon-yenile) center / contain no-repeat;
}
.t5-yenile:hover { transform: rotate(90deg); }
input#login_button { display: block; border: 0; cursor: pointer; font-family: inherit; }

/* ---- İndirme sayfası ---- */
.down_content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
    width: auto;
    height: auto;
    margin-top: 18px;
}
.down_content_left, .down_content_right {
    float: none;
    width: auto;
    height: auto;
    min-height: 200px;
    padding: 24px;
    box-sizing: border-box;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 14px;
    background: linear-gradient(180deg, var(--zp-panel-zemin-0b1d3d, #0b1d3d), var(--zp-panel-zemin-071124, #071124)) !important;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 18px;
}
#nvidia_logo, #amd_logo { margin: 0 auto !important; }
.dmn-download-button.btn-danger { margin: 18px 0 0; }
.table_systemreq {
    width: 100%;
    margin: 18px 0 0;
    border-collapse: separate;
    border-spacing: 0;
    border: 1px solid var(--zp-panel-kenar-13336c, #13336c);
    border-radius: 12px;
    overflow: hidden;
}
.table_systemreq th { height: 44px; border: 0 !important; background: var(--zp-panel-zemin-0b1d3d, #0b1d3d) !important; }
.table_systemreq td { height: 42px; border-top: 1px solid var(--zp-kenar-kenar-323232, #323232); }
.table_systemreq tr:nth-child(odd) td { background: color-mix(in srgb, var(--zp-panel-zemin-071124, #071124) 60%, transparent); }
.table_systemreq td:first-child { color: var(--zp-metin-metin-a8a8a8, #a8a8a8); }