/* ============================================================
   panel-vercel.css — Vercel/Geist BRUTAL OVERRIDE
   Bu dosya CSS chain'in EN SONUNDA yüklenir; tüm dekoratif
   katmanları (gradient/shadow/blur) wipe eder, pure mono kalır.
   ============================================================ */

/* ====================================================
   1) ROOT VARIABLES — both --ui-* and --l* (login) overrides
   ==================================================== */

:root,
html, html[data-theme="light"], html[data-theme="light"][data-palette],
html[data-palette], body, body.office-theme {
  /* Panel --ui-* tokens — !important to beat panel-v2.css's !important */
  --ui-bg:            #fafafa !important;
  --ui-surface:       #ffffff !important;
  --ui-surface-2:     #ffffff !important;
  --ui-surface-3:     #f5f5f5 !important;
  --ui-border:        #e5e5e5 !important;
  --ui-border-strong: #d4d4d4 !important;
  --ui-text:          #0a0a0a !important;
  --ui-muted:         #666666 !important;
  --ui-muted-soft:    #8a8a8a !important;
  --ui-primary:       #0070F3 !important;
  --ui-primary-rgb:   0, 112, 243 !important;
  --ui-primary-2:     #0070F3 !important;
  --ui-primary-2-rgb: 0, 112, 243 !important;
  --ui-danger:        #E5484D !important;
  --ui-danger-rgb:    229, 72, 77 !important;
  --ui-warning:       #F5A623 !important;
  --ui-warning-rgb:   245, 166, 35 !important;
  --ui-success:       #17C964 !important;
  --ui-success-rgb:   23, 201, 100 !important;
  --ui-radius-lg:     8px !important;
  --ui-radius-md:     6px !important;
  --ui-radius-sm:     5px !important;
  --ui-shadow:        none !important;
  --ui-shadow-soft:   none !important;
  --ui-shadow-card:   none !important;
  --ui-shadow-card-hover: 0 2px 6px rgba(0,0,0,0.06) !important;
  --ui-shadow-sm:     none !important;

  /* login.css --l* tokens (light) */
  --lbg:              #fafafa !important;
  --lgrid-line:       transparent !important;
  --lglow1:           transparent !important;
  --lglow2:           transparent !important;
  --lcard-bg:         #ffffff !important;
  --lcard-border:     #e5e5e5 !important;
  --linfo-bg:         #ffffff !important;
  --linfo-border:     #e5e5e5 !important;
  --linfo-text:       #0a0a0a !important;
  --linput-bg:        #ffffff !important;
  --linput-bg-focus:  #ffffff !important;
  --linput-border:    #d4d4d4 !important;
  --lcheck-bg:        #ffffff !important;
  --lbtn-bg:          #000 !important;
  --lbtn-hbg:         #333 !important;
  --lbtn-outline-bg:  #ffffff !important;
  --lbtn-outline-hbg: #f5f5f5 !important;
  --lbtn-tour-bg:     #000 !important;
  --lbtn-tour-hbg:    #333 !important;
  --lalert-err-bg:    #ffffff !important;
  --lalert-wrn-bg:    #ffffff !important;
  --ltool-bg:         transparent !important;
  --ltool-hbg:        #f5f5f5 !important;
  --llang-act-bg:     #000 !important;
}

html[data-theme="dark"],
html[data-theme="dark"][data-palette],
html[data-theme="dark"] body,
html[data-theme="dark"] body.office-theme {
  --ui-bg:            #000000 !important;
  --ui-surface:       #0a0a0a !important;
  --ui-surface-2:     #111111 !important;
  --ui-surface-3:     #161616 !important;
  --ui-border:        #1f1f1f !important;
  --ui-border-strong: #2e2e2e !important;
  --ui-text:          #ededed !important;
  --ui-muted:         #a1a1a1 !important;
  --ui-muted-soft:    #666666 !important;
  --ui-primary:       #0070F3 !important;
  --ui-primary-rgb:   0, 112, 243 !important;
  --ui-primary-2:     #0070F3 !important;
  --ui-primary-2-rgb: 0, 112, 243 !important;
  --ui-danger:        #FF6369 !important;
  --ui-danger-rgb:    255, 99, 105 !important;
  --ui-warning:       #F5A623 !important;
  --ui-warning-rgb:   245, 166, 35 !important;
  --ui-success:       #46DE85 !important;
  --ui-success-rgb:   70, 222, 133 !important;
  --ui-shadow:        none !important;
  --ui-shadow-soft:   none !important;
  --ui-shadow-card:   none !important;
  --ui-shadow-card-hover: 0 2px 8px rgba(0,0,0,0.4) !important;
  --ui-shadow-sm:     none !important;

  --lbg:              #000000 !important;
  --lgrid-line:       transparent !important;
  --lglow1:           transparent !important;
  --lglow2:           transparent !important;
  --lcard-bg:         #0a0a0a !important;
  --lcard-border:     #1f1f1f !important;
  --linfo-bg:         #0a0a0a !important;
  --linfo-border:     #1f1f1f !important;
  --linfo-text:       #ededed !important;
  --linput-bg:        #0a0a0a !important;
  --linput-bg-focus:  #111111 !important;
  --linput-border:    #2e2e2e !important;
  --lcheck-bg:        #0a0a0a !important;
  --lbtn-bg:          #ffffff !important;
  --lbtn-hbg:         #e5e5e5 !important;
  --lbtn-outline-bg:  #0a0a0a !important;
  --lbtn-outline-hbg: #161616 !important;
  --lbtn-tour-bg:     #ffffff !important;
  --lbtn-tour-hbg:    #e5e5e5 !important;
  --lalert-err-bg:    #0a0a0a !important;
  --lalert-wrn-bg:    #0a0a0a !important;
  --ltool-bg:         transparent !important;
  --ltool-hbg:        #161616 !important;
  --llang-act-bg:     #ffffff !important;
}

/* ====================================================
   2) KILL DECORATIVE LAYERS — wipe gradients/blobs
   ==================================================== */

/* Ambient blob layer in panel-v2.css */
body::before,
body::after,
html body::before,
html body::after {
  display: none !important;
  background: none !important;
  background-image: none !important;
  content: none !important;
}

/* Login page grid + glow blobs */
.login-page::before,
.login-page::after,
body.login-page::before,
body.login-page::after,
.login-bg-grid,
.login-glow,
[class*="login"]::before,
[class*="login"]::after {
  display: none !important;
  background: none !important;
  background-image: none !important;
}

/* ====================================================
   3) FONTS — Geist Sans + Geist Mono everywhere
   Specificity-match panel-polish.css selectors to win cascade
   ==================================================== */

html, body,
html:not([data-font-family]) body,
html[data-font-family="default"] body,
html[data-font-family] body,
html body, html[data-theme] body, html[data-palette] body,
body.office-theme, body.login-page {
  font-family: 'Geist', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
  letter-spacing: -0.005em !important;
}

/* All descendants of body — beat all .btn / .table / etc font overrides */
html body *:not(code):not(pre):not(kbd):not(samp):not(tt):not(.mono):not(.font-mono):not([class*="mono"]):not(.id):not(.fw-mono):not(.text-mono),
html:not([data-font-family]) body *:not(code):not(pre):not(kbd):not(samp):not(tt):not(.mono):not(.font-mono):not([class*="mono"]):not(.id):not(.fw-mono):not(.text-mono),
.btn, button, input, textarea, select,
.form-control, .form-select, label,
.table, table, td, th,
.card, .modal, .dropdown-menu,
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.page-title, .card-title, .modal-title,
.sa-hero-title, .sa-kpi-val, .sa-stat-val, .sa-kpi-label,
.brand, .nav, .menu-list, .menu-item,
.login-card, .login-info, .auth-card {
  font-family: 'Geist', 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif !important;
}

/* Headings — tighter tracking */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
html:not([data-font-family]) h1, html:not([data-font-family]) h2,
html:not([data-font-family]) h3, html:not([data-font-family]) h4,
html:not([data-font-family]) h5, html:not([data-font-family]) h6,
html[data-font-family="default"] h1, html[data-font-family="default"] h2,
html[data-font-family="default"] h3, html[data-font-family="default"] h4,
html[data-font-family="default"] h5, html[data-font-family="default"] h6 {
  font-family: 'Geist', 'Inter', system-ui, sans-serif !important;
  letter-spacing: -0.02em !important;
  font-weight: 600 !important;
}

/* Mono — code, ID columns, kbd */
code, pre, kbd, samp, tt,
.mono, .font-mono, [class*="mono"],
.id, .fw-mono, .text-mono,
html body code, html body pre, html body kbd, html body samp,
.sa-slug, .sa-db, .code-chip {
  font-family: 'Geist Mono', ui-monospace, 'JetBrains Mono', 'Cascadia Code', monospace !important;
  letter-spacing: 0 !important;
}

/* ====================================================
   4) BODY — pure background, no decoration
   ==================================================== */

html[data-theme="light"] body,
html[data-theme="light"] body.office-theme,
html[data-theme="light"] body.login-page {
  background: #fafafa !important;
  background-image: none !important;
  color: #0a0a0a !important;
}

html[data-theme="dark"] body,
html[data-theme="dark"] body.office-theme,
html[data-theme="dark"] body.login-page {
  background: #000000 !important;
  background-image: none !important;
  color: #ededed !important;
}

/* ====================================================
   5) LOGIN PAGE — full Vercel reset
   ==================================================== */

body.login-page,
.login-page {
  background: var(--lbg) !important;
  background-image: none !important;
}

.login-info,
.login-info-panel,
[class*="login-info"] {
  background: var(--linfo-bg) !important;
  background-image: none !important;
  border: 1px solid var(--linfo-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--linfo-text) !important;
}

.login-card,
[class*="login-card"] {
  background: var(--lcard-bg) !important;
  background-image: none !important;
  border: 1px solid var(--lcard-border) !important;
  border-radius: 8px !important;
  box-shadow: none !important;
}

/* Login quick buttons */
.login-quick-btn {
  background: transparent !important;
  border: 1px solid var(--ui-border-strong) !important;
  color: var(--ui-text) !important;
  border-radius: 6px !important;
  transition: background 0.12s ease !important;
}
.login-quick-btn:hover {
  background: var(--ui-surface-3) !important;
  color: var(--ui-text) !important;
  border-color: var(--ui-border-strong) !important;
  transform: none !important;
}

/* Lang switcher pills */
.login-lang-btn, [class*="lang-btn"] {
  background: transparent !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--ui-muted) !important;
  border-radius: 5px !important;
}
.login-lang-btn.active, [class*="lang-btn"].active {
  background: var(--llang-act-bg) !important;
  color: #fff !important;
  border-color: var(--llang-act-bg) !important;
}
html[data-theme="dark"] .login-lang-btn.active {
  color: #000 !important;
}

/* Login tool icons (theme/quick links/QR/info/contact) top-right */
.login-tool, [class*="login-tool"] {
  background: transparent !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px !important;
  color: var(--ui-text) !important;
}
.login-tool:hover, [class*="login-tool"]:hover {
  background: var(--ui-surface-3) !important;
  border-color: var(--ui-border-strong) !important;
}

/* ====================================================
   6) SIDEBAR — borderless, dim, minimal
   ==================================================== */

body.office-theme aside.col-md-3,
body.office-theme .col-md-3.pt-3,
body.office-theme .sidebar,
aside.col-md-3 {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border-right: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] body.office-theme aside.col-md-3,
html[data-theme="dark"] body.office-theme .col-md-3.pt-3,
html[data-theme="dark"] aside.col-md-3 {
  background: #000 !important;
}

body.office-theme .menu-list a,
body.office-theme nav a.menu-item,
body.office-theme aside a,
aside .menu-list a,
.menu-list a {
  color: var(--ui-muted) !important;
  background: transparent !important;
  background-image: none !important;
  font-weight: 500 !important;
  border-radius: 5px !important;
  box-shadow: none !important;
  border: none !important;
  transition: background 0.12s ease, color 0.12s ease !important;
}

body.office-theme .menu-list a:hover,
body.office-theme nav a.menu-item:hover,
body.office-theme aside a:hover,
.menu-list a:hover {
  background: var(--ui-surface-3) !important;
  color: var(--ui-text) !important;
}

body.office-theme .menu-list a.active,
body.office-theme nav a.menu-item.active,
body.office-theme aside a.active,
body.office-theme aside a[aria-current="page"],
.menu-list a.active {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  color: var(--ui-text) !important;
  font-weight: 600 !important;
  box-shadow: none !important;
  border: none !important;
}

/* ====================================================
   7) CARDS / PANELS — flat, 1px border, no shadow
   ==================================================== */

.card, .panel, .box, .module-card,
.dashboard-widget, .stat-card, .kpi-card,
[class*="card"], [class*="panel"] {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  box-shadow: none !important;
}

.card:hover, .dashboard-widget:hover {
  box-shadow: var(--ui-shadow-card-hover) !important;
  transform: none !important;
}

.card-header, .panel-header, .card-footer {
  background: transparent !important;
  background-image: none !important;
  border-color: var(--ui-border) !important;
  font-weight: 600 !important;
  letter-spacing: -0.01em !important;
}

/* ====================================================
   8) BUTTONS — pure Vercel monochrome
   ==================================================== */

.btn {
  border-radius: var(--ui-radius-md) !important;
  font-weight: 500 !important;
  letter-spacing: -0.005em !important;
  box-shadow: none !important;
  transition: background 0.12s ease, border-color 0.12s ease !important;
  background-image: none !important;
}

.btn-primary, button.btn-primary, .btn.btn-primary {
  background: #000 !important;
  background-image: none !important;
  border-color: #000 !important;
  color: #fff !important;
}
.btn-primary:hover, button.btn-primary:hover, .btn.btn-primary:hover {
  background: #333 !important;
  background-image: none !important;
  border-color: #333 !important;
  color: #fff !important;
}
html[data-theme="dark"] .btn-primary,
html[data-theme="dark"] button.btn-primary,
html[data-theme="dark"] .btn.btn-primary {
  background: #fff !important;
  border-color: #fff !important;
  color: #000 !important;
}
html[data-theme="dark"] .btn-primary:hover {
  background: #e5e5e5 !important;
  border-color: #e5e5e5 !important;
  color: #000 !important;
}

.btn-secondary, .btn-outline-secondary, .btn-outline-primary,
.btn-light, .btn-default {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border-strong) !important;
  color: var(--ui-text) !important;
}
.btn-secondary:hover, .btn-outline-secondary:hover,
.btn-outline-primary:hover, .btn-light:hover {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  border-color: var(--ui-border-strong) !important;
  color: var(--ui-text) !important;
}

.btn-success {
  background: var(--ui-success) !important;
  background-image: none !important;
  border-color: var(--ui-success) !important;
  color: #fff !important;
}
.btn-danger {
  background: var(--ui-danger) !important;
  background-image: none !important;
  border-color: var(--ui-danger) !important;
  color: #fff !important;
}
.btn-warning {
  background: var(--ui-warning) !important;
  background-image: none !important;
  border-color: var(--ui-warning) !important;
  color: #fff !important;
}

/* Login submit button override */
.login-submit, .btn-login, [class*="btn-login"],
button[type="submit"].btn-primary {
  background: var(--lbtn-bg) !important;
  background-image: none !important;
  border-color: var(--lbtn-bg) !important;
  color: #fff !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
}
html[data-theme="dark"] .login-submit,
html[data-theme="dark"] .btn-login,
html[data-theme="dark"] button[type="submit"].btn-primary {
  color: #000 !important;
}
.login-submit:hover, .btn-login:hover {
  background: var(--lbtn-hbg) !important;
  border-color: var(--lbtn-hbg) !important;
}

/* ====================================================
   9) FORMS — minimal, sharp
   ==================================================== */

.form-control, .form-select, input[type="text"], input[type="email"],
input[type="password"], input[type="number"], input[type="date"],
input[type="search"], input[type="tel"], input[type="url"],
textarea, select {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  color: var(--ui-text) !important;
  box-shadow: none !important;
  font-family: 'Geist', system-ui, sans-serif !important;
}
.form-control:focus, .form-select:focus,
input:focus, textarea:focus, select:focus {
  border-color: var(--ui-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--ui-primary-rgb), 0.18) !important;
  outline: none !important;
}

.form-label, label {
  font-weight: 500 !important;
  color: var(--ui-text) !important;
  font-size: 13px !important;
}

/* Login-specific inputs */
.login-card input,
.login-card .form-control,
.login-card .form-select {
  background: var(--linput-bg) !important;
  background-image: none !important;
  border-color: var(--linput-border) !important;
  color: var(--ui-text) !important;
}
.login-card input:focus {
  background: var(--linput-bg-focus) !important;
  border-color: var(--ui-primary) !important;
}

/* ====================================================
   10) TABLES — sharp, dense
   ==================================================== */

.table, table {
  --bs-table-bg: transparent;
  border-color: var(--ui-border) !important;
  background: transparent !important;
}
.table thead th, table thead th {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  color: var(--ui-muted) !important;
  font-weight: 500 !important;
  font-size: 11.5px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border-bottom: 1px solid var(--ui-border) !important;
  border-top: 1px solid var(--ui-border) !important;
  padding: 10px 14px !important;
}
.table td, table td {
  border-color: var(--ui-border) !important;
  padding: 11px 14px !important;
  vertical-align: middle !important;
  background: transparent !important;
}
.table-hover > tbody > tr:hover > * {
  background: var(--ui-surface-3) !important;
  color: var(--ui-text) !important;
}

/* ====================================================
   11) BADGES / TAGS — outline style
   ==================================================== */

.badge, .tag, .chip {
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  border-radius: 4px !important;
  padding: 2px 8px !important;
  font-size: 11px !important;
  border: 1px solid currentColor !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
.badge.bg-primary, .badge-primary {
  color: var(--ui-primary) !important;
  border-color: rgba(var(--ui-primary-rgb), 0.45) !important;
}
.badge.bg-success, .badge-success {
  color: var(--ui-success) !important;
  border-color: rgba(var(--ui-success-rgb), 0.45) !important;
}
.badge.bg-danger, .badge-danger {
  color: var(--ui-danger) !important;
  border-color: rgba(var(--ui-danger-rgb), 0.45) !important;
}
.badge.bg-warning, .badge-warning {
  color: var(--ui-warning) !important;
  border-color: rgba(var(--ui-warning-rgb), 0.45) !important;
}
.badge.bg-secondary, .badge-secondary {
  color: var(--ui-muted) !important;
  border-color: var(--ui-border-strong) !important;
}
.badge.bg-info, .badge-info {
  color: var(--ui-primary) !important;
  border-color: rgba(var(--ui-primary-rgb), 0.45) !important;
}

/* ====================================================
   12) ALERTS — left-border style
   ==================================================== */

.alert {
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  background: var(--ui-surface) !important;
  background-image: none !important;
  color: var(--ui-text) !important;
  box-shadow: none !important;
  font-size: 13.5px !important;
}
.alert-primary { border-left: 3px solid var(--ui-primary) !important; }
.alert-success { border-left: 3px solid var(--ui-success) !important; }
.alert-danger  { border-left: 3px solid var(--ui-danger) !important; }
.alert-warning { border-left: 3px solid var(--ui-warning) !important; }
.alert-info    { border-left: 3px solid var(--ui-primary) !important; }

/* ====================================================
   13) MODALS / DROPDOWNS
   ==================================================== */

.modal-content {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-lg) !important;
  box-shadow: 0 16px 48px rgba(0,0,0,0.16) !important;
}
.modal-header, .modal-footer {
  border-color: var(--ui-border) !important;
  background: transparent !important;
  background-image: none !important;
}
.modal-title { font-weight: 600 !important; letter-spacing: -0.02em !important; }

.dropdown-menu {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
  padding: 4px !important;
}
.dropdown-item {
  border-radius: 4px !important;
  font-size: 13.5px !important;
  padding: 7px 10px !important;
}
.dropdown-item:hover, .dropdown-item:focus {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  color: var(--ui-text) !important;
}

/* ====================================================
   14) LINKS / TYPOGRAPHY
   ==================================================== */

a:not(.btn):not(.menu-item):not(.dropdown-item):not(.nav-link):not(.login-tool):not(.login-quick-btn) {
  color: var(--ui-primary);
  text-decoration: none;
  transition: opacity 0.12s ease;
}
a:not(.btn):not(.menu-item):not(.dropdown-item):not(.nav-link):not(.login-tool):not(.login-quick-btn):hover {
  opacity: 0.82;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.page-header h1, .page-header .h1, h1.page-title {
  font-size: 28px !important;
  font-weight: 600 !important;
  letter-spacing: -0.03em !important;
}

/* Breadcrumb */
.breadcrumb, .td-breadcrumb {
  background: transparent !important;
  background-image: none !important;
  padding: 0 0 16px !important;
  font-size: 12px !important;
  color: var(--ui-muted) !important;
}

/* ====================================================
   15) AI FLOATING CHAT — Vercel'leştir
   ==================================================== */

#tdAiFloatToggle, .td-ai-float-toggle, [id*="AiFloat"] button {
  background: #000 !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.18) !important;
}
html[data-theme="dark"] #tdAiFloatToggle,
html[data-theme="dark"] .td-ai-float-toggle {
  background: #fff !important;
  color: #000 !important;
}

/* ====================================================
   16) MISC — focus rings, pagination, tooltip, selection
   ==================================================== */

.form-check-input:focus, .btn:focus, .btn-check:focus + .btn {
  box-shadow: 0 0 0 3px rgba(var(--ui-primary-rgb), 0.18) !important;
}
.form-check-input:checked {
  background-color: var(--ui-primary) !important;
  border-color: var(--ui-primary) !important;
}

.pagination .page-link {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--ui-text) !important;
  box-shadow: none !important;
}
.pagination .page-item.active .page-link {
  background: var(--ui-text) !important;
  border-color: var(--ui-text) !important;
  color: var(--ui-bg) !important;
}

.tooltip-inner {
  background: var(--ui-text) !important;
  color: var(--ui-bg) !important;
  border-radius: 5px !important;
  font-size: 12px !important;
  font-weight: 500 !important;
}

::selection {
  background: rgba(var(--ui-primary-rgb), 0.25);
  color: var(--ui-text);
}

/* ====================================================
   17) SUPER ADMIN — sa-hero, sa-kpi, kpi-trend-badge
   ==================================================== */

/* Hero page header — nuke decorative pseudo-elements */
.sa-page-hero,
.sa-page-hero[class] {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-lg) !important;
  box-shadow: none !important;
}
.sa-page-hero::before,
.sa-page-hero::after {
  display: none !important;
  background: none !important;
  background-image: none !important;
  content: none !important;
}

/* SA KPI cards — flat */
.sa-kpi-card, .sa-stat-card {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  box-shadow: none !important;
}
.sa-kpi-card::before,
.sa-kpi-card::after,
.sa-stat-card::before,
.sa-stat-card::after {
  display: none !important;
  background: none !important;
  content: none !important;
}

/* SA KPI icons — neutralize colored backgrounds (override inline style) */
.sa-kpi-icon,
.sa-kpi-card .sa-kpi-icon,
.sa-stat-card .sa-stat-icon {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  color: var(--ui-text) !important;
  border-radius: 6px !important;
  border: 1px solid var(--ui-border) !important;
}

/* SA KPI trend badge — outline style, neutral */
.kpi-trend-badge,
.kpi-trend-badge.positive,
.kpi-trend-badge.negative,
.kpi-trend-badge.neutral,
html[data-theme="dark"] .kpi-trend-badge.positive,
html[data-theme="dark"] .kpi-trend-badge.negative,
html[data-theme="dark"] .kpi-trend-badge.neutral {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 4px !important;
  font-weight: 500 !important;
  font-size: 10.5px !important;
  padding: 2px 7px !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  color: var(--ui-muted) !important;
}
.kpi-trend-badge.positive {
  color: var(--ui-success) !important;
  border-color: rgba(var(--ui-success-rgb), 0.45) !important;
}
.kpi-trend-badge.negative {
  color: var(--ui-danger) !important;
  border-color: rgba(var(--ui-danger-rgb), 0.45) !important;
}

/* SA Hero title, KPI value — sharp typography */
.sa-hero-title, .sa-kpi-val, .sa-stat-val {
  font-family: 'Geist', system-ui, sans-serif !important;
  letter-spacing: -0.03em !important;
  font-weight: 600 !important;
}

/* SA table action buttons — borderless ghost */
.sa-action-btn, .sa-table-actions a, .sa-table-actions button,
[class*="action-btn"] {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 5px !important;
  color: var(--ui-muted) !important;
  box-shadow: none !important;
  width: 32px !important;
  height: 32px !important;
}
.sa-action-btn:hover, .sa-table-actions a:hover, .sa-table-actions button:hover {
  background: var(--ui-surface-3) !important;
  color: var(--ui-text) !important;
  border-color: var(--ui-border-strong) !important;
}

/* Slug / DB code chips */
.sa-slug, .sa-db, code, .code-chip,
[class*="slug"] code, [class*="db"] code {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--ui-text) !important;
  font-family: 'Geist Mono', ui-monospace, monospace !important;
  font-size: 11.5px !important;
  padding: 1px 6px !important;
  border-radius: 4px !important;
}

/* Aktif/durum chip in tables */
.sa-status, .status-pill, .status-badge,
[class*="status-pill"], [class*="status-badge"] {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid currentColor !important;
  border-radius: 4px !important;
  padding: 1px 7px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

/* ====================================================
   18) LAST RESORT — kill any remaining decorative bg
   ==================================================== */

/* Common decorative containers — wipe gradient bgs but keep solid bg */
.main-card, .stat-tile, .info-tile, .summary-card,
[class*="-tile"], [class*="-pill"]:not(.kpi-trend-badge),
[class*="-hero"]:not(.sa-page-hero),
[class*="-banner"], [class*="-gradient"] {
  background-image: none !important;
  box-shadow: none !important;
}

/* Universal pseudo-element nuke for decorative elements */
.sa-kpi-card .sa-kpi-icon::before,
.sa-kpi-card .sa-kpi-icon::after,
[class*="hero"]::before, [class*="hero"]::after,
[class*="banner"]::before, [class*="banner"]::after {
  display: none !important;
  content: none !important;
}

/* Top header / page header strip if any */
.page-hero, .panel-hero, .module-header {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-lg) !important;
  box-shadow: none !important;
}

/* Logo box on login info panel — keep it simple */
.login-info img, .login-info .logo,
.login-info [class*="logo"] {
  filter: none !important;
}

/* ====================================================
   19) DASHBOARD-SPECIFIC OVERRIDES
   ==================================================== */

/* Hero header + glow + title gradient */
.hero, .panel-hero, .dashboard-hero {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-lg) !important;
  box-shadow: none !important;
}
.hero::before, .hero::after,
.hero-teal-glow, .hero-blue-glow, .hero-purple-glow,
[class*="hero-"][class*="-glow"] {
  display: none !important;
  background: none !important;
  background-image: none !important;
  content: none !important;
}

/* Hero title gradient text — make it solid */
.hero-title-gradient, .title-gradient,
[class*="title-gradient"] {
  background: none !important;
  background-image: none !important;
  -webkit-text-fill-color: var(--ui-text) !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  color: var(--ui-text) !important;
}

/* Page kicker (small label above heading) */
.page-kicker, .kicker, .panel-kicker, .module-kicker {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--ui-muted) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  padding: 2px 8px !important;
  border-radius: 4px !important;
  font-weight: 500 !important;
}

/* News ticker — neutral */
.menu-news-ticker, .news-ticker, .topbar-news,
[class*="news-ticker"] {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  color: var(--ui-muted) !important;
}
.menu-news-ticker a, .news-ticker a {
  color: var(--ui-muted) !important;
}
.menu-news-ticker a:hover, .news-ticker a:hover {
  color: var(--ui-text) !important;
}

/* Dash chips — outline pills */
.dash-chip, .dash-chip-success, .dash-chip-warning,
.dash-chip-danger, .dash-chip-info, .dash-chip-primary,
[class*="dash-chip"] {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid currentColor !important;
  border-radius: 4px !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  padding: 2px 7px !important;
  color: var(--ui-muted) !important;
}
.dash-chip-success { color: var(--ui-success) !important; border-color: rgba(var(--ui-success-rgb), 0.45) !important; }
.dash-chip-warning { color: var(--ui-warning) !important; border-color: rgba(var(--ui-warning-rgb), 0.45) !important; }
.dash-chip-danger  { color: var(--ui-danger)  !important; border-color: rgba(var(--ui-danger-rgb), 0.45) !important; }
.dash-chip-info    { color: var(--ui-primary) !important; border-color: rgba(var(--ui-primary-rgb), 0.45) !important; }
.dash-chip-primary { color: var(--ui-primary) !important; border-color: rgba(var(--ui-primary-rgb), 0.45) !important; }

/* KPI icon container */
.kpi-ico, .kpi-icon, .metric-icon-badge,
.stat-icon, .widget-icon, .dash-icon {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  color: var(--ui-text) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px !important;
}

/* Metric progress bars — monochrome */
.metric-progress, .progress, .stat-progress {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  border-radius: 999px !important;
  height: 4px !important;
  overflow: hidden !important;
}
.metric-progress-fill, .progress-bar, .stat-progress-fill {
  background: var(--ui-text) !important;
  background-image: none !important;
  box-shadow: none !important;
}
html[data-theme="dark"] .metric-progress-fill,
html[data-theme="dark"] .progress-bar {
  background: var(--ui-text) !important;
}

/* Notification dropdown */
.notif-dropdown, .notification-dropdown {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,0.18) !important;
}
.notif-item-dot, .notification-dot {
  background: var(--ui-primary) !important;
  background-image: none !important;
}

/* Topbar status dot */
.topbar-status-dot, .h-status-dot, [class*="status-dot"] {
  background: var(--ui-success) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* AI chat panel header (tdai) — neutral */
.tdai-header, [class*="tdai"][class*="header"],
.ai-chat-header, .ai-panel-header {
  background: var(--ui-surface-3) !important;
  background-image: none !important;
  color: var(--ui-text) !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

/* Mail KPI cards (settings page mail dashboard) */
.mail-kpi, .mail-stat-card, [class*="mail-kpi"] {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
}

/* Sidebar build note */
.sidebar-build-note, .mobile-sidebar-note, [class*="build-note"] {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--ui-muted) !important;
  border-radius: var(--ui-radius-sm) !important;
}

/* Bootstrap text-bg-* utilities — outline style */
.text-bg-primary, .text-bg-secondary, .text-bg-success,
.text-bg-danger, .text-bg-warning, .text-bg-info,
.text-bg-light, .text-bg-dark {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid currentColor !important;
}
.text-bg-primary { color: var(--ui-primary) !important; border-color: rgba(var(--ui-primary-rgb), 0.5) !important; }
.text-bg-success { color: var(--ui-success) !important; border-color: rgba(var(--ui-success-rgb), 0.5) !important; }
.text-bg-danger  { color: var(--ui-danger)  !important; border-color: rgba(var(--ui-danger-rgb), 0.5) !important; }
.text-bg-warning { color: var(--ui-warning) !important; border-color: rgba(var(--ui-warning-rgb), 0.5) !important; }
.text-bg-info    { color: var(--ui-primary) !important; border-color: rgba(var(--ui-primary-rgb), 0.5) !important; }

/* Offcanvas header — neutral */
.offcanvas-header, .offcanvas-body {
  background: var(--ui-surface) !important;
  background-image: none !important;
  color: var(--ui-text) !important;
  border-color: var(--ui-border) !important;
}

/* Bootstrap btn-outline-secondary on dark — was rgb(43,52,69) blue-grey */
html[data-theme="dark"] .btn-outline-secondary,
html[data-theme="dark"] .btn.btn-outline-secondary,
html[data-theme="dark"] .btn.btn-sm.btn-outline-secondary {
  background: transparent !important;
  background-image: none !important;
  border-color: var(--ui-border-strong) !important;
  color: var(--ui-text) !important;
}
html[data-theme="dark"] .btn-outline-secondary:hover {
  background: var(--ui-surface-3) !important;
  color: var(--ui-text) !important;
}

/* Dashboard widget header strip */
.widget-header, .dashboard-widget-header,
.dw-header, [class*="widget"][class*="header"] {
  background: transparent !important;
  background-image: none !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

/* Drag handle on widgets */
[class*="drag-handle"], .widget-drag {
  color: var(--ui-muted-soft) !important;
  background: transparent !important;
}

/* Chart legends */
.chart-legend, .legend, [class*="chart-legend"] {
  color: var(--ui-muted) !important;
  font-size: 11px !important;
}

/* News ticker individual items */
.news-ticker-item, .ticker-item, [class*="ticker-item"] {
  background: transparent !important;
  background-image: none !important;
  color: var(--ui-muted) !important;
}

/* Universal — kill ALL background-image (gradient) on common containers */
.widget, .panel-body, .stat-card, .info-card,
.dashboard-card, .summary-card, .module-summary,
[class*="card-body"], [class*="card-header"],
[class*="-content"], [class*="-section"]:not(.sa-page-hero) {
  background-image: none !important;
}

/* Dropdown buttons / toolbar buttons */
.toolbar-btn, .icon-btn, [class*="icon-btn"]:not(.btn-primary) {
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--ui-text) !important;
  border-radius: 5px !important;
}
.toolbar-btn:hover, .icon-btn:hover {
  background: var(--ui-surface-3) !important;
  color: var(--ui-text) !important;
}

/* ====================================================
   20) NUCLEAR — universal gradient/shadow wipe
   Allow only canvas/svg/img + explicit gradient elements.
   ==================================================== */

*:not(canvas):not(svg):not(img):not(.hero-title-gradient):not([class*="donut-chart"]):not(.chart-canvas):not(.tdai-msg-bot):not(.tdai-msg-user) {
  background-image: none !important;
}

/* Kill box-shadow universally except where explicitly needed */
*:not(.dropdown-menu):not(.modal-content):not(.tooltip-inner):not(.tdai-panel):not(.notif-dropdown):not(#tdAiFloatToggle):not(.td-ai-float-toggle) {
  box-shadow: none !important;
}

/* ====================================================
   21) DARK MODE — kill all navy/blue-tinted backgrounds
   on cards, panels, sections (default panel-v2.css uses
   rgba navy as "card surface" — wipe to pure surface)
   ==================================================== */

html[data-theme="dark"] .card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .stat-tile,
html[data-theme="dark"] .info-tile,
html[data-theme="dark"] .summary-card,
html[data-theme="dark"] .dashboard-card,
html[data-theme="dark"] .dashboard-widget,
html[data-theme="dark"] .widget,
html[data-theme="dark"] .module-card,
html[data-theme="dark"] .section-card,
html[data-theme="dark"] .mail-kpi,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] [class*="-card"]:not(.text-bg-success):not(.text-bg-warning):not(.text-bg-danger):not(.text-bg-info),
html[data-theme="dark"] [class*="-tile"],
html[data-theme="dark"] [class*="-widget"] {
  background-color: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
}

html[data-theme="light"] .card,
html[data-theme="light"] .panel,
html[data-theme="light"] [class*="-card"]:not(.text-bg-success):not(.text-bg-warning):not(.text-bg-danger):not(.text-bg-info):not(.text-bg-primary),
html[data-theme="light"] [class*="-tile"],
html[data-theme="light"] [class*="-widget"] {
  background-color: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
}

/* Section dividers / banner strips — neutralize */
.section-header, .section-divider, .module-header,
.settings-section-header, [class*="section-header"],
[class*="section-banner"], [class*="module-banner"] {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  border-bottom: 1px solid var(--ui-border) !important;
  color: var(--ui-text) !important;
  padding-top: 18px !important;
  padding-bottom: 8px !important;
  margin-top: 16px !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  font-weight: 500 !important;
  color: var(--ui-muted) !important;
}

/* Alert / notice strips — flat */
.notice-strip, .alert-strip, .info-strip,
[class*="notice-"], [class*="info-strip"] {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  color: var(--ui-text) !important;
}

/* Settings KPI / mini stat cards */
.settings-kpi, .mini-stat, .small-stat,
[class*="settings-kpi"], [class*="mini-stat"], [class*="small-stat"] {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: var(--ui-radius-md) !important;
  box-shadow: none !important;
}

/* Universal heading kicker (small label above) */
[class*="kicker"], [class*="eyebrow"] {
  background: transparent !important;
  background-image: none !important;
  color: var(--ui-muted) !important;
  font-size: 10.5px !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-weight: 500 !important;
  padding: 0 !important;
  border: none !important;
}

/* Topbar (page header bar with notifications, theme toggle) */
.topbar, .top-bar, .panel-topbar,
[class*="topbar"]:not([class*="status"]):not([class*="dot"]) {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border-bottom: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
}