/* ========================================================
   TÜM UYGULAMA KURUMSAL FONT: PLUS JAKARTA SANS
   ======================================================== */
*, *::before, *::after {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* Sayısal ve Finansal Paralar (Plus Jakarta Sans Tabular Numbers) */
.font-mono, [class*="font-mono"], .money, td.text-right, [data-split] {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-feature-settings: "tnum" 1, "cv05" 1 !important;
  font-variant-numeric: tabular-nums !important;
  letter-spacing: -0.015em !important;
}

::-webkit-scrollbar { width: 6px; height: 6px; }
html.dark ::-webkit-scrollbar-track { background: #0f172a; }
html.dark ::-webkit-scrollbar-thumb { background: #334155; border-radius: 3px; }
html.light ::-webkit-scrollbar-track { background: #f1f5f9; }
html.light ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }

html.light body { background-color: #f8fafc !important; color: #0f172a !important; }
html.light .bg-dark-950 { background-color: #f1f5f9 !important; }
html.light .bg-dark-900, html.light .bg-dark-900\/80 { background-color: rgba(255, 255, 255, 0.95) !important; }
html.light [class*="bg-slate-900"], html.light .bg-slate-900 {
  background-color: #ffffff !important; box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.05) !important;
}
html.light [class*="bg-slate-950"], html.light .bg-slate-950 { background-color: #f8fafc !important; }
html.light [class*="bg-slate-800"], html.light .bg-slate-800 { background-color: #f1f5f9 !important; color: #0f172a !important; }
html.light [class*="border-slate-800"], html.light .border-slate-800,
html.light [class*="border-slate-700"], html.light .border-slate-700 { border-color: #e2e8f0 !important; }
html.light .divide-slate-800 > :not([hidden]) ~ :not([hidden]), html.light .divide-slate-800\/60 > :not([hidden]) ~ :not([hidden]) { border-color: #e2e8f0 !important; }
html.light .text-white, html.light .text-slate-100, html.light .text-slate-200 { color: #0f172a !important; }
html.light .text-slate-300 { color: #334155 !important; }
html.light .text-slate-400 { color: #475569 !important; }
html.light .text-slate-500 { color: #64748b !important; }

html.light button.bg-brand-500, html.light button.bg-brand-600, html.light button.bg-rose-600, html.light button.bg-emerald-600, html.light button.bg-indigo-600, html.light button.bg-sky-600 { color: #ffffff !important; }
html.light .text-brand-400, html.light .text-brand-300 { color: #e6330e !important; }
html.light .text-emerald-400 { color: #059669 !important; }
html.light .text-rose-400 { color: #e11d48 !important; }
html.light .text-sky-400 { color: #0284c7 !important; }
html.light .text-amber-400 { color: #d97706 !important; }
html.light .text-amber-300 { color: #b45309 !important; }
html.light #cum-data-quality { color: #92400e; background-color: #fffbeb; border-color: #fcd34d; }
html.light #expense-customer-note, html.light #cashflow-customer-note { color: #92400e; background-color: #fffbeb; border-color: #fcd34d; }

.app-select-wrap { position: relative; display: inline-block; min-width: 0; vertical-align: middle; }
.app-select-wrap.w-full { display: block; }
.app-select-native { position: absolute !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; clip-path: inset(50%); }
.app-select-trigger { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; min-width: 7rem; text-align: left; cursor: pointer; }
.app-select-wrap.w-full .app-select-trigger { width: 100%; }
.app-select-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.app-select-chevron { flex: none; font-size: 1.25rem; line-height: 0.7; transform: translateY(-0.12rem); }
.app-select-trigger[aria-expanded="true"] { border-color: #fb4823 !important; box-shadow: 0 0 0 2px rgba(251, 72, 35, 0.15); }
.app-select-menu { position: fixed; z-index: 120; display: flex; flex-direction: column; overflow: hidden; padding: 0.35rem; border: 1px solid #475569; border-radius: 0.85rem; background: #0f172a; color: #f8fafc; box-shadow: 0 18px 40px rgba(0,0,0,0.32); }
.app-select-options-container { overflow-y: auto; overscroll-behavior: contain; flex: 1 1 auto; }
.app-select-search-box { padding: 0.25rem 0.25rem 0.45rem; margin-bottom: 0.25rem; border-bottom: 1px solid #334155; flex: none; }
.app-select-search-wrapper { position: relative; display: flex; align-items: center; }
.app-select-search-icon { position: absolute; left: 0.6rem; width: 0.85rem; height: 0.85rem; color: #94a3b8; pointer-events: none; }
.app-select-search-input { width: 100%; padding: 0.4rem 0.5rem 0.4rem 1.85rem; font-size: 0.78rem; border-radius: 0.5rem; border: 1px solid #334155; background: #1e293b; color: #f8fafc; outline: none; font-family: inherit; }
.app-select-search-input:focus { border-color: #fb4823; box-shadow: 0 0 0 1px rgba(251, 72, 35, 0.25); }
.app-select-empty { padding: 0.75rem 0.5rem; text-align: center; font-size: 0.75rem; color: #94a3b8; font-style: italic; }
.app-select-option { display: block; width: 100%; padding: 0.65rem 0.8rem; border-radius: 0.55rem; text-align: left; font-size: 0.85rem; line-height: 1.25rem; color: inherit; }
.app-select-option:hover, .app-select-option.keyboard-focus { background: #334155; }
.app-select-option.selected { background: rgba(251,72,35,0.18); color: #ff9f8c; font-weight: 700; }
.app-select-option:disabled { opacity: 0.45; cursor: not-allowed; }
html.light .app-select-trigger { background: #f1f5f9 !important; border-color: #cbd5e1 !important; color: #0f172a !important; }
html.light .app-select-menu { background: #ffffff; border-color: #cbd5e1; color: #0f172a; box-shadow: 0 18px 40px rgba(15,23,42,0.18); }
html.light .app-select-search-box { border-bottom-color: #e2e8f0; }
html.light .app-select-search-input { background: #f8fafc; border-color: #cbd5e1; color: #0f172a; }
html.light .app-select-search-icon { color: #64748b; }
html.light .app-select-empty { color: #64748b; }
html.light .app-select-option:hover, html.light .app-select-option.keyboard-focus { background: #fff1ee; color: #c02607; }
html.light .app-select-option.selected { background: #fff0eb; color: #c02607; }

/* Açık Tema Genel Hover İyileştirmeleri */
html.light .hover\:bg-slate-800:hover,
html.light .hover\:bg-slate-700:hover,
html.light .hover\:bg-slate-850:hover {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
}

html.light tr.hover\:bg-slate-800\/40:hover,
html.light tr:hover {
  background-color: #f8fafc !important;
}

/* Açılır Listeler (Dropdown Menüler) - Makine Arama, Müşteri Filtresi, Çoklu Dönem ve Sütun Menüleri */
#machine-search-dropdown, #customer-filter-menu, #period-filter-menu, [id$="-columns-menu"] {
  scrollbar-width: thin;
}

/* Açık Tema Dropdown Tasarımı (Müşteri, Makine, Dönem ve Sütun Menüleri) */
html.light #machine-search-dropdown,
html.light #customer-filter-menu,
html.light #period-filter-menu,
html.light [id$="-columns-menu"] {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 20px 45px -10px rgba(15, 23, 42, 0.18), 0 0 0 1px rgba(0, 0, 0, 0.05) !important;
}

html.light #customer-filter-menu .bg-slate-900\/95,
html.light #customer-filter-menu .bg-slate-900\/90,
html.light #machine-search-dropdown .bg-slate-900\/95,
html.light #machine-search-dropdown .bg-slate-900\/90,
html.light #period-filter-menu .bg-slate-900\/95,
html.light #period-filter-menu .bg-slate-900\/90 {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
}

html.light #customer-filter-menu .bg-slate-800,
html.light #machine-search-dropdown .bg-slate-800,
html.light #period-filter-menu .bg-slate-800,
html.light #period-filter-button {
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

html.light #customer-filter-menu .text-slate-100,
html.light #customer-filter-menu .text-slate-200,
html.light #machine-search-dropdown .text-slate-100,
html.light #machine-search-dropdown .text-slate-200,
html.light #period-filter-menu .text-slate-100,
html.light #period-filter-menu .text-slate-200 {
  color: #0f172a !important;
}

html.light #customer-filter-menu .text-slate-300,
html.light #machine-search-dropdown .text-slate-300,
html.light #period-filter-menu .text-slate-300 {
  color: #334155 !important;
}

html.light #customer-filter-menu .text-slate-400,
html.light #machine-search-dropdown .text-slate-400,
html.light #period-filter-menu .text-slate-400 {
  color: #64748b !important;
}

html.light #customer-filter-menu .border-slate-800,
html.light #customer-filter-menu .border-slate-800\/60,
html.light #customer-filter-menu .border-slate-800\/50,
html.light #machine-search-dropdown .border-slate-800,
html.light #machine-search-dropdown .border-slate-800\/60,
html.light #machine-search-dropdown .border-slate-800\/50,
html.light #period-filter-menu .border-slate-800,
html.light #period-filter-menu .border-slate-800\/60,
html.light #period-filter-menu .border-slate-800\/50 {
  border-color: #e2e8f0 !important;
}

html.light #customer-filter-menu .hover\:bg-slate-800\/60:hover,
html.light #customer-filter-menu .hover\:bg-slate-800\/70:hover,
html.light #machine-search-dropdown .hover\:bg-slate-800\/60:hover,
html.light #machine-search-dropdown .hover\:bg-slate-800\/70:hover,
html.light #period-filter-menu .hover\:bg-slate-800\/60:hover,
html.light #period-filter-menu .hover\:bg-slate-800\/70:hover {
  background-color: #fff1ee !important;
}

html.light [id$="-columns-menu"] label {
  color: #1e293b !important;
  transition: background-color 0.15s ease, color 0.15s ease;
}

html.light [id$="-columns-menu"] label:hover {
  background-color: #fff1ee !important;
  color: #c02607 !important;
}

/* Koyu Tema Dropdown Kurumsal Vurgu */
html.dark [id$="-columns-menu"] label:hover {
  background-color: rgba(251, 72, 35, 0.12) !important;
  color: #ff9f8c !important;
}

html.light #tab-dashboard > div:first-child {
  background: linear-gradient(135deg, #ffffff 0%, #fff3f0 100%) !important; border-color: #ffcdc2 !important;
}

#app-shell {
  overflow-x: clip;
}

#sidebar {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  height: 100vh;
  height: 100dvh;
  align-self: flex-start;
  z-index: 50;
  transition: width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}
.brand-logo-light, .brand-logo-collapsed { display: none; }
html.light .brand-logo-light { display: block; }
html.light .brand-logo-dark { display: none; }

/* Anlık Oturum Durumu & PIN Ekranı Parıldamasını (Flicker) Engelleme */
html.is-authenticated #login-overlay { display: none !important; }
html.is-authenticated #app-shell { display: flex !important; }
html.is-unauthenticated #app-shell { display: none !important; }
html.is-unauthenticated #login-overlay { display: flex !important; }
.auth-locked #app-shell { display: none !important; }
#app-shell { width: 100% !important; max-width: 100% !important; }
#app-views { width: 100% !important; max-width: 100% !important; }
#sidebar.collapsed { width: 5rem !important; }
#sidebar.collapsed > div:first-child { flex-direction: column; align-items: center; padding: 0.75rem 0.25rem; gap: 0.5rem; }
#sidebar.collapsed > div:first-child > div { overflow: visible; }
#sidebar.collapsed #sidebar-toggle-btn { align-self: center; }
#sidebar.collapsed .sidebar-text,
#sidebar.collapsed .sidebar-badge,
#sidebar.collapsed .sidebar-logo-text,
#sidebar.collapsed .sidebar-group-header-btn,
#sidebar.collapsed .sidebar-group-label,
#sidebar.collapsed #sidebar-user-profile { display: none !important; }
#sidebar.collapsed .sidebar-group-body { display: block !important; }
#sidebar.collapsed .brand-logo-expanded { display: none !important; }
#sidebar.collapsed .brand-logo-collapsed { display: block; }
#sidebar.collapsed .sidebar-nav-btn { justify-content: center !important; padding-left: 0 !important; padding-right: 0 !important; }
#sidebar.collapsed .sidebar-footer { justify-content: center !important; padding-left: 0.5rem !important; padding-right: 0.5rem !important; }

/* R4B-01 Kurumsal Sidebar Gruplama, Aktif Gösterge & Mobil Drawer */
#sidebar .sidebar-nav-btn:not(#tab-btn-bilo)[aria-current="page"] {
  box-shadow: inset 3px 0 0 0 #fb4823, 0 2px 10px -2px rgba(251, 72, 35, 0.25);
}
#sidebar .sidebar-group-header-btn:focus-visible,
#sidebar .sidebar-nav-btn:focus-visible,
#sidebar .sidebar-offer-sub-btn:focus-visible {
  outline: 2px solid #fb4823;
  outline-offset: 1px;
}
html.light #sidebar .sidebar-group-header-btn,
html.light #sidebar .sidebar-group-label {
  color: #475569 !important;
}
html.light #sidebar .sidebar-group-header-btn:hover {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
}
html.light #sidebar #sidebar-user-profile {
  background-color: #f8fafc !important;
  border-color: #cbd5e1 !important;
}
html.light #sidebar #sidebar-user-badge {
  color: #0f172a !important;
}
html.light #mobile-sidebar-open-btn {
  background-color: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

@media (max-width: 767px) {
  #sidebar {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    width: 17rem !important;
    max-width: 86vw;
    z-index: 55;
    transform: translateX(0);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.65);
    transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1), width 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  }
  #sidebar.collapsed {
    transform: translateX(-105%) !important;
    width: 0 !important;
    min-width: 0 !important;
    border-right-width: 0 !important;
    overflow: hidden !important;
    pointer-events: none !important;
    box-shadow: none !important;
  }
}

.cp-status-control { display: inline-flex; align-items: center; gap: 0.65rem; white-space: nowrap; }
.cp-status-switch { position: relative; display: inline-block; flex: none; width: 2.75rem; height: 1.5rem; padding: 0; border: 1px solid #64748b; border-radius: 9999px; background: #475569; vertical-align: middle; cursor: pointer; -webkit-appearance: none; appearance: none; }
.cp-status-switch[aria-checked="true"] { border-color: #059669; background: #059669; }
.cp-status-switch-knob { position: absolute; top: 2px; left: 2px; display: block; width: 1.125rem; height: 1.125rem; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.25); transition: transform .2s ease; }
.cp-status-switch[aria-checked="true"] .cp-status-switch-knob { transform: translateX(1.2rem); }
.cp-status-switch:focus-visible { outline: 2px solid #fb4823; outline-offset: 2px; }

@media (max-width: 640px) {
  #cp-head { display: none; }
  #cp-rows { display: block; padding: 0.5rem; }
  #cp-rows tr { display: block; margin-bottom: 0.75rem; overflow: hidden; border: 1px solid #334155; border-radius: 0.85rem; }
  #cp-rows tr:last-child { margin-bottom: 0; }
  #cp-rows td[data-label] { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; max-width: none; min-height: 2.75rem; padding: 0.6rem 0.8rem; text-align: right; white-space: normal; overflow-wrap: anywhere; }
  #cp-rows td[data-label] + td[data-label] { border-top: 1px solid #334155; }
  #cp-rows td[data-label]::before { content: attr(data-label); flex: 0 0 6.5rem; color: #94a3b8; font-weight: 600; text-align: left; }
  #cp-rows td[data-label="İşlemler"] { justify-content: flex-end; }
  html.light #cp-rows tr { border-color: #e2e8f0; }
  html.light #cp-rows td[data-label] + td[data-label] { border-color: #e2e8f0; }
  html.light #cp-rows td[data-label]::before { color: #475569; }
}

.tab-btn { white-space: nowrap; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); }
.tab-btn.active { box-shadow: 0 2px 10px -2px rgba(251, 72, 35, 0.25); }

/* ========================================================
   SOL MENÜ (SIDEBAR) AÇIK TEMA YÜKSEK KONTRAST & PARLAK MOR BİLO
   ======================================================== */
html.light #sidebar {
  background-color: #ffffff !important;
  border-right-color: #e2e8f0 !important;
}

html.light #sidebar .sidebar-nav-btn:not(#tab-btn-bilo) {
  background-color: #f8fafc !important;
  border: 1px solid #e2e8f0 !important;
  color: #0f172a !important;
  font-weight: 600 !important;
}

html.light #sidebar .sidebar-nav-btn:not(#tab-btn-bilo) .sidebar-text {
  color: #0f172a !important;
  font-weight: 600 !important;
}

html.light #sidebar .sidebar-nav-btn:not(#tab-btn-bilo) svg {
  color: #334155 !important;
}

html.light #sidebar .sidebar-nav-btn:not(#tab-btn-bilo):hover {
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

html.light #sidebar .sidebar-nav-btn:not(#tab-btn-bilo)[aria-current="page"] {
  background: linear-gradient(135deg, #fff1ee 0%, #ffe4de 100%) !important;
  border: 1px solid #fb4823 !important;
  color: #c22808 !important;
  box-shadow: 0 3px 10px -2px rgba(230, 51, 14, 0.18) !important;
}

html.light #sidebar .sidebar-nav-btn:not(#tab-btn-bilo)[aria-current="page"] .sidebar-text,
html.light #sidebar .sidebar-nav-btn:not(#tab-btn-bilo)[aria-current="page"] svg {
  color: #c22808 !important;
  font-weight: 700 !important;
}

/* Sidebar Alt Menüler (Teklif Yönetimi vb.) Açık Tema Okunabilirliği */
html.light #sidebar #sidebar-offers-submenu {
  border-left-color: #cbd5e1 !important;
}

html.light #sidebar .sidebar-offer-sub-btn {
  background-color: transparent !important;
  color: #1e293b !important;
  font-weight: 600 !important;
}

html.light #sidebar .sidebar-offer-sub-btn span,
html.light #sidebar .sidebar-offer-sub-btn svg {
  color: #334155 !important;
}

html.light #sidebar .sidebar-offer-sub-btn:hover {
  background-color: #f1f5f9 !important;
  color: #0f172a !important;
}

html.light #sidebar .sidebar-offer-sub-btn.active,
html.light #sidebar .sidebar-offer-sub-btn[aria-current="true"] {
  background-color: #fff1ee !important;
  border: 1px solid #fdba74 !important;
  color: #c22808 !important;
  font-weight: 700 !important;
}

html.light #sidebar .sidebar-offer-sub-btn.active span,
html.light #sidebar .sidebar-offer-sub-btn.active svg,
html.light #sidebar .sidebar-offer-sub-btn[aria-current="true"] span,
html.light #sidebar .sidebar-offer-sub-btn[aria-current="true"] svg {
  color: #c22808 !important;
}

/* Sidebar Rozetleri (Makine Sayısı, Teklif Sayısı, Bildirim Sayısı) Açık Tema Net Kontrast */
html.light #sidebar #badge-machine-count,
html.light #sidebar #badge-offers-count {
  background-color: #ea580c !important;
  color: #ffffff !important;
  border: 1px solid #c2410c !important;
  font-weight: 800 !important;
}

html.light #sidebar #sidebar-notification-count {
  background-color: #e11d48 !important;
  color: #ffffff !important;
  font-weight: 800 !important;
}

/* BİLO TEKNİK ASİSTAN — PARLAK MOR (VIBRANT PURPLE) TASARIM (DARK & LIGHT) */
#sidebar #tab-btn-bilo {
  background: linear-gradient(135deg, #a855f7 0%, #9333ea 55%, #7c3aed 100%) !important;
  border: 1px solid #d8b4fe !important;
  color: #ffffff !important;
  box-shadow: 0 4px 15px -1px rgba(168, 85, 247, 0.5) !important;
}

#sidebar #tab-btn-bilo .sidebar-text {
  color: #ffffff !important;
  font-weight: 700 !important;
}

#sidebar #tab-btn-bilo svg,
#sidebar #tab-btn-bilo .bilo-sidebar-icon {
  color: #ffffff !important;
  filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.45));
}

#sidebar #badge-bilo-records {
  background: #ffffff !important;
  color: #6d28d9 !important;
  border: 1px solid #f3e8ff !important;
  font-weight: 800 !important;
  box-shadow: 0 2px 6px rgba(88, 28, 135, 0.28) !important;
  letter-spacing: 0.01em !important;
}

#sidebar #tab-btn-bilo:hover,
#sidebar #tab-btn-bilo[aria-current="page"] {
  background: linear-gradient(135deg, #c084fc 0%, #a855f7 45%, #7e22ce 100%) !important;
  border: 1px solid #ffffff !important;
  color: #ffffff !important;
  box-shadow: 0 6px 20px -1px rgba(168, 85, 247, 0.68) !important;
}

#sidebar #tab-btn-bilo:hover .sidebar-text,
#sidebar #tab-btn-bilo[aria-current="page"] .sidebar-text,
#sidebar #tab-btn-bilo:hover svg,
#sidebar #tab-btn-bilo[aria-current="page"] svg {
  color: #ffffff !important;
}

#sidebar #tab-btn-bilo:hover #badge-bilo-records,
#sidebar #tab-btn-bilo[aria-current="page"] #badge-bilo-records {
  background: #ffffff !important;
  color: #581c87 !important;
  border-color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25) !important;
}

/* Açık Temada Bilo Butonu: Parlak Mor ve Maksimum Kontrast */
html.light #sidebar #tab-btn-bilo {
  background: linear-gradient(135deg, #a855f7 0%, #9333ea 55%, #7c3aed 100%) !important;
  border: 1px solid #7e22ce !important;
  color: #ffffff !important;
  box-shadow: 0 4px 16px -2px rgba(147, 51, 234, 0.52) !important;
}

html.light #sidebar #tab-btn-bilo .sidebar-text,
html.light #sidebar #tab-btn-bilo svg,
html.light #sidebar #tab-btn-bilo .bilo-sidebar-icon {
  color: #ffffff !important;
  font-weight: 700 !important;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.22));
}

html.light #sidebar #tab-btn-bilo #badge-bilo-records {
  background: #ffffff !important;
  color: #6d28d9 !important;
  border: 1px solid #f3e8ff !important;
  font-weight: 800 !important;
  box-shadow: 0 2px 5px rgba(88, 28, 135, 0.22) !important;
}

html.light #sidebar #tab-btn-bilo:hover,
html.light #sidebar #tab-btn-bilo[aria-current="page"] {
  background: linear-gradient(135deg, #c084fc 0%, #9333ea 50%, #6d28d9 100%) !important;
  border: 1px solid #581c87 !important;
  box-shadow: 0 6px 20px -2px rgba(147, 51, 234, 0.65) !important;
}

.bilo-shortcut-btn {
  background: linear-gradient(135deg, #9333ea 0%, #7c3aed 100%) !important;
  border-color: #a855f7 !important;
  color: #ffffff !important;
  box-shadow: 0 3px 10px -2px rgba(147, 51, 234, 0.4) !important;
}

.bilo-shortcut-btn *,
html.light .bilo-shortcut-btn,
html.light .bilo-shortcut-btn * {
  color: #ffffff !important;
}

/* Puantaj Toolbar Butonları & Akordeon Kartları */
#tab-timesheet .flex-wrap > button {
  transition: all 0.15s ease;
}
html.light #tab-timesheet .flex-wrap > button:not(#ts-btn-save-all) {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}
html.light #tab-timesheet .flex-wrap > button:not(#ts-btn-save-all):hover {
  background-color: #f8fafc !important;
  border-color: #94a3b8 !important;
}
html.light #tab-timesheet #ts-btn-save-all,
html.light #ts-btn-save-all {
  background-color: #059669 !important;
  border-color: #047857 !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px -1px rgba(5, 150, 105, 0.4) !important;
}
html.light #tab-timesheet #ts-btn-save-all:hover,
html.light #ts-btn-save-all:hover {
  background-color: #047857 !important;
  border-color: #065f46 !important;
  color: #ffffff !important;
}
html.light #tab-timesheet #ts-btn-save-all * {
  color: #ffffff !important;
}

/* Puantaj Akordeon Kartları - Açık Tema */
.ts-accordion-card {
  transition: all 0.2s ease;
}
html.light .ts-accordion-card {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 4px 15px -1px rgba(15, 23, 42, 0.06), 0 2px 4px -2px rgba(15, 23, 42, 0.04) !important;
}
html.light .ts-accordion-header {
  background-color: #ffffff !important;
}
html.light .ts-accordion-header:hover {
  background-color: #fff9f8 !important;
}
html.light .ts-accordion-header h3 {
  color: #0f172a !important;
}
html.light .ts-accordion-header p {
  color: #475569 !important;
}
html.light .ts-accordion-kpi-pill {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
  color: #334155 !important;
}
html.light .ts-accordion-card button.bg-slate-800 {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
}
html.light .ts-accordion-card button.bg-slate-800:hover {
  background-color: #f1f5f9 !important;
}
html.light .ts-accordion-card button.bg-emerald-600 {
  background-color: #059669 !important;
  border-color: #047857 !important;
  color: #ffffff !important;
}
html.light .ts-accordion-card button.bg-emerald-600:hover {
  background-color: #047857 !important;
}
html.light .ts-accordion-card button.bg-emerald-600 * {
  color: #ffffff !important;
}
html.light .ts-accordion-body {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
}
html.light .ts-accordion-inner-kpis {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
}
html.light .ts-accordion-card table thead {
  background-color: #f1f5f9 !important;
  border-color: #e2e8f0 !important;
}
html.light .ts-accordion-card table thead th {
  color: #475569 !important;
}
html.light .ts-accordion-card table tbody tr {
  border-color: #f1f5f9 !important;
}
html.light .ts-accordion-card table tbody tr:hover {
  background-color: #f1f5f9 !important;
}
html.light .ts-accordion-card table select,
html.light .ts-accordion-card table input,
html.light #timesheet-rows select,
html.light #timesheet-rows input {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}
html.light input[data-field="daily_hours"],
html.light input[onchange*="daily_hours"] {
  border-color: #fb923c !important;
  color: #c02607 !important;
  background-color: #fff9f8 !important;
}

/* ==========================================================================
   FINANS MODÜLÜ UI/UX MODERNİZASYONU & DARK/LIGHT TEMA UYUMU
   ========================================================================== */

/* ==========================================================================
   UNIFIED SEGMENTED SUBTAB & TABBED NAV BAR SYSTEM (DARK & LIGHT)
   ========================================================================== */

/* Navigasyon Sekmeleri (Modern Pill Bar - Koyu Tema) */
.segmented-nav-bar,
.finance-nav-bar {
  background-color: #0f172a !important;
  border-color: #1e293b !important;
}

.finance-subtab-btn,
.op-subtab-btn,
[data-subtab],
.ctr-status-btn,
.ts-contract-tab-btn,
.segmented-tab-btn {
  color: #94a3b8;
  background-color: transparent;
  border: 1px solid transparent;
  cursor: pointer;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1);
  font-weight: 500;
}

.finance-subtab-btn:hover,
.op-subtab-btn:hover,
[data-subtab]:hover,
.ctr-status-btn:hover,
.ts-contract-tab-btn:hover,
.segmented-tab-btn:hover {
  color: #f8fafc;
  background-color: rgba(30, 41, 59, 0.7);
}

.finance-subtab-btn.active,
.op-subtab-btn.active,
[data-subtab].active,
.ctr-status-btn.active,
.ts-contract-tab-btn.active,
.segmented-tab-btn.active {
  background: linear-gradient(135deg, #ff441f 0%, #e6330e 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-color: transparent !important;
  box-shadow: 0 4px 14px -2px rgba(230, 51, 14, 0.55), 0 2px 4px -1px rgba(0, 0, 0, 0.2) !important;
  transform: translateY(-0.5px);
}

.finance-subtab-btn.active i,
.finance-subtab-btn.active svg,
.finance-subtab-btn.active span,
.finance-subtab-btn.active *,
.op-subtab-btn.active i,
.op-subtab-btn.active svg,
.op-subtab-btn.active span,
.op-subtab-btn.active *,
[data-subtab].active i,
[data-subtab].active svg,
[data-subtab].active span,
[data-subtab].active *,
.ctr-status-btn.active i,
.ctr-status-btn.active svg,
.ctr-status-btn.active span,
.ctr-status-btn.active *,
.ts-contract-tab-btn.active i,
.ts-contract-tab-btn.active svg,
.ts-contract-tab-btn.active span,
.ts-contract-tab-btn.active *,
.segmented-tab-btn.active i,
.segmented-tab-btn.active svg,
.segmented-tab-btn.active span,
.segmented-tab-btn.active * {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

/* Hakediş & Gelir Kartları (Dark Mode) */
.revenue-card {
  background-color: #0f172a;
  border-color: #1e293b;
}

.revenue-card .rev-breakdown-row {
  background-color: rgba(30, 41, 59, 0.45);
  border-color: rgba(51, 65, 85, 0.6);
  color: #cbd5e1;
}

.revenue-card .rev-breakdown-row .rev-label {
  color: #94a3b8;
}

.revenue-card .rev-input-box {
  background-color: rgba(15, 23, 42, 0.65);
  border-color: #334155;
}

.revenue-card .rev-field-input {
  background-color: #1e293b;
  border-color: #475569;
  color: #f8fafc;
}

.revenue-card .rev-field-input:focus {
  border-color: #ff441f;
  box-shadow: 0 0 0 2px rgba(255, 68, 31, 0.25);
}

.revenue-card .rev-summary-panel {
  background: linear-gradient(180deg, rgba(30, 41, 59, 0.7) 0%, rgba(15, 23, 42, 0.95) 100%);
  border-color: rgba(255, 68, 31, 0.35);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
}

.revenue-card .rev-select-input {
  background-color: #1e293b;
  border-color: #475569;
  color: #f8fafc;
}

/* Light Tema Finans Modülü Geçersiz Kılmaları (html.light) */
html.light .segmented-nav-bar,
html.light .finance-nav-bar {
  background-color: #f1f5f9 !important;
  border-color: #e2e8f0 !important;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04) !important;
}

html.light .finance-subtab-btn,
html.light .op-subtab-btn,
html.light [data-subtab],
html.light .ctr-status-btn,
html.light .ts-contract-tab-btn,
html.light .segmented-tab-btn {
  color: #64748b !important;
  background-color: transparent !important;
  border-color: transparent !important;
}

html.light .finance-subtab-btn:hover,
html.light .op-subtab-btn:hover,
html.light [data-subtab]:hover,
html.light .ctr-status-btn:hover,
html.light .ts-contract-tab-btn:hover,
html.light .segmented-tab-btn:hover {
  color: #0f172a !important;
  background-color: rgba(255, 255, 255, 0.9) !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

html.light .finance-subtab-btn.active,
html.light .op-subtab-btn.active,
html.light [data-subtab].active,
html.light .ctr-status-btn.active,
html.light .ts-contract-tab-btn.active,
html.light .segmented-tab-btn.active {
  background: linear-gradient(135deg, #ff441f 0%, #e6330e 100%) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  border-color: transparent !important;
  box-shadow: 0 4px 14px -2px rgba(230, 51, 14, 0.45), 0 2px 4px -1px rgba(0, 0, 0, 0.08) !important;
  transform: translateY(-0.5px);
}

html.light .finance-subtab-btn.active i,
html.light .finance-subtab-btn.active svg,
html.light .finance-subtab-btn.active span,
html.light .finance-subtab-btn.active *,
html.light .op-subtab-btn.active i,
html.light .op-subtab-btn.active svg,
html.light .op-subtab-btn.active span,
html.light .op-subtab-btn.active *,
html.light [data-subtab].active i,
html.light [data-subtab].active svg,
html.light [data-subtab].active span,
html.light [data-subtab].active *,
html.light .ctr-status-btn.active i,
html.light .ctr-status-btn.active svg,
html.light .ctr-status-btn.active span,
html.light .ctr-status-btn.active *,
html.light .ts-contract-tab-btn.active i,
html.light .ts-contract-tab-btn.active svg,
html.light .ts-contract-tab-btn.active span,
html.light .ts-contract-tab-btn.active *,
html.light .segmented-tab-btn.active i,
html.light .segmented-tab-btn.active svg,
html.light .segmented-tab-btn.active span,
html.light .segmented-tab-btn.active * {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

/* Light Tema: Gelirler & Fatura Kartları */
html.light .revenue-card {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 4px 20px -2px rgba(15, 23, 42, 0.06) !important;
}

html.light .revenue-card .rev-breakdown-row {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

html.light .revenue-card .rev-breakdown-row .rev-label {
  color: #475569 !important;
}

html.light .revenue-card .rev-input-box {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
}

html.light .revenue-card .rev-input-box label {
  color: #475569 !important;
}

html.light .revenue-card .rev-field-input {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

html.light .revenue-card .rev-field-input:focus {
  border-color: #ff441f !important;
  box-shadow: 0 0 0 2px rgba(255, 68, 31, 0.15) !important;
}

html.light .revenue-card .rev-summary-panel {
  background: linear-gradient(180deg, #fff9f8 0%, #ffffff 100%) !important;
  border-color: #fed7aa !important;
  box-shadow: 0 4px 16px rgba(234, 88, 12, 0.08) !important;
}

html.light .revenue-card .rev-summary-panel label {
  color: #475569 !important;
}

html.light .revenue-card .rev-select-input {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

html.light .revenue-card [data-total="subtotal"],
html.light .revenue-card [data-total="vat"] {
  color: #0f172a !important;
}

html.light .rev-sort-box {
  background-color: #f1f5f9 !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

html.light .rev-sort-box select {
  color: #0f172a !important;
}

html.light .rev-sort-box select option {
  background-color: #ffffff !important;
  color: #0f172a !important;
}

/* Light Tema: KPI ve Filtre Seçicileri */
html.light .fin-kpi-card {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04) !important;
}

html.light .fin-filter-select {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

html.light #expense-category-cards > div {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03) !important;
}

/* Light Tema: Giderler & Nakit Akışı Tabloları */
html.light #tab-expenses table thead,
html.light #tab-cashflow table thead {
  background-color: #f1f5f9 !important;
  border-color: #e2e8f0 !important;
}

html.light #tab-expenses table thead th,
html.light #tab-cashflow table thead th {
  color: #475569 !important;
}

html.light #tab-expenses table tbody tr,
html.light #tab-cashflow table tbody tr {
  border-color: #f1f5f9 !important;
}

html.light #tab-expenses table tbody tr:hover,
html.light #tab-cashflow table tbody tr:hover {
  background-color: #f8fafc !important;
}

html.light #tab-cashflow table tfoot {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

/* Finans Rozetleri & Durum Etiketleri (Light Mode) */
html.light .bg-emerald-500\/20 {
  background-color: rgba(5, 150, 105, 0.15) !important;
  color: #047857 !important;
}

html.light .bg-rose-500\/20 {
  background-color: rgba(225, 29, 72, 0.15) !important;
  color: #be123c !important;
}

html.light .bg-brand-500\/20 {
  background-color: rgba(230, 51, 14, 0.15) !important;
  color: #c02607 !important;
}

/* Operatör Havuzu Açık Tema ve Etiket Stilleri */
html.light #tab-operators .bg-slate-900 {
  background-color: #ffffff !important;
  border-color: #e2e8f0 !important;
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.05);
}

html.light #tab-operators .bg-slate-950 {
  background-color: #f8fafc !important;
  border-color: #e2e8f0 !important;
  color: #0f172a !important;
}

html.light #tab-operators input,
html.light #tab-operators select {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
  color: #0f172a !important;
}

html.light #tab-operators input::placeholder {
  color: #94a3b8 !important;
}

html.light #tab-operators thead {
  background-color: #f8fafc !important;
  color: #475569 !important;
  border-color: #e2e8f0 !important;
}

html.light #tab-operators tbody tr:hover {
  background-color: #f8fafc !important;
}

/* Operatör Uzmanlık ve Sertifika Etiketleri (Tablo & Görünüm) */
.op-tag-specialty {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  background-color: rgba(230, 51, 14, 0.12);
  color: #fb7185;
  border: 1px solid rgba(230, 51, 14, 0.25);
  line-height: 1.3;
}
html.light .op-tag-specialty {
  background-color: #fff1ee !important;
  color: #c02607 !important;
  border-color: #fed7aa !important;
}

.op-tag-license {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 7px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 500;
  background-color: rgba(99, 102, 241, 0.12);
  color: #a5b4fc;
  border: 1px solid rgba(99, 102, 241, 0.25);
  line-height: 1.3;
}
html.light .op-tag-license {
  background-color: #eef2ff !important;
  color: #4338ca !important;
  border-color: #c7d2fe !important;
}

/* Modal Etiket Giriş Kutuları */
.op-tag-container {
  min-height: 42px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 12px;
  background-color: #1e293b;
  border: 1px solid #334155;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  cursor: text;
}
.op-tag-container:focus-within {
  border-color: #e6330e !important;
  box-shadow: 0 0 0 1px #e6330e;
}
html.light .op-tag-container {
  background-color: #ffffff !important;
  border-color: #cbd5e1 !important;
}
html.light .op-tag-container:focus-within {
  border-color: #e6330e !important;
  box-shadow: 0 0 0 1px #e6330e;
}

.op-tag-pill {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 2.5px 8px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
}
.op-tag-pill-specialty {
  background-color: rgba(230, 51, 14, 0.18);
  color: #ff6b4a;
  border: 1px solid rgba(230, 51, 14, 0.35);
}
html.light .op-tag-pill-specialty {
  background-color: #fff1ee !important;
  color: #c02607 !important;
  border-color: #fed7aa !important;
}
.op-tag-pill-license {
  background-color: rgba(99, 102, 241, 0.18);
  color: #a5b4fc;
  border: 1px solid rgba(99, 102, 241, 0.35);
}
html.light .op-tag-pill-license {
  background-color: #eef2ff !important;
  color: #4338ca !important;
  border-color: #c7d2fe !important;
}

.op-tag-remove-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  font-size: 10px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.7;
  transition: opacity 0.15s, background-color 0.15s;
  border: none;
  background: transparent;
  color: inherit;
  padding: 0;
}
.op-tag-remove-btn:hover {
  opacity: 1;
  background-color: rgba(0, 0, 0, 0.2);
}

.op-quick-chip {
  font-size: 11px;
  font-weight: 500;
  padding: 2.5px 8px;
  border-radius: 6px;
  border: 1px solid #334155;
  background-color: rgba(30, 41, 59, 0.7);
  color: #cbd5e1;
  cursor: pointer;
  transition: all 0.15s ease;
}
.op-quick-chip:hover {
  border-color: #e6330e;
  color: #ffffff;
  background-color: rgba(230, 51, 14, 0.2);
}
html.light .op-quick-chip {
  background-color: #f1f5f9 !important;
  color: #475569 !important;
  border-color: #cbd5e1 !important;
}
html.light .op-quick-chip:hover {
  background-color: #fff1ee !important;
  color: #c02607 !important;
  border-color: #fed7aa !important;
}

/* ==========================================================================
   A4 RESMİ DİJİTAL SERVİS FORMU YAZDIRMA STİLLERİ
   ========================================================================== */
@media print {
  @page {
    size: A4 portrait;
    margin: 8mm 10mm;
  }
  body {
    background: #ffffff !important;
    color: #000000 !important;
  }
  body * {
    visibility: hidden;
  }
  #modal-service-sheet,
  #modal-service-sheet #printable-service-sheet,
  #modal-service-sheet #printable-service-sheet * {
    visibility: visible;
  }
  #modal-service-sheet {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 100% !important;
    height: auto !important;
    background: #ffffff !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    display: block !important;
    z-index: 999999 !important;
  }
  #modal-service-sheet > div {
    background: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
    max-width: 100% !important;
    max-height: none !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }
  #modal-service-sheet .overflow-y-auto {
    overflow: visible !important;
    padding: 0 !important;
    background: #ffffff !important;
  }
  #printable-service-sheet {
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  .no-print,
  .no-print *,
  [data-ai-hidden="true"],
  [data-ai-hidden="true"] *,
  #sheet-ai-risk-panel.hidden,
  #sheet-ai-risk-panel.hidden *,
  #sheet-ai-collapsed-bar,
  #sheet-ai-collapsed-bar * {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }
  #sheet-ai-risk-panel:not(.hidden):not([data-ai-hidden="true"]) {
    display: block !important;
    background: #f8fafc !important;
    color: #0f172a !important;
    border: 1px solid #cbd5e1 !important;
    page-break-inside: avoid !important;
  }
  #sheet-ai-risk-panel:not(.hidden):not([data-ai-hidden="true"]) * {
    color: #0f172a !important;
  }
  .scroll-to-top-btn {
    display: none !important;
  }
}

/* ========================================================
   SAYFA BAŞINA DÖN BUTONU (GÖREV 3)
   ======================================================== */
.scroll-to-top-btn {
  position: fixed;
  right: 1.5rem;
  bottom: 1.5rem;
  z-index: 45;
  width: 2.625rem;
  height: 2.625rem;
  border-radius: 0.875rem;
  border: 1px solid rgba(251, 72, 35, 0.45);
  background: rgba(15, 23, 42, 0.92);
  color: #fb4823;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(251, 72, 35, 0.15);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  cursor: pointer;
  opacity: 0;
  visibility: hidden;
  transform: translateY(0.75rem) scale(0.95);
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease, background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}
.scroll-to-top-btn.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}
.scroll-to-top-btn:hover {
  background: #fb4823;
  border-color: #fb4823;
  color: #ffffff;
  box-shadow: 0 12px 28px -4px rgba(251, 72, 35, 0.45);
  transform: translateY(-2px) scale(1.03);
}
.scroll-to-top-btn:active {
  transform: translateY(0) scale(0.97);
}
.scroll-to-top-btn:focus-visible {
  outline: 2px solid #fb4823;
  outline-offset: 3px;
}
html.light .scroll-to-top-btn {
  background: rgba(255, 255, 255, 0.95);
  border-color: rgba(230, 51, 14, 0.4);
  color: #e6330e;
  box-shadow: 0 10px 25px -5px rgba(15, 23, 42, 0.15), 0 0 0 1px rgba(230, 51, 14, 0.1);
}
html.light .scroll-to-top-btn:hover {
  background: #fb4823;
  border-color: #fb4823;
  color: #ffffff;
}
html.is-unauthenticated .scroll-to-top-btn,
body.auth-locked .scroll-to-top-btn {
  display: none !important;
}
@media (max-width: 640px) {
  .scroll-to-top-btn {
    right: 1rem;
    bottom: 1.125rem;
    width: 2.375rem;
    height: 2.375rem;
    border-radius: 0.75rem;
  }
}
@media (prefers-reduced-motion: reduce) {
  .scroll-to-top-btn {
    transition: none !important;
  }
}

/* ============================================================================
   R4C-13: GELİŞMİŞ BİLO & SERVİS İNDEKSİ BİLO PANELİ
   KURUMSAL UI/UX & WCAG 2.2 AA ERİŞİLEBİLİRLİK TASARIM SİSTEMİ
   ============================================================================ */

:root,
html.dark {
  --bilo-bg-page: #020617;
  --bilo-bg-card: #0f172a;
  --bilo-bg-subcard: #1e293b;
  --bilo-bg-input: #0f172a;
  --bilo-border: #334155;
  --bilo-border-strong: #475569;

  --bilo-text-primary: #f8fafc;    /* 17.4:1 on #0f172a */
  --bilo-text-secondary: #e2e8f0;  /* 14.1:1 on #0f172a */
  --bilo-text-muted: #cbd5e1;      /* 10.8:1 on #0f172a */

  --bilo-brand-bg: #c22808;        /* 5.88:1 with #ffffff */
  --bilo-brand-bg-hover: #9e1f05;  /* 7.80:1 with #ffffff */
  --bilo-brand-soft-bg: #431407;
  --bilo-brand-soft-border: #ea580c;
  --bilo-brand-soft-text: #ffedd5; /* 11.2:1 on #431407 */

  --bilo-verified-bg: #064e3b;
  --bilo-verified-border: #10b981;
  --bilo-verified-text: #ecfdf5;   /* 9.1:1 on #064e3b */

  --bilo-info-bg: #0c4a6e;
  --bilo-info-border: #38bdf8;
  --bilo-info-text: #f0f9ff;       /* 9.6:1 on #0c4a6e */

  --bilo-warn-bg: #78350f;
  --bilo-warn-border: #f59e0b;
  --bilo-warn-text: #fffbeb;       /* 8.5:1 on #78350f */

  --bilo-danger-bg: #881337;
  --bilo-danger-border: #fb7185;
  --bilo-danger-text: #fff1f2;     /* 8.6:1 on #881337 */

  --bilo-stat-bg: #312e81;
  --bilo-stat-border: #818cf8;
  --bilo-stat-text: #eef2ff;       /* 9.9:1 on #312e81 */

  --bilo-neutral-bg: #1e293b;
  --bilo-neutral-border: #475569;
  --bilo-neutral-text: #f1f5f9;    /* 11.9:1 on #1e293b */
}

html.light {
  --bilo-bg-page: #f8fafc;
  --bilo-bg-card: #ffffff;
  --bilo-bg-subcard: #f8fafc;
  --bilo-bg-input: #ffffff;
  --bilo-border: #cbd5e1;
  --bilo-border-strong: #94a3b8;

  --bilo-text-primary: #0f172a;    /* 16.1:1 on #ffffff */
  --bilo-text-secondary: #1e293b;  /* 13.6:1 on #ffffff */
  --bilo-text-muted: #334155;      /* 10.4:1 on #ffffff */

  --bilo-brand-bg: #c22808;        /* 5.88:1 with #ffffff */
  --bilo-brand-bg-hover: #9e1f05;  /* 7.80:1 with #ffffff */
  --bilo-brand-soft-bg: #fff7ed;
  --bilo-brand-soft-border: #fdba74;
  --bilo-brand-soft-text: #9a3412; /* 7.2:1 on #fff7ed */

  --bilo-verified-bg: #ecfdf5;
  --bilo-verified-border: #6ee7b7;
  --bilo-verified-text: #065f46;   /* 7.7:1 on #ecfdf5 */

  --bilo-info-bg: #f0f9ff;
  --bilo-info-border: #7dd3fc;
  --bilo-info-text: #0c4a6e;       /* 8.9:1 on #f0f9ff */

  --bilo-warn-bg: #fffbeb;
  --bilo-warn-border: #fcd34d;
  --bilo-warn-text: #78350f;       /* 8.4:1 on #fffbeb */

  --bilo-danger-bg: #fff1f2;
  --bilo-danger-border: #fda4af;
  --bilo-danger-text: #881337;     /* 8.7:1 on #fff1f2 */

  --bilo-stat-bg: #eef2ff;
  --bilo-stat-border: #a5b4fc;
  --bilo-stat-text: #312e81;       /* 9.8:1 on #eef2ff */

  --bilo-neutral-bg: #f1f5f9;
  --bilo-neutral-border: #cbd5e1;
  --bilo-neutral-text: #1e293b;    /* 12.1:1 on #f1f5f9 */
}

/* Printable Service Sheet is always a light paper surface (#ffffff) */
#printable-service-sheet {
  --bilo-bg-page: #f8fafc;
  --bilo-bg-card: #ffffff;
  --bilo-bg-subcard: #f8fafc;
  --bilo-bg-input: #ffffff;
  --bilo-border: #cbd5e1;
  --bilo-border-strong: #94a3b8;
  --bilo-text-primary: #0f172a;
  --bilo-text-secondary: #1e293b;
  --bilo-text-muted: #334155;
  --bilo-verified-bg: #ecfdf5;
  --bilo-verified-border: #6ee7b7;
  --bilo-verified-text: #065f46;
  --bilo-info-bg: #f0f9ff;
  --bilo-info-border: #7dd3fc;
  --bilo-info-text: #0c4a6e;
  --bilo-warn-bg: #fffbeb;
  --bilo-warn-border: #fcd34d;
  --bilo-warn-text: #78350f;
  --bilo-danger-bg: #fff1f2;
  --bilo-danger-border: #fda4af;
  --bilo-danger-text: #881337;
  --bilo-stat-bg: #eef2ff;
  --bilo-stat-border: #a5b4fc;
  --bilo-stat-text: #312e81;
  --bilo-neutral-bg: #f1f5f9;
  --bilo-neutral-border: #cbd5e1;
  --bilo-neutral-text: #1e293b;
}

.bilo-surface-card {
  background-color: var(--bilo-bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--bilo-border) !important;
  color: var(--bilo-text-primary) !important;
  border-radius: 1rem;
  box-shadow: 0 4px 16px -4px rgba(15, 23, 42, 0.08);
}

.bilo-surface-subcard {
  background-color: var(--bilo-bg-subcard) !important;
  background-image: none !important;
  border: 1px solid var(--bilo-border) !important;
  color: var(--bilo-text-primary) !important;
  border-radius: 0.75rem;
}

.bilo-header-card {
  background-color: var(--bilo-bg-card) !important;
  background-image: none !important;
  border: 1px solid var(--bilo-border) !important;
  border-left: 5px solid #c22808 !important;
  color: var(--bilo-text-primary) !important;
  border-radius: 1rem;
  box-shadow: 0 6px 20px -4px rgba(15, 23, 42, 0.1);
}

.bilo-text-primary {
  color: var(--bilo-text-primary) !important;
}

.bilo-text-secondary {
  color: var(--bilo-text-secondary) !important;
}

.bilo-text-muted {
  color: var(--bilo-text-muted) !important;
}

.bilo-label {
  display: block;
  font-size: 0.75rem;
  line-height: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.025em;
  color: var(--bilo-text-secondary) !important;
  margin-bottom: 0.375rem;
}

.bilo-input {
  width: 100%;
  background-color: var(--bilo-bg-input) !important;
  border: 1px solid var(--bilo-border-strong) !important;
  color: var(--bilo-text-primary) !important;
  border-radius: 0.625rem;
  padding: 0.625rem 0.75rem;
  font-size: 0.875rem;
  line-height: 1.35rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.bilo-input::placeholder {
  color: var(--bilo-text-muted) !important;
  opacity: 0.85;
}

.bilo-input:focus,
.bilo-input:focus-visible {
  outline: 2px solid #c22808 !important;
  outline-offset: 1px !important;
  border-color: #c22808 !important;
}

.bilo-btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: var(--bilo-brand-bg) !important;
  background-image: none !important;
  color: #ffffff !important;
  border: 1px solid transparent !important;
  border-radius: 0.625rem;
  padding: 0.65rem 1.25rem;
  font-size: 0.875rem;
  line-height: 1.25rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.15s ease, transform 0.1s ease;
}

.bilo-btn-primary *,
html.light .bilo-btn-primary,
html.light .bilo-btn-primary * {
  color: #ffffff !important;
}

.bilo-btn-primary:hover:not(:disabled) {
  background-color: var(--bilo-brand-bg-hover) !important;
}

.bilo-btn-primary:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.bilo-btn-secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  background-color: var(--bilo-bg-subcard) !important;
  color: var(--bilo-text-primary) !important;
  border: 1px solid var(--bilo-border-strong) !important;
  border-radius: 0.625rem;
  padding: 0.625rem 1rem;
  font-size: 0.8125rem;
  line-height: 1.25rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}

.bilo-btn-secondary:hover {
  border-color: #c22808 !important;
}

.bilo-btn-danger {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  background-color: var(--bilo-danger-bg) !important;
  color: var(--bilo-danger-text) !important;
  border: 1px solid var(--bilo-danger-border) !important;
  border-radius: 0.625rem;
  padding: 0.625rem 1rem;
  font-size: 0.8125rem;
  line-height: 1.25rem;
  font-weight: 700;
  cursor: pointer;
}

.bilo-btn-primary:focus-visible,
.bilo-btn-secondary:focus-visible,
.bilo-btn-danger:focus-visible,
.bilo-quick-chip:focus-visible {
  outline: 2px solid #c22808 !important;
  outline-offset: 2px !important;
}

.bilo-quick-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  background-color: var(--bilo-bg-subcard) !important;
  color: var(--bilo-text-primary) !important;
  border: 1px solid var(--bilo-border-strong) !important;
  border-radius: 0.5rem;
  padding: 0.45rem 0.75rem;
  font-size: 0.75rem;
  line-height: 1.15rem;
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
}

.bilo-quick-chip:hover {
  border-color: #c22808 !important;
  background-color: var(--bilo-brand-soft-bg) !important;
  color: var(--bilo-brand-soft-text) !important;
}

/* Semantic Badges & Callout Surfaces (WCAG AA/AAA Verified) */
.bilo-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.25rem 0.625rem;
  border-radius: 0.5rem;
  font-size: 0.75rem;
  line-height: 1.1rem;
  font-weight: 700;
  border: 1px solid transparent;
}

.bilo-tone-verified {
  background-color: var(--bilo-verified-bg) !important;
  border-color: var(--bilo-verified-border) !important;
  color: var(--bilo-verified-text) !important;
}

.bilo-tone-info {
  background-color: var(--bilo-info-bg) !important;
  border-color: var(--bilo-info-border) !important;
  color: var(--bilo-info-text) !important;
}

.bilo-tone-warn {
  background-color: var(--bilo-warn-bg) !important;
  border-color: var(--bilo-warn-border) !important;
  color: var(--bilo-warn-text) !important;
}

.bilo-tone-danger {
  background-color: var(--bilo-danger-bg) !important;
  border-color: var(--bilo-danger-border) !important;
  color: var(--bilo-danger-text) !important;
}

.bilo-tone-stat {
  background-color: var(--bilo-stat-bg) !important;
  border-color: var(--bilo-stat-border) !important;
  color: var(--bilo-stat-text) !important;
}

.bilo-tone-brand {
  background-color: var(--bilo-brand-soft-bg) !important;
  border-color: var(--bilo-brand-soft-border) !important;
  color: var(--bilo-brand-soft-text) !important;
}

.bilo-tone-neutral {
  background-color: var(--bilo-neutral-bg) !important;
  border-color: var(--bilo-neutral-border) !important;
  color: var(--bilo-neutral-text) !important;
}

.bilo-tone-verified *,
.bilo-tone-info *,
.bilo-tone-warn *,
.bilo-tone-danger *,
.bilo-tone-stat *,
.bilo-tone-brand *,
.bilo-tone-neutral * {
  color: inherit !important;
}

.bilo-prose-list {
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--bilo-text-primary) !important;
}

.bilo-prose-list li {
  margin-bottom: 0.45rem;
}

.bilo-citation-card {
  background-color: var(--bilo-bg-card) !important;
  border: 1px solid var(--bilo-border-strong) !important;
  border-radius: 0.875rem;
  padding: 1rem 1.125rem;
  color: var(--bilo-text-primary) !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.bilo-citation-card:hover {
  border-color: #c22808 !important;
  box-shadow: 0 4px 14px -3px rgba(15, 23, 42, 0.12);
}

.bilo-details-box {
  border: 1px solid var(--bilo-border) !important;
  background-color: var(--bilo-bg-subcard) !important;
  border-radius: 0.625rem;
  padding: 0.5rem 0.75rem;
  margin-top: 0.5rem;
}

.bilo-details-box > summary {
  cursor: pointer;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--bilo-text-secondary) !important;
  user-select: none;
}

/* ============================================================================
   R4B-02 — GERÇEK UI/UX SADELEŞTİRMESİ VE KURUMSAL TEKLİF EKRANI KURALLARI
   ============================================================================ */

.sr-only {
  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;
}

/* Teklifler alt menüsü sidebarda asla açılmaz; modül içi bağlamsal menüden erişilir */
.sidebar-offers-context-hidden {
  display: none !important;
}

/* Daraltılmış sidebarda yalnızca 8 üst düzey ikon görünür */
#sidebar.collapsed #sidebar-group-body-operations {
  display: none !important;
}

#sidebar.collapsed #sidebar-group-btn-operations {
  justify-content: center;
  padding-left: 0;
  padding-right: 0;
}

#sidebar.collapsed #sidebar-group-btn-operations .sidebar-text,
#sidebar.collapsed #sidebar-group-btn-operations .sidebar-group-chevron {
  display: none !important;
}

/* Teklif modalları için kesin konumlandırma */
#modal-offer,
#modal-offer-detail,
#modal-offer-doc-preview,
#modal-offer-email,
#modal-offer-rental,
#modal-offer-historical-complete,
#modal-offer-webhook-test {
  position: fixed;
  inset: 0;
  z-index: 60;
}

/* Teklifler araç menüsü (dropdown) */
#offers-tools-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 0.375rem);
  z-index: 50;
  min-width: 14rem;
}