html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #08111f;
  --bg2: #121d31;
  --bg3: #17253d;
  --bg4: #0f1726;
  --panel: #121d31;
  --panel2: #17253d;
  --panel-2: #17253d;
  --panel-3: #0f1a2e;
  --line: #2a3a55;
  --border: rgba(128, 161, 219, 0.16);
  --text: #f7fbff;
  --muted: #9fb0c7;
  --blue: #4d8eff;
  --blue2: #2456c8;
  --green: #34d399;
  --orange: #fbbf24;
  --purple: #8b5cf6;
  --red: #fb7185;
  --wa: #22c55e;
  --wa-dark: #16a34a;
}

html[data-theme="light"] {
  color-scheme: light;
  --bg: #f6f8fb;
  --bg2: #ffffff;
  --bg3: #eef2f7;
  --bg4: #e6edf6;
  --panel: #ffffff;
  --panel2: #f8fbff;
  --panel-2: #f8fbff;
  --panel-3: #eef4fb;
  --line: #d9e1ec;
  --border: #d9e1ec;
  --text: #172033;
  --muted: #64748b;
  --blue: #2563eb;
  --blue2: #1d4ed8;
  --green: #16a34a;
  --orange: #d97706;
  --purple: #7c3aed;
  --red: #dc2626;
  --wa: #22c55e;
  --wa-dark: #15803d;
}

html[data-theme="dark"] {
  --text-title: #f7fbff;
  --text-body: #e1e7f5;
  --text-label: #c7d2e3;
  --text-muted-strong: #9fb0c7;
  --text-muted-soft: #8ea0ba;
}

html[data-theme="light"] {
  --text-title: #172033;
  --text-body: #334155;
  --text-label: #475569;
  --text-muted-strong: #64748b;
  --text-muted-soft: #7b8798;
}

html[data-theme="dark"] body {
  background:
    radial-gradient(circle at top right, rgba(77, 142, 255, 0.16), transparent 28%),
    linear-gradient(180deg, #111827 0%, #0f172a 100%) !important;
  color: var(--text) !important;
}

html[data-theme="light"] body {
  background:
    radial-gradient(circle at top right, rgba(37, 99, 235, 0.1), transparent 28%),
    linear-gradient(180deg, #f8fafc 0%, #eef4fb 100%) !important;
  color: var(--text) !important;
}

html[data-theme="dark"] .nav,
html[data-theme="dark"] .sidebar {
  background: rgba(8, 15, 27, 0.96) !important;
  border-right: 1px solid rgba(120, 142, 182, 0.16) !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.22) !important;
}

html[data-theme="light"] .nav,
html[data-theme="light"] .sidebar {
  background: rgba(255, 255, 255, 0.94) !important;
  border-right: 1px solid rgba(217, 225, 236, 0.95) !important;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="dark"] .nav .nav-scroll,
html[data-theme="dark"] .sidebar .nav-scroll,
html[data-theme="dark"] .nav .nav-actions {
  background: rgba(8, 15, 27, 0.96) !important;
}

html[data-theme="light"] .nav .nav-scroll,
html[data-theme="light"] .sidebar .nav-scroll,
html[data-theme="light"] .nav .nav-actions {
  background: rgba(255, 255, 255, 0.94) !important;
}

html[data-theme="dark"] .nav-logo,
html[data-theme="dark"] .logo-box,
html[data-theme="dark"] .nav-logo.is-guest {
  border-bottom-color: rgba(120, 142, 182, 0.14) !important;
  background: transparent !important;
}

html[data-theme="light"] .nav-logo,
html[data-theme="light"] .logo-box,
html[data-theme="light"] .nav-logo.is-guest {
  border-bottom-color: rgba(217, 225, 236, 0.95) !important;
  background: transparent !important;
}

html[data-theme="dark"] .nav-logo img {
  background: #111827 !important;
}

html[data-theme="light"] .nav-logo img {
  background: #ffffff !important;
}

html[data-theme="dark"] .nav-link,
html[data-theme="dark"] .sub-link,
html[data-theme="dark"] .sidebar-footer-link,
html[data-theme="dark"] .nav a {
  color: #475569 !important;
  background: transparent !important;
  border-color: transparent !important;
}

html[data-theme="dark"] .nav-link .material-symbols-outlined,
html[data-theme="dark"] .sub-link .material-symbols-outlined,
html[data-theme="dark"] .sidebar-footer-link .material-symbols-outlined,
html[data-theme="dark"] .nav a .material-symbols-outlined {
  color: #475569 !important;
  opacity: 1 !important;
}

html[data-theme="light"] .nav-link,
html[data-theme="light"] .sub-link,
html[data-theme="light"] .sidebar-footer-link,
html[data-theme="light"] .nav a {
  color: #475569 !important;
  background: transparent !important;
  border-color: transparent !important;
  opacity: 1 !important;
}

html[data-theme="light"] .nav-link .material-symbols-outlined,
html[data-theme="light"] .sub-link .material-symbols-outlined,
html[data-theme="light"] .sidebar-footer-link .material-symbols-outlined,
html[data-theme="light"] .nav a .material-symbols-outlined {
  color: #475569 !important;
  opacity: 1 !important;
}

html[data-theme="dark"] .nav-link:hover,
html[data-theme="dark"] .sub-link:hover,
html[data-theme="dark"] .nav-link.active {
  background: #152848 !important;
  color: #ffffff !important;
}

html[data-theme="light"] .nav-link:hover,
html[data-theme="light"] .sub-link:hover,
html[data-theme="light"] .nav-link.active {
  background: #f1f6ff !important;
  color: #1d4ed8 !important;
}

html[data-theme="dark"] .nav-link.active {
  border: 1px solid #4d8eff !important;
  box-shadow: 0 0 0 1px rgba(77, 142, 255, 0.18), 0 0 22px rgba(77, 142, 255, 0.12) !important;
}

html[data-theme="light"] .nav-link.active {
  border: 1px solid #2563eb !important;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.1), 0 10px 22px rgba(37, 99, 235, 0.1) !important;
}

html[data-theme="dark"] .sub-link.active {
  background: #152848 !important;
  color: #ffffff !important;
  border: 1px solid #4d8eff !important;
  box-shadow: 0 0 0 1px rgba(77, 142, 255, 0.18), 0 0 22px rgba(77, 142, 255, 0.12) !important;
}

html[data-theme="light"] .sub-link.active {
  background: #f1f6ff !important;
  color: #1d4ed8 !important;
  border: 1px solid #2563eb !important;
  box-shadow: 0 0 0 1px rgba(37, 99, 235, 0.1), 0 10px 22px rgba(37, 99, 235, 0.1) !important;
}

html[data-theme="dark"] #sidebarUserIdentity,
html[data-theme="dark"] .sidebar-user-card {
  background: rgba(16, 19, 26, 0.54) !important;
  border-color: rgba(173, 198, 255, 0.14) !important;
}

html[data-theme="light"] #sidebarUserIdentity,
html[data-theme="light"] .sidebar-user-card {
  background: #ffffff !important;
  border-color: #d9e1ec !important;
}

html[data-theme="light"] #sidebarUserIdentity .sidebar-user-name,
html[data-theme="light"] .sidebar-user-card .sidebar-user-name {
  color: #475569 !important;
}

html[data-theme="light"] #sidebarUserIdentity .sidebar-user-email,
html[data-theme="light"] .sidebar-user-card .sidebar-user-email {
  color: #475569 !important;
}

html[data-theme="light"] #sidebarUserIdentity strong,
html[data-theme="light"] #sidebarUserIdentity span,
html[data-theme="light"] .sidebar-user-card strong,
html[data-theme="light"] .sidebar-user-card span {
  color: #475569 !important;
}

html[data-theme="light"] #sidebarUserIdentity #sidebarLogoutButton,
html[data-theme="light"] .sidebar-user-card #sidebarLogoutButton {
  background: rgba(220, 38, 38, 0.08) !important;
  color: #b91c1c !important;
  border: 1px solid rgba(220, 38, 38, 0.24) !important;
  box-shadow: none !important;
}

html[data-theme="light"] #sidebarUserIdentity #sidebarLogoutButton .material-symbols-outlined,
html[data-theme="light"] .sidebar-user-card #sidebarLogoutButton .material-symbols-outlined {
  color: #b91c1c !important;
  font-variation-settings: 'wght' 700 !important;
}

html[data-theme="dark"] #sidebarUserIdentity #sidebarLogoutButton,
html[data-theme="dark"] .sidebar-user-card #sidebarLogoutButton {
  background: rgba(251, 113, 133, 0.12) !important;
  color: #fecdd3 !important;
  border: 1px solid rgba(251, 113, 133, 0.32) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] #sidebarUserIdentity #sidebarLogoutButton .material-symbols-outlined,
html[data-theme="dark"] .sidebar-user-card #sidebarLogoutButton .material-symbols-outlined {
  color: #fecdd3 !important;
  font-variation-settings: 'wght' 700 !important;
}

html[data-theme="light"] #sidebarUserIdentity #sidebarLogoutButton:hover,
html[data-theme="light"] .sidebar-user-card #sidebarLogoutButton:hover {
  background: rgba(220, 38, 38, 0.12) !important;
}

html[data-theme="dark"] #sidebarUserIdentity #sidebarLogoutButton:hover,
html[data-theme="dark"] .sidebar-user-card #sidebarLogoutButton:hover {
  background: rgba(251, 113, 133, 0.18) !important;
}

html[data-theme="dark"] .btn,
html[data-theme="dark"] .mini-btn {
  background: #182437 !important;
  color: #f7fbff !important;
  border-color: rgba(105, 127, 164, 0.2) !important;
}

html[data-theme="light"] .btn,
html[data-theme="light"] .mini-btn {
  background: #ffffff !important;
  color: #172033 !important;
  border-color: #d9e1ec !important;
}

html[data-theme="light"] .btn:hover,
html[data-theme="light"] .mini-btn:hover {
  background: #eef2f7 !important;
}

html[data-theme="dark"] .btn-primary {
  background: linear-gradient(180deg, #4d8eff, #3f79e0) !important;
  color: #08111f !important;
  border-color: #4d8eff !important;
}

html[data-theme="light"] .btn-primary {
  background: linear-gradient(180deg, #4d8eff, #3f79e0) !important;
  color: #ffffff !important;
  border-color: #4d8eff !important;
}

html[data-theme="dark"] .btn-primary:hover {
  background: linear-gradient(180deg, rgba(118, 176, 255, 0.96), rgba(77, 142, 255, 0.94)) !important;
  border-color: rgba(125, 183, 255, 0.98) !important;
  border-width: 2px !important;
  color: #08111f !important;
  box-shadow: 0 0 0 1px rgba(125, 183, 255, 0.24), 0 10px 22px rgba(77, 142, 255, 0.18) !important;
}

html[data-theme="light"] .btn-primary:hover {
  background: linear-gradient(180deg, rgba(110, 168, 255, 0.97), rgba(77, 142, 255, 0.95)) !important;
  border-color: rgba(110, 168, 255, 0.98) !important;
  border-width: 2px !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(110, 168, 255, 0.22), 0 10px 20px rgba(77, 142, 255, 0.16) !important;
}

html[data-theme="dark"] .btn-green {
  background: #4edca5 !important;
  color: #062217 !important;
  border-color: #4edca5 !important;
}

html[data-theme="light"] .btn-green {
  background: #22c55e !important;
  color: #ffffff !important;
  border-color: #22c55e !important;
}

html[data-theme="dark"] .btn-green:hover {
  background: linear-gradient(180deg, rgba(96, 235, 182, 0.96), rgba(52, 211, 153, 0.94)) !important;
  border-color: rgba(110, 240, 190, 0.98) !important;
  border-width: 2px !important;
  color: #062217 !important;
  box-shadow: 0 0 0 1px rgba(110, 240, 190, 0.24), 0 10px 22px rgba(52, 211, 153, 0.16) !important;
}

html[data-theme="light"] .btn-green:hover {
  background: linear-gradient(180deg, rgba(74, 222, 128, 0.97), rgba(34, 197, 94, 0.95)) !important;
  border-color: rgba(74, 222, 128, 0.98) !important;
  border-width: 2px !important;
  color: #ffffff !important;
  box-shadow: 0 0 0 1px rgba(74, 222, 128, 0.2), 0 10px 20px rgba(34, 197, 94, 0.14) !important;
}

html[data-theme="dark"] .btn-red {
  background: rgba(251, 113, 133, 0.12) !important;
  color: #fecdd3 !important;
  border-color: rgba(251, 113, 133, 0.32) !important;
}

html[data-theme="light"] .btn-red {
  background: rgba(220, 38, 38, 0.08) !important;
  color: #b91c1c !important;
  border-color: rgba(220, 38, 38, 0.24) !important;
}

html[data-theme="light"] .product-title {
  color: #d7e2f5 !important;
}

html[data-theme="dark"] .product-title {
  color: #d7e2f5 !important;
}

html[data-theme="light"] body.marketplace-page .product-title,
html[data-theme="dark"] body.marketplace-page .product-title {
  color: #3f79e0 !important;
  font-weight: 900 !important;
}

html[data-theme="dark"] .stat,
html[data-theme="dark"] .stat-card,
html[data-theme="dark"] .controls,
html[data-theme="dark"] .template-card,
html[data-theme="dark"] .table-card,
html[data-theme="dark"] .panel,
html[data-theme="dark"] .compose-area,
html[data-theme="dark"] .compose-card,
html[data-theme="dark"] .modal,
html[data-theme="dark"] .group-card,
html[data-theme="dark"] .total-box,
html[data-theme="dark"] .garanti-section,
html[data-theme="dark"] .hero,
html[data-theme="dark"] .quick-access {
  background: var(--bg2) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
}

html[data-theme="light"] .stat,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .controls,
html[data-theme="light"] .template-card,
html[data-theme="light"] .table-card,
html[data-theme="light"] .panel,
html[data-theme="light"] .compose-area,
html[data-theme="light"] .compose-card,
html[data-theme="light"] .modal,
html[data-theme="light"] .group-card,
html[data-theme="light"] .total-box,
html[data-theme="light"] .garanti-section,
html[data-theme="light"] .hero,
html[data-theme="light"] .quick-access {
  background: var(--bg2) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06) !important;
}

html[data-theme="dark"] .inp,
html[data-theme="dark"] .sel,
html[data-theme="dark"] .template-textarea,
html[data-theme="dark"] .urun-inp,
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background: var(--bg3);
  color: var(--text);
  border-color: var(--border);
}

html[data-theme="light"] .inp,
html[data-theme="light"] .sel,
html[data-theme="light"] .template-textarea,
html[data-theme="light"] .urun-inp,
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  background: #ffffff;
  color: var(--text);
  border-color: var(--border);
}

html[data-theme="light"] thead {
  background: #f1f5f9 !important;
}

html[data-theme="dark"] thead {
  background: rgba(255, 255, 255, 0.03) !important;
}

html[data-theme="light"] td {
  border-bottom-color: rgba(217, 225, 236, 0.85) !important;
}

html[data-theme="dark"] td {
  border-bottom-color: rgba(128, 161, 219, 0.12) !important;
}

html[data-theme="light"] tr:hover td {
  background: #f8fafc !important;
}

html[data-theme="dark"] tr:hover td {
  background: rgba(255, 255, 255, 0.02) !important;
}

html[data-theme="light"] .toast {
  background: #ffffff !important;
  color: #172033 !important;
  border-color: #d9e1ec !important;
}

html[data-theme="dark"] .toast {
  background: var(--bg2) !important;
  color: var(--text) !important;
  border-color: var(--border) !important;
}

html[data-theme] body,
html[data-theme] .container,
html[data-theme] .page,
html[data-theme] .panel,
html[data-theme] .table-card,
html[data-theme] .compose-card,
html[data-theme] .compose-area,
html[data-theme] .controls,
html[data-theme] .modal,
html[data-theme] .card,
html[data-theme] .group-card,
html[data-theme] .total-box,
html[data-theme] .garanti-section,
html[data-theme] .quick-access,
html[data-theme] .template-card,
html[data-theme] .timer-card,
html[data-theme] .preview-card {
  color: var(--text-body) !important;
}

html[data-theme] h1,
html[data-theme] h2,
html[data-theme] h3,
html[data-theme] h4,
html[data-theme] .dashboard-head h1,
html[data-theme] .page-head h1,
html[data-theme] .table-header h3,
html[data-theme] .panel-head h3,
html[data-theme] .compose-head h3,
html[data-theme] .modal-head h3,
html[data-theme] .invoice-detail-title,
html[data-theme] .product-modal-title,
html[data-theme] .shipping-card-title,
html[data-theme] .invoice-card-firm,
html[data-theme] .customer-contact-summary-name,
html[data-theme] .rental-title,
html[data-theme] .rental-toolbar h2 {
  color: var(--text-title) !important;
  letter-spacing: 0 !important;
}

html[data-theme] .head-sub,
html[data-theme] .muted,
html[data-theme] .stat-label,
html[data-theme] .stat-sub,
html[data-theme] .form-label,
html[data-theme] .control label,
html[data-theme] .control-group label,
html[data-theme] .field label,
html[data-theme] .health-card-label,
html[data-theme] .preview-label,
html[data-theme] .send-target-label,
html[data-theme] .price-label,
html[data-theme] .section-header,
html[data-theme] .garanti-group-label,
html[data-theme] .order-card-meta-label,
html[data-theme] .customer-stat strong,
html[data-theme] .customer-contact-summary strong,
html[data-theme] .rental-meta-label,
html[data-theme] .inline-edit-field label,
html[data-theme] .file-asset-title,
html[data-theme] .invoice-card-box strong,
html[data-theme] .shipping-card-field span,
html[data-theme] .product-field small,
html[data-theme] .loading-text,
html[data-theme] .empty,
html[data-theme] th {
  color: var(--text-muted-strong) !important;
}

html[data-theme] .stat-value,
html[data-theme] td,
html[data-theme] .table-card td,
html[data-theme] .panel td,
html[data-theme] .modal-body,
html[data-theme] .table-head h3,
html[data-theme] .table-header,
html[data-theme] .product-title,
html[data-theme] .cari-name,
html[data-theme] .group-name,
html[data-theme] .invoice-id-main,
html[data-theme] .invoice-desc,
html[data-theme] .detail-summary-box span,
html[data-theme] .shipping-card-field strong,
html[data-theme] .detail-link-text,
html[data-theme] .invoice-firm {
  color: var(--text-body) !important;
}

html[data-theme] .product-sub,
html[data-theme] .cari-sub,
html[data-theme] .group-meta,
html[data-theme] .photo-empty,
html[data-theme] .invoice-note,
html[data-theme] .invoice-muted,
html[data-theme] .shipping-card-meta,
html[data-theme] .history-meta,
html[data-theme] .autocomplete-item small,
html[data-theme] .customer-contact-summary-phone {
  color: var(--text-muted-soft) !important;
}

html[data-theme] .stat-label,
html[data-theme] .form-label,
html[data-theme] .control label,
html[data-theme] .control-group label,
html[data-theme] .field label,
html[data-theme] th,
html[data-theme] .section-header,
html[data-theme] .garanti-group-label,
html[data-theme] .price-label {
  font-weight: 700 !important;
}

html[data-theme] .muted,
html[data-theme] .head-sub,
html[data-theme] .stat-sub,
html[data-theme] .product-sub,
html[data-theme] .cari-sub,
html[data-theme] .group-meta,
html[data-theme] .invoice-note,
html[data-theme] .invoice-muted,
html[data-theme] .shipping-card-meta,
html[data-theme] .history-meta,
html[data-theme] .empty {
  font-weight: 500 !important;
}

html[data-theme] .stat-value,
html[data-theme] .product-title,
html[data-theme] .cari-name,
html[data-theme] .group-name,
html[data-theme] .shipping-card-title,
html[data-theme] .invoice-id-main,
html[data-theme] .invoice-firm {
  font-weight: 800 !important;
}

html[data-theme="light"] body.marketplace-page .product-title,
html[data-theme="dark"] body.marketplace-page .product-title {
  color: #3f79e0 !important;
}

body.customer-modal-open #globalThemeToggle,
body.order-detail-open #globalThemeToggle,
body.sales-detail-open #globalThemeToggle,
body.cari-detail-open #globalThemeToggle {
  display: none !important;
}
