@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;700;900&display=swap');
:root {
    --buy-bg: #15173D; --sell-bg: #262626; --arb-bg: #280905; 
    --accent: #3b82f6; --side-bg: #1A3263; 
    --side1-hdr: #005461; --side2-hdr: #005461; --side3-hdr: #005461;
}
body { font-size: 13px; background-color: #010204; color: #cbd5e1; font-family: 'Inter', sans-serif; overflow: hidden; user-select: none; transition: background-color 0.3s; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type=number] { -moz-appearance: textfield; }
::-webkit-scrollbar { width: 3px; } ::-webkit-scrollbar-track { background: transparent; } ::-webkit-scrollbar-thumb { background: #475569; }

@keyframes pulse-neon { 0% { border-color: #1e293b; } 50% { border-color: #22d3ee; box-shadow: 0 0 10px rgba(34, 211, 238, 0.4); } 100% { border-color: #1e293b; } }
.animate-status-pulse { animation: pulse-neon 1.5s infinite; color: #22d3ee !important; border-color: #22d3ee !important; }
@keyframes slideInUpFlip { 0% { transform: translateY(100%) rotateX(-90deg); opacity: 0; } 50% { transform: translateY(-10%) rotateX(10deg); opacity: 1; } 100% { transform: translateY(0) rotateX(0deg); opacity: 1; } }
@keyframes slideOutDown { 0% { transform: translateY(0); opacity: 1; } 100% { transform: translateY(100%); opacity: 0; display: none; } }
.anim-show { animation: slideInUpFlip 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards; }
.anim-hide { animation: slideOutDown 0.6s ease-in forwards; }

.neon-buy { background: var(--buy-bg) !important; border: 1px solid rgba(255,255,255,0.05); transition: background 0.3s; }
.neon-sell { background: var(--sell-bg) !important; border: 1px solid rgba(255,255,255,0.05); transition: background 0.3s; }
.neon-arb { background: var(--arb-bg) !important; border: 1px solid rgba(255,255,255,0.05); transition: background 0.3s; }

.data-table { table-layout: fixed; width: 100%; border-collapse: collapse; }
.data-table thead th { position: sticky; top: 0; background: #0f172a; z-index: 20; padding: 4px; font-size: 10px; color: #94a3b8; text-transform: uppercase; border-bottom: 2px solid #1e293b; transition: all 0.3s; text-align: center; }
.data-table tbody td { padding: 0 !important; border: none !important; white-space: nowrap; height: 18px; vertical-align: middle; transition: all 0.3s; text-align: center; }

.data-table tbody tr:nth-child(even) { background-color: rgba(255, 255, 255, 0.02); }
.data-table tbody tr.own-row:hover { background: rgba(59, 130, 246, 0.2) !important; cursor: pointer; }
.data-table tbody tr.other-row:hover { background: rgba(255, 255, 255, 0.1) !important; cursor: pointer; }

.ctrl-btn { border: 1px solid #1e293b; background: rgba(15, 23, 42, 0.8); padding: 4px 10px; border-radius: 4px; font-size: 11px; font-weight: 900; display: flex; align-items: center; justify-content: center; gap: 6px; transition: all 0.2s; color: #94a3b8; cursor: pointer; }
.ctrl-btn:hover { border-color: var(--accent); color: white; }

.sidebar-box { display: flex; flex-direction: column; transition: all 0.3s ease; overflow:hidden; background: var(--side-bg); }
.side-hdr { border-radius: 6px 6px 0 0; padding: 4px 10px; font-size: 10.5px; letter-spacing: 0.5px; box-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 2px 4px rgba(0,0,0,0.2); display: flex; justify-content: space-between; align-items: center; text-transform: uppercase; font-weight: 800; margin-bottom: 1px; z-index: 10; height: 26px; }
.side-hdr-1 { background-color: var(--side1-hdr) !important; color: #ffffff; }
.side-hdr-2 { background-color: var(--side2-hdr) !important; color: #ffffff; }
.side-hdr-3 { background-color: var(--side3-hdr) !important; color: #ffffff; }

.red-badge { background-color: #dc2626 !important; color: #ffffff !important; }
#todayTransactions > div:nth-child(even) { background-color: rgba(255, 255, 255, 0.05) !important; }

.flag-img { width: 24px !important; height: 16px !important; border-radius: 2px; vertical-align: middle; flex-shrink: 0; box-shadow: 0 1px 2px rgba(0,0,0,0.2); }

.delete-msg-btn { color: #ef4444 !important; cursor: pointer; transition: all 0.2s; }
.delete-msg-btn:hover { color: #dc2626 !important; }
.delete-btn { color: #ff0000 !important; cursor: pointer; font-size: 15px; font-weight: 900; z-index: 50; position: relative; }

/* WEBORSA YENİ LOGO CSS */
.logo-icon-css { background-color: var(--accent); filter: drop-shadow(0 0 5px rgba(59, 130, 246, 0.6)); }
.logo-text-css { color: #ffffff; transition: color 0.3s ease, text-shadow 0.3s ease; }
header .group:hover .logo-text-css, #mobileHeader .group:hover .logo-text-css { text-shadow: 0 0 10px rgba(255, 255, 255, 0.4); }
.light-mode header .logo-icon-css, .light-mode #mobileHeader .logo-icon-css { background-color: #0f172a; filter: none; }
.light-mode header .logo-icon-css i, .light-mode #mobileHeader .logo-icon-css i { color: var(--accent) !important; }
.light-mode .logo-text-css { color: #0f172a !important; font-weight: 900; }
.light-mode header .group:hover .logo-text-css, .light-mode #mobileHeader .group:hover .logo-text-css { text-shadow: 0 0 10px rgba(59, 130, 246, 0.3); }

.text-dynamic { color: #ffffff !important; font-weight: 800 !important; opacity: 1 !important; text-shadow: none !important; }
.col-cins { font-size: 12px !important; font-weight: 900 !important; text-align: left !important; padding-left: 8px !important; } 

.uye-loc-text { color: #ffffff !important; font-weight: 800 !important; font-size: 12px !important; display: flex; align-items: center; justify-content: flex-start; height: 18px; line-height: 18px; width: 100%; margin: 0; padding: 0 0 0 10px; letter-spacing: 0.2px; overflow: hidden; text-overflow: ellipsis; }

.arb-yon-al { color: #10b981; font-weight: 900; } .arb-yon-sat { color: #ef4444; font-weight: 900; }
.islem-alis { border-color: #10b981; border-left-width: 4px; } .islem-satis { border-color: #f43f5e; border-left-width: 4px; }
.islem-alis .islem-kur-val { color: #34d399 !important; font-weight: 900; } .islem-satis .islem-kur-val { color: #f87171 !important; font-weight: 900; }

/* AÇIK MOD (LIGHT MODE) */
.light-mode { background-color: #e2e8f0; color: #1e293b; }
.light-mode header { background-color: #f1f5f9 !important; border-bottom-color: #cbd5e1 !important; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05); }
.light-mode header .border-r { border-color: #cbd5e1 !important; }
.light-mode header .bg-black\/20 { background-color: #e2e8f0 !important; } 
.light-mode .control-bar-bg { background-color: #CBCBCB !important; border-color: #a3a3a3 !important; }
.light-mode #tabDoviz, .light-mode button.bg-emerald-600, .light-mode button.bg-red-600, .light-mode button.bg-orange-600, .light-mode button.bg-blue-600 { color: #ffffff !important; }
.light-mode #arbitrajNav { background-color: #e2e8f0 !important; border-color: #cbd5e1 !important; box-shadow: none !important; }
.light-mode #tabAltin { color: #000000; font-weight: 800; } .light-mode #tabAltin:hover { color: #0f172a; background: #cbd5e1; }
.light-mode header .w-\[1px\] { background-color: #94a3b8 !important; }
.light-mode #clock { color: #000000 !important; font-weight: 900; }
.light-mode .bg-slate-900\/60, .light-mode .bg-slate-900\/40, .light-mode .bg-slate-800 { background-color: #ffffff !important; border-color: #cbd5e1 !important; }
.light-mode .ctrl-btn { background-color: #f8fafc !important; border-color: #cbd5e1 !important; color: #000000 !important; font-weight: 800 !important; }
.light-mode .ctrl-btn:hover { background-color: #e2e8f0 !important; color: #000000 !important; }
.light-mode .shadow-inner { box-shadow: none !important; border: 1px solid #cbd5e1 !important; }
.light-mode .sidebar-box { border: 1px solid #cbd5e1; box-shadow: 0 1px 3px rgba(0,0,0,0.05); }
.light-mode .bg-black\/20, .light-mode .bg-black\/40, .light-mode .bg-white\/5 { background-color: #ffffff !important; border-color: #cbd5e1 !important; color: #000000 !important;}
.light-mode .data-table thead th { background: #e2e8f0 !important; color: #000000 !important; border-bottom-color: #94a3b8 !important; font-weight: 900;}
.light-mode .data-table tbody tr { border-bottom: 1px solid #cbd5e1; }
.light-mode .data-table tbody tr:nth-child(even) { background-color: rgba(0, 0, 0, 0.03); }
.light-mode .data-table tbody tr.other-row:hover { background-color: rgba(0,0,0,0.08) !important; }
.light-mode .uye-karti { background-color: #ffffff !important; border-color: #cbd5e1 !important; }
.light-mode .uye-karti:hover { background-color: #f1f5f9 !important; }
.light-mode .text-dynamic, .light-mode .uye-loc-text, .light-mode .uye-adi { color: #000000 !important; font-weight: 900 !important; }
.light-mode .arb-yon-al { color: #009900 !important; font-weight: 900 !important; }
.light-mode .arb-yon-sat { color: #cc0000 !important; font-weight: 900 !important; }
.light-mode .islem-alis { border-color: #009900 !important; background: transparent !important; }
.light-mode .islem-satis { border-color: #cc0000 !important; background: transparent !important; }
.light-mode .islem-alis .islem-kur-val { color: #009900 !important; font-weight: 900 !important; }
.light-mode .islem-satis .islem-kur-val { color: #cc0000 !important; font-weight: 900 !important; }
.light-mode #todayTransactions > div:nth-child(even) { background-color: rgba(0, 0, 0, 0.05) !important; }
.text-blue-300 { font-size: 13px !important; }
.light-mode .text-blue-300 { color: #1e3a8a !important; font-weight: 900 !important;}
.light-mode .text-slate-400, .light-mode .text-slate-300, .light-mode .text-slate-500, .light-mode .text-white { color: #000000 !important; font-weight: 900 !important; opacity: 1 !important; }
.light-mode .side-hdr-1, .light-mode .side-hdr-2, .light-mode .side-hdr-3 { color: #000000 !important; font-weight: 900 !important; border-bottom: 1px solid #a3a3a3 !important; }
.light-mode #chatArea > div { background-color: #f8fafc !important; border-color: #cbd5e1 !important; }
.light-mode #chatArea > div:hover { background-color: #e2e8f0 !important; }
.light-mode #onlineCount { background-color: #064e3b !important; color: #ffffff !important; box-shadow: none !important; }
.light-mode .delete-msg-btn { color: #ff0000 !important; } .light-mode .delete-msg-btn:hover { color: #cc0000 !important; }

/* MODALLAR */
.light-mode #orderModal > div, .light-mode #editModal > div, .light-mode #settingsModal > div, .light-mode #approveModal > div, .light-mode #profileModal > div, .light-mode #inboxModal > div, .light-mode #historyModal > div, .light-mode #blockModal > div, .light-mode #transactionAlertModal > div { background-color: #f8fafc !important; border-color: #cbd5e1 !important; }
.light-mode input[type="text"], .light-mode textarea, .light-mode input[type="password"], .light-mode input[type="email"], .light-mode input[type="number"] { background-color: #ffffff !important; color: #000000 !important; border-color: #94a3b8 !important; font-weight: 800;}
.light-mode input::placeholder, .light-mode textarea::placeholder { color: #64748b !important; }
.light-mode .custom-select-list { background: #ffffff !important; border-color: #cbd5e1 !important; box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1); }
.light-mode .select-item { color: #000000 !important; border-bottom-color: #e2e8f0 !important; font-weight: 800;}
.light-mode .select-item:hover { background: #f1f5f9 !important; color: #3b82f6 !important;}
.light-mode #orderModal .bg-slate-800, .light-mode #editModal .bg-slate-800, .light-mode #settingsModal .bg-slate-900, .light-mode #approveModal .bg-slate-900\/90, .light-mode #approveModal .bg-black\/30, .light-mode #approveModal .bg-black\/40 { background-color: #ffffff !important; border-color: #cbd5e1 !important; color: #000000 !important; }

/* Geçmiş Ekranı Beyazlatma */
.light-mode .modal-body-bg { background-color: #ffffff !important; border-top: 1px solid #cbd5e1 !important; }
.light-mode #historyList tr { border-bottom: 1px solid #cbd5e1 !important; background-color: #ffffff !important; }
.light-mode #historyList tr:nth-child(even) { background-color: #f8fafc !important; }
.light-mode #historyList tr:hover { background-color: #e2e8f0 !important; }
.light-mode #historyList td { color: #0f172a !important; font-weight: 800 !important; text-shadow: none !important; }
.light-mode #historyList td span.text-emerald-400 { color: #009900 !important; font-weight: 900 !important; }
.light-mode #historyList td span.text-red-400 { color: #cc0000 !important; font-weight: 900 !important; }
.light-mode #historyList td.text-blue-400 { color: #2563eb !important; font-weight: 900 !important; }
.light-mode #historyModal th { background-color: #e2e8f0 !important; color: #000000 !important; font-weight: 900 !important; border-bottom: 2px solid #cbd5e1 !important; }

.light-mode #orderModal .text-white:not(#modalHeader, #modalHeader *, button, button *), .light-mode #editModal .text-white:not(.edit-cins-text, .bg-blue-600, button, button *), .light-mode #settingsModal .text-white:not(.bg-slate-800, button, button *), .light-mode #approveModal .text-white:not(button, button *), .light-mode #profileModal .text-white:not(button, button *), .light-mode #inboxModal .text-white:not(button, button *), .light-mode #blockModal .text-white:not(button, button *) { color: #000000 !important; font-weight: 900 !important; }
.light-mode #inboxList .bg-red-900\/20 { background-color: #fee2e2 !important; border-color: #fca5a5 !important; }
.light-mode #inboxList .bg-slate-800 { background-color: #ffffff !important; border-color: #cbd5e1 !important; }
.light-mode #inboxList .text-white { color: #000000 !important; font-weight: 900 !important; }
.light-mode #inboxList .text-slate-300 { color: #334155 !important; font-weight: 700 !important; }

.light-mode .edit-cins-bg { background-color: #1e293b !important; border-color: #0f172a !important; }
.light-mode .edit-cins-text { color: #ffffff !important; font-style: normal !important; }
.light-mode .edit-plus-minus { background-color: #cbd5e1 !important; color: #000000 !important; border-color: #94a3b8 !important; font-weight: 900 !important;}
.light-mode .edit-plus-minus:hover { background-color: #94a3b8 !important; }
.light-mode #orderModal .bg-slate-700 { background-color: #334155 !important; color: #ffffff !important; border-color: #1e293b !important; }
.light-mode #orderModal .bg-slate-700:hover { background-color: #2563eb !important; color: #ffffff !important; border-color: #1d4ed8 !important; }
.light-mode #stdName, .light-mode #arbName1, .light-mode #arbName2, .light-mode #sureName { color: #000000 !important; font-weight: 900 !important;}
.light-mode #btnArbSat.bg-transparent, .light-mode #btnArbAl.bg-transparent { color: #64748b !important; }

/* TOOLTİP HER İKİ MOD */
#globalTooltip { display: none; position: fixed; z-index: 999999; width: 300px; background: rgba(15, 23, 42, 0.95) !important; backdrop-filter: blur(8px); border: 2px solid #3b82f6 !important; color: #ffffff !important; padding: 14px; border-radius: 8px; box-shadow: 0 20px 40px rgba(0,0,0,0.8); pointer-events: none; line-height: 1.4; }
#globalTooltip * { text-shadow: none !important; }
#globalTooltip p, #globalTooltip span, #globalTooltip div, #globalTooltip i { color: #ffffff !important; font-weight: 800 !important; }
#globalTooltip .text-emerald-400, #globalTooltip .text-emerald-300 { color: #34d399 !important; }
#globalTooltip .text-red-400, #globalTooltip .text-red-500 { color: #f87171 !important; }
#globalTooltip .text-blue-400, #globalTooltip .text-blue-300 { color: #60a5fa !important; }
#globalTooltip .text-orange-400 { color: #fbbf24 !important; }
#globalTooltip .text-slate-400 { color: #94a3b8 !important; }
#globalTooltip .text-slate-500 { color: #64748b !important; }

/* Tooltip İç Kutuları */
.tooltip-inner-box { background-color: rgba(255, 255, 255, 0.05); border: 1px solid rgba(255, 255, 255, 0.1); }
.light-mode #globalTooltip .tooltip-inner-box { background-color: rgba(0, 0, 0, 0.25) !important; border: 1px solid rgba(0, 0, 0, 0.4) !important; }

.custom-select-list { display: none; max-height: 200px; overflow-y: auto; z-index: 1000; border: 2px solid #334155; position: absolute; width: 100%; top: calc(100% + 2px); background: #0f172a; box-shadow: 0 10px 30px rgba(0,0,0,0.9); left: 0; }
.custom-select-list.active { display: block; }
.custom-select-list::-webkit-scrollbar { width: 4px; }
.custom-select-list::-webkit-scrollbar-thumb { background: #3b82f6; border-radius: 4px; }
.select-item { padding: 8px 12px; transition: background 0.1s; border-bottom: 1px solid rgba(255,255,255,0.05); cursor: pointer; color: white; }
.select-item:hover { background: #3b82f6 !important; }
.modal-active { display: flex !important; }

/* ========================================================
   MOBIL RESPONSIVE (YENİ EKLENEN UX TASARIM MİMARİSİ)
======================================================== */
@media (max-width: 768px) {
    body { padding-bottom: 56px; } 
    
    #topControlBar { display: none !important; }
    
    body.mob-active-pano #mainContentBox { display: flex !important; }
    body.mob-active-pano #rightPanelContainer { display: none !important; }
    body.mob-active-pano #tablesContainer { display: flex !important; flex-direction: column !important; }
    body.mob-active-pano #arbitrajPanel { display: none !important; }

    body.mob-active-arb #mainContentBox { display: flex !important; }
    body.mob-active-arb #rightPanelContainer { display: none !important; }
    body.mob-active-arb #tablesContainer { display: none !important; }
    body.mob-active-arb #arbitrajPanel { display: flex !important; height: 100% !important; margin-top: 0 !important; }

    body.mob-active-uyeler #mainContentBox { display: none !important; }
    body.mob-active-uyeler #rightPanelContainer { display: flex !important; width: 100% !important; max-width: 100% !important; flex: 1 !important; }
    
    #panelAlim, #panelSatim { flex: 1 !important; width: 100% !important; }
    
    /* MOBİL TABLO HİZALAMALARI (Cins Daraltıldı, Lokasyon Eklendi) */
    #panelAlim .data-table th:nth-child(6), #panelAlim .data-table td:nth-child(6),
    #panelSatim .data-table th:nth-child(6), #panelSatim .data-table td:nth-child(6) { display: none !important; } /* Süre Gizli */
    
    #panelAlim .data-table th:nth-child(5), #panelAlim .data-table td:nth-child(5),
    #panelSatim .data-table th:nth-child(5), #panelSatim .data-table td:nth-child(5) { display: table-cell !important; width: 20% !important; font-size: 10px !important; } /* Lokasyon */

    #panelAlim .data-table th:nth-child(1), #panelAlim .data-table td:nth-child(1),
    #panelSatim .data-table th:nth-child(1), #panelSatim .data-table td:nth-child(1) { width: 16% !important; font-size: 12px !important; } /* Cins - Daraltıldı ve Büyütüldü */
    
    #panelAlim .data-table th:nth-child(2), #panelAlim .data-table td:nth-child(2),
    #panelSatim .data-table th:nth-child(2), #panelSatim .data-table td:nth-child(2) { width: 17% !important; font-size: 11px !important; } /* Miktar */

    #panelAlim .data-table th:nth-child(3), #panelAlim .data-table td:nth-child(3),
    #panelSatim .data-table th:nth-child(3), #panelSatim .data-table td:nth-child(3) { width: 19% !important; font-size: 11px !important; } /* Kur */
    
    #panelAlim .data-table th:nth-child(4), #panelAlim .data-table td:nth-child(4),
    #panelSatim .data-table th:nth-child(4), #panelSatim .data-table td:nth-child(4) { width: 22% !important; font-size: 10px !important; } /* Üye */
    
    #panelAlim .data-table th:nth-child(7), #panelAlim .data-table td:nth-child(7),
    #panelSatim .data-table th:nth-child(7), #panelSatim .data-table td:nth-child(7) { width: 6% !important; } /* Buton */

    /* ARBİTRAJ TABLOSU MOBİL (Cinsler daraltıldı, yazı büyüdü) */
    #arbitrajPanel .data-table th:nth-child(8), #arbitrajPanel .data-table td:nth-child(8) { display: none !important; } /* Süre Gizli */
    
    #arbitrajPanel .data-table th:nth-child(1), #arbitrajPanel .data-table td:nth-child(1),
    #arbitrajPanel .data-table th:nth-child(3), #arbitrajPanel .data-table td:nth-child(3) { width: 12% !important; font-size: 10px !important; } /* Cins 1 ve 2 */
    
    #arbitrajPanel .data-table th:nth-child(2), #arbitrajPanel .data-table td:nth-child(2) { width: 6% !important; font-size: 9px !important; } /* Yön */
    
    #arbitrajPanel .data-table th:nth-child(4), #arbitrajPanel .data-table td:nth-child(4),
    #arbitrajPanel .data-table th:nth-child(5), #arbitrajPanel .data-table td:nth-child(5) { width: 15% !important; font-size: 10px !important; } /* Miktar, Kur */
    
    #arbitrajPanel .data-table th:nth-child(6), #arbitrajPanel .data-table td:nth-child(6) { width: 17% !important; font-size: 9px !important; } /* Üye */
    
    #arbitrajPanel .data-table th:nth-child(7), #arbitrajPanel .data-table td:nth-child(7) { display: table-cell !important; width: 17% !important; font-size: 9px !important; } /* Lokasyon */
    
    #arbitrajPanel .data-table th:nth-child(9), #arbitrajPanel .data-table td:nth-child(9) { width: 6% !important; }

    .uye-loc-text { font-size: 9px !important; padding-left: 2px !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .flag-img { width: 16px !important; height: 11px !important; margin-right: 2px !important; }
    
    /* Mobilde Tooltip tamamen iptal */
    #globalTooltip { display: none !important; }
    
    .light-mode #mobileBottomNav { background-color: #f8fafc !important; border-top-color: #cbd5e1 !important; }
    .light-mode #mobileHeader { background-color: #f1f5f9 !important; border-bottom-color: #cbd5e1 !important; }
    .light-mode #clockMob { color: #000000 !important; }
}

@media (max-width: 1366px) { .col-cins, .col-val { font-size: 13px !important; } .col-info { font-size: 10px !important; } .data-table thead th { font-size: 9px; } #clock { font-size: 1.1rem; } .weborsa-logo-header{ height: 24px; } }
@media (max-width: 1024px) { body { font-size: 11px; } .col-cins, .col-val { font-size: 12px !important; } .col-info { font-size: 9px !important; } .data-table thead th { font-size: 8px; padding: 2px; } .ctrl-btn { font-size: 9px; padding: 2px 4px; } #clock { font-size: 1rem; } }

/* MOBİL SOHBET VE KLAVYE KALKANI */
@media (max-width: 768px) {
    /* 1. Tarayıcı adres çubuğu payını hesaba katarak ekranı tam oturt (100vh yerine 100dvh) */
    body { height: 100dvh !important; } 
    
    /* 2. Sohbet paneline mobilde daha fazla alan ver ki ezilmesin */
    #side3 { flex: 5 !important; min-height: 160px !important; }
    
    /* 3. Herhangi bir yazı kutusuna (Sohbet) tıklayıp klavye açılınca alt menüyü GİZLE */
    body:has(input:focus) #mobileBottomNav { display: none !important; }
    body:has(input:focus) { padding-bottom: 0 !important; }
}

/* AÇIK MOD (LIGHT MODE) İÇİN SAĞ ÜST BÜRO ADI RENGİ */
.light-mode .header-buro-adi,
.light-mode .header-buro-adi i {
    color: #064e3b !important; /* Koyu Zümrüt Yeşili - Açık zeminde çok net okunur */
    font-weight: 900 !important;
    text-shadow: none !important; /* Varsa parlama efektini kapatır, yazıyı netleştirir */
}


/* ========================================================
   ONAY MODALI - GELİŞMİŞ EFEKTLER
======================================================== */

/* 1. Kırmızı ve Daha Belirgin Yanıp Sönme Animasyonu */
@keyframes alertPulse {
    0%, 100% { 
        border-color: rgba(220, 38, 38, 0.3); 
        box-shadow: 0 0 5px rgba(220, 38, 38, 0.1);
        background-color: rgba(0, 0, 0, 0.6);
    }
    50% { 
        border-color: rgba(255, 0, 0, 1); 
        box-shadow: 0 0 20px rgba(220, 38, 38, 0.4);
        background-color: rgba(127, 29, 29, 0.2); /* Hafif kırmızımsı arka plan */
    }
}

.attention-pulse-red {
    animation: alertPulse 2s infinite ease-in-out; /* Hızı 2 saniyeye düşürdüm (daha dikkat çekici) */
}


/* ==========================================
   KENDİ İŞLEMLERİM (OWN-ROW) VURGUSU - KIRMIZI TONU
========================================== */

/* 1. KOYU MOD (Standart Mod) İçin Kendi İşlemlerim */
.data-table tbody tr.own-row {
    /* İçi rahat okunsun diye %25 şeffaf, dikkat çekici yakut kırmızısı */
    background-color: rgba(225, 29, 72, 0.25) !important; 
    border-left: 4px solid #f43f5e !important; /* Parlak kırmızı/pembe şerit */
}
.data-table tbody tr.own-row td {
    font-weight: 900 !important; /* Yazılar iyice kalın ve okunaklı */
}

/* 2. AÇIK MOD (Light Mode) İçin Kendi İşlemlerim */
.light-mode .data-table tbody tr.own-row {
    /* Açık zeminde siyah yazıların okunması için %15 şeffaf kırmızı */
    background-color: rgba(225, 29, 72, 0.15) !important; 
    border-left: 4px solid #e11d48 !important; /* Koyu kırmızı şerit */
}

/* ==========================================
   PANO BAŞLIKLARI (ÜYE ETİKETİ YANI - KESİN ÇÖZÜM)
========================================== */
.pano-baslik {
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: 1px !important;
    margin-left: 8px !important;
    padding: 3px 6px !important;
    border-radius: 4px !important;
    text-shadow: none !important;
    vertical-align: middle !important;
    display: inline-block !important;
    line-height: 1 !important;
}

/* Koyu ve Açık Modda Aynı Şekilde Patlayan Renkler */
.baslik-alim { 
    color: #ffffff !important; 
    background-color: #10b981 !important; /* Canlı Yeşil */
    box-shadow: 0 0 6px rgba(16, 185, 129, 0.6) !important;
}
.baslik-satim { 
    color: #ffffff !important; 
    background-color: #e11d48 !important; /* Canlı Kırmızı */
    box-shadow: 0 0 6px rgba(225, 29, 72, 0.6) !important;
}
.baslik-arb { 
    color: #ffffff !important; 
    background-color: #f97316 !important; /* Canlı Turuncu */
    box-shadow: 0 0 6px rgba(249, 115, 22, 0.6) !important;
}

/* Mobilde ekran daraldığı için başlıkları kibarlaştıralım */
@media (max-width: 768px) {
    .pano-baslik {
        font-size: 8px !important;
        margin-left: 4px !important;
        padding: 2px 4px !important;
    }
}

/* --- YAVAŞ DÖNEN VE NEFES ALAN İŞLEM ANİMASYONU --- */

/* 1. AŞAMA: YAVAŞ DÖNME (1.5 Saniye) */
.row-firlama-donme {
    /* Dönüşü 1.5 saniyeye çektik, daha yumuşak bir giriş yapar */
    animation: rowDonmeOturma 2.5s cubic-bezier(0.175, 0.885, 0.32, 1.275) forwards;
}

@keyframes rowDonmeOturma {
    0% { opacity: 0; transform: scale(0.4) rotate(-360deg); }
    100% { opacity: 1; transform: scale(1) rotate(0deg); }
}

/* 2. AŞAMA: NEFES ALMA (5 Saniye) */
.row-nefes-yesil { animation: nefesParlaYesil 5s ease-out forwards; }
.row-nefes-kirmizi { animation: nefesParlaKirmizi 5s ease-out forwards; }

@keyframes nefesParlaYesil {
    0% { background-color: rgba(16, 185, 129, 0); transform: scale(1); }
    15% { background-color: rgba(16, 185, 129, 0.7); transform: scale(1.06); box-shadow: 0 0 20px rgba(16, 185, 129, 0.6); }
    35% { background-color: rgba(16, 185, 129, 0.3); transform: scale(1); }
    55% { background-color: rgba(16, 185, 129, 0.5); transform: scale(1.04); }
    100% { background-color: transparent; transform: scale(1); }
}

@keyframes nefesParlaKirmizi {
    0% { background-color: rgba(239, 68, 68, 0); transform: scale(1); }
    15% { background-color: rgba(239, 68, 68, 0.7); transform: scale(1.06); box-shadow: 0 0 20px rgba(239, 68, 68, 0.6); }
    35% { background-color: rgba(239, 68, 68, 0.3); transform: scale(1); }
    55% { background-color: rgba(239, 68, 68, 0.5); transform: scale(1.04); }
    100% { background-color: transparent; transform: scale(1); }
}

/* Döviz Listesi Optimizasyonu */
.custom-select-list {
    transform: translateZ(0); /* Donanım hızlandırmayı tetikler, kaydırmayı hızlandırır */
    backface-visibility: hidden;
    perspective: 1000px;
}

.select-item {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 15px !important;
    font-weight: 800 !important;
    font-size: 14px !important;
    transition: background 0.1s ease-in-out;
}

/* Bayrakların kutu içinde daha net ve uyumlu durması için */
.select-item img {
    width: 24px !important;
    height: 16px !important;
    object-fit: cover !important;
    border-radius: 2px !important;
    box-shadow: 0 1px 3px rgba(0,0,0,0.3) !important;
}

/* Açık Modda 'YENİ' etiketinin beyaz kalması için zorlama */
.light-mode .bg-red-600.text-white {
    color: #ffffff !important;
}

/* Onay Modalı Açıklama Alanındaki Italic'i de kaldıralım */
#appAciklama {
    font-style: normal !important;
}

/* --- AÇIK MODDA KOYU ARKA PLAN ÜZERİNDEKİ YAZILARI BEYAZ TUT --- */
.light-mode #modalHeader,
.light-mode #modalHeader span,
.light-mode .bg-emerald-600,
.light-mode .bg-orange-600,
.light-mode .bg-red-600,
.light-mode .bg-red-600 span {
    color: #ffffff !important; /* Bu alanlarda yazı hep beyaz kalır */
    text-shadow: 0 1px 2px rgba(0,0,0,0.2); /* Daha net okunurluk için hafif gölge */
}

/* İtalik yazı kuralını global olarak pasif yapalım */
#modalHeader, #stdName, .select-item, #appAciklama {
    font-style: normal !important;
}