/* =========================================
   LUUMTECH LIQUID GLASS THEME
   Admin-style design with Dark/Light mode
   ========================================= */

/* ===========================================
   CSS VARIABLES & DESIGN TOKENS
   =========================================== */
:root {
  /* ===== DARK MODE (Default) ===== */
  --lg-bg-primary: #0a0a0c;
  --lg-bg-secondary: #111113;
  --lg-bg-tertiary: #1a1a1e;
  --lg-bg-elevated: #222226;

  /* Glass Effects - Dark */
  --lg-glass-bg: rgba(17, 17, 19, 0.85);
  --lg-glass-bg-light: rgba(26, 26, 30, 0.75);
  --lg-glass-border: rgba(255, 255, 255, 0.06);
  --lg-glass-border-light: rgba(255, 255, 255, 0.1);
  --lg-blur: 24px;
  --lg-saturation: 150%;

  /* Accent Colors - Blue (matching light mode) */
  --lg-accent: #60a5fa;
  --lg-accent-hover: #93c5fd;
  --lg-accent-rgb: 96, 165, 250;
  --lg-accent-secondary: #22d3ee;
  --lg-accent-tertiary: #818cf8;

  /* Text Colors - Dark */
  --lg-text-primary: #f1f1f1;
  --lg-text-secondary: #a1a1aa;
  --lg-text-muted: #71717a;
  --lg-text-inverse: #000000;

  /* Borders */
  --lg-border: rgba(255, 255, 255, 0.06);
  --lg-border-light: rgba(255, 255, 255, 0.1);

  /* Status Colors */
  --lg-success: #22c55e;
  --lg-warning: #eab308;
  --lg-danger: #ef4444;
  --lg-info: #3b82f6;

  /* Border Radius - Matching Admin */
  --lg-radius-xs: 4px;
  --lg-radius-sm: 6px;
  --lg-radius-md: 8px;
  --lg-radius-lg: 12px;
  --lg-radius-xl: 16px;
  --lg-radius-full: 9999px;

  /* Shadows - Minimal */
  --lg-shadow-sm: none;
  --lg-shadow-md: 0 1px 3px rgba(0, 0, 0, 0.12);
  --lg-shadow-lg: 0 2px 8px rgba(0, 0, 0, 0.15);
  --lg-shadow-glow: 0 0 12px rgba(96, 165, 250, 0.15);

  /* Transitions */
  --lg-transition: all 0.2s ease;
  --lg-transition-fast: all 0.15s ease;
  --lg-transition-slow: all 0.3s ease;

  /* Typography - Inter (clean dashboard) */
  --lg-font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --lg-font-weight-thin: 300;
  --lg-font-weight-light: 400;
  --lg-font-weight-normal: 400;
  --lg-font-weight-medium: 500;
  --lg-font-weight-semibold: 600;
  --lg-font-size-xs: 0.6875rem;
  /* 11px */
  --lg-font-size-sm: 0.75rem;
  /* 12px */
  --lg-font-size-base: 0.8125rem;
  /* 13px */
  --lg-font-size-md: 0.875rem;
  /* 14px */
  --lg-font-size-lg: 1rem;
  /* 16px */
  --lg-font-size-xl: 1.25rem;
  /* 20px */
  --lg-font-size-2xl: 1.5rem;
  /* 24px */

  /* Spacing */
  --lg-space-xs: 4px;
  --lg-space-sm: 8px;
  --lg-space-md: 12px;
  --lg-space-lg: 16px;
  --lg-space-xl: 24px;
  --lg-space-2xl: 32px;
}

/* ===== LIGHT MODE ===== */
html[data-theme="light"] {
  --lg-bg-primary: #f0f2f5;
  --lg-bg-secondary: #ffffff;
  --lg-bg-tertiary: #f5f7fa;
  --lg-bg-elevated: #ffffff;

  /* Glass Effects - Light */
  --lg-glass-bg: rgba(255, 255, 255, 0.92);
  --lg-glass-bg-light: rgba(245, 247, 250, 0.88);
  --lg-glass-border: rgba(0, 0, 0, 0.06);
  --lg-glass-border-light: rgba(0, 0, 0, 0.08);

  /* Text Colors - Light */
  --lg-text-primary: #111827;
  --lg-text-secondary: #6b7280;
  --lg-text-muted: #9ca3af;
  --lg-text-inverse: #ffffff;

  /* Accent override for light mode - blue accent like reference */
  --lg-accent: #3b82f6;
  --lg-accent-hover: #2563eb;
  --lg-accent-rgb: 59, 130, 246;
  --lg-accent-secondary: #0891b2;

  /* Borders - Light */
  --lg-border: rgba(0, 0, 0, 0.06);
  --lg-border-light: rgba(0, 0, 0, 0.1);

  /* Shadows - Light (minimal) */
  --lg-shadow-sm: none;
  --lg-shadow-md: 0 1px 2px rgba(0, 0, 0, 0.04);
  --lg-shadow-lg: 0 2px 6px rgba(0, 0, 0, 0.06);
  --lg-shadow-glow: 0 0 12px rgba(59, 130, 246, 0.15);
}

/* ===========================================
   BASE STYLES
   =========================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
  font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
}

/* Restore Font Awesome glyph font overridden by global font rule */
body.luumtech-theme .fa,
body.luumtech-theme .fas,
body.luumtech-theme .far,
body.luumtech-theme .fab,
body.luumtech-theme .fa-solid,
body.luumtech-theme .fa-regular,
body.luumtech-theme .fa-brands,
body.luumtech-theme i[class^="fa-"],
body.luumtech-theme i[class*=" fa-"] {
  font-style: normal !important;
}

body.luumtech-theme .fa::before,
body.luumtech-theme .fas::before,
body.luumtech-theme .far::before,
body.luumtech-theme .fab::before,
body.luumtech-theme .fa-solid::before,
body.luumtech-theme .fa-regular::before,
body.luumtech-theme .fa-brands::before,
body.luumtech-theme [class^="fa-"]::before,
body.luumtech-theme [class*=" fa-"]::before {
  font-family: var(--fa-style-family, "Font Awesome 6 Free") !important;
  font-style: normal !important;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
}

body.luumtech-theme .fa-brands::before,
body.luumtech-theme .fab::before {
  font-family: "Font Awesome 6 Brands" !important;
}

html {
  font-size: 16px;
  scroll-behavior: smooth;
}

body.luumtech-theme {
  background: var(--lg-bg-primary);
  color: var(--lg-text-primary);
  font-family: var(--lg-font-family);
  font-size: var(--lg-font-size-base);
  font-weight: 300;
  line-height: 1.6;
  letter-spacing: 0.01em;
  min-height: 100vh;
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: flex;
  flex-direction: column;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Override Bootstrap/Tailwind backgrounds */
.luumtech-theme [class*="tw-bg-white"],
.luumtech-theme [class*="tw-bg-neutral-"],
.luumtech-theme .bg-white {
  background: var(--lg-bg-elevated) !important;
}

/* Light mode background fixes */
html[data-theme="light"] body.luumtech-theme {
  background: var(--lg-bg-primary);
}

html[data-theme="light"] .panel_s,
html[data-theme="light"] .panel-glass,
html[data-theme="light"] .login-card,
html[data-theme="light"] .navbar-glass,
html[data-theme="light"] .dropdown-menu-glass {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

html[data-theme="light"] .form-control,
html[data-theme="light"] .glass-input {
  background: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

html[data-theme="light"] .btn-default {
  background: #ffffff !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Dynamic Logo Visibility */
/* Reversed: show-dark logo appears in LIGHT mode, show-light logo appears in DARK mode */
.brand-logo.show-dark,
.brand-logo.show-light {
  max-height: 28px;
  max-width: 140px;
  width: auto;
  height: auto;
  display: inline-block;
  object-fit: contain;
}

/* Dark mode: SHOW light logo, HIDE dark logo */
html[data-theme="dark"] .brand-logo.show-dark {
  display: none !important;
}

html[data-theme="dark"] .brand-logo.show-light {
  display: inline-block !important;
}

/* Light mode: SHOW dark logo, HIDE light logo */
html[data-theme="light"] .brand-logo.show-light {
  display: none !important;
}

html[data-theme="light"] .brand-logo.show-dark {
  display: inline-block !important;
}

/* Theme Toggle Icon Visibility */
.theme-toggle-icon.show-dark,
.theme-toggle-icon.show-light {
  display: none;
}

html[data-theme="dark"] .theme-toggle-icon.show-dark {
  display: inline-flex;
}

html[data-theme="light"] .theme-toggle-icon.show-light {
  display: inline-flex;
}

/* SVG Icons */
.nav-icon {
  flex-shrink: 0;
  vertical-align: middle;
  margin-right: var(--lg-space-sm);
}

.menu-icon {
  color: var(--lg-text-secondary);
}

.form-icon {
  flex-shrink: 0;
  vertical-align: middle;
  margin-right: var(--lg-space-xs);
}

.btn-icon {
  flex-shrink: 0;
  vertical-align: middle;
  margin-right: var(--lg-space-xs);
}

/* Eye Icon Toggle */
.eye-icon {
  color: var(--lg-text-muted);
  transition: var(--lg-transition);
}

.eye-icon.hide {
  display: none;
}

.password-toggle:hover .eye-icon {
  color: var(--lg-text-primary);
}

/* Login Logo - Dynamic Light/Dark (Reversed) */
.login-brand-logo.show-dark,
.login-brand-logo.show-light {
  max-height: 40px;
  width: auto;
}

html[data-theme="dark"] .login-brand-logo.show-dark {
  display: none !important;
}

html[data-theme="light"] .login-brand-logo.show-light {
  display: none !important;
}

/* ===========================================
   TYPOGRAPHY
   =========================================== */
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--lg-text-primary);
  font-weight: 500;
  margin-top: 0;
  line-height: 1.3;
  letter-spacing: -0.01em;
}

h1 {
  font-size: var(--lg-font-size-2xl);
  font-weight: 500;
}

h2 {
  font-size: var(--lg-font-size-xl);
  font-weight: 500;
}

h3 {
  font-size: var(--lg-font-size-lg);
  font-weight: 500;
}

h4 {
  font-size: var(--lg-font-size-md);
  font-weight: 500;
}

h5 {
  font-size: var(--lg-font-size-base);
  font-weight: 500;
}

h6 {
  font-size: var(--lg-font-size-sm);
  font-weight: 500;
}

p {
  margin-top: 0;
  margin-bottom: var(--lg-space-md);
  color: var(--lg-text-secondary);
  font-weight: 300;
  letter-spacing: 0.005em;
}

a {
  color: var(--lg-accent);
  text-decoration: none;
  transition: var(--lg-transition-fast);
}

a:hover,
a:focus {
  color: var(--lg-accent-hover);
  text-decoration: none;
}

small,
.small {
  font-size: var(--lg-font-size-sm);
}

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

/* ===========================================
   THEME TOGGLE BUTTON
   =========================================== */
.theme-toggle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 12px;
  width: 44px;
  height: 44px;
  background: var(--lg-glass-bg);
  border: 1px solid var(--lg-border);
  border-radius: 50%;
  cursor: pointer;
  transition: var(--lg-transition);
}

.theme-toggle:hover {
  background: var(--lg-glass-bg-light);
  border-color: var(--lg-accent);
}

.theme-toggle-icon {
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--lg-text-secondary);
  transition: var(--lg-transition);
}

.theme-toggle:hover .theme-toggle-icon {
  color: var(--lg-accent);
}

.theme-toggle-label {
  font-size: var(--lg-font-size-xs);
  color: var(--lg-text-muted);
  white-space: nowrap;
}

/* Switch Style Toggle */
.theme-switch {
  position: relative;
  width: 44px;
  height: 24px;
  background: var(--lg-bg-tertiary);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-full);
  cursor: pointer;
  transition: var(--lg-transition);
}

.theme-switch::before {
  content: '';
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: var(--lg-accent);
  border-radius: 50%;
  transition: var(--lg-transition);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

html[data-theme="light"] .theme-switch::before {
  left: calc(100% - 20px);
}

.theme-switch-icons {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 5px;
  height: 100%;
  font-size: 10px;
}

.theme-switch-icons i {
  color: var(--lg-text-muted);
  z-index: 1;
}

/* Login Page Theme Toggle */
.login-theme-toggle {
  position: absolute;
  top: var(--lg-space-xl);
  right: var(--lg-space-xl);
}

.login-theme-toggle .theme-toggle {
  padding: var(--lg-space-sm) var(--lg-space-md);
  background: var(--lg-glass-bg);
  -webkit-backdrop-filter: blur(var(--lg-blur));
  backdrop-filter: blur(var(--lg-blur));
  box-shadow: var(--lg-shadow-md);
}

/* Navbar Theme Toggle */
.customers-nav-item-theme-toggle {
  display: flex;
  align-items: center;
  margin-left: var(--lg-space-sm);
}

.customers-nav-item-theme-toggle .theme-toggle {
  margin: 0;
}

/* ===========================================
   LOGIN PAGE - PREMIUM DESIGN
   =========================================== */

/* Animated Background */
.login-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  overflow: hidden;
  background: var(--lg-bg-primary);
}

.gradient-mesh {
  position: absolute;
  width: 200%;
  height: 200%;
  top: -50%;
  left: -50%;
  background:
    radial-gradient(ellipse at 20% 30%, rgba(139, 92, 246, 0.15) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(59, 130, 246, 0.12) 0%, transparent 45%),
    radial-gradient(ellipse at 60% 80%, rgba(34, 211, 238, 0.1) 0%, transparent 50%),
    radial-gradient(ellipse at 10% 70%, rgba(var(--lg-accent-rgb), 0.1) 0%, transparent 40%);
  animation: gradientShift 20s ease infinite;
}

html[data-theme="light"] .gradient-mesh {
  background:
    radial-gradient(ellipse at 20% 30%, rgba(139, 92, 246, 0.08) 0%, transparent 50%),
    radial-gradient(ellipse at 80% 20%, rgba(59, 130, 246, 0.06) 0%, transparent 45%),
    radial-gradient(ellipse at 60% 80%, rgba(34, 211, 238, 0.05) 0%, transparent 50%),
    radial-gradient(ellipse at 10% 70%, rgba(var(--lg-accent-rgb), 0.05) 0%, transparent 40%);
}

@keyframes gradientShift {

  0%,
  100% {
    transform: translate(0, 0) rotate(0deg);
  }

  25% {
    transform: translate(2%, 2%) rotate(1deg);
  }

  50% {
    transform: translate(-1%, 3%) rotate(-1deg);
  }

  75% {
    transform: translate(1%, -2%) rotate(0.5deg);
  }
}

/* Floating Orbs */
.floating-orbs {
  position: absolute;
  width: 100%;
  height: 100%;
}

.orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.4;
  animation: float 25s ease-in-out infinite;
}

html[data-theme="light"] .orb {
  opacity: 0.2;
}

.orb-1 {
  width: 300px;
  height: 300px;
  background: radial-gradient(circle, rgba(var(--lg-accent-rgb), 0.4) 0%, transparent 70%);
  top: 10%;
  left: 10%;
  animation-delay: 0s;
}

.orb-2 {
  width: 250px;
  height: 250px;
  background: radial-gradient(circle, rgba(34, 211, 238, 0.35) 0%, transparent 70%);
  top: 60%;
  right: 10%;
  animation-delay: -5s;
}

.orb-3 {
  width: 200px;
  height: 200px;
  background: radial-gradient(circle, rgba(139, 92, 246, 0.3) 0%, transparent 70%);
  bottom: 20%;
  left: 20%;
  animation-delay: -10s;
}

.orb-4 {
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, rgba(59, 130, 246, 0.25) 0%, transparent 70%);
  top: 30%;
  right: 25%;
  animation-delay: -7s;
}

.orb-5 {
  width: 180px;
  height: 180px;
  background: radial-gradient(circle, rgba(236, 72, 153, 0.2) 0%, transparent 70%);
  top: 5%;
  right: 40%;
  animation-delay: -12s;
}

@keyframes float {

  0%,
  100% {
    transform: translateY(0) translateX(0) scale(1);
  }

  25% {
    transform: translateY(-20px) translateX(15px) scale(1.02);
  }

  50% {
    transform: translateY(15px) translateX(-20px) scale(0.98);
  }

  75% {
    transform: translateY(-15px) translateX(-15px) scale(1.01);
  }
}

/* Grid Overlay */
.grid-overlay {
  position: absolute;
  width: 100%;
  height: 100%;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.015) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.015) 1px, transparent 1px);
  background-size: 60px 60px;
  opacity: 0.5;
}

html[data-theme="light"] .grid-overlay {
  background-image:
    linear-gradient(rgba(0, 0, 0, 0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0, 0, 0, 0.02) 1px, transparent 1px);
}

/* Login Container */
.login-container {
  position: relative;
  z-index: 1;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}

.login-wrapper {
  width: 100%;
  max-width: 440px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

/* Logo */
.login-logo {
  text-align: center;
}

.login-brand-logo {
  height: 40px;
  width: auto;
}

/* Login Card - Clean Admin Style */
.login-card {
  width: 100%;
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  border-radius: 30px;
  box-shadow: none;
  overflow: hidden;
  transition: var(--lg-transition-slow);
}

html[data-theme="light"] .login-card {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.12);
  box-shadow: none;
}

.login-card-header {
  padding: 32px 32px 0;
  text-align: center;
}

.login-card-header .company-logo {
  margin-bottom: 20px;
}

.login-card-header .company-logo img {
  max-height: 40px;
  width: auto;
}

.login-title {
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--lg-text-primary);
  margin: 0 0 4px;
}

.login-subtitle {
  color: var(--lg-text-muted);
  font-size: 0.875rem;
  margin: 0;
  font-weight: 300;
}

.login-card-body {
  padding: 24px 32px 32px;
}

/* Glass Form Groups */
.form-group-glass {
  position: relative;
  margin-bottom: var(--lg-space-lg);
}

.form-group-glass .floating-label,
.form-group-glass .control-label {
  display: flex;
  align-items: center;
  gap: var(--lg-space-xs);
  font-size: var(--lg-font-size-sm);
  font-weight: 500;
  color: var(--lg-text-secondary);
  margin-bottom: var(--lg-space-xs);
  transition: var(--lg-transition);
}

.form-group-glass .floating-label i,
.form-group-glass .control-label i {
  font-size: var(--lg-font-size-sm);
  color: var(--lg-text-muted);
}

.form-group-glass.focused .floating-label,
.form-group-glass.focused .control-label {
  color: var(--lg-accent);
}

.form-group-glass.focused .floating-label i,
.form-group-glass.focused .control-label i {
  color: var(--lg-accent);
}

/* Glass Input */
.glass-input,
.form-control {
  width: 100%;
  padding: var(--lg-space-md) var(--lg-space-lg);
  background: var(--lg-bg-tertiary);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-md);
  color: var(--lg-text-primary);
  font-size: var(--lg-font-size-base);
  font-family: var(--lg-font-family);
  transition: var(--lg-transition);
  outline: none;
}

.glass-input::placeholder,
.form-control::placeholder {
  color: var(--lg-text-muted);
}

.glass-input:focus,
.form-control:focus {
  border-color: var(--lg-accent);
  background: var(--lg-bg-elevated);
  box-shadow: 0 0 0 3px rgba(var(--lg-accent-rgb), 0.1);
}

/* Input Glow Effect - Disabled */
.input-glow {
  display: none !important;
}

/* Password Toggle */
.password-toggle {
  position: absolute;
  right: var(--lg-space-md);
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: var(--lg-text-muted);
  cursor: pointer;
  padding: var(--lg-space-xs);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: var(--lg-transition-fast);
}

.password-toggle:hover {
  color: var(--lg-text-primary);
}

/* Bootstrap Select Override */
.glass-select,
.selectpicker,
.bootstrap-select>.dropdown-toggle {
  background: var(--lg-bg-tertiary) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-md) !important;
  color: var(--lg-text-primary) !important;
  padding: var(--lg-space-md) var(--lg-space-lg) !important;
  font-size: var(--lg-font-size-base) !important;
  height: auto !important;
}

.bootstrap-select .dropdown-menu {
  background: var(--lg-glass-bg) !important;
  -webkit-backdrop-filter: blur(var(--lg-blur)) !important;
  backdrop-filter: blur(var(--lg-blur)) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-md) !important;
  box-shadow: var(--lg-shadow-lg) !important;
  padding: var(--lg-space-xs) !important;
}

.bootstrap-select .dropdown-menu li a {
  color: var(--lg-text-primary) !important;
  padding: var(--lg-space-sm) var(--lg-space-md) !important;
  font-size: var(--lg-font-size-sm) !important;
  border-radius: var(--lg-radius-sm) !important;
}

.bootstrap-select .dropdown-menu li a:hover,
.bootstrap-select .dropdown-menu li.selected a {
  background: rgba(var(--lg-accent-rgb), 0.1) !important;
  color: var(--lg-accent) !important;
}

/* Form Options (Remember & Forgot) */
.form-options {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--lg-space-xl);
}

/* Glass Checkbox */
.checkbox-glass {
  display: flex;
  align-items: center;
}

.checkbox-glass input[type="checkbox"] {
  display: none;
}

.checkbox-glass label {
  display: flex;
  align-items: center;
  gap: var(--lg-space-sm);
  cursor: pointer;
  font-size: var(--lg-font-size-sm);
  color: var(--lg-text-secondary);
  -webkit-user-select: none;
  user-select: none;
}

.checkbox-custom {
  width: 18px;
  height: 18px;
  border: 2px solid var(--lg-border-light);
  border-radius: var(--lg-radius-xs);
  background: var(--lg-bg-tertiary);
  position: relative;
  transition: var(--lg-transition);
}

.checkbox-glass input[type="checkbox"]:checked+label .checkbox-custom {
  background: var(--lg-accent);
  border-color: var(--lg-accent);
}

.checkbox-custom::after {
  content: '';
  position: absolute;
  left: 5px;
  top: 1px;
  width: 5px;
  height: 9px;
  border: solid var(--lg-text-inverse);
  border-width: 0 2px 2px 0;
  transform: rotate(45deg) scale(0);
  transition: var(--lg-transition-fast);
}

.checkbox-glass input[type="checkbox"]:checked+label .checkbox-custom::after {
  transform: rotate(45deg) scale(1);
}

/* Forgot Link */
.forgot-link {
  font-size: var(--lg-font-size-sm);
  color: var(--lg-text-secondary);
}

.forgot-link:hover {
  color: var(--lg-accent);
}

/* Form Actions */
.form-actions {
  display: flex;
  flex-direction: column;
  gap: var(--lg-space-md);
}

/* Glass Buttons */
.btn-glass-primary,
.btn-primary {
  position: relative;
  width: 100%;
  padding: var(--lg-space-md) var(--lg-space-xl);
  background: var(--lg-accent);
  border: none;
  border-radius: var(--lg-radius-md);
  color: var(--lg-text-inverse);
  font-size: var(--lg-font-size-base);
  font-weight: 500;
  font-family: var(--lg-font-family);
  letter-spacing: 0.01em;
  cursor: pointer;
  overflow: hidden;
  transition: var(--lg-transition);
}

.btn-glass-primary:hover,
.btn-primary:hover {
  background: var(--lg-accent-hover);
  transform: translateY(-1px);
  box-shadow: var(--lg-shadow-glow);
}

.btn-glass-primary:active,
.btn-primary:active {
  transform: translateY(0);
}

/* Button Shine Effect */
.btn-shine {
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg,
      transparent,
      rgba(255, 255, 255, 0.2),
      transparent);
  transition: none;
}

.btn-glass-primary:hover .btn-shine {
  animation: shine 0.5s forwards;
}

@keyframes shine {
  0% {
    left: -100%;
  }

  100% {
    left: 200%;
  }
}

/* Button Loading State */
.btn-login .btn-loader {
  display: none;
}

.btn-login.loading .btn-text {
  visibility: hidden;
}

.btn-login.loading .btn-loader {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.spinner {
  width: 20px;
  height: 20px;
  animation: spin 1s linear infinite;
}

@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}

/* Secondary Button */
.btn-glass-secondary,
.btn-default {
  width: 100%;
  padding: var(--lg-space-md) var(--lg-space-xl);
  background: transparent;
  border: 1px solid var(--lg-border-light);
  border-radius: var(--lg-radius-md);
  color: var(--lg-text-primary);
  font-size: var(--lg-font-size-base);
  font-weight: 400;
  font-family: var(--lg-font-family);
  letter-spacing: 0.01em;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--lg-space-sm);
  transition: var(--lg-transition);
  cursor: pointer;
}

.btn-glass-secondary:hover,
.btn-default:hover {
  background: var(--lg-glass-bg-light);
  border-color: var(--lg-accent);
  color: var(--lg-accent);
}

/* Login Footer */
.login-footer {
  text-align: center;
  color: var(--lg-text-muted);
  font-size: var(--lg-font-size-xs);
}

/* Recaptcha */
.recaptcha-wrapper {
  margin-bottom: var(--lg-space-lg);
  display: flex;
  justify-content: center;
}

/* Form Errors */
.form-group-glass .form-error,
.form-group-glass .text-danger {
  color: var(--lg-danger);
  font-size: var(--lg-font-size-xs);
  margin-top: var(--lg-space-xs);
}

/* ===========================================
   NAVBAR - FLOATING PILL STYLE
   =========================================== */
.navbar-glass {
  position: fixed !important;
  top: 10px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  max-width: 1200px !important;
  z-index: 1000 !important;
  background: rgba(255, 255, 255, 0.35) !important;
  -webkit-backdrop-filter: blur(40px) saturate(200%) !important;
  backdrop-filter: blur(40px) saturate(200%) !important;
  border: 1px solid rgba(255, 255, 255, 0.25) !important;
  border-radius: 310px !important;
  box-shadow: none !important;
  padding: 12px 20px !important;
  min-height: 0 !important;
  transition: var(--lg-transition-slow) !important;
}

html[data-theme="dark"] .navbar-glass {
  background: rgba(17, 17, 19, 0.35) !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}

.navbar-glass.navbar-scrolled {
  box-shadow: none !important;
}

.navbar-glass .container {
  width: 100% !important;
  max-width: 100% !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.navbar-glass .navbar-header {
  margin: 0;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.navbar-glass .navbar-brand {
  padding: var(--lg-space-xs) 0 !important;
  margin-right: var(--lg-space-lg) !important;
  height: auto !important;
}

.navbar-glass .navbar-collapse {
  margin-left: auto;
  padding-left: 0 !important;
}

.navbar-glass .navbar-brand img {
  height: 24px;
  width: auto;
}

.navbar-glass .navbar-nav {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 0;
}

.navbar-glass .navbar-nav>li>a {
  color: var(--lg-text-secondary) !important;
  padding: 8px 14px !important;
  font-size: var(--lg-font-size-sm) !important;
  font-weight: 400 !important;
  border-radius: 310px !important;
  line-height: 1.4 !important;
  transition: var(--lg-transition-fast) !important;
  white-space: nowrap !important;
  display: flex !important;
  align-items: center !important;
  gap: 5px !important;
}

.navbar-glass .navbar-nav>li>a:hover {
  color: var(--lg-text-primary) !important;
  background: var(--lg-glass-bg-light) !important;
}

.navbar-glass .navbar-nav>li.active>a {
  color: #ffffff !important;
  background: var(--lg-accent) !important;
}

html[data-theme="light"] .navbar-glass .navbar-nav>li.active>a {
  color: #ffffff !important;
  background: var(--lg-accent) !important;
}

.navbar-glass .navbar-nav>li>a i {
  margin-right: var(--lg-space-xs);
  font-size: var(--lg-font-size-sm);
}

/* Profile Dropdown in Navbar */
.navbar-glass .customers-nav-item-profile>a.profile-toggle {
  display: flex !important;
  align-items: center !important;
  gap: var(--lg-space-sm) !important;
  padding: var(--lg-space-xs) var(--lg-space-sm) !important;
  background: var(--lg-glass-bg-light) !important;
  border-radius: var(--lg-radius-full) !important;
}

.navbar-glass .client-profile-image-small {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid var(--lg-border-light);
}

.navbar-glass .profile-name {
  color: var(--lg-text-primary);
  font-weight: 500;
  font-size: var(--lg-font-size-sm);
}

.navbar-glass .dropdown-caret {
  width: 14px;
  height: 14px;
  color: var(--lg-text-muted);
  transition: var(--lg-transition);
}

.navbar-glass .customers-nav-item-profile.open .dropdown-caret {
  transform: rotate(180deg);
}

/* Glass Dropdown Menu */
.dropdown-menu-glass {
  background: var(--lg-glass-bg) !important;
  -webkit-backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-saturation)) !important;
  backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-saturation)) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-lg) !important;
  box-shadow: var(--lg-shadow-lg) !important;
  padding: var(--lg-space-xs) !important;
  margin-top: var(--lg-space-sm) !important;
  min-width: 180px !important;
}

.dropdown-menu-glass>li>a {
  color: var(--lg-text-secondary) !important;
  padding: var(--lg-space-sm) var(--lg-space-md) !important;
  border-radius: var(--lg-radius-sm) !important;
  font-size: var(--lg-font-size-sm) !important;
  display: flex !important;
  align-items: center !important;
  gap: var(--lg-space-sm) !important;
  transition: var(--lg-transition-fast) !important;
}

.dropdown-menu-glass>li>a:hover,
.dropdown-menu-glass>li.active>a {
  background: rgba(var(--lg-accent-rgb), 0.1) !important;
  color: var(--lg-accent) !important;
}

.dropdown-menu-glass>li>a i {
  width: 16px;
  text-align: center;
  color: var(--lg-text-muted);
  font-size: var(--lg-font-size-sm);
}

.dropdown-menu-glass>li>a:hover i {
  color: var(--lg-accent);
}

.dropdown-menu-glass .divider {
  background: var(--lg-border) !important;
  margin: var(--lg-space-xs) 0 !important;
}

.dropdown-menu-glass .badge-accent {
  background: var(--lg-accent);
  color: var(--lg-text-inverse);
  font-size: var(--lg-font-size-xs);
  padding: 2px var(--lg-space-sm);
  border-radius: var(--lg-radius-full);
  margin-left: auto;
}

/* Login Button in Navbar */
.navbar-glass .customers-nav-item-login>a {
  background: var(--lg-accent) !important;
  color: #ffffff !important;
  font-weight: 500 !important;
  padding: 6px 14px !important;
  border-radius: 310px !important;
  margin-left: var(--lg-space-sm) !important;
  white-space: nowrap !important;
  min-width: max-content !important;
  letter-spacing: 0.01em !important;
}

.navbar-glass .customers-nav-item-login>a:hover {
  background: var(--lg-accent-hover) !important;
  box-shadow: var(--lg-shadow-glow);
}

/* Body padding for fixed navbar */
body.luumtech-theme {
  padding-top: 90px;
}

/* No navbar padding for login pages */
body.luumtech-theme.viewlogin,
body.luumtech-theme.viewregister,
body.luumtech-theme.viewforgot_password,
body.luumtech-theme.viewreset_password {
  padding-top: 0;
}

/* Login page navbar - auto width, centered */
body.viewlogin .navbar-glass,
body.viewregister .navbar-glass,
body.viewforgot_password .navbar-glass,
body.viewreset_password .navbar-glass {
  width: auto !important;
  max-width: calc(100vw - 24px) !important;
  min-width: 0 !important;
}

/* ===========================================
   GLASS PANELS & CARDS
   =========================================== */
.panel_s,
.panel-glass {
  background: var(--lg-bg-secondary) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-lg) !important;
  box-shadow: none !important;
  margin-bottom: var(--lg-space-lg);
}

.panel_s .panel-body,
.panel-glass .panel-body {
  padding: var(--lg-space-lg);
  color: var(--lg-text-primary);
}

.panel-header,
.panel_s .panel-heading {
  padding: var(--lg-space-md) var(--lg-space-lg);
  border-bottom: 1px solid var(--lg-border);
  background: var(--lg-bg-tertiary);
  border-radius: var(--lg-radius-lg) var(--lg-radius-lg) 0 0;
}

.panel-footer {
  background: var(--lg-bg-tertiary) !important;
  border-top: 1px solid var(--lg-border) !important;
  padding: var(--lg-space-md) var(--lg-space-lg) !important;
  border-radius: 0 0 var(--lg-radius-lg) var(--lg-radius-lg);
}

/* ===========================================
   ALERTS - GLASS STYLE
   =========================================== */
.alert-glass,
.alert {
  background: var(--lg-bg-tertiary) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-md) !important;
  color: var(--lg-text-primary) !important;
  padding: var(--lg-space-md) var(--lg-space-lg) !important;
  display: flex !important;
  align-items: center !important;
  gap: var(--lg-space-md) !important;
  font-size: var(--lg-font-size-sm) !important;
  margin-bottom: var(--lg-space-lg);
}

.alert-glass.alert-success,
.alert-success {
  border-color: rgba(34, 197, 94, 0.3) !important;
  background: rgba(34, 197, 94, 0.1) !important;
}

.alert-glass.alert-success i,
.alert-success i {
  color: var(--lg-success);
}

.alert-glass.alert-danger,
.alert-danger {
  border-color: rgba(239, 68, 68, 0.3) !important;
  background: rgba(239, 68, 68, 0.1) !important;
}

.alert-glass.alert-danger i,
.alert-danger i {
  color: var(--lg-danger);
}

.alert-glass.alert-warning,
.alert-warning {
  border-color: rgba(234, 179, 8, 0.3) !important;
  background: rgba(234, 179, 8, 0.1) !important;
}

.alert-glass.alert-warning i,
.alert-warning i {
  color: var(--lg-warning);
}

.alert-glass.alert-info,
.alert-info {
  border-color: rgba(59, 130, 246, 0.3) !important;
  background: rgba(59, 130, 246, 0.1) !important;
}

.alert-glass.alert-info i,
.alert-info i {
  color: var(--lg-info);
}

.alert .close {
  color: var(--lg-text-secondary) !important;
  opacity: 0.7;
  margin-left: auto;
}

.alert .close:hover {
  opacity: 1;
}

/* ===========================================
   BUTTONS - ADMIN MATCHING STYLE
   =========================================== */
.btn {
  font-family: var(--lg-font-family);
  font-size: var(--lg-font-size-sm);
  font-weight: 500;
  padding: var(--lg-space-sm) var(--lg-space-lg);
  border-radius: var(--lg-radius-md);
  transition: var(--lg-transition);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--lg-space-xs);
  cursor: pointer;
  border: none;
}

.btn-primary {
  background: var(--lg-accent) !important;
  color: var(--lg-text-inverse) !important;
  border: none !important;
}

.btn-primary:hover,
.btn-primary:focus {
  background: var(--lg-accent-hover) !important;
  box-shadow: var(--lg-shadow-glow) !important;
  color: var(--lg-text-inverse) !important;
}

.btn-default {
  background: var(--lg-bg-tertiary) !important;
  border: 1px solid var(--lg-border) !important;
  color: var(--lg-text-primary) !important;
}

.btn-default:hover,
.btn-default:focus {
  background: var(--lg-bg-elevated) !important;
  border-color: var(--lg-accent) !important;
  color: var(--lg-accent) !important;
}

.btn-success {
  background: var(--lg-success) !important;
  color: #fff !important;
  border: none !important;
}

.btn-success:hover {
  background: #16a34a !important;
}

.btn-danger {
  background: var(--lg-danger) !important;
  color: #fff !important;
  border: none !important;
}

.btn-danger:hover {
  background: #dc2626 !important;
}

.btn-warning {
  background: var(--lg-warning) !important;
  color: #000 !important;
  border: none !important;
}

.btn-info {
  background: var(--lg-info) !important;
  color: #fff !important;
  border: none !important;
}

.btn-xs {
  padding: var(--lg-space-xs) var(--lg-space-sm);
  font-size: var(--lg-font-size-xs);
}

.btn-sm {
  padding: var(--lg-space-xs) var(--lg-space-md);
  font-size: var(--lg-font-size-sm);
}

.btn-lg {
  padding: var(--lg-space-md) var(--lg-space-xl);
  font-size: var(--lg-font-size-md);
}

/* ===========================================
   FORM INPUTS - ADMIN MATCHING STYLE
   =========================================== */
.form-control {
  background: var(--lg-bg-tertiary) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-md) !important;
  color: var(--lg-text-primary) !important;
  padding: var(--lg-space-sm) var(--lg-space-md) !important;
  font-size: var(--lg-font-size-sm) !important;
  font-family: var(--lg-font-family) !important;
  height: auto !important;
  transition: var(--lg-transition) !important;
}

.form-control:focus {
  border-color: var(--lg-accent) !important;
  box-shadow: 0 0 0 2px rgba(var(--lg-accent-rgb), 0.1) !important;
  background: var(--lg-bg-elevated) !important;
}

.form-control::placeholder {
  color: var(--lg-text-muted) !important;
}

label,
.control-label {
  color: var(--lg-text-secondary) !important;
  font-weight: 500 !important;
  font-size: var(--lg-font-size-sm) !important;
  margin-bottom: var(--lg-space-xs) !important;
}

.form-group {
  margin-bottom: var(--lg-space-lg);
}

/* Select */
select.form-control {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23a1a1aa' d='M6 8.825L1.175 4 2.25 2.925 6 6.675l3.75-3.75L10.825 4z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  padding-right: 36px !important;
}

/* Textarea */
textarea.form-control {
  min-height: 80px;
  resize: vertical;
}

/* ===========================================
   TABLES - ADMIN MATCHING STYLE
   =========================================== */
.table {
  color: var(--lg-text-primary);
  font-size: var(--lg-font-size-sm);
  background: var(--lg-bg-secondary);
  border-radius: var(--lg-radius-md);
  overflow: hidden;
}

.table>thead>tr>th {
  background: var(--lg-bg-tertiary) !important;
  border-color: var(--lg-border) !important;
  color: var(--lg-text-secondary) !important;
  font-weight: 500 !important;
  font-size: var(--lg-font-size-xs) !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: var(--lg-space-md) var(--lg-space-lg) !important;
}

.table>tbody>tr>td {
  border-color: var(--lg-border) !important;
  padding: var(--lg-space-md) var(--lg-space-lg) !important;
  color: var(--lg-text-primary) !important;
  vertical-align: middle;
}

.table>tbody>tr:hover>td {
  background: rgba(var(--lg-accent-rgb), 0.03) !important;
}

.table-striped>tbody>tr:nth-of-type(odd) {
  background-color: var(--lg-bg-tertiary);
}

.table.items thead {
  background: var(--lg-bg-tertiary) !important;
}

/* ===========================================
   STATS CARDS
   =========================================== */
.stats-card {
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: var(--lg-space-lg);
  text-align: center;
  transition: var(--lg-transition);
}

.stats-card:hover {
  border-color: var(--lg-accent);
  box-shadow: var(--lg-shadow-md);
}

.stats-card .stat-icon {
  width: 40px;
  height: 40px;
  margin: 0 auto var(--lg-space-md);
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(var(--lg-accent-rgb), 0.1);
  border-radius: var(--lg-radius-md);
  color: var(--lg-accent);
  font-size: var(--lg-font-size-lg);
}

.stats-card .stat-number {
  font-size: var(--lg-font-size-2xl);
  font-weight: 500;
  color: var(--lg-text-primary);
  margin-bottom: var(--lg-space-xs);
}

.stats-card .stat-label {
  font-size: var(--lg-font-size-xs);
  color: var(--lg-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* ===========================================
   SUBMENU - TABS STYLE
   =========================================== */
.submenu {
  display: flex;
  gap: var(--lg-space-xs);
  margin-bottom: var(--lg-space-lg);
  padding: 0;
  list-style: none;
  flex-wrap: wrap;
}

.submenu li a {
  display: flex;
  align-items: center;
  gap: var(--lg-space-xs);
  padding: var(--lg-space-sm) var(--lg-space-md);
  background: var(--lg-bg-tertiary);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-md);
  color: var(--lg-text-secondary) !important;
  font-size: var(--lg-font-size-sm);
  font-weight: 500;
  transition: var(--lg-transition);
}

.submenu li a:hover,
.submenu li.active a {
  background: rgba(var(--lg-accent-rgb), 0.1);
  border-color: var(--lg-accent);
  color: var(--lg-accent) !important;
}

/* ===========================================
   FOOTER - GLASS STYLE
   =========================================== */
.glass-footer {
  background: var(--lg-bg-secondary) !important;
  border-top: 1px solid var(--lg-border) !important;
  padding: var(--lg-space-lg) !important;
  margin-top: auto;
}

.glass-footer .copyright-footer {
  color: var(--lg-text-muted);
  font-size: var(--lg-font-size-sm);
}

.glass-footer .footer-separator {
  color: var(--lg-text-muted);
  margin: 0 var(--lg-space-sm);
}

.glass-footer a {
  color: var(--lg-text-secondary);
}

.glass-footer a:hover {
  color: var(--lg-accent);
}

/* ===========================================
   WRAPPER & CONTENT
   =========================================== */
#wrapper {
  flex: 1;
}

#content {
  padding: var(--lg-space-lg) 0;
}

.container {
  max-width: 1200px;
}

/* ===========================================
   BADGES & LABELS
   =========================================== */
.badge,
.label {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px var(--lg-space-sm);
  font-size: var(--lg-font-size-xs);
  font-weight: 500;
  border-radius: var(--lg-radius-full);
  line-height: 1.4;
}

.badge-primary,
.label-primary {
  background: var(--lg-accent);
  color: var(--lg-text-inverse);
}

.badge-success,
.label-success {
  background: var(--lg-success);
  color: #fff;
}

.badge-danger,
.label-danger {
  background: var(--lg-danger);
  color: #fff;
}

.badge-warning,
.label-warning {
  background: var(--lg-warning);
  color: #000;
}

.badge-info,
.label-info {
  background: var(--lg-info);
  color: #fff;
}

.badge-default,
.label-default {
  background: var(--lg-bg-tertiary);
  color: var(--lg-text-secondary);
}

/* ===========================================
   PAGINATION
   =========================================== */
.pagination {
  display: flex;
  gap: var(--lg-space-xs);
  list-style: none;
  padding: 0;
  margin: var(--lg-space-lg) 0;
}

.pagination>li>a,
.pagination>li>span {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 var(--lg-space-sm);
  background: var(--lg-bg-tertiary);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-sm);
  color: var(--lg-text-secondary);
  font-size: var(--lg-font-size-sm);
  transition: var(--lg-transition-fast);
}

.pagination>li>a:hover,
.pagination>li.active>a,
.pagination>li.active>span {
  background: var(--lg-accent);
  border-color: var(--lg-accent);
  color: var(--lg-text-inverse);
}

.pagination>li.disabled>a,
.pagination>li.disabled>span {
  opacity: 0.5;
  pointer-events: none;
}

/* ===========================================
   ANIMATIONS
   =========================================== */
@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animated {
  animation-duration: 0.4s;
  animation-fill-mode: both;
}

.fadeIn {
  animation-name: fadeIn;
}

.fadeInUp {
  animation-name: fadeInUp;
}

.fadeInDown {
  animation-name: fadeInDown;
}

/* Animation delays */
.login-logo {
  animation-delay: 0.1s;
}

.login-card {
  animation-delay: 0.15s;
}

.login-footer {
  animation-delay: 0.3s;
}

/* ===========================================
   RESPONSIVE DESIGN
   =========================================== */
@media (max-width: 991px) {
  .navbar-glass {
    width: calc(100% - 24px) !important;
    max-width: none !important;
    border-radius: var(--lg-radius-lg) !important;
    padding: 6px 12px !important;
  }

  .navbar-glass .container {
    flex-wrap: wrap !important;
  }

  .navbar-glass .navbar-toggle {
    margin: 0;
    padding: var(--lg-space-sm);
    border: none !important;
  }

  .navbar-glass .navbar-toggle .icon-bar {
    background: var(--lg-text-secondary) !important;
    width: 20px;
    height: 2px;
    border-radius: 1px;
  }

  .navbar-glass .navbar-collapse {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--lg-glass-bg);
    -webkit-backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-saturation));
    backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-saturation));
    border: 1px solid var(--lg-border);
    border-radius: var(--lg-radius-lg);
    margin-top: var(--lg-space-sm);
    padding: var(--lg-space-md);
    box-shadow: var(--lg-shadow-lg);
  }

  .navbar-glass .navbar-nav>li>a {
    padding: var(--lg-space-md) var(--lg-space-lg) !important;
  }

  body.luumtech-theme {
    padding-top: 70px;
  }
}

@media (max-width: 767px) {
  :root {
    --lg-space-xl: 20px;
    --lg-space-2xl: 24px;
  }

  .login-wrapper {
    padding: 0;
  }

  .login-card-header,
  .login-card-body {
    padding: var(--lg-space-lg);
  }

  .form-options {
    flex-direction: column;
    gap: var(--lg-space-md);
    align-items: flex-start;
  }

  .submenu {
    justify-content: center;
  }

  .container {
    padding-left: var(--lg-space-md);
    padding-right: var(--lg-space-md);
  }
}

/* ===========================================
   DATATABLES OVERRIDE
   =========================================== */
.dataTables_wrapper {
  color: var(--lg-text-primary);
  font-size: var(--lg-font-size-sm);
}

.dataTables_wrapper .dataTables_length label,
.dataTables_wrapper .dataTables_filter label {
  color: var(--lg-text-secondary);
  font-size: var(--lg-font-size-sm);
}

.dataTables_wrapper .dataTables_length select,
.dataTables_wrapper .dataTables_filter input {
  background: var(--lg-bg-tertiary) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-sm) !important;
  color: var(--lg-text-primary) !important;
  padding: var(--lg-space-xs) var(--lg-space-sm) !important;
  font-size: var(--lg-font-size-sm) !important;
}

.dataTables_wrapper .dataTables_info {
  color: var(--lg-text-muted);
  font-size: var(--lg-font-size-sm);
}

.dataTables_wrapper .dataTables_paginate .paginate_button {
  background: var(--lg-bg-tertiary) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-sm) !important;
  color: var(--lg-text-secondary) !important;
  margin: 0 2px !important;
  padding: var(--lg-space-xs) var(--lg-space-sm) !important;
  font-size: var(--lg-font-size-sm) !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.current {
  background: var(--lg-accent) !important;
  border-color: var(--lg-accent) !important;
  color: var(--lg-text-inverse) !important;
}

/* ===========================================
   UTILITY CLASSES
   =========================================== */
.text-accent {
  color: var(--lg-accent) !important;
}

.text-success {
  color: var(--lg-success) !important;
}

.text-danger {
  color: var(--lg-danger) !important;
}

.text-warning {
  color: var(--lg-warning) !important;
}

.text-info {
  color: var(--lg-info) !important;
}

.bg-accent {
  background: var(--lg-accent) !important;
}

.bg-glass {
  background: var(--lg-glass-bg) !important;
}

.border-accent {
  border-color: var(--lg-accent) !important;
}

.rounded {
  border-radius: var(--lg-radius-md) !important;
}

.rounded-lg {
  border-radius: var(--lg-radius-lg) !important;
}

.rounded-full {
  border-radius: var(--lg-radius-full) !important;
}

/* Theme element visibility rules are handled per-component (brand-logo, theme-toggle-icon) */

/* ===========================================
   DARK MODE BACKGROUND FIXES
   =========================================== */
html[data-theme="dark"] .panel_s,
html[data-theme="dark"] .panel-body,
html[data-theme="dark"] .panel-glass,
html[data-theme="dark"] .project-overview-left,
html[data-theme="dark"] .project-overview-right,
html[data-theme="dark"] .contract-preview,
html[data-theme="dark"] .invoice-html-preview,
html[data-theme="dark"] .estimate-preview,
html[data-theme="dark"] .proposal-preview,
html[data-theme="dark"] .project-info-panel,
html[data-theme="dark"] .mtop15,
html[data-theme="dark"] .table-responsive,
html[data-theme="dark"] .widget,
html[data-theme="dark"] [class*="tw-bg-white"],
html[data-theme="dark"] [class*="tw-bg-neutral-50"],
html[data-theme="dark"] .calendar-container,
html[data-theme="dark"] .fc,
html[data-theme="dark"] .fc-view-container,
html[data-theme="dark"] .fc-view {
  background: var(--lg-bg-elevated) !important;
  color: var(--lg-text-primary) !important;
}

/* Dark mode panel heading text fixes */
html[data-theme="dark"] .panel-heading,
html[data-theme="dark"] .panel-title,
html[data-theme="dark"] h4.bold,
html[data-theme="dark"] h3.bold,
html[data-theme="dark"] .project-heading,
html[data-theme="dark"] .section-heading,
html[data-theme="dark"] label,
html[data-theme="dark"] .control-label,
html[data-theme="dark"] td,
html[data-theme="dark"] th,
html[data-theme="dark"] p,
html[data-theme="dark"] span:not(.badge),
html[data-theme="dark"] strong {
  color: var(--lg-text-primary) !important;
}

/* Specific text that needs to be white in dark mode */
html[data-theme="dark"] .tw-text-neutral-700,
html[data-theme="dark"] .tw-text-neutral-800,
html[data-theme="dark"] .tw-text-neutral-900,
html[data-theme="dark"] .text-dark,
html[data-theme="dark"] .text-muted {
  color: var(--lg-text-secondary) !important;
}

/* Tables in dark mode */
html[data-theme="dark"] .table,
html[data-theme="dark"] .table>thead>tr>th,
html[data-theme="dark"] .table>tbody>tr>td {
  background: var(--lg-bg-elevated) !important;
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .table-striped>tbody>tr:nth-of-type(odd) {
  background: var(--lg-bg-tertiary) !important;
}

/* Chart containers */
html[data-theme="dark"] .chart-container,
html[data-theme="dark"] .chart-stage {
  background: var(--lg-bg-elevated) !important;
}

/* Project summary icons - make them visible */
html[data-theme="dark"] .project-status-icon,
html[data-theme="dark"] .fa,
html[data-theme="dark"] .fas,
html[data-theme="dark"] .far,
html[data-theme="dark"] .fab,
html[data-theme="dark"] [class*="fa-"] {
  color: var(--lg-text-secondary);
}

/* ===========================================
   BOTTOM BAR (Files & Calendar)
   =========================================== */
.bottom-bar {
  position: fixed;
  bottom: var(--lg-space-md);
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  width: auto;
  max-width: calc(100% - 32px);
  background: var(--lg-glass-bg);
  -webkit-backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-saturation));
  backdrop-filter: blur(var(--lg-blur)) saturate(var(--lg-saturation));
  border: 1px solid var(--lg-border);
  border-radius: 310px;
  padding: 6px 12px;
  display: flex;
  justify-content: center;
  gap: 4px;
  box-shadow: var(--lg-shadow-lg);
}

.bottom-bar-item {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 9px 16px;
  color: var(--lg-text-secondary);
  text-decoration: none;
  border-radius: 310px;
  transition: var(--lg-transition-fast);
  font-size: 0.875rem;
  font-weight: 400;
  white-space: nowrap;
}

.bottom-bar-item:hover,
.bottom-bar-item:focus {
  color: var(--lg-text-primary);
  background: var(--lg-glass-bg-light);
  text-decoration: none;
}

.bottom-bar-item.active {
  color: #ffffff;
  background: var(--lg-accent);
}

.bottom-bar-icon {
  width: 18px;
  height: 18px;
}

.bottom-bar-label {
  font-size: 0.875rem;
  font-weight: 400;
}

/* Adjust main content when bottom bar is visible */
body.has-bottom-bar {
  padding-bottom: 80px;
}

/* ===========================================
   DASHBOARD SVG ICONS
   =========================================== */
.panel-icon,
.stat-icon,
.widget-icon,
.section-icon {
  width: 20px;
  height: 20px;
  stroke: currentColor;
  stroke-width: 1.5;
  fill: none;
  vertical-align: middle;
  margin-right: var(--lg-space-sm);
}

.panel-icon-lg {
  width: 32px;
  height: 32px;
}

.panel-icon-accent {
  color: var(--lg-accent);
}

.panel-icon-info {
  color: var(--lg-info);
}

.panel-icon-success {
  color: var(--lg-success);
}

.panel-icon-warning {
  color: var(--lg-warning);
}

.panel-icon-danger {
  color: var(--lg-danger);
}

/* ===========================================
   UI FIXES BATCH 2
   =========================================== */

/* FIX: Dropdown Double Border - Remove inner wrapper border */
.bootstrap-select>.dropdown-toggle,
.form-control,
select.form-control,
.selectpicker {
  outline: none !important;
  box-shadow: none !important;
}

.bootstrap-select .btn:focus,
.bootstrap-select .btn:active,
.bootstrap-select>.dropdown-toggle:focus,
.bootstrap-select>.dropdown-toggle:active {
  outline: none !important;
  box-shadow: none !important;
}

.bootstrap-select .bs-searchbox input,
.bootstrap-select .filter-option-inner-inner {
  border: none !important;
  box-shadow: none !important;
}

/* FIX: Form control double border - single clean border */
.form-group .form-control,
.form-group select,
.form-group input,
.form-group textarea {
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-tertiary) !important;
  color: var(--lg-text-primary) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Remove outer border when form-group wraps bootstrap-select */
.form-group .bootstrap-select {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
}

.form-group .bootstrap-select>.dropdown-toggle {
  border: 1px solid var(--lg-border) !important;
  box-shadow: none !important;
}

.form-group .form-control:focus,
.form-group select:focus,
.form-group input:focus,
.form-group textarea:focus {
  border-color: var(--lg-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--lg-accent-rgb), 0.15) !important;
}

/* FIX: Login Gradient Underline Remove */
.form-group-glass::after,
.login-form .form-group::after,
.login-wrapper .form-group::after {
  display: none !important;
  content: none !important;
}

.form-group-glass,
.form-group-glass input,
.form-group-glass select {
  background-image: none !important;
  border-bottom: none !important;
}

/* FIX: Login Eye Icon Centering */
.password-toggle {
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 0;
  cursor: pointer;
  color: var(--lg-text-muted);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}

.password-toggle .eye-icon {
  width: 18px;
  height: 18px;
  vertical-align: middle;
}

.form-group-glass {
  position: relative;
}

/* FIX: Invoice Stats Colors in Dark Mode */
html[data-theme="dark"] .text-danger,
html[data-theme="dark"] .text-success,
html[data-theme="dark"] .text-warning,
html[data-theme="dark"] .text-info,
html[data-theme="dark"] .text-muted {
  opacity: 1 !important;
}

/* Invoice summary stats with better visibility */
.invoice-stats .stat-value,
.invoice-summary .stat-item,
.quick-stats .stat-item {
  color: var(--lg-text-primary) !important;
}

/* Ödenmedi, Ödendi, etc. badges with proper dark mode colors */
.invoice-badge,
.status-badge,
.label.s-status {
  font-weight: 500;
  padding: 4px 12px;
  border-radius: var(--lg-radius-full);
}

html[data-theme="dark"] .label-danger,
html[data-theme="dark"] .s-status-1 {
  background: rgba(239, 68, 68, 0.2) !important;
  color: #f87171 !important;
}

html[data-theme="dark"] .label-success,
html[data-theme="dark"] .s-status-2 {
  background: rgba(34, 197, 94, 0.2) !important;
  color: #4ade80 !important;
}

html[data-theme="dark"] .label-warning,
html[data-theme="dark"] .s-status-3,
html[data-theme="dark"] .s-status-4 {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #fbbf24 !important;
}

html[data-theme="dark"] .label-info,
html[data-theme="dark"] .s-status-5 {
  background: rgba(59, 130, 246, 0.2) !important;
  color: #60a5fa !important;
}

/* FIX: Progress Bars - Modern Design */
.progress {
  background: rgba(255, 255, 255, 0.1) !important;
  border-radius: var(--lg-radius-full) !important;
  height: 8px !important;
  overflow: hidden !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.2) !important;
}

html[data-theme="light"] .progress {
  background: rgba(0, 0, 0, 0.08) !important;
}

.progress-bar {
  border-radius: var(--lg-radius-full) !important;
  transition: width 0.6s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.progress-bar-success {
  background: linear-gradient(135deg, #22c55e 0%, #16a34a 100%) !important;
}

.progress-bar-info {
  background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%) !important;
}

.progress-bar-warning {
  background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%) !important;
}

.progress-bar-danger {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%) !important;
}

/* FIX: Statement Page Print/PDF Icons Side by Side */
.statement-actions,
.export-buttons,
.btn-group.pull-right {
  display: flex !important;
  gap: 8px !important;
  flex-wrap: nowrap !important;
}

.statement-actions .btn,
.export-buttons .btn {
  margin: 0 !important;
  flex-shrink: 0;
}

/* FIX: Dashboard Greeting Animation - More Prominent Colors */
.dashboard-greeting {
  background: linear-gradient(135deg, rgba(163, 230, 53, 0.15) 0%, rgba(34, 211, 238, 0.15) 50%, rgba(139, 92, 246, 0.1) 100%) !important;
  border: 1px solid rgba(163, 230, 53, 0.3) !important;
}

.greeting-text {
  background: linear-gradient(135deg, #a3e635 0%, #22d3ee 50%, #8b5cf6 100%) !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  background-clip: text !important;
  animation: gradient-shift 5s ease infinite !important;
  background-size: 200% 200% !important;
}

@keyframes gradient-shift {

  0%,
  100% {
    background-position: 0% 50%;
  }

  50% {
    background-position: 100% 50%;
  }
}

.deco-circle {
  background: linear-gradient(135deg, rgba(163, 230, 53, 0.2) 0%, rgba(34, 211, 238, 0.2) 100%) !important;
}

/* FIX: Year Selector Background */
.chart-filters {
  background: var(--lg-glass-bg-light) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-md) !important;
  padding: var(--lg-space-md) !important;
}

.chart-filters select,
.chart-filters .bootstrap-select>.dropdown-toggle {
  background: var(--lg-bg-tertiary) !important;
}

/* FIX: Talep Aç Button Size */
.customers-nav-item-open_ticket .btn,
.btn-new-ticket,
a[href*="open_ticket"] .btn,
.btn.btn-primary[href*="tickets/open"],
.open-ticket-btn {
  padding: 8px 16px !important;
  font-size: var(--lg-font-size-sm) !important;
  height: auto !important;
  line-height: 1.4 !important;
}

/* FIX: Profile Page Image Section */
.profile-image-wrapper,
.contact-profile-image-wrapper,
.customer-profile-image {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--lg-space-md);
  padding: var(--lg-space-xl);
  background: var(--lg-glass-bg);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
}

.profile-image,
.contact-profile-image,
.customer-profile-image img {
  width: 120px !important;
  height: 120px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  border: 3px solid var(--lg-accent) !important;
  box-shadow: 0 8px 32px rgba(var(--lg-accent-rgb), 0.2) !important;
}

.profile-image-actions {
  display: flex;
  gap: var(--lg-space-sm);
  margin-top: var(--lg-space-sm);
}

.profile-image-actions .btn {
  padding: 6px 12px;
  font-size: var(--lg-font-size-xs);
  border-radius: var(--lg-radius-full);
}

/* FIX: Projects/Support Summary Sections */
.projects-summary-wrapper,
.tickets-summary-wrapper,
.project-summary,
.support-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--lg-space-md);
}

.project-status-item,
.ticket-status-item,
.summary-stat-card {
  background: var(--lg-glass-bg);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  padding: var(--lg-space-lg);
  text-align: center;
  transition: var(--lg-transition);
}

.project-status-item:hover,
.ticket-status-item:hover,
.summary-stat-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--lg-shadow-lg);
  border-color: var(--lg-accent);
}

.project-status-item .count,
.ticket-status-item .count,
.summary-stat-card .stat-value {
  font-size: 2rem;
  font-weight: 500;
  color: var(--lg-accent);
  display: block;
  margin-bottom: var(--lg-space-xs);
}

.project-status-item .status-name,
.ticket-status-item .status-name,
.summary-stat-card .stat-label {
  font-size: var(--lg-font-size-sm);
  color: var(--lg-text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

/* FIX: Knowledge Base Search */
.knowledge-base-search,
.kb-search-wrapper,
.search-articles-wrapper {
  background: linear-gradient(135deg, rgba(var(--lg-accent-rgb), 0.1) 0%, rgba(34, 211, 238, 0.08) 100%);
  border: 1px solid rgba(var(--lg-accent-rgb), 0.2);
  border-radius: var(--lg-radius-xl);
  padding: var(--lg-space-2xl) var(--lg-space-xl);
  text-align: center;
  margin-bottom: var(--lg-space-xl);
}

.knowledge-base-search h3,
.kb-search-wrapper h3,
.search-articles-wrapper .title {
  font-size: 1.5rem;
  font-weight: 500;
  margin-bottom: var(--lg-space-lg);
  background: linear-gradient(135deg, var(--lg-accent) 0%, #22d3ee 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.knowledge-base-search .search-input,
.kb-search-wrapper input,
.search-articles-wrapper input {
  width: 100%;
  max-width: 500px;
  margin: 0 auto;
  padding: var(--lg-space-md) var(--lg-space-xl);
  font-size: var(--lg-font-size-md);
  background: var(--lg-glass-bg);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-full);
  color: var(--lg-text-primary);
  transition: var(--lg-transition);
}

.knowledge-base-search .search-input:focus,
.kb-search-wrapper input:focus,
.search-articles-wrapper input:focus {
  border-color: var(--lg-accent);
  box-shadow: 0 0 0 4px rgba(var(--lg-accent-rgb), 0.15);
  outline: none;
}

/* FIX: Estimate/Proposal Page Dark Mode */
html[data-theme="dark"] .estimate-wrapper,
html[data-theme="dark"] .proposal-wrapper,
html[data-theme="dark"] .public-estimate,
html[data-theme="dark"] .public-proposal {
  background: var(--lg-bg-primary) !important;
  color: var(--lg-text-primary) !important;
}

html[data-theme="dark"] .estimate-wrapper .panel,
html[data-theme="dark"] .proposal-wrapper .panel,
html[data-theme="dark"] .public-estimate .panel,
html[data-theme="dark"] .public-proposal .panel {
  background: var(--lg-bg-secondary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .estimate-wrapper table,
html[data-theme="dark"] .proposal-wrapper table,
html[data-theme="dark"] .public-estimate table,
html[data-theme="dark"] .public-proposal table {
  background: var(--lg-bg-tertiary) !important;
}

html[data-theme="dark"] .estimate-wrapper table th,
html[data-theme="dark"] .proposal-wrapper table th,
html[data-theme="dark"] .public-estimate table th,
html[data-theme="dark"] .public-proposal table th {
  background: rgba(var(--lg-accent-rgb), 0.1) !important;
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .estimate-wrapper table td,
html[data-theme="dark"] .proposal-wrapper table td,
html[data-theme="dark"] .public-estimate table td,
html[data-theme="dark"] .public-proposal table td {
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

/* FIX: Remove Files/Calendar from Navbar if in bottom bar */
/* Note: This is handled in PHP, but just in case */
.navbar-glass .customers-nav-item-files,
.navbar-glass .customers-nav-item-calendar {
  display: none !important;
}

/* ===========================================
   TAILWIND DARK MODE TEXT OVERRIDES
   =========================================== */
html[data-theme="dark"] .tw-text-neutral-500,
html[data-theme="dark"] .tw-text-neutral-600,
html[data-theme="dark"] .tw-text-neutral-700,
html[data-theme="dark"] .tw-text-neutral-800,
html[data-theme="dark"] .tw-text-neutral-900,
html[data-theme="dark"] .tw-text-gray-500,
html[data-theme="dark"] .tw-text-gray-600,
html[data-theme="dark"] .tw-text-gray-700,
html[data-theme="dark"] .tw-text-gray-800,
html[data-theme="dark"] .tw-text-gray-900,
html[data-theme="dark"] .\!tw-text-neutral-700 {
  color: var(--lg-text-secondary) !important;
}

html[data-theme="dark"] .bold,
html[data-theme="dark"] .tw-font-medium,
html[data-theme="dark"] .tw-font-semibold,
html[data-theme="dark"] .tw-font-bold {
  color: var(--lg-text-primary) !important;
}

/* Estimate/Proposal Public Pages - Full Fix */
html[data-theme="dark"] .preview-top-wrapper,
html[data-theme="dark"] .mtop15.preview-top-wrapper {
  background: var(--lg-bg-primary) !important;
  color: var(--lg-text-primary) !important;
}

html[data-theme="dark"] .panel_s,
html[data-theme="dark"] .panel-body {
  background: var(--lg-bg-secondary) !important;
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .preview-sticky-header,
html[data-theme="dark"] .preview-sticky-container {
  background: var(--lg-bg-secondary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .estimate-html-number,
html[data-theme="dark"] .proposal-html-number,
html[data-theme="dark"] .bold.estimate-html-number,
html[data-theme="dark"] .bold {
  color: var(--lg-text-primary) !important;
}

html[data-theme="dark"] .estimate-html-company-info,
html[data-theme="dark"] .proposal-html-company-info,
html[data-theme="dark"] .estimate-html-customer-billing-info,
html[data-theme="dark"] .proposal-html-customer-billing-info,
html[data-theme="dark"] .estimate-html-customer-shipping-info {
  color: var(--lg-text-secondary) !important;
}

html[data-theme="dark"] .estimate_to,
html[data-theme="dark"] .estimate_ship_to {
  color: var(--lg-text-secondary) !important;
}

/* Estimate/Proposal Tables */
html[data-theme="dark"] .items-table,
html[data-theme="dark"] .items-table th,
html[data-theme="dark"] .items-table td,
html[data-theme="dark"] .table.text-right,
html[data-theme="dark"] .table.text-right td {
  background: var(--lg-bg-tertiary) !important;
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .items-table th {
  background: rgba(var(--lg-accent-rgb), 0.1) !important;
}

html[data-theme="dark"] .estimate-html-total-to-words,
html[data-theme="dark"] .estimate-html-note,
html[data-theme="dark"] .estimate-html-terms-and-conditions,
html[data-theme="dark"] .proposal-html-note {
  color: var(--lg-text-primary) !important;
}

html[data-theme="dark"] hr {
  border-color: var(--lg-border) !important;
}

/* Action buttons on estimate/proposal */
html[data-theme="dark"] .action-button.download,
html[data-theme="dark"] .action-button.go-to-portal,
html[data-theme="dark"] .btn-default.action-button {
  background: var(--lg-bg-tertiary) !important;
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

/* ===========================================
   DASHBOARD QUICK STATS (Ödenmedi, Ödendi etc.)
   =========================================== */
html[data-theme="dark"] .quick-stats-invoices span,
html[data-theme="dark"] .invoice-overview span,
html[data-theme="dark"] .panel-heading span,
html[data-theme="dark"] .quick-stats a,
html[data-theme="dark"] .section-client-dashboard .panel-heading {
  color: var(--lg-text-primary) !important;
}

/* Color-coded stat items */
html[data-theme="dark"] .quick-stats-invoices .stat-unpaid,
html[data-theme="dark"] .stat-danger,
html[data-theme="dark"] [class*="invoice"] .text-danger {
  color: #f87171 !important;
}

html[data-theme="dark"] .quick-stats-invoices .stat-paid,
html[data-theme="dark"] .stat-success,
html[data-theme="dark"] [class*="invoice"] .text-success {
  color: #4ade80 !important;
}

html[data-theme="dark"] .quick-stats-invoices .stat-overdue,
html[data-theme="dark"] .stat-warning,
html[data-theme="dark"] [class*="invoice"] .text-warning {
  color: #fbbf24 !important;
}

html[data-theme="dark"] .quick-stats-invoices .stat-partially,
html[data-theme="dark"] .stat-info,
html[data-theme="dark"] [class*="invoice"] .text-info {
  color: #60a5fa !important;
}

/* Bootstrap Select Wrapper Fix - Remove Double Border */
.bootstrap-select {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.bootstrap-select>.dropdown-toggle {
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-md) !important;
}

.bootstrap-select.btn-group .dropdown-toggle .caret {
  color: var(--lg-text-muted) !important;
}

/* Page wrapper/body fix for estimate/proposal */
html[data-theme="dark"] .container-fluid,
html[data-theme="dark"] body.customers {
  background: var(--lg-bg-primary) !important;
}

/* ===========================================
   PROFILE AVATAR SECTION
   =========================================== */
.profile-avatar-section {
  margin-bottom: var(--lg-space-xl);
  padding: 0 15px;
}

.profile-avatar-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--lg-space-xl) var(--lg-space-lg);
  background: linear-gradient(135deg, rgba(var(--lg-accent-rgb), 0.05) 0%, rgba(34, 211, 238, 0.03) 100%);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-xl);
  text-align: center;
}

.profile-avatar-ring {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  padding: 4px;
  background: linear-gradient(135deg, var(--lg-accent), #22d3ee);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: var(--lg-space-md);
}

.profile-avatar-img {
  width: 112px;
  height: 112px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--lg-bg-secondary);
}

.profile-avatar-placeholder {
  background: var(--lg-glass-bg);
  color: var(--lg-text-muted);
}

.profile-avatar-actions {
  display: flex;
  gap: var(--lg-space-sm);
  margin-top: var(--lg-space-sm);
}

.profile-avatar-change,
.profile-avatar-upload {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px !important;
  font-size: var(--lg-font-size-xs) !important;
  background: var(--lg-accent) !important;
  color: white !important;
  border: none !important;
  border-radius: var(--lg-radius-full) !important;
  cursor: pointer;
  transition: var(--lg-transition);
}

.profile-avatar-change:hover,
.profile-avatar-upload:hover {
  opacity: 0.9;
  transform: translateY(-1px);
}

.profile-avatar-remove {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px !important;
  font-size: var(--lg-font-size-xs) !important;
  background: rgba(239, 68, 68, 0.1) !important;
  color: #ef4444 !important;
  border: 1px solid rgba(239, 68, 68, 0.2) !important;
  border-radius: var(--lg-radius-full) !important;
  cursor: pointer;
  transition: var(--lg-transition);
}

.profile-avatar-remove:hover {
  background: rgba(239, 68, 68, 0.2) !important;
  color: #ef4444 !important;
}

.hidden {
  display: none !important;
}

/* ===========================================
   KNOWLEDGE BASE SEARCH - Enhanced
   =========================================== */
.panel_s .search-input,
.panel_s input[name="search"],
.panel_s .search-box input {
  border-radius: var(--lg-radius-full) !important;
  padding: var(--lg-space-md) var(--lg-space-xl) !important;
}

/* Profile section heading */
html[data-theme="dark"] .section-text,
html[data-theme="dark"] .section-heading h4 {
  color: var(--lg-text-primary) !important;
}

/* Panel footer dark mode */
html[data-theme="dark"] .panel-footer {
  background: var(--lg-bg-tertiary) !important;
  border-color: var(--lg-border) !important;
  color: var(--lg-text-secondary) !important;
}

/* Client profile image thumb fix */
.client-profile-image-thumb {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  object-fit: cover;
}

/* ===========================================
   KNOWLEDGE BASE SEARCH HERO
   =========================================== */
/* ===========================================
   KB SEARCH HERO - Creative Animated Design
   =========================================== */
.kb-page {
  max-width: 100%;
}

.kb-search-hero {
  position: relative;
  border-radius: 24px;
  padding: 60px 24px 48px;
  margin-bottom: 32px;
  text-align: center;
  overflow: hidden;
  min-height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.kb-hero-bg-img {
  position: absolute;
  inset: 0;
  background: url('../images/kb-hero-bg.png') center/cover no-repeat;
  z-index: 0;
}

.kb-hero-blur-overlay {
  position: absolute;
  inset: 0;
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  backdrop-filter: blur(16px) saturate(180%);
  background: rgba(10, 15, 30, 0.5);
  z-index: 1;
}

.kb-hero-glow {
  position: absolute;
  top: -50%;
  left: 50%;
  transform: translateX(-50%);
  width: 400px;
  height: 400px;
  background: radial-gradient(circle, rgba(var(--lg-accent-rgb), 0.15) 0%, transparent 70%);
  animation: heroGlowPulse 4s ease-in-out infinite;
  pointer-events: none;
}

@keyframes heroGlowPulse {

  0%,
  100% {
    opacity: 0.4;
    transform: translateX(-50%) scale(1);
  }

  50% {
    opacity: 0.8;
    transform: translateX(-50%) scale(1.2);
  }
}

/* Floating Particles */
.kb-hero-particles {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.particle {
  position: absolute;
  border-radius: 50%;
  opacity: 0;
  animation: particleFloat 8s ease-in-out infinite;
}

.p1 {
  width: 6px;
  height: 6px;
  background: var(--lg-accent);
  top: 20%;
  left: 10%;
  animation-delay: 0s;
}

.p2 {
  width: 4px;
  height: 4px;
  background: #22d3ee;
  top: 60%;
  left: 85%;
  animation-delay: 1.5s;
}

.p3 {
  width: 8px;
  height: 8px;
  background: #818cf8;
  top: 30%;
  left: 75%;
  animation-delay: 3s;
}

.p4 {
  width: 5px;
  height: 5px;
  background: var(--lg-accent);
  top: 70%;
  left: 20%;
  animation-delay: 4.5s;
}

.p5 {
  width: 3px;
  height: 3px;
  background: #f59e0b;
  top: 15%;
  left: 60%;
  animation-delay: 2s;
}

.p6 {
  width: 7px;
  height: 7px;
  background: #22c55e;
  top: 80%;
  left: 50%;
  animation-delay: 5.5s;
}

@keyframes particleFloat {
  0% {
    opacity: 0;
    transform: translateY(20px) scale(0);
  }

  15% {
    opacity: 0.8;
    transform: translateY(0px) scale(1);
  }

  50% {
    opacity: 0.4;
    transform: translateY(-30px) scale(0.8);
  }

  85% {
    opacity: 0.7;
    transform: translateY(-10px) scale(1.1);
  }

  100% {
    opacity: 0;
    transform: translateY(20px) scale(0);
  }
}


.kb-search-content {
  position: relative;
  z-index: 3;
  max-width: 600px;
  margin: 0 auto;
}

.kb-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 16px;
  background: rgba(var(--lg-accent-rgb), 0.1);
  border: 1px solid rgba(var(--lg-accent-rgb), 0.2);
  border-radius: 310px;
  color: var(--lg-accent);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  margin-bottom: 20px;
  animation: badgeSlideIn 0.6s ease-out;
}

@keyframes badgeSlideIn {
  from {
    opacity: 0;
    transform: translateY(-10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.kb-search-title {
  font-size: 2rem;
  font-weight: 600;
  margin: 0 0 8px;
  color: var(--lg-text-primary);
  animation: titleFadeIn 0.8s ease-out 0.2s both;
}

@keyframes titleFadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.kb-gradient-text {
  background: linear-gradient(135deg, var(--lg-accent) 0%, #22d3ee 50%, #818cf8 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  background-size: 200% auto;
  animation: gradientShift 3s ease-in-out infinite;
}

@keyframes gradientShift {
  0% {
    background-position: 0% center;
  }

  50% {
    background-position: 100% center;
  }

  100% {
    background-position: 0% center;
  }
}

.kb-search-subtitle {
  font-size: 0.875rem;
  color: var(--lg-text-secondary);
  margin: 0 0 28px;
  animation: titleFadeIn 0.8s ease-out 0.4s both;
}

.kb-search-form {
  max-width: 520px;
  margin: 0 auto;
  animation: titleFadeIn 0.8s ease-out 0.5s both;
}

.kb-search-input-wrapper {
  position: relative;
  display: flex;
  align-items: center;
}

.kb-input-icon {
  position: absolute;
  left: 18px;
  color: var(--lg-text-muted);
  pointer-events: none;
  z-index: 2;
}

.kb-search-field {
  width: 100%;
  padding: 16px 56px 16px 48px;
  font-size: 0.9375rem;
  background: var(--lg-bg-secondary);
  border: 2px solid var(--lg-border);
  border-radius: 310px;
  color: var(--lg-text-primary);
  transition: all 0.3s ease;
  outline: none;
}

.kb-search-field:focus {
  border-color: transparent;
  background-image: linear-gradient(var(--lg-bg-secondary), var(--lg-bg-secondary)),
    conic-gradient(from var(--tilt-angle, 0deg), var(--lg-accent), #22d3ee, #818cf8, var(--lg-accent));
  background-origin: border-box;
  background-clip: padding-box, border-box;
  animation: tiltRotate 3s linear infinite;
}

.kb-search-field::placeholder {
  color: var(--lg-text-muted);
}

.kb-search-btn {
  position: absolute;
  right: 6px;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: none;
  background: linear-gradient(135deg, var(--lg-accent), #22d3ee);
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(var(--lg-accent-rgb), 0.3);
}

.kb-search-btn:hover {
  transform: scale(1.1) rotate(90deg);
  box-shadow: 0 6px 20px rgba(var(--lg-accent-rgb), 0.4);
}

.kb-hero-stats {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-top: 24px;
  animation: titleFadeIn 0.8s ease-out 0.7s both;
}

.kb-stat {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.75rem;
  color: var(--lg-text-muted);
  font-weight: 500;
}

.kb-stat svg {
  opacity: 0.6;
}

/* Old KB jumbotron override */
.jumbotron.kb-search-jumbotron,
.jumbotron {
  display: none !important;
}

/* KB empty state */
.kb-empty-state {
  text-align: center;
  padding: 48px 24px;
  color: var(--lg-text-muted);
}

.kb-empty-state svg {
  margin-bottom: 16px;
}

/* Old KB jumbotron override */
.jumbotron.kb-search-jumbotron {
  display: none;
}

/* KB category list dark mode */
html[data-theme="dark"] .tw-divide-neutral-200 {
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .tw-bg-neutral-50 {
  background: var(--lg-bg-tertiary) !important;
  color: var(--lg-text-primary) !important;
}

html[data-theme="dark"] .tw-text-neutral-600:hover,
html[data-theme="dark"] a.tw-text-neutral-600:hover {
  color: var(--lg-accent) !important;
}

/* ===========================================
   HIDE CUSTOMER TOP SUBMENU (FILES/CALENDAR)
   Since these are already in the bottom bar
   =========================================== */
.customer-top-submenu {
  display: none !important;
}

/* ===========================================
   TICKETS - Open Ticket Button Smaller
   =========================================== */
.btn.new-ticket,
a.btn.btn-primary.new-ticket {
  padding: 8px 16px !important;
  font-size: var(--lg-font-size-sm) !important;
  border-radius: var(--lg-radius-md) !important;
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}

/* Tickets summary cards dark mode */
html[data-theme="dark"] .tw-border-neutral-200 {
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .tw-bg-white,
html[data-theme="dark"] .tw-bg-neutral-50 {
  background: var(--lg-bg-secondary) !important;
}

html[data-theme="dark"] a.tw-border-neutral-200:hover,
html[data-theme="dark"] .hover\:tw-bg-neutral-100:hover {
  background: var(--lg-bg-tertiary) !important;
}

html[data-theme="dark"] .tw-text-primary-600 {
  color: var(--lg-accent) !important;
}

/* ===========================================
   STATEMENT - Print/PDF Buttons Inline
   =========================================== */
.section-statement ._buttons {
  display: inline-flex !important;
  gap: var(--lg-space-sm);
  align-items: center;
}

.section-statement ._buttons .btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

/* ===========================================
   INVOICE STATS - Dark Mode Visibility  
   =========================================== */
html[data-theme="dark"] .section-client-dashboard .tw-text-primary-600,
html[data-theme="dark"] .section-client-dashboard .tw-font-semibold {
  color: var(--lg-text-primary) !important;
}

/* Color stat badges by status color (inline style) */
html[data-theme="dark"] .section-client-dashboard dt[style*="color"] {
  filter: brightness(1.3) saturate(1.2);
}

/* Year selector dropdown */
html[data-theme="dark"] .bootstrap-select .dropdown-menu {
  background: var(--lg-bg-secondary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .bootstrap-select .dropdown-menu li a {
  color: var(--lg-text-primary) !important;
}

html[data-theme="dark"] .bootstrap-select .dropdown-menu li a:hover,
html[data-theme="dark"] .bootstrap-select .dropdown-menu li.selected a {
  background: var(--lg-bg-tertiary) !important;
  color: var(--lg-accent) !important;
}

/* ===========================================
   NAVBAR MENU ICONS
   =========================================== */
.navbar-nav>li>a .nav-icon {
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: -3px;
  margin-right: 4px;
  opacity: 0.7;
  transition: opacity 0.2s;
}

.navbar-nav>li>a:hover .nav-icon,
.navbar-nav>li.active>a .nav-icon {
  opacity: 1;
}

/* ===========================================
   INVOICE STATS - Modern Card Grid
   =========================================== */
.invoice-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}

@media (max-width: 768px) {
  .invoice-stats-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.invoice-stat-card {
  display: block;
  padding: 16px 20px;
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  border-radius: var(--lg-radius-lg);
  transition: all 0.25s ease;
  text-decoration: none !important;
}

.invoice-stat-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  border-color: var(--lg-accent);
  text-decoration: none !important;
}

.stat-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 12px;
}

.stat-icon {
  width: 36px;
  height: 36px;
  border-radius: var(--lg-radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
}

.stat-numbers {
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--lg-text-primary);
}

.stat-separator {
  opacity: 0.3;
  margin: 0 2px;
}

.stat-total {
  opacity: 0.5;
  font-size: 0.875rem;
}

.stat-label {
  font-size: 0.8rem;
  font-weight: 500;
  letter-spacing: 0.3px;
  display: block;
  margin-bottom: 8px;
}

.stat-progress {
  height: 4px;
  background: var(--lg-bg-tertiary);
  border-radius: 4px;
  overflow: hidden;
}

.stat-progress-bar {
  height: 100%;
  border-radius: 4px;
  transition: width 0.8s ease;
  min-width: 2px;
}

/* ===========================================
   KB CATEGORIES - Modern Card Grid
   =========================================== */
.kb-categories-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.kb-category-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  border-left: 3px solid var(--cat-color-1, var(--lg-accent));
  border-radius: 16px;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  text-decoration: none !important;
  color: var(--lg-text-primary) !important;
}

.kb-category-card:hover {
  transform: translateX(4px);
  border-color: var(--cat-color-1, var(--lg-accent));
  border-left: 3px solid var(--cat-color-1, var(--lg-accent));
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  text-decoration: none !important;
  color: var(--lg-text-primary) !important;
}

.kb-category-icon {
  width: 48px;
  height: 48px;
  min-width: 48px;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--cat-color-1, var(--lg-accent)), var(--cat-color-2, #22d3ee));
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
  transition: all 0.3s ease;
}

.kb-category-card:hover .kb-category-icon {
  transform: scale(1.08);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.kb-category-content {
  flex: 1;
  min-width: 0;
}

.kb-category-name {
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0 0 4px;
  color: var(--lg-text-primary);
  display: flex;
  align-items: center;
  gap: 8px;
}

.kb-category-meta {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kb-category-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 28px;
  height: 28px;
  padding: 0 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--cat-color-1, var(--lg-accent)), var(--cat-color-2, #22d3ee));
  color: white;
  font-size: 0.75rem;
  font-weight: 600;
}

.kb-category-desc {
  font-size: 0.8125rem;
  color: var(--lg-text-muted);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kb-category-arrow {
  color: var(--lg-text-muted);
  opacity: 0;
  transform: translateX(-8px);
  transition: all 0.3s ease;
}

.kb-category-card:hover .kb-category-arrow {
  opacity: 1;
  transform: translateX(0);
  color: var(--cat-color-1, var(--lg-accent));
}

/* ===========================================
   PROFILE PAGE - Modern Layout
   =========================================== */
.section-profile-page {
  padding-bottom: 24px;
}

.profile-header-card {
  position: relative;
  overflow: hidden;
  margin-bottom: 24px;
  border-radius: var(--lg-radius-xl) !important;
}

.profile-header-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  background: linear-gradient(135deg, rgba(var(--lg-accent-rgb), 0.15) 0%, rgba(34, 211, 238, 0.1) 50%, rgba(168, 85, 247, 0.08) 100%);
}

.profile-header-content {
  position: relative;
  display: flex;
  align-items: flex-end;
  gap: 24px;
  padding: 60px 32px 24px;
}

.profile-header-content .profile-avatar-section {
  margin: 0;
  padding: 0;
}

.profile-header-content .profile-avatar-card {
  padding: 0;
  background: none;
  border: none;
}

.profile-header-content .profile-avatar-ring {
  border: 4px solid var(--lg-bg-primary);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.profile-header-info {
  padding-bottom: 8px;
}

.profile-name-heading {
  font-size: 1.5rem;
  font-weight: 500;
  color: var(--lg-text-primary);
  margin: 0 0 4px;
}

.profile-email-heading {
  font-size: 0.9rem;
  color: var(--lg-text-muted);
  margin: 0;
}

.profile-form-body {
  padding: 24px !important;
}

.profile-form-body .form-group {
  margin-bottom: 20px;
}

.profile-form-body label {
  font-weight: 500;
  color: var(--lg-text-secondary);
  margin-bottom: 6px;
}

.email-notification-checkboxes {
  margin-top: 12px;
}

/* Panel headings with icons */
.panel-heading .panel-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  font-weight: 500;
}

.panel-heading .panel-title svg {
  opacity: 0.7;
}

/* ===========================================
   PROJECT / TICKET SUMMARY - Modern Cards
   =========================================== */
.projects-summary-wrapper dl,
dl.tw-grid {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)) !important;
  gap: 12px !important;
}

.projects-summary-wrapper dl>a,
dl.tw-grid>a {
  display: block !important;
  padding: 16px 20px !important;
  background: var(--lg-bg-secondary) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: var(--lg-radius-lg) !important;
  transition: all 0.25s ease !important;
  text-decoration: none !important;
}

.projects-summary-wrapper dl>a:hover,
dl.tw-grid>a:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1) !important;
  border-color: var(--lg-accent) !important;
}

.projects-summary-wrapper dl>a dt,
dl.tw-grid>a dt {
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  margin-bottom: 4px !important;
}

.projects-summary-wrapper dl>a dd,
dl.tw-grid>a dd {
  margin: 0 !important;
}

html[data-theme="dark"] .projects-summary-wrapper dl>a dt,
html[data-theme="dark"] dl.tw-grid>a dt {
  filter: brightness(1.4) saturate(1.2) !important;
}

html[data-theme="dark"] .projects-summary-wrapper dl>a dd,
html[data-theme="dark"] dl.tw-grid>a dd,
html[data-theme="dark"] .tw-text-primary-600 {
  color: var(--lg-text-primary) !important;
}

/* ===========================================
   DUPLICATE FOOTER FIX
   =========================================== */
.login-footer {
  position: relative;
  z-index: 2;
}

/* Hide the secondary footer on login/forgot password pages */
body:has(.login-container) .glass-footer {
  display: none !important;
}

/* KB dark mode overrides */
html[data-theme="dark"] .kb-search-hero {
  background: linear-gradient(135deg, rgba(var(--lg-accent-rgb), 0.08) 0%, rgba(34, 211, 238, 0.04) 100%);
}

html[data-theme="dark"] .kb-search-field {
  background: var(--lg-bg-secondary) !important;
}

html[data-theme="dark"] .kb-search-field::placeholder {
  color: var(--lg-text-muted) !important;
}

/* Hide old jumbotron */
.jumbotron {
  display: none !important;
}

/* ===========================================
   NAVBAR ACTIVE/HOVER COLORS
   =========================================== */

.navbar-glass .navbar-nav>li.active>a {
  background: rgba(var(--lg-accent-rgb), 0.08) !important;
}

/* ===========================================
   SUMMARY HERO SECTIONS (Projects & Tickets)
   =========================================== */
.summary-hero-section {
  position: relative;
  overflow: hidden;
  border-radius: var(--lg-radius-xl);
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  padding: 32px 28px;
  margin-bottom: 24px;
}

.summary-hero-bg {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  pointer-events: none;
  overflow: hidden;
}

.summary-hero-orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  opacity: 0.25;
}

.summary-hero-orb-1 {
  width: 200px;
  height: 200px;
  top: -60px;
  right: -40px;
  background: radial-gradient(circle, rgba(var(--lg-accent-rgb), 0.5) 0%, transparent 70%);
  animation: summaryOrbFloat 15s ease-in-out infinite;
}

.summary-hero-orb-2 {
  width: 180px;
  height: 180px;
  bottom: -50px;
  left: -30px;
  background: radial-gradient(circle, rgba(34, 211, 238, 0.4) 0%, transparent 70%);
  animation: summaryOrbFloat 18s ease-in-out infinite reverse;
}

html[data-theme="light"] .summary-hero-orb {
  opacity: 0.12;
}

@keyframes summaryOrbFloat {

  0%,
  100% {
    transform: translate(0, 0) scale(1);
  }

  50% {
    transform: translate(15px, -10px) scale(1.1);
  }
}

.summary-hero-content {
  position: relative;
  z-index: 1;
}

.summary-hero-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.1rem;
  font-weight: 500;
  color: var(--lg-text-primary);
  margin: 0 0 20px;
}

.summary-hero-title svg {
  color: var(--lg-accent);
}

.summary-cards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
}

.summary-stat-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  background: var(--lg-glass-bg);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border: 1px solid var(--lg-glass-border);
  border-radius: var(--lg-radius-lg);
  text-decoration: none !important;
  transition: all 0.25s ease;
}

.summary-stat-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--lg-shadow-md);
  border-color: var(--lg-accent);
  text-decoration: none !important;
}

.summary-stat-color {
  width: 4px;
  height: 32px;
  border-radius: 4px;
  flex-shrink: 0;
}

.summary-stat-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.summary-stat-label {
  font-size: 0.78rem;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.summary-stat-value {
  font-size: 1.25rem;
  font-weight: 500;
  color: var(--lg-text-primary);
  line-height: 1.2;
}

/* Override old tw-grid styles for summary sections */
.tickets-summary-heading {
  display: none !important;
}

/* ===========================================
   KB ARTICLE PREVIEWS
   =========================================== */
.kb-category-section {
  margin-bottom: 16px;
}

.kb-articles-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: -1px;
  margin-left: 22px;
  margin-right: 0;
  border-left: 2px solid var(--lg-border);
  padding-left: 16px;
}

.kb-article-item {
  display: flex;
  gap: 12px;
  padding: 14px 16px;
  text-decoration: none !important;
  color: var(--lg-text-primary) !important;
  border-radius: var(--lg-radius-md);
  transition: all 0.2s ease;
}

.kb-article-item:hover {
  background: var(--lg-bg-tertiary);
  text-decoration: none !important;
  color: var(--lg-text-primary) !important;
}

.kb-article-icon {
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: var(--lg-radius-sm);
  background: rgba(var(--lg-accent-rgb), 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--lg-accent);
  margin-top: 2px;
}

.kb-article-content {
  flex: 1;
  min-width: 0;
}

.kb-article-title {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--lg-text-primary);
  margin: 0 0 4px;
  line-height: 1.3;
}

.kb-article-preview {
  font-size: 0.8rem;
  color: var(--lg-text-muted);
  margin: 0 0 4px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.kb-article-date {
  font-size: 0.7rem;
  color: var(--lg-text-muted);
  opacity: 0.7;
}

.kb-articles-more {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 16px;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--lg-accent) !important;
  text-decoration: none !important;
  transition: all 0.2s ease;
}

.kb-articles-more:hover {
  color: var(--lg-accent-hover) !important;
  text-decoration: none !important;
  transform: translateX(4px);
}

/* Also update KB article list page styles */
html[data-theme="dark"] .kb-article-title {
  color: var(--lg-text-primary);
}

html[data-theme="dark"] .kb-article-preview {
  color: var(--lg-text-muted);
}

/* ===========================================
   SUMMARY STAT CARDS - LARGER DISPLAY
   =========================================== */
.summary-stat-card {
  padding: 18px 20px !important;
}

.summary-stat-value {
  font-size: 1.5rem !important;
  font-weight: 500 !important;
}

.summary-stat-label {
  font-size: 0.82rem !important;
  letter-spacing: 0.02em;
}

.summary-stat-color {
  width: 5px !important;
  height: 40px !important;
  border-radius: 6px !important;
}

/* ===========================================
   NAVBAR & BOTTOM BAR - LIQUID GLASS
   =========================================== */
html[data-theme="light"] .navbar-glass {
  -webkit-backdrop-filter: blur(40px) saturate(200%) !important;
  backdrop-filter: blur(40px) saturate(200%) !important;
  background: rgba(255, 255, 255, 0.4) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .bottom-bar {
  -webkit-backdrop-filter: blur(40px) saturate(200%) !important;
  backdrop-filter: blur(40px) saturate(200%) !important;
  background: rgba(255, 255, 255, 0.4) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .bottom-bar {
  -webkit-backdrop-filter: blur(40px) saturate(200%) !important;
  backdrop-filter: blur(40px) saturate(200%) !important;
  background: rgba(17, 17, 19, 0.35) !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
  box-shadow: none !important;
}

/* ===========================================
   SECTION HEADINGS - DARK MODE FIX
   =========================================== */
html[data-theme="dark"] .section-heading,
html[data-theme="dark"] .tw-text-neutral-700,
html[data-theme="dark"] .tickets-summary-heading {
  color: var(--lg-text-primary) !important;
}

/* ===========================================
   PROJECT STATUS LABELS - DARK MODE
   =========================================== */
html[data-theme="dark"] [class*="project-status-"] {
  background: transparent !important;
  border-color: currentColor !important;
}

/* ===========================================
   PROJECT DETAIL PAGE - DARK MODE
   =========================================== */
html[data-theme="dark"] .project-overview-left .table td,
html[data-theme="dark"] .project-overview-left .table th,
html[data-theme="dark"] .project-overview-right .table td,
html[data-theme="dark"] .project-overview-right .table th {
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .project-overview-left,
html[data-theme="dark"] .project-overview-right {
  background: var(--lg-bg-secondary) !important;
}

/* Project tabs */
html[data-theme="dark"] .nav-tabs>li>a {
  color: var(--lg-text-secondary) !important;
  background: transparent !important;
  border-color: transparent !important;
}

html[data-theme="dark"] .nav-tabs>li.active>a,
html[data-theme="dark"] .nav-tabs>li>a:hover {
  color: var(--lg-accent) !important;
  background: var(--lg-bg-secondary) !important;
  border-color: var(--lg-border) !important;
  border-bottom-color: var(--lg-bg-secondary) !important;
}

html[data-theme="dark"] .nav-tabs {
  border-bottom-color: var(--lg-border) !important;
}

/* Project progress bars */
html[data-theme="dark"] .progress {
  background: var(--lg-bg-tertiary) !important;
}

/* Project task lists */
html[data-theme="dark"] .task-list-items .task-item,
html[data-theme="dark"] .tasks-table td,
html[data-theme="dark"] .tasks-table th {
  color: var(--lg-text-primary) !important;
  border-color: var(--lg-border) !important;
}

/* Project milestones */
html[data-theme="dark"] .milestone-name {
  color: var(--lg-text-primary) !important;
}

/* Project file uploads */
html[data-theme="dark"] .project-files .file-name,
html[data-theme="dark"] .project-files td,
html[data-theme="dark"] .project-files th {
  color: var(--lg-text-primary) !important;
}

/* Project discussions */
html[data-theme="dark"] .discussion-info h4 a,
html[data-theme="dark"] .discussion-info .text-muted {
  color: var(--lg-text-primary) !important;
}

/* Project gantt */
html[data-theme="dark"] .gantt-container {
  background: var(--lg-bg-secondary) !important;
}

/* General dark mode overrides for project page */
html[data-theme="dark"] .tw-text-neutral-600,
html[data-theme="dark"] .tw-text-neutral-500,
html[data-theme="dark"] .tw-text-neutral-400,
html[data-theme="dark"] .tw-text-neutral-800,
html[data-theme="dark"] .tw-text-neutral-900 {
  color: var(--lg-text-primary) !important;
}

html[data-theme="dark"] .tw-bg-white,
html[data-theme="dark"] .tw-bg-neutral-50 {
  background: var(--lg-bg-secondary) !important;
}

html[data-theme="dark"] .tw-border-neutral-200,
html[data-theme="dark"] .tw-border-neutral-300 {
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .tw-divide-neutral-200>*+* {
  border-color: var(--lg-border) !important;
}

html[data-theme="dark"] .tw-ring-white {
  --tw-ring-color: var(--lg-bg-primary) !important;
}

/* ===========================================
   KB CATEGORY ARTICLES PAGE - FULL LIST
   =========================================== */
.kb-category-articles-page {
  padding: 0;
}

.kb-articles-section {
  margin-bottom: 16px;
}

.kb-articles-list-full {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.kb-articles-list-full .kb-article-item {
  padding: 18px 20px;
  border-radius: var(--lg-radius-lg);
  border: 1px solid transparent;
}

.kb-articles-list-full .kb-article-item:hover {
  border-color: var(--lg-border);
  background: var(--lg-bg-tertiary);
}

.kb-article-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 6px;
}

.kb-article-header .kb-article-title {
  margin: 0;
  flex: 1;
}

.kb-article-header .kb-article-date {
  white-space: nowrap;
  flex-shrink: 0;
}

.kb-articles-list-full .kb-article-preview {
  -webkit-line-clamp: 3;
  font-size: 0.85rem;
  margin-bottom: 0;
}

/* ===========================================
   LIGHT MODE - CLEAN DASHBOARD STYLE
   =========================================== */
html[data-theme="light"] body.luumtech-theme {
  background: #f0f2f5 !important;
}

/* Remove grain texture - keep it clean */
html[data-theme="light"] body.luumtech-theme::after {
  display: none;
}

/* Light mode cards */
html[data-theme="light"] .panel_s,
html[data-theme="light"] .panel-glass {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: none !important;
  border-radius: 16px !important;
}

/* Light mode accent links */
html[data-theme="light"] a {
  color: #3b82f6;
}

html[data-theme="light"] a:hover {
  color: #2563eb;
}

/* Light mode summary hero */
html[data-theme="light"] .summary-hero-section {
  background: linear-gradient(135deg, #f5f7fa 0%, #edf2f7 100%);
}

/* Light mode KB cards */
html[data-theme="light"] .kb-category-card {
  background: #ffffff;
  box-shadow: none;
}

/* Light mode table headers */
html[data-theme="light"] .table>thead>tr>th {
  background: #f5f7fa !important;
  color: #374151 !important;
  border-bottom: 2px solid rgba(0, 0, 0, 0.06) !important;
  font-weight: 500 !important;
  font-size: 0.8rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

/* Light mode table body */
html[data-theme="light"] .table>tbody>tr>td {
  border-color: rgba(0, 0, 0, 0.04) !important;
}

html[data-theme="light"] .table>tbody>tr:hover>td {
  background: #f9fafb !important;
}

/* Light mode chart area */
html[data-theme="light"] .chart-container {
  padding: 20px 0;
}

html[data-theme="light"] .chart-filters .form-control {
  border-radius: 10px !important;
  font-size: 0.85rem;
}

/* Light mode dashboard greeting */
html[data-theme="light"] .dashboard-greeting {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.06) 0%, rgba(34, 211, 238, 0.06) 100%) !important;
  border-color: rgba(59, 130, 246, 0.12) !important;
}

/* ===========================================
   NEW STAT CARD SYSTEM (Dashboard-style)
   =========================================== */
.lg-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 16px;
  margin-bottom: 20px;
}

.lg-stat-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 20px 22px;
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  border-radius: 16px;
  text-decoration: none !important;
  color: var(--lg-text-primary) !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.lg-stat-card:hover {
  transform: translateY(-2px);
  box-shadow: none;
  border-color: var(--lg-accent);
  text-decoration: none !important;
  color: var(--lg-text-primary) !important;
}

.lg-stat-top {
  display: flex;
  align-items: center;
  gap: 10px;
}

.lg-stat-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.lg-stat-label {
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--lg-text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.lg-stat-number {
  font-size: 2rem;
  font-weight: 500;
  line-height: 1;
  color: var(--lg-text-primary);
  letter-spacing: -0.02em;
  font-variant-numeric: tabular-nums;
}

/* Light mode stat cards */
html[data-theme="light"] .lg-stat-card {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.06);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

html[data-theme="light"] .lg-stat-card:hover {
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.08);
  border-color: rgba(0, 0, 0, 0.1);
}

html[data-theme="light"] .lg-stat-label {
  color: #6b7280;
}

html[data-theme="light"] .lg-stat-number {
  color: #111827;
}

/* Dark mode stat cards */
html[data-theme="dark"] .lg-stat-card {
  background: var(--lg-bg-secondary);
  border-color: var(--lg-border);
}

html[data-theme="dark"] .lg-stat-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}

/* Responsive stat grid */
@media (max-width: 767px) {
  .lg-stat-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
  }

  .lg-stat-card {
    padding: 16px;
    gap: 12px;
  }

  .lg-stat-number {
    font-size: 1.5rem;
  }

  .lg-stat-icon {
    width: 32px;
    height: 32px;
    min-width: 32px;
  }

  .lg-stat-label {
    font-size: 0.78rem;
  }
}

@media (max-width: 479px) {
  .lg-stat-grid {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
}

/* ===========================================
   LIGHT MODE - REFINED OVERALL
   =========================================== */
/* Page content wrapper needs z-index above body::after */
html[data-theme="light"] .content_wrapper,
html[data-theme="light"] #wrapper,
html[data-theme="light"] .container {
  position: relative;
  z-index: 1;
}

/* Clean panel look */
html[data-theme="light"] .panel_s {
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: 16px !important;
}

/* Buttons in light mode */
html[data-theme="light"] .btn-default {
  border-color: rgba(0, 0, 0, 0.08) !important;
}

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

/* ===========================================
   LOGIN FORM - CONSISTENT FIELD SIZING
   =========================================== */
.login-card .form-group-glass .form-control,
.login-card .form-group-glass .glass-input,
.login-card .form-group .bootstrap-select>.dropdown-toggle {
  height: 46px !important;
  padding: 10px 16px !important;
  font-size: 0.875rem !important;
  font-weight: 400 !important;
  border-radius: 12px !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-tertiary) !important;
  color: var(--lg-text-primary) !important;
  box-shadow: none !important;
  line-height: 1.5 !important;
}

.login-card .form-group .bootstrap-select {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.login-card .form-group-glass .form-control:focus,
.login-card .form-group-glass .glass-input:focus {
  border-color: var(--lg-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--lg-accent-rgb), 0.1) !important;
}

/* Password eye icon - properly centered */
.login-card .password-toggle,
.form-group-glass .password-toggle {
  position: absolute !important;
  right: 14px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  background: none !important;
  border: none !important;
  padding: 4px !important;
  cursor: pointer !important;
  color: var(--lg-text-muted) !important;
  z-index: 10 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
}

.login-card .password-toggle:hover {
  color: var(--lg-text-primary) !important;
}

/* login label styling */
.login-card .control-label,
.login-card .floating-label {
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  color: var(--lg-text-secondary) !important;
  margin-bottom: 6px !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
}

/* ===========================================
   KB ARTICLE PAGE STYLING
   =========================================== */
.kb-article-page {
  padding: 0;
}

.kb-article-main {
  padding: 32px;
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  border-radius: 16px;
  margin-bottom: 24px;
}

.kb-article-breadcrumb {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 24px;
  font-size: 0.8rem;
  font-weight: 400;
  color: var(--lg-text-muted);
}

.kb-article-breadcrumb a {
  color: var(--lg-accent) !important;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 4px;
  font-weight: 500;
}

.kb-article-breadcrumb a:hover {
  color: var(--lg-accent-hover) !important;
}

.kb-breadcrumb-sep {
  color: var(--lg-text-muted);
  font-weight: 300;
}

.kb-breadcrumb-current {
  color: var(--lg-text-secondary);
  font-weight: 400;
}

.kb-article-title {
  font-size: 1.5rem !important;
  font-weight: 500 !important;
  color: var(--lg-text-primary) !important;
  margin: 0 0 24px 0 !important;
  line-height: 1.35 !important;
  letter-spacing: -0.02em;
}

.kb-article-body {
  color: var(--lg-text-secondary);
  font-size: 0.9rem;
  line-height: 1.75;
  font-weight: 400;
}

.kb-article-body h1,
.kb-article-body h2,
.kb-article-body h3,
.kb-article-body h4 {
  color: var(--lg-text-primary);
  margin-top: 28px;
  margin-bottom: 12px;
  font-weight: 500;
}

.kb-article-body p {
  margin-bottom: 16px;
  color: var(--lg-text-secondary);
}

.kb-article-body strong {
  color: var(--lg-text-primary);
  font-weight: 500;
}

.kb-article-body a {
  color: var(--lg-accent);
  font-weight: 500;
}

/* Useful feedback section */
.kb-useful-section {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--lg-border);
}

.kb-useful-inner {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: var(--lg-bg-tertiary);
  border-radius: 14px;
  border: 1px solid var(--lg-border);
}

.kb-useful-icon {
  width: 40px;
  height: 40px;
  min-width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(var(--lg-accent-rgb), 0.15) 0%, rgba(34, 211, 238, 0.1) 100%);
  border-radius: 10px;
  color: var(--lg-accent);
}

.kb-useful-text {
  flex: 1;
}

.kb-useful-question {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--lg-text-primary);
  display: block;
}

.kb-useful-buttons {
  display: flex !important;
  gap: 8px !important;
}

.kb-useful-btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 16px !important;
  border-radius: 10px !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
  color: var(--lg-text-secondary) !important;
  font-size: 0.8rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.kb-useful-yes:hover {
  background: rgba(34, 197, 94, 0.1) !important;
  border-color: #22c55e !important;
  color: #22c55e !important;
}

.kb-useful-no:hover {
  background: rgba(239, 68, 68, 0.1) !important;
  border-color: #ef4444 !important;
  color: #ef4444 !important;
}

/* Related articles sidebar */
.kb-related-section {
  background: var(--lg-bg-secondary);
  border: 1px solid var(--lg-border);
  border-radius: 16px;
  padding: 24px;
}

.kb-related-title {
  font-size: 0.95rem !important;
  font-weight: 500 !important;
  color: var(--lg-text-primary) !important;
  margin: 0 0 16px 0 !important;
  display: flex;
  align-items: center;
}

.kb-related-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.kb-related-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--lg-border);
  text-decoration: none !important;
  color: var(--lg-text-primary) !important;
  transition: all 0.2s ease;
}

.kb-related-item:hover {
  background: var(--lg-bg-tertiary);
  border-color: var(--lg-accent);
  color: var(--lg-text-primary) !important;
  text-decoration: none !important;
}

.kb-related-item-icon {
  width: 36px;
  height: 36px;
  min-width: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--lg-bg-tertiary);
  border-radius: 10px;
  color: var(--lg-accent);
}

.kb-related-item:hover .kb-related-item-icon {
  background: rgba(var(--lg-accent-rgb), 0.12);
}

.kb-related-item-content {
  flex: 1;
  min-width: 0;
}

.kb-related-item-title {
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--lg-text-primary);
  display: block;
  line-height: 1.3;
  margin-bottom: 2px;
}

.kb-related-item-preview {
  font-size: 0.72rem;
  font-weight: 400;
  color: var(--lg-text-muted);
  display: block;
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kb-related-arrow {
  flex-shrink: 0;
  color: var(--lg-text-muted);
  transition: transform 0.2s ease;
}

.kb-related-item:hover .kb-related-arrow {
  transform: translateX(3px);
  color: var(--lg-accent);
}

/* KB search hero icon alignment - inline with title */
.kb-search-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.kb-search-title .kb-search-icon-wrapper {
  width: 44px;
  height: 44px;
  margin: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

/* ===========================================
   ESTIMATE / INVOICE / PROPOSAL PAGE
   =========================================== */
.preview-top-wrapper {
  padding: var(--lg-space-lg);
}

.preview-top-wrapper .action-button {
  display: inline-block;
}

.preview-top-wrapper .btn.action-button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  font-size: var(--lg-font-size-sm);
  font-weight: 500;
  border-radius: 8px;
  border: 1px solid var(--lg-border);
  background: var(--lg-bg-elevated);
  color: var(--lg-text-primary);
  transition: var(--lg-transition);
  white-space: nowrap;
}

.preview-top-wrapper .btn.action-button:hover {
  background: var(--lg-glass-bg-light);
  border-color: var(--lg-accent);
  color: var(--lg-accent);
}

.preview-top-wrapper .btn.action-button.accept {
  background: var(--lg-accent);
  border-color: var(--lg-accent);
  color: #ffffff;
}

.preview-top-wrapper .btn.action-button.accept:hover {
  opacity: 0.9;
}

.preview-top-wrapper .btn.action-button.decline {
  border-color: #ef4444;
  color: #ef4444;
}

.preview-top-wrapper .btn.action-button.decline:hover {
  background: rgba(239, 68, 68, 0.1);
}

.estimate-html-logo img,
.invoice-html-logo img,
.proposal-html-logo img {
  max-height: 36px;
  max-width: 180px;
  width: auto;
}

/* Mobile Responsive - Estimate/Invoice/Proposal */
@media (max-width: 768px) {
  .preview-top-wrapper {
    padding: var(--lg-space-md);
  }

  .preview-top-wrapper .sm\:tw-flex {
    flex-direction: column !important;
    gap: 12px;
  }

  .preview-top-wrapper .tw-flex {
    flex-wrap: wrap;
    gap: 8px !important;
  }

  .preview-top-wrapper .btn.action-button {
    flex: 1;
    justify-content: center;
    min-width: 0;
    font-size: var(--lg-font-size-xs);
    padding: 8px 12px;
  }

  .preview-top-wrapper .action-button {
    flex: 1;
  }

  .preview-top-wrapper .action-button form {
    width: 100%;
  }

  .preview-top-wrapper .action-button form .btn {
    width: 100%;
  }

  .panel_s .col-md-10 {
    padding: 0 !important;
  }

  .panel_s .panel-body {
    padding: var(--lg-space-md) !important;
  }

  .transaction-html-info-col-left,
  .transaction-html-info-col-right {
    text-align: left !important;
  }

  .col-md-6.col-md-offset-6 {
    margin-left: 0 !important;
    width: 100% !important;
  }

  .table-responsive {
    margin: 0 -8px;
  }

  .estimate-html-number h4,
  .invoice-html-number h4 {
    font-size: var(--lg-font-size-lg) !important;
  }
}

/* ===========================================
   NAVBAR LANGUAGE DROPDOWN
   =========================================== */
.customers-nav-item-language {
  position: relative;
}

.nav-language-toggle {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 6px 12px !important;
  font-size: var(--lg-font-size-sm) !important;
  font-weight: 400 !important;
  color: var(--lg-text-secondary) !important;
  border-radius: var(--lg-radius-lg) !important;
  transition: var(--lg-transition-fast) !important;
}

.nav-language-toggle:hover {
  color: var(--lg-text-primary) !important;
  background: var(--lg-glass-bg-light) !important;
}

.nav-language-toggle .lang-name {
  font-size: var(--lg-font-size-sm);
}

.nav-language-toggle .dropdown-caret {
  opacity: 0.5;
}

.dropdown-menu-lang {
  background: var(--lg-bg-elevated) !important;
  border: 1px solid var(--lg-border) !important;
  border-radius: 8px !important;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15) !important;
  padding: 4px !important;
  min-width: 120px !important;
  margin-top: 4px !important;
}

.dropdown-menu-lang>li>a {
  padding: 8px 14px !important;
  font-size: var(--lg-font-size-sm) !important;
  color: var(--lg-text-secondary) !important;
  border-radius: 6px !important;
  transition: var(--lg-transition-fast) !important;
}

.dropdown-menu-lang>li>a:hover {
  background: var(--lg-glass-bg-light) !important;
  color: var(--lg-text-primary) !important;
}

.dropdown-menu-lang>li.active>a {
  background: rgba(var(--lg-accent-rgb), 0.1) !important;
  color: var(--lg-accent) !important;
  font-weight: 500;
}

/* ===========================================
   LOGIN PAGE - ADMIN STYLE OVERRIDES
   =========================================== */
/* Login page form controls */
.login-card .form-group {
  margin-bottom: 16px;
}

.login-card .control-label {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--lg-text-secondary);
  margin-bottom: 8px;
  display: block;
}

.login-card .form-control {
  height: 44px;
  padding: 10px 14px;
  font-size: 0.875rem;
  border-radius: 8px;
  border: 1px solid var(--lg-border);
  background: var(--lg-bg-tertiary);
  color: var(--lg-text-primary);
}

html[data-theme="light"] .login-card .form-control {
  background: #f9fafb;
  border-color: #d1d5db;
}

.login-card .form-control:focus {
  border-color: var(--lg-accent);
  box-shadow: 0 0 0 3px rgba(var(--lg-accent-rgb), 0.1);
  background: var(--lg-bg-elevated);
}

html[data-theme="light"] .login-card .form-control:focus {
  background: #ffffff;
}

/* Login button - block style */
.login-card .btn-block {
  width: 100%;
  display: block;
  padding: 12px;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 8px;
  position: relative;
}

.login-card .btn-primary {
  background: var(--lg-accent);
  border: none;
  color: #ffffff;
}

.login-card .btn-primary:hover {
  opacity: 0.9;
  box-shadow: 0 2px 8px rgba(var(--lg-accent-rgb), 0.3);
}

.login-card .btn-primary.loading .btn-text {
  visibility: hidden;
}

.login-card .btn-primary.loading .btn-loader {
  display: block;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.login-card .btn-loader {
  display: none;
}

/* Password toggle in admin-style */
.login-card .password-toggle {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: none;
  border: none;
  padding: 4px;
  cursor: pointer;
  color: var(--lg-text-muted);
  z-index: 10;
  display: flex;
  align-items: center;
}

.login-card .password-toggle:hover {
  color: var(--lg-text-primary);
}

/* Forgot link */
.login-card .forgot-link {
  font-size: 0.75rem;
  color: var(--lg-text-muted);
  text-decoration: none;
}

.login-card .forgot-link:hover {
  color: var(--lg-accent);
}

/* Checkbox inline */
.login-card .checkbox-inline label {
  font-size: 0.8125rem;
  color: var(--lg-text-secondary);
  font-weight: 400;
}

/* Login footer */
.login-footer {
  text-align: center;
  color: var(--lg-text-muted);
  font-size: 0.6875rem;
  padding: 16px 0;
}

/* ===========================================
   SWITCH TOGGLE (Checkbox → iOS-style Switch)
   =========================================== */
.switch-toggle {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  font-size: 0.8125rem;
  color: var(--lg-text-secondary);
  font-weight: 400;
  -webkit-user-select: none;
  user-select: none;
}

.switch-toggle input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.switch-toggle .switch-track {
  position: relative;
  width: 36px;
  height: 20px;
  background: var(--lg-border);
  border-radius: 310px;
  transition: background 0.2s ease;
  flex-shrink: 0;
}

html[data-theme="light"] .switch-toggle .switch-track {
  background: #d1d5db;
}

.switch-toggle .switch-thumb {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  background: #ffffff;
  border-radius: 50%;
  transition: transform 0.2s ease;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

.switch-toggle input[type="checkbox"]:checked+.switch-track {
  background: var(--lg-accent);
}

.switch-toggle input[type="checkbox"]:checked+.switch-track .switch-thumb {
  transform: translateX(16px);
}

.switch-toggle .switch-label {
  line-height: 1.4;
}

/* Profile page switches */
.checkbox input[type="checkbox"]+.switch-track,
.profile-switch .switch-track {
  position: relative;
  width: 36px;
  height: 20px;
  background: var(--lg-border);
  border-radius: 310px;
  transition: background 0.2s ease;
  flex-shrink: 0;
  display: inline-block;
  vertical-align: middle;
}

/* ===========================================
   MODERN ALERT NOTIFICATIONS
   =========================================== */
.alert {
  position: relative;
  border: none !important;
  border-radius: 16px !important;
  padding: 16px 20px 16px 56px !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin-bottom: 16px !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06) !important;
  line-height: 1.5 !important;
  overflow: hidden;
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.alert::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
}

.alert::after {
  content: '';
  position: absolute;
  left: 16px;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border-radius: 8px;
  background-size: 16px 16px;
  background-repeat: no-repeat;
  background-position: center;
}

.alert .close,
.alert [data-dismiss="alert"] {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.4;
  font-size: 0.875rem;
  font-weight: 400;
  color: inherit;
  text-shadow: none;
  padding: 4px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  transition: all 0.15s ease;
}

.alert .close:hover,
.alert [data-dismiss="alert"]:hover {
  opacity: 1;
  background: rgba(0, 0, 0, 0.06);
}

.alert-danger {
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.08), rgba(239, 68, 68, 0.03)) !important;
  color: #ef4444 !important;
}

.alert-danger::before {
  background: linear-gradient(to bottom, #ef4444, #f97316);
}

.alert-danger::after {
  background-color: rgba(239, 68, 68, 0.1);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ef4444' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='8' x2='12' y2='12'/%3E%3Cline x1='12' y1='16' x2='12.01' y2='16'/%3E%3C/svg%3E");
}

html[data-theme="light"] .alert-danger {
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.06), rgba(239, 68, 68, 0.02)) !important;
  color: #dc2626 !important;
  box-shadow: 0 4px 24px rgba(239, 68, 68, 0.08) !important;
}

.alert-success {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.08), rgba(34, 197, 94, 0.03)) !important;
  color: #22c55e !important;
}

.alert-success::before {
  background: linear-gradient(to bottom, #22c55e, #10b981);
}

.alert-success::after {
  background-color: rgba(34, 197, 94, 0.1);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2322c55e' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 11.08V12a10 10 0 1 1-5.93-9.14'/%3E%3Cpolyline points='22 4 12 14.01 9 11.01'/%3E%3C/svg%3E");
}

html[data-theme="light"] .alert-success {
  background: linear-gradient(135deg, rgba(34, 197, 94, 0.06), rgba(34, 197, 94, 0.02)) !important;
  color: #16a34a !important;
  box-shadow: 0 4px 24px rgba(34, 197, 94, 0.08) !important;
}

.alert-warning {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.08), rgba(245, 158, 11, 0.03)) !important;
  color: #f59e0b !important;
}

.alert-warning::before {
  background: linear-gradient(to bottom, #f59e0b, #eab308);
}

.alert-warning::after {
  background-color: rgba(245, 158, 11, 0.1);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f59e0b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'/%3E%3Cline x1='12' y1='9' x2='12' y2='13'/%3E%3Cline x1='12' y1='17' x2='12.01' y2='17'/%3E%3C/svg%3E");
}

html[data-theme="light"] .alert-warning {
  background: linear-gradient(135deg, rgba(245, 158, 11, 0.06), rgba(245, 158, 11, 0.02)) !important;
  color: #d97706 !important;
  box-shadow: 0 4px 24px rgba(245, 158, 11, 0.08) !important;
}

.alert-info {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.08), rgba(59, 130, 246, 0.03)) !important;
  color: #3b82f6 !important;
}

.alert-info::before {
  background: linear-gradient(to bottom, #3b82f6, #6366f1);
}

.alert-info::after {
  background-color: rgba(59, 130, 246, 0.1);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233b82f6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='10'/%3E%3Cline x1='12' y1='16' x2='12' y2='12'/%3E%3Cline x1='12' y1='8' x2='12.01' y2='8'/%3E%3C/svg%3E");
}

html[data-theme="light"] .alert-info {
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.06), rgba(59, 130, 246, 0.02)) !important;
  color: #2563eb !important;
  box-shadow: 0 4px 24px rgba(59, 130, 246, 0.08) !important;
}

/* Login page-specific overrides */
.login-card .form-control {
  border-radius: 310px !important;
}

.login-card .btn-block {
  border-radius: 310px !important;
}

/* Theme toggle spacing fix */
.customers-nav-item-theme-toggle {
  margin-right: 0 !important;
  padding-right: 0 !important;
}

.customers-nav-item-theme-toggle+li {
  margin-left: 0 !important;
}

/* Navbar language dropdown radius */
.dropdown-menu-lang {
  border-radius: 16px !important;
  max-height: 280px;
  overflow-y: auto;
  padding: 6px !important;
}

.dropdown-menu-lang::-webkit-scrollbar {
  width: 4px;
}

.dropdown-menu-lang::-webkit-scrollbar-track {
  background: transparent;
}

.dropdown-menu-lang::-webkit-scrollbar-thumb {
  background: var(--lg-border);
  border-radius: 4px;
}

.nav-language-toggle {
  border-radius: 310px !important;
}

/* Language flag emoji styling */
.lang-flag {
  font-size: 1.1em;
  line-height: 1;
  margin-right: 2px;
}

.dropdown-menu-lang .lang-flag {
  font-size: 1.2em;
  margin-right: 4px;
}

.dropdown-menu-lang li a {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 14px !important;
  font-size: 0.8125rem !important;
  color: var(--lg-text-primary) !important;
  transition: all 0.15s ease !important;
  border-radius: 10px !important;
  margin: 2px 0 !important;
}

.dropdown-menu-lang li a:hover {
  background: var(--lg-glass-bg-light) !important;
  transform: translateX(2px);
}

.dropdown-menu-lang li.active a {
  background: var(--lg-accent) !important;
  color: #ffffff !important;
}

/* ===========================================
   INPUT FOCUS TILT BORDER ANIMATION
   =========================================== */
.form-control-tilt-wrapper {
  position: relative;
  border-radius: inherit;
}

.form-control-tilt-wrapper::before {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: conic-gradient(from var(--tilt-angle, 0deg),
      transparent 0%,
      var(--lg-accent) 10%,
      #22d3ee 20%,
      transparent 30%);
  opacity: 0;
  transition: opacity 0.3s ease;
  z-index: 0;
  pointer-events: none;
}

.form-control-tilt-wrapper.active::before {
  opacity: 1;
  animation: tiltRotate 3s linear infinite;
}

.form-control-tilt-wrapper .form-control {
  position: relative;
  z-index: 1;
}

@keyframes tiltRotate {
  from {
    --tilt-angle: 0deg;
  }

  to {
    --tilt-angle: 360deg;
  }
}

@property --tilt-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

/* Pure CSS fallback: animated border on focus */
.form-control:focus {
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
  background-image: linear-gradient(var(--lg-bg-secondary), var(--lg-bg-secondary)),
    conic-gradient(from var(--tilt-angle, 0deg), var(--lg-accent), #22d3ee, #818cf8, var(--lg-accent)) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  border: 2px solid transparent !important;
  animation: tiltRotate 3s linear infinite;
}

html[data-theme="light"] .form-control:focus {
  background-image: linear-gradient(#ffffff, #ffffff),
    conic-gradient(from var(--tilt-angle, 0deg), #3b82f6, #22d3ee, #8b5cf6, #3b82f6) !important;
}

.login-card .form-control:focus {
  background-image: linear-gradient(var(--lg-bg-secondary), var(--lg-bg-secondary)),
    conic-gradient(from var(--tilt-angle, 0deg), var(--lg-accent), #22d3ee, #818cf8, var(--lg-accent)) !important;
  background-origin: border-box !important;
  background-clip: padding-box, border-box !important;
  border: 2px solid transparent !important;
}

html[data-theme="light"] .login-card .form-control:focus {
  background-image: linear-gradient(var(--lg-bg-secondary), var(--lg-bg-secondary)),
    conic-gradient(from var(--tilt-angle, 0deg), #3b82f6, #22d3ee, #8b5cf6, #3b82f6) !important;
}

/* ===========================================
   MOBILE RESPONSIVE - HAMBURGER MENU
   =========================================== */
@media (max-width: 768px) {
  .navbar-glass {
    border-radius: 310px !important;
    padding: 8px 16px !important;
  }

  .navbar-glass .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: nowrap;
  }

  .navbar-glass .navbar-header {
    display: flex;
    align-items: center;
    flex: 1;
    float: none;
  }

  .navbar-glass .navbar-brand {
    margin-right: auto !important;
  }

  /* Mobile top-right icons: language flag + dark mode + hamburger */
  .navbar-glass .mobile-icons {
    display: flex;
    align-items: center;
    gap: 4px;
  }

  /* Hide language text, show only flag on mobile */
  .navbar-glass .lang-name {
    display: none !important;
  }

  .navbar-glass .dropdown-caret {
    display: none !important;
  }

  .navbar-glass .nav-language-toggle {
    padding: 6px !important;
    min-width: auto !important;
  }

  /* Hamburger button */
  .navbar-glass .navbar-toggle {
    display: flex !important;
    align-items: center;
    justify-content: center;
    border: none !important;
    background: none !important;
    padding: 6px !important;
    margin: 0 !important;
    float: none !important;
    border-radius: 8px;
    color: var(--lg-text-primary);
  }

  .navbar-glass .navbar-toggle:hover,
  .navbar-glass .navbar-toggle:focus {
    background: var(--lg-glass-bg-light) !important;
  }

  .navbar-glass .navbar-toggle .menu-icon {
    stroke: var(--lg-text-primary);
  }

  /* Collapse menu */
  .navbar-glass .navbar-collapse {
    position: absolute;
    top: calc(100% + 8px);
    left: 8px;
    right: 8px;
    background: var(--lg-bg-secondary);
    border: 1px solid var(--lg-border);
    border-radius: 20px !important;
    padding: 12px !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
    -webkit-backdrop-filter: blur(40px);
    backdrop-filter: blur(40px);
    max-height: 70vh;
    overflow-y: auto;
  }

  .navbar-glass .navbar-collapse .navbar-nav {
    flex-direction: column !important;
    width: 100%;
    margin: 0 !important;
    float: none !important;
  }

  .navbar-glass .navbar-collapse .navbar-nav>li {
    width: 100%;
  }

  .navbar-glass .navbar-collapse .navbar-nav>li>a {
    padding: 12px 16px !important;
    border-radius: 12px !important;
    justify-content: flex-start !important;
  }

  .navbar-glass .navbar-collapse .navbar-nav>li.active>a {
    background: var(--lg-accent) !important;
    color: #fff !important;
  }

  /* Hide language & theme toggle from collapsed menu (they're in header) */
  .navbar-glass .navbar-collapse .customers-nav-item-language,
  .navbar-glass .navbar-collapse .customers-nav-item-theme-toggle {
    display: none !important;
  }

  /* Profile dropdown in mobile */
  .navbar-glass .navbar-collapse .customers-nav-item-profile>a {
    border-radius: 12px !important;
  }

  /* Show login button full width */
  .navbar-glass .navbar-collapse .customers-nav-item-login>a {
    text-align: center;
    border-radius: 12px !important;
  }
}

@media (min-width: 769px) {
  .navbar-glass .navbar-toggle {
    display: none !important;
  }
}

/* ===========================================
   LUUMTECH TAIL OVERRIDES (highest priority)
   =========================================== */
body.luumtech-theme address {
  font-style: normal !important;
}

body.luumtech-theme [class^="fa-"]::before,
body.luumtech-theme [class*=" fa-"]::before {
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
}

body.contract-view .luum-doc-actions .btn,
body.proposal-view .luum-doc-actions .btn,
body.viewestimate .luum-doc-actions .btn,
body.viewinvoice .luum-doc-actions .btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  min-height: 38px;
  padding: 9px 14px !important;
  border-radius: 11px !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
}

body.contract-view .luum-doc-logo .doc-brand-logo img,
body.proposal-view .luum-doc-logo .doc-brand-logo img,
body.viewestimate .luum-doc-logo .doc-brand-logo img,
body.viewinvoice .luum-doc-logo .doc-brand-logo img {
  max-height: 38px !important;
  width: auto !important;
}

body.contract-view .btn:focus,
body.contract-view .btn:active:focus,
body.proposal-view .btn:focus,
body.proposal-view .btn:active:focus,
body.viewestimate .btn:focus,
body.viewestimate .btn:active:focus,
body.viewinvoice .btn:focus,
body.viewinvoice .btn:active:focus,
body.contract-view .btn:focus-visible,
body.proposal-view .btn:focus-visible,
body.viewestimate .btn:focus-visible,
body.viewinvoice .btn:focus-visible {
  box-shadow: none !important;
  outline: none !important;
}

body.proposal-view .proposal-html-number {
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
}

body.proposal-view .proposal-html-number small,
body.proposal-view .proposal-html-subject {
  display: block;
  margin-top: 8px;
  font-size: 1.08rem !important;
  font-weight: 600 !important;
  color: var(--lg-text-secondary) !important;
}

body.viewinvoice .invoice-payment-pdf-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:hover,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:focus,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open>a.profile-dropdown-toggle,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile>a.profile-dropdown-toggle:hover {
  background: var(--lg-accent) !important;
  color: #fff !important;
}

html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open .profile-name,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open .dropdown-caret {
  color: #fff !important;
}

html[data-theme="dark"] .navbar-glass {
  background: rgba(10, 12, 18, 0.55) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

.aw-stat-section {
  padding: 18px 0 !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
}

.aw-stat-section-header,
.aw-stat-grid,
.aw-stat-grid-4,
.aw-stat-grid-5 {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

.aw-stat-section-title,
.contracts-summary-heading,
.section-heading-contracts {
  font-weight: 500 !important;
}

html[data-theme="light"] .aw-stat-section {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] .aw-stat-card::before {
  background: rgba(255, 255, 255, 0.24) !important;
}

.profile-edit-form .email-notification-checkboxes .profile-switch {
  width: 100%;
  margin-bottom: 12px;
}

.profile-edit-form .email-notification-checkboxes .switch-track {
  width: 42px;
  height: 24px;
  border-radius: 12px;
}

.profile-edit-form .email-notification-checkboxes .switch-thumb {
  width: 18px;
  height: 18px;
  top: 3px;
  left: 3px;
}

.profile-edit-form .email-notification-checkboxes input[type="checkbox"]:checked+.switch-track .switch-thumb {
  transform: translateX(18px);
}

.project-page .panel_s {
  border-radius: 16px !important;
  overflow: hidden;
}

.project-page .new-task,
.project-page .new-task-btn {
  padding: 8px 14px !important;
  border-radius: 12px !important;
  font-size: 0.82rem !important;
}

.project-page .horizontal-scrollable-tabs {
  border: 1px solid var(--lg-border) !important;
  border-radius: 14px !important;
  padding: 4px !important;
  background: var(--lg-bg-secondary) !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li>a {
  border: 0 !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  font-size: 0.84rem !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a,
.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:hover {
  background: rgba(var(--lg-accent-rgb), 0.16) !important;
  color: var(--lg-accent) !important;
}

@media (max-width: 767px) {

  .aw-stat-section-header,
  .aw-stat-grid,
  .aw-stat-grid-4,
  .aw-stat-grid-5 {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  body.contract-view .luum-doc-actions .btn,
  body.proposal-view .luum-doc-actions .btn,
  body.viewestimate .luum-doc-actions .btn,
  body.viewinvoice .luum-doc-actions .btn {
    width: 100%;
  }
}

/* ===========================================
   LUUMTECH FINAL OVERRIDES
   =========================================== */

/* Keep document addresses from rendering italic in portal pages */
body.luumtech-theme address {
  font-style: normal;
}

/* Font Awesome fallback for legacy aliases like fa-file-alt/fa-file-text */
body.luumtech-theme [class^="fa-"]::before,
body.luumtech-theme [class*=" fa-"]::before {
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
}

/* Shared public document template (contract / estimate / proposal / invoice) */
body.contract-view .preview-top-wrapper,
body.proposal-view .preview-top-wrapper,
body.viewestimate .preview-top-wrapper,
body.viewinvoice .preview-top-wrapper {
  margin-top: 6px;
}

body.contract-view .luum-doc-logo .doc-brand-logo img,
body.proposal-view .luum-doc-logo .doc-brand-logo img,
body.viewestimate .luum-doc-logo .doc-brand-logo img,
body.viewinvoice .luum-doc-logo .doc-brand-logo img,
body.contract-view .luum-doc-logo img,
body.proposal-view .luum-doc-logo img,
body.viewestimate .luum-doc-logo img,
body.viewinvoice .luum-doc-logo img {
  max-height: 38px !important;
  width: auto !important;
}

body.contract-view .luum-doc-actions,
body.proposal-view .luum-doc-actions,
body.viewestimate .luum-doc-actions,
body.viewinvoice .luum-doc-actions {
  gap: 8px !important;
  align-items: center !important;
  flex-wrap: wrap;
}

body.contract-view .luum-doc-actions form,
body.proposal-view .luum-doc-actions form,
body.viewestimate .luum-doc-actions form,
body.viewinvoice .luum-doc-actions form {
  margin: 0;
}

body.contract-view .luum-doc-actions .btn,
body.proposal-view .luum-doc-actions .btn,
body.viewestimate .luum-doc-actions .btn,
body.viewinvoice .luum-doc-actions .btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px;
  min-height: 38px;
  padding: 9px 14px !important;
  border-radius: 11px !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
  line-height: 1.2;
}

body.contract-view .btn:focus,
body.contract-view .btn:active:focus,
body.proposal-view .btn:focus,
body.proposal-view .btn:active:focus,
body.viewestimate .btn:focus,
body.viewestimate .btn:active:focus,
body.viewinvoice .btn:focus,
body.viewinvoice .btn:active:focus,
body.contract-view .btn:focus-visible,
body.proposal-view .btn:focus-visible,
body.viewestimate .btn:focus-visible,
body.viewinvoice .btn:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

body.proposal-view .proposal-html-number {
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
}

body.proposal-view .proposal-html-number small,
body.proposal-view .proposal-html-subject {
  display: block;
  margin-top: 8px;
  font-size: 1.08rem !important;
  font-weight: 600 !important;
  color: var(--lg-text-secondary) !important;
  white-space: normal;
}

body.contract-view .contract-html-subject,
body.viewestimate .transaction-html-info-col-left .estimate-html-number,
body.viewinvoice .transaction-html-info-col-left .invoice-html-number {
  font-size: 1.55rem !important;
  font-weight: 700 !important;
  line-height: 1.15 !important;
}

body.contract-view .panel_s,
body.proposal-view .panel_s,
body.viewestimate .panel_s,
body.viewinvoice .panel_s {
  border-radius: 16px !important;
  overflow: hidden;
}

body.contract-view .proposal-tab-icon,
body.proposal-view .proposal-tab-icon {
  width: 15px;
  height: 15px;
  margin-right: 6px;
  vertical-align: -2px;
}

body.viewinvoice .invoice-payment-pdf-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

body.viewinvoice .invoice-payment-pdf-btn svg {
  width: 15px;
  height: 15px;
}

/* Navbar active profile item should match bottom bar active color in dark mode */
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:hover,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:focus,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open>a.profile-dropdown-toggle,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile>a.profile-dropdown-toggle:hover,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile>a.profile-dropdown-toggle:focus {
  background: var(--lg-accent) !important;
  color: #ffffff !important;
  border-color: transparent !important;
}

html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open .profile-name,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open .dropdown-caret {
  color: #ffffff !important;
}

/* Better dark navbar separation */
html[data-theme="dark"] .navbar-glass {
  background: rgba(10, 12, 18, 0.55) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

/* Stats sections: align with panels and improve light mode visibility */
.aw-stat-section {
  padding: 18px 0 !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
}

.aw-stat-section-header,
.aw-stat-grid,
.aw-stat-grid-4,
.aw-stat-grid-5 {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

.aw-stat-section-title,
.contracts-summary-heading,
.section-heading-contracts {
  font-weight: 500 !important;
}

html[data-theme="light"] .aw-stat-section {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="light"] .aw-stat-card::before {
  background: rgba(255, 255, 255, 0.24) !important;
}

/* Profile page notification switches */
.profile-edit-form .email-notification-checkboxes .profile-switch {
  width: 100%;
  margin-bottom: 12px;
}

.profile-edit-form .email-notification-checkboxes .switch-track {
  width: 42px;
  height: 24px;
  border-radius: 12px;
  background: var(--lg-border);
}

.profile-edit-form .email-notification-checkboxes .switch-thumb {
  width: 18px;
  height: 18px;
  top: 3px;
  left: 3px;
}

.profile-edit-form .email-notification-checkboxes input[type="checkbox"]:checked+.switch-track .switch-thumb {
  transform: translateX(18px);
}

.profile-edit-form .email-notification-checkboxes .switch-label {
  color: var(--lg-text-primary);
  font-weight: 500;
}

/* Project overview page redesign polish */
.project-page .panel_s {
  border-radius: 16px !important;
  overflow: hidden;
}

.project-page .new-task,
.project-page .new-task-btn {
  padding: 8px 14px !important;
  border-radius: 12px !important;
  font-size: 0.82rem !important;
  line-height: 1.15 !important;
}

.project-page .horizontal-scrollable-tabs {
  border: 1px solid var(--lg-border) !important;
  border-radius: 14px !important;
  padding: 4px !important;
  background: var(--lg-bg-secondary) !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs {
  border-bottom: 0 !important;
  gap: 4px;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li>a {
  border: 0 !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  font-size: 0.84rem !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a,
.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:hover {
  background: rgba(var(--lg-accent-rgb), 0.16) !important;
  color: var(--lg-accent) !important;
}

.project-page .tw-rounded-md.tw-border.tw-border-solid.tw-border-neutral-100.tw-bg-neutral-50 {
  border-color: var(--lg-border) !important;
  border-radius: 14px !important;
}

html[data-theme="dark"] .project-page .panel_s,
html[data-theme="dark"] .project-page .horizontal-scrollable-tabs {
  background: #16181d !important;
  border-color: rgba(255, 255, 255, 0.09) !important;
}

@media (max-width: 767px) {

  .aw-stat-section-header,
  .aw-stat-grid,
  .aw-stat-grid-4,
  .aw-stat-grid-5 {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  body.contract-view .luum-doc-actions .btn,
  body.proposal-view .luum-doc-actions .btn,
  body.viewestimate .luum-doc-actions .btn,
  body.viewinvoice .luum-doc-actions .btn {
    width: 100%;
  }
}

/* ===========================================
   DASHBOARD GLASS CARDS & FIXES (v2)
   =========================================== */

/* --- Glass Card Grid --- */
.lg-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
}

.lg-stat-grid-row {
  grid-template-columns: repeat(auto-fit, minmax(0, 1fr)) !important;
}

.lg-glass-card {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 140px;
  border-radius: 22px;
  overflow: hidden;
  text-decoration: none !important;
  background-size: cover !important;
  background-position: center !important;
  transition: all 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.lg-glass-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.14);
}

/* Content with frosted glass — NOT full-card overlay */
.lg-glass-content {
  position: relative;
  z-index: 2;
  padding: 14px 18px;
  margin: 12px;
  width: calc(100% - 24px);
  border-radius: 14px;
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  background: rgba(255, 255, 255, 0.45);
  border: 1px solid rgba(255, 255, 255, 0.35);
}

/* Dark mode: dark frosted glass */
html[data-theme="dark"] .lg-glass-content {
  background: rgba(0, 0, 0, 0.4);
  border-color: rgba(255, 255, 255, 0.08);
}

/* Light mode: dark text for readability */
.lg-glass-label {
  display: block;
  font-size: 0.95rem;
  font-weight: 600;
  color: #1a1a2e;
  margin-bottom: 2px;
  text-shadow: 0 1px 4px rgba(255, 255, 255, 0.3);
}

.lg-glass-count {
  display: block;
  font-size: 0.82rem;
  color: rgba(30, 30, 60, 0.6);
  font-weight: 500;
}

/* Dark mode: white text */
html[data-theme="dark"] .lg-glass-label {
  color: #ffffff;
  text-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
}

html[data-theme="dark"] .lg-glass-count {
  color: rgba(255, 255, 255, 0.55);
}

/* ═══════════════════════════════════════
   APPLE WIDGET STAT CARDS (aw-stat-*)
   Summary section redesign — Projects, Invoices, Estimates
   ═══════════════════════════════════════ */

/* Wrapper section — dark rounded container */
.aw-stat-section {
  background: #1c1c1e;
  border-radius: 22px;
  padding: 20px 16px;
  margin-bottom: 24px;
}

html[data-theme="light"] .aw-stat-section {
  background: #f2f2f7;
}

.aw-stat-section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding: 0;
}

.aw-stat-section-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: -0.01em;
}

html[data-theme="light"] .aw-stat-section-title {
  color: #1a1a2e;
}

.aw-stat-section-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.12);
  color: #ffffff !important;
  font-size: 0.78rem;
  font-weight: 600;
  text-decoration: none !important;
  transition: background 0.2s;
  border: 1px solid rgba(255, 255, 255, 0.08);
}

.aw-stat-section-btn:hover {
  background: rgba(255, 255, 255, 0.2);
}

html[data-theme="light"] .aw-stat-section-btn {
  background: rgba(0, 0, 0, 0.08);
  color: #1a1a2e !important;
  border-color: rgba(0, 0, 0, 0.1);
}

html[data-theme="light"] .aw-stat-section-btn:hover {
  background: rgba(0, 0, 0, 0.14);
}

.aw-stat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
}

/* Force 4-column layout for pages with exactly 4 cards */
.aw-stat-grid-4 {
  grid-template-columns: repeat(4, 1fr);
}

/* Force 5-column layout */
.aw-stat-grid-5 {
  grid-template-columns: repeat(5, 1fr);
}

@media (max-width: 991px) {

  .aw-stat-grid-4,
  .aw-stat-grid-5 {
    grid-template-columns: repeat(2, 1fr);
  }

  .aw-stat-section {
    padding: 16px;
  }
}

@media (max-width: 575px) {

  .aw-stat-grid,
  .aw-stat-grid-4,
  .aw-stat-grid-5 {
    grid-template-columns: 1fr;
  }

  .aw-stat-section {
    padding: 12px;
    border-radius: 16px;
  }

  .aw-stat-section-header {
    flex-direction: column;
    gap: 10px;
    align-items: flex-start;
  }
}

/* Match panel_s radius below stat sections */
.aw-stat-section+.panel_s,
.aw-stat-section~.panel_s {
  border-radius: 22px !important;
  overflow: hidden;
}

@media (max-width: 575px) {

  .aw-stat-section+.panel_s,
  .aw-stat-section~.panel_s {
    border-radius: 16px !important;
  }
}

.aw-stat-card {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 20px;
  border-radius: 20px;
  background-size: cover !important;
  background-position: center !important;
  border-top: none;
  text-decoration: none !important;
  color: #ffffff !important;
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1),
    box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  animation: awStatUp 0.5s cubic-bezier(0.4, 0, 0.2, 1) both;
  overflow: hidden;
  min-height: 160px;
}

/* Frosted glass overlay */
.aw-stat-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 20px;
  background: rgba(0, 0, 0, 0.25);
  -webkit-backdrop-filter: blur(6px) saturate(160%);
  backdrop-filter: blur(6px) saturate(160%);
  z-index: 1;
  transition: background 0.3s;
}

.aw-stat-card:hover::before {
  background: rgba(0, 0, 0, 0.35);
}

/* All content above the blur */
.aw-stat-header,
.aw-stat-body,
.aw-stat-bar {
  position: relative;
  z-index: 2;
}

.aw-stat-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2);
}

/* Staggered entrance */
.aw-stat-card:nth-child(1) {
  animation-delay: 0s;
}

.aw-stat-card:nth-child(2) {
  animation-delay: 0.06s;
}

.aw-stat-card:nth-child(3) {
  animation-delay: 0.12s;
}

.aw-stat-card:nth-child(4) {
  animation-delay: 0.18s;
}

.aw-stat-card:nth-child(5) {
  animation-delay: 0.24s;
}

@keyframes awStatUp {
  from {
    opacity: 0;
    transform: translateY(14px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Header row: icon + label */
.aw-stat-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}

.aw-stat-icon {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  background: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

.aw-stat-label {
  font-size: 0.82rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  line-height: 1.2;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
}



/* Center: ring + number */
.aw-stat-body {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 1;
}

.aw-stat-ring-wrap {
  position: relative;
  width: 54px;
  height: 54px;
  flex-shrink: 0;
}

.aw-stat-ring-wrap canvas {
  width: 54px !important;
  height: 54px !important;
}

.aw-stat-vals {
  flex: 1;
  min-width: 0;
}

.aw-stat-num {
  font-family: 'Plus Jakarta Sans', 'SF Pro Display', -apple-system, system-ui, sans-serif;
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
  color: #ffffff;
  letter-spacing: -0.03em;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}



.aw-stat-sub {
  font-size: 0.72rem;
  color: rgba(255, 255, 255, 0.65);
  font-weight: 500;
  margin-top: 3px;
  display: block;
}



/* Footer: micro progress bar */
.aw-stat-bar {
  margin-top: 14px;
  height: 4px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.15);
  overflow: hidden;
}

.aw-stat-bar-fill {
  height: 100%;
  border-radius: 4px;
  width: 0%;
  transition: width 1.2s cubic-bezier(0.4, 0, 0.2, 1);
  background: rgba(255, 255, 255, 0.7) !important;
}

/* Responsive */
@media (max-width: 767px) {
  .aw-stat-grid {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .aw-stat-card {
    padding: 14px;
  }

  .aw-stat-num {
    font-size: 1.6rem;
  }
}

/* --- Fix Year Select Double Border --- */
.dash-chart-card .form-group {
  margin-bottom: 0;
}

.dash-chart-card .form-group .bootstrap-select {
  border: none !important;
  background: transparent !important;
}

.dash-chart-card .form-group .bootstrap-select>.dropdown-toggle {
  border: 1px solid var(--lg-border) !important;
  border-radius: 14px !important;
  padding: 10px 16px !important;
  background: var(--lg-bg-tertiary) !important;
  box-shadow: none !important;
}

/* --- Navbar Logo Size (smaller) --- */
.navbar-glass .navbar-brand img {
  height: 26px;
  width: auto;
}

/* --- Light mode: panels match glass style --- */
html[data-theme="light"] .panel-heading,
html[data-theme="light"] .panel-default>.panel-heading {
  background: var(--lg-bg-secondary) !important;
  border-color: var(--lg-border) !important;
  color: var(--lg-text-primary) !important;
}

html[data-theme="light"] .panel,
html[data-theme="light"] .panel-default {
  border-color: var(--lg-border) !important;
}

html[data-theme="light"] .panel-heading h4,
html[data-theme="light"] .panel-heading .panel-title {
  color: var(--lg-text-primary) !important;
}

/* ===========================================
   CONTRACT PAGE FIXES
   =========================================== */

/* Fix: Tab icons not showing on contract page */
.contract-tabs .nav-tabs>li>a i,
.contract-tab-icons i,
.nav-tabs>li>a>.fa,
.nav-tabs>li>a>.glyphicon,
.nav-tabs>li>a>i {
  display: inline-block !important;
  margin-right: 6px;
  font-size: 14px;
  color: currentColor;
}

/* Contract title bigger */
.contract-heading h1,
.contract-heading .contract-subject,
#contract-preview h1,
.contract-info h2,
.col-md-8 h4.bold {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
}

/* ===========================================
   PROPOSAL PAGE FIXES
   =========================================== */

/* Fix: Proposal action buttons cleaner */
.proposal-top-actions .btn,
.viewproposal-actions .btn,
#proposal-action-buttons .btn,
#proposal-wrapper .action-button {
  padding: 8px 14px !important;
  font-size: 0.84rem !important;
  border-radius: 10px !important;
}

#proposal-wrapper .action-button .proposal-action-icon {
  width: 14px;
  height: 14px;
  margin-right: 6px;
  vertical-align: -2px;
}

#proposal-wrapper .go-to-portal {
  display: inline-flex !important;
  align-items: center !important;
}

/* Proposal title bigger */
.proposal-heading h1,
.proposal-heading h2,
.proposal-info h1,
.proposal-info h2,
.proposal-header-title,
#proposal-wrapper .proposal-html-number {
  font-size: 1.75rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
}

#proposal-wrapper .proposal-html-subject {
  display: block;
  margin-top: 8px;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  line-height: 1.35;
  color: var(--lg-text-secondary);
  white-space: normal;
}

#proposal-wrapper .proposal-html-tabs .nav-tabs>li>a .proposal-tab-icon {
  width: 15px;
  height: 15px;
  margin-right: 6px;
  vertical-align: -2px;
}

/* Proposal logo smaller */
.proposal-logo img,
.contract-logo img,
.proposal-html-logo img {
  max-height: 36px !important;
  width: auto !important;
}

/* ===========================================
   PROJECT PAGE FIXES
   =========================================== */

/* Fix: Project page icons not showing */
.project-page .nav-tabs>li>a i,
.project-page .nav-tabs>li>a .fa,
.project-page .nav-tabs .glyphicon,
.project-heading .nav-tabs>li>a i,
.project-tabs .nav-tabs>li>a i,
#project_tabs>li>a i,
.project-tab i {
  display: inline-block !important;
  margin-right: 4px;
  font-size: 13px;
  color: var(--lg-text-muted);
}

/* Fix: "Yeni Görev" button too big */
.project-heading .btn-success,
.btn.add-task-btn,
#new_task_btn,
a[href*="new_task"] .btn-success,
.project-page .btn-success.btn-lg,
.project-page .new-task-btn {
  padding: 8px 18px !important;
  font-size: 0.85rem !important;
  border-radius: 12px !important;
}

/* Fix: Progress bar design */
.project-page .progress,
.project-overview .progress {
  height: 8px;
  border-radius: 10px;
  background: var(--lg-bg-tertiary);
  overflow: hidden;
  box-shadow: none;
}

.project-page .progress-bar,
.project-overview .progress-bar {
  border-radius: 10px;
  background: linear-gradient(90deg, var(--lg-accent), #60a5fa);
  box-shadow: none;
  transition: width 0.6s ease;
}

/* Fix: Project overview list icons */
.project-overview-left i,
.project-info-label i {
  display: inline-block !important;
  width: 16px;
  text-align: center;
  margin-right: 6px;
  color: var(--lg-accent);
}

/* ===========================================
   PROFILE PAGE: CHECKBOXES → SWITCHES
   =========================================== */

/* Profile page toggle switches (like login) */
.profile-edit-form .checkbox input[type="checkbox"],
.client-profile .checkbox input[type="checkbox"],
#profile_settings input[type="checkbox"] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 40px;
  height: 22px;
  background-color: var(--lg-border, #d1d5db);
  background-image: radial-gradient(circle at 12px 11px, #ffffff 7px, transparent 7px);
  background-repeat: no-repeat;
  border: none;
  border-radius: 310px;
  position: relative;
  cursor: pointer;
  transition: background-color 0.25s ease;
  margin: 0;
  vertical-align: middle;
  box-shadow: none;
}

.profile-edit-form .checkbox input[type="checkbox"]::before,
.client-profile .checkbox input[type="checkbox"]::before,
#profile_settings input[type="checkbox"]::before {
  display: none;
}

.profile-edit-form .checkbox input[type="checkbox"]:checked,
.client-profile .checkbox input[type="checkbox"]:checked,
#profile_settings input[type="checkbox"]:checked {
  background-color: var(--lg-accent);
  background-image: radial-gradient(circle at 28px 11px, #ffffff 7px, transparent 7px);
  border-color: var(--lg-accent);
}

.profile-edit-form .checkbox input[type="checkbox"]:checked::before,
.client-profile .checkbox input[type="checkbox"]:checked::before,
#profile_settings input[type="checkbox"]:checked::before {
  display: none;
}

/* --- Responsive Glass Cards --- */
@media (max-width: 767px) {
  .lg-stat-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .lg-stat-grid-row {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  .lg-glass-card {
    min-height: 110px;
  }

  .lg-glass-content {
    padding: 10px 14px;
    margin: 8px;
    width: calc(100% - 16px);
  }

  .lg-glass-label {
    font-size: 0.85rem;
  }
}

/* ===========================================
   NAVBAR & FOOTER FONT SIZE OVERRIDES
   =========================================== */

/* Navbar menu items — bigger font */
.navbar-glass .navbar-nav>li>a {
  font-size: 0.875rem !important;
  /* 14px instead of 12px */
  padding: 9px 16px !important;
}

.navbar-glass .navbar-nav>li>a i {
  font-size: 0.875rem;
}

/* Profile dropdown items — bigger */
.dropdown-menu-glass>li>a {
  font-size: 0.875rem !important;
  padding: 10px 20px !important;
}

/* Footer — bigger font */
.glass-footer .copyright-footer {
  font-size: 0.8125rem !important;
  /* 13px */
}

.glass-footer a {
  font-size: 0.8125rem;
}

/* ===========================================
   LOGO FALLBACK TEXT
   =========================================== */
.navbar-brand-text {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--lg-text-primary);
  letter-spacing: -0.02em;
  text-decoration: none !important;
}

html[data-theme="dark"] .navbar-brand-text {
  color: #ffffff;
}

/* Hide/show theme toggle icons based on theme (scoped to avoid overriding brand-logo) */
.theme-toggle-icon.show-dark {
  display: none !important;
}

.theme-toggle-icon.show-light {
  display: inline-flex !important;
}

html[data-theme="dark"] .theme-toggle-icon.show-dark {
  display: inline-flex !important;
}

html[data-theme="dark"] .theme-toggle-icon.show-light {
  display: none !important;
}

/* ===========================================
   NAVBAR/BOTTOM BAR REWORK (Desktop + Mobile)
   =========================================== */

/* Keep mobile controls hidden on desktop */
.navbar-glass .mobile-icons {
  display: none;
}

/* Desktop navbar: give more room and tighter spacing */
.navbar-glass {
  width: auto !important;
  max-width: calc(100% - 16px) !important;
  display: inline-flex !important;
}

.navbar-glass .container {
  gap: 8px;
}

.navbar-glass .navbar-collapse {
  flex: 0 0 auto;
  min-width: 0;
  margin-left: 0 !important;
  display: flex !important;
  align-items: center !important;
}

.navbar-glass .navbar-brand {
  margin-right: 6px !important;
}

.navbar-glass .navbar-brand img {
  height: 24px;
}

.navbar-glass .navbar-nav {
  gap: 2px;
}

.navbar-glass .navbar-nav.navbar-right {
  float: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.navbar-glass .navbar-nav>li {
  flex-shrink: 0;
}

.navbar-glass .navbar-nav>li>a {
  font-size: 0.84rem !important;
  padding: 8px 10px !important;
}

.navbar-glass .profile-name {
  max-width: 96px;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Language switch: flag-only and theme-toggle style */
.navbar-glass .nav-language-toggle {
  width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: var(--lg-glass-bg) !important;
  border: 1px solid var(--lg-border) !important;
}

.navbar-glass .nav-language-toggle .lang-name,
.navbar-glass .nav-language-toggle .dropdown-caret {
  display: none !important;
}

.navbar-glass .nav-language-toggle .lang-flag {
  margin-right: 0 !important;
  font-size: 1rem;
  line-height: 1;
}

.navbar-glass .nav-language-toggle:hover,
.navbar-glass .customers-nav-item-language.open .nav-language-toggle {
  background: var(--lg-glass-bg-light) !important;
  border-color: var(--lg-accent) !important;
  color: var(--lg-text-primary) !important;
}

/* Bottom bar color fix (remove blue link look) */
.bottom-bar-item,
.bottom-bar-item:visited {
  color: var(--lg-text-secondary) !important;
}

.bottom-bar-item:hover,
.bottom-bar-item:focus {
  color: var(--lg-text-primary) !important;
  background: var(--lg-glass-bg-light) !important;
}

.bottom-bar-item.active,
.bottom-bar-item.active:visited,
.bottom-bar-item.active:hover,
.bottom-bar-item.active:focus {
  color: #ffffff !important;
  background: var(--lg-accent) !important;
}

/* Mobile layout */
@media (max-width: 768px) {
  .navbar-glass {
    width: calc(100% - 16px) !important;
    left: 8px !important;
    transform: none !important;
    max-width: none !important;
    border-radius: 22px !important;
    padding: 8px 10px !important;
  }

  .navbar-glass .container {
    width: 100% !important;
  }

  .navbar-glass .navbar-header {
    width: 100%;
    flex: 1;
    justify-content: space-between;
  }

  .navbar-glass .navbar-brand {
    margin-right: 0 !important;
    padding-right: 8px !important;
  }

  .navbar-glass .navbar-brand img {
    height: 22px;
  }

  .navbar-glass .mobile-icons {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
  }

  .navbar-glass .mobile-icons .nav-language-toggle,
  .navbar-glass .mobile-icons .theme-toggle,
  .navbar-glass .mobile-icons .navbar-toggle {
    width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    border-radius: 50% !important;
  }

  .navbar-glass .mobile-icons .theme-toggle {
    margin: 0;
  }

  .navbar-glass .mobile-icons .navbar-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--lg-border) !important;
    background: var(--lg-glass-bg) !important;
    color: var(--lg-text-primary) !important;
    float: none !important;
    margin: 0 !important;
  }

  .navbar-glass .mobile-icons .navbar-toggle .menu-icon {
    width: 18px;
    height: 18px;
    stroke-width: 1.4;
  }

  .navbar-glass .mobile-icons .navbar-toggle:hover,
  .navbar-glass .mobile-icons .navbar-toggle:focus {
    background: var(--lg-glass-bg-light) !important;
    border-color: var(--lg-accent) !important;
  }

  .navbar-glass .mobile-language-dropdown .dropdown-menu-lang {
    left: auto !important;
    right: 0 !important;
    min-width: 170px !important;
  }

  /* Hide desktop language/theme entries inside collapsed list */
  .navbar-glass .navbar-collapse .customers-nav-item-language,
  .navbar-glass .navbar-collapse .customers-nav-item-theme-toggle {
    display: none !important;
  }

  /* Bottom bar: label below icon */
  .bottom-bar {
    width: calc(100% - 16px);
    max-width: none;
    left: 8px;
    transform: none;
    bottom: 8px;
    border-radius: 18px;
    padding: 6px 4px;
    justify-content: space-around;
    gap: 0;
  }

  .bottom-bar-item {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    min-width: 0;
    padding: 6px 4px;
    border-radius: 10px;
    flex: 1 1 0;
  }

  .bottom-bar-icon {
    width: 18px;
    height: 18px;
  }

  .bottom-bar-label {
    display: block;
    font-size: 0.68rem;
    line-height: 1.05;
    text-align: center;
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  body.has-bottom-bar {
    padding-bottom: 94px;
  }
}

@media (min-width: 769px) {
  .navbar-glass .navbar-toggle {
    display: none !important;
  }
}

/* ===========================================
   FINAL END-OF-FILE OVERRIDES
   =========================================== */
body.luumtech-theme address {
  font-style: normal !important;
}

body.luumtech-theme [class^="fa-"]::before,
body.luumtech-theme [class*=" fa-"]::before {
  font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
}

body.contract-view .luum-doc-actions .btn,
body.proposal-view .luum-doc-actions .btn,
body.viewestimate .luum-doc-actions .btn,
body.viewinvoice .luum-doc-actions .btn {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  min-height: 38px;
  padding: 9px 14px !important;
  border-radius: 11px !important;
  font-size: 0.82rem !important;
  font-weight: 500 !important;
}

body.contract-view .btn:focus,
body.contract-view .btn:active:focus,
body.proposal-view .btn:focus,
body.proposal-view .btn:active:focus,
body.viewestimate .btn:focus,
body.viewestimate .btn:active:focus,
body.viewinvoice .btn:focus,
body.viewinvoice .btn:active:focus,
body.contract-view .btn:focus-visible,
body.proposal-view .btn:focus-visible,
body.viewestimate .btn:focus-visible,
body.viewinvoice .btn:focus-visible {
  box-shadow: none !important;
  outline: none !important;
}

body.proposal-view .proposal-html-number {
  font-size: 2rem !important;
  font-weight: 700 !important;
  line-height: 1.12 !important;
}

body.proposal-view .proposal-html-number small,
body.proposal-view .proposal-html-subject {
  display: block;
  margin-top: 8px;
  font-size: 1.08rem !important;
  font-weight: 600 !important;
  color: var(--lg-text-secondary) !important;
}

body.viewinvoice .invoice-payment-pdf-btn {
  width: 34px;
  height: 34px;
  border-radius: 10px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:hover,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:focus,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open>a.profile-dropdown-toggle,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile>a.profile-dropdown-toggle:hover {
  background: var(--lg-accent) !important;
  color: #fff !important;
}

html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open .profile-name,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open .dropdown-caret {
  color: #fff !important;
}

.aw-stat-section {
  padding: 18px 0 !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
}

.aw-stat-section-header,
.aw-stat-grid,
.aw-stat-grid-4,
.aw-stat-grid-5 {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

.aw-stat-section-title,
.contracts-summary-heading,
.section-heading-contracts {
  font-weight: 500 !important;
}

html[data-theme="light"] .aw-stat-section {
  background: #f8fafc !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}

.profile-edit-form .email-notification-checkboxes .profile-switch {
  width: 100%;
  margin-bottom: 12px;
}

.profile-edit-form .email-notification-checkboxes .switch-track {
  width: 42px;
  height: 24px;
  border-radius: 12px;
}

.profile-edit-form .email-notification-checkboxes .switch-thumb {
  width: 18px;
  height: 18px;
  top: 3px;
  left: 3px;
}

.profile-edit-form .email-notification-checkboxes input[type="checkbox"]:checked+.switch-track .switch-thumb {
  transform: translateX(18px);
}

.project-page .panel_s {
  border-radius: 16px !important;
  overflow: hidden;
}

.project-page .new-task,
.project-page .new-task-btn {
  padding: 8px 14px !important;
  border-radius: 12px !important;
  font-size: 0.82rem !important;
}

.project-page .horizontal-scrollable-tabs {
  border: 1px solid var(--lg-border) !important;
  border-radius: 14px !important;
  padding: 4px !important;
  background: var(--lg-bg-secondary) !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li>a {
  border: 0 !important;
  border-radius: 10px !important;
  padding: 10px 12px !important;
  font-size: 0.84rem !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a,
.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:hover {
  background: rgba(var(--lg-accent-rgb), 0.16) !important;
  color: var(--lg-accent) !important;
}

@media (max-width: 767px) {

  body.contract-view .luum-doc-actions .btn,
  body.proposal-view .luum-doc-actions .btn,
  body.viewestimate .luum-doc-actions .btn,
  body.viewinvoice .luum-doc-actions .btn {
    width: 100%;
  }
}

/* ===========================================
   2026-02 Theme Hotfix Overrides
   =========================================== */

/* Keep regular text style in all semantic blocks */
body.luumtech-theme address {
  font-style: normal !important;
}

/* Statement: native browser select + cleaner dark visuals */
.section-statement #range.statement-period-native {
  -webkit-appearance: menulist !important;
  -moz-appearance: menulist !important;
  appearance: menulist !important;
  background-image: none !important;
  padding-right: 12px !important;
}

html[data-theme="dark"] .section-statement .panel_s {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .section-statement .panel_s>.panel-body {
  background: transparent !important;
}

.section-statement .statement-account-summary td,
.section-statement .statement-account-summary th {
  border-left: 0 !important;
  border-right: 0 !important;
}

.section-statement .statement-account-summary tr td {
  border-top-color: rgba(15, 23, 42, 0.1) !important;
}

.section-statement .statement-account-summary tfoot td {
  border-top: 1px solid rgba(15, 23, 42, 0.16) !important;
}

html[data-theme="dark"] .section-statement .statement-account-summary tr td {
  border-top-color: rgba(255, 255, 255, 0.11) !important;
}

html[data-theme="dark"] .section-statement .statement-account-summary tfoot td {
  border-top-color: rgba(255, 255, 255, 0.2) !important;
}

html[data-theme="dark"] .section-statement hr {
  border-top-color: rgba(255, 255, 255, 0.1) !important;
}

/* Document pages: unified responsive actions/layout */
body.contract-view .luum-doc-logo .doc-brand-logo,
body.proposal-view .luum-doc-logo .doc-brand-logo,
body.viewestimate .luum-doc-logo .doc-brand-logo,
body.viewinvoice .luum-doc-logo .doc-brand-logo {
  max-height: 46px !important;
  width: auto !important;
}

body.viewinvoice .luum-doc-main,
body.viewestimate .luum-doc-main {
  float: none !important;
  width: 100% !important;
  max-width: 1080px !important;
  margin: 0 auto !important;
  padding: 24px 24px 18px !important;
}

body.contract-view .preview-sticky-container,
body.proposal-view .preview-sticky-container,
body.viewestimate .preview-sticky-container,
body.viewinvoice .preview-sticky-container {
  max-width: 1080px !important;
  margin: 0 auto !important;
}

body.contract-view .luum-doc-actions,
body.proposal-view .luum-doc-actions,
body.viewestimate .luum-doc-actions,
body.viewinvoice .luum-doc-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 8px !important;
  flex-wrap: wrap !important;
}

body.contract-view .luum-doc-actions .go-to-portal,
body.proposal-view .luum-doc-actions .go-to-portal,
body.viewestimate .luum-doc-actions .go-to-portal,
body.viewinvoice .luum-doc-actions .go-to-portal {
  order: 1;
}

body.contract-view .luum-doc-actions .download,
body.proposal-view .luum-doc-actions .download,
body.viewestimate .luum-doc-actions .download,
body.viewinvoice .luum-doc-actions .download {
  order: 2;
}

body.viewinvoice .luum-doc-actions .pay-now-top {
  order: 3;
}

body.contract-view .luum-doc-actions .accept,
body.proposal-view .luum-doc-actions .decline,
body.proposal-view .luum-doc-actions .accept,
body.viewestimate .luum-doc-actions .decline,
body.viewestimate .luum-doc-actions .accept {
  order: 4;
}

body.viewinvoice .luum-doc-actions .go-to-portal,
body.viewestimate .luum-doc-actions .go-to-portal,
body.contract-view .luum-doc-actions .go-to-portal,
body.proposal-view .luum-doc-actions .go-to-portal {
  width: auto !important;
  min-width: 145px;
}

body.viewinvoice .invoice-payment-pdf-btn {
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
  color: var(--lg-text-secondary) !important;
}

body.viewinvoice .invoice-payment-pdf-btn:hover {
  border-color: rgba(var(--lg-accent-rgb), 0.35) !important;
  color: var(--lg-accent) !important;
}

body.proposal-view #proposal-wrapper .luum-doc-actions .pull-left {
  float: none !important;
  flex: 1 1 280px;
  min-width: 240px;
}

body.proposal-view #proposal-wrapper .luum-doc-actions>a,
body.proposal-view #proposal-wrapper .luum-doc-actions>button,
body.proposal-view #proposal-wrapper .luum-doc-actions>form {
  float: none !important;
}

body.proposal-view .proposal-tab-icon,
body.contract-view .proposal-tab-icon {
  width: 16px !important;
  height: 16px !important;
  display: inline-block !important;
  vertical-align: middle !important;
}

/* Remove noisy button focus ring in document previews */
body.contract-view .luum-doc-actions .btn:focus,
body.contract-view .luum-doc-actions .btn:active:focus,
body.proposal-view .luum-doc-actions .btn:focus,
body.proposal-view .luum-doc-actions .btn:active:focus,
body.viewestimate .luum-doc-actions .btn:focus,
body.viewestimate .luum-doc-actions .btn:active:focus,
body.viewinvoice .luum-doc-actions .btn:focus,
body.viewinvoice .luum-doc-actions .btn:active:focus {
  box-shadow: none !important;
  outline: none !important;
}

/* Navbar + bottom bar active colors */
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:hover,
html[data-theme="dark"] .navbar-glass .navbar-nav>li.active>a:focus {
  background: var(--lg-accent) !important;
  color: #fff !important;
}

html[data-theme="dark"] .navbar-glass .customers-nav-item-profile.open>a.profile-dropdown-toggle,
html[data-theme="dark"] .navbar-glass .customers-nav-item-profile>a.profile-dropdown-toggle:hover {
  background: var(--lg-accent) !important;
  color: #fff !important;
}

html[data-theme="dark"] .bottom-bar-item.active,
html[data-theme="dark"] .bottom-bar-item.active:hover,
html[data-theme="dark"] .bottom-bar-item.active:focus {
  background: var(--lg-accent) !important;
  color: #fff !important;
}

html[data-theme="dark"] .bottom-bar-item.active .bottom-bar-icon,
html[data-theme="dark"] .bottom-bar-item.active .bottom-bar-label {
  color: #fff !important;
}

/* Stats components more visible in light mode */
html[data-theme="light"] .aw-stat-section {
  background: #f3f6fb !important;
  border-color: rgba(15, 23, 42, 0.09) !important;
}

html[data-theme="light"] .aw-stat-card {
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  background-color: #ffffff !important;
}

.aw-stat-section-title,
.contracts-summary-heading,
.section-heading-contracts {
  font-weight: 400 !important;
}

/* Company profile language field alignment */
.company-profile-language-group .bootstrap-select .dropdown-toggle .filter-option,
.company-profile-language-group .bootstrap-select .dropdown-toggle .filter-option-inner-inner,
.company-profile-language-group .bootstrap-select .dropdown-menu li a {
  text-align: left !important;
}

.company-profile-language-group .bootstrap-select .dropdown-toggle .filter-option-inner-inner {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px;
}

/* Project page refinements */
.project-page .tw-flex.tw-items-center.tw-justify-between.tw-mb-3 {
  align-items: center !important;
  gap: 12px;
}

.project-page .new-task,
.project-page .new-task-btn {
  margin-left: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-height: 36px !important;
  padding: 7px 12px !important;
  font-size: 0.8rem !important;
  border-radius: 10px !important;
}

.project-page .project-discussions-new-btn {
  width: auto !important;
  min-width: 140px;
  padding: 7px 12px !important;
  border-radius: 10px !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li {
  float: none !important;
  flex: 0 0 auto;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li>a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  white-space: nowrap !important;
  overflow: visible !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a,
.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:hover,
.project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:focus {
  background: rgba(var(--lg-accent-rgb), 0.2) !important;
  color: var(--lg-accent) !important;
}

html[data-theme="light"] .project-page .panel_s,
html[data-theme="light"] .project-page .horizontal-scrollable-tabs {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.08) !important;
}

html[data-theme="dark"] .project-page .panel_s,
html[data-theme="dark"] .project-page .horizontal-scrollable-tabs {
  background: #121420 !important;
  border-color: rgba(255, 255, 255, 0.11) !important;
}

/* Mobile navbar profile icon + stable collapse */
.navbar-glass .mobile-profile-dropdown {
  display: inline-flex;
  align-items: center;
  position: relative;
}

.navbar-glass .mobile-profile-trigger {
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-glass-bg) !important;
  color: var(--lg-text-primary) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
}

.navbar-glass .mobile-profile-trigger .client-profile-image-small {
  width: 24px !important;
  height: 24px !important;
  min-width: 24px;
  border-radius: 50% !important;
}

.navbar-glass .mobile-profile-initials {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 600;
  color: #fff;
  background: var(--lg-accent);
}

.navbar-glass .dropdown-menu-mobile-profile {
  right: 0 !important;
  left: auto !important;
  min-width: 210px !important;
  margin-top: 8px !important;
}

@media (max-width: 768px) {
  .navbar-glass .navbar-collapse:not(.in) {
    height: 0 !important;
    overflow: hidden !important;
  }

  .navbar-glass .navbar-collapse.collapsing {
    overflow: hidden !important;
  }

  body.viewinvoice .luum-doc-main,
  body.viewestimate .luum-doc-main {
    padding: 16px 14px !important;
  }
}

@media (min-width: 769px) {
  .navbar-glass .mobile-profile-dropdown {
    display: none !important;
  }
}

/* ===========================================
   2026-02 Visual Polish Patch II
   =========================================== */

/* Document top action strip: no bulky background bar */
body.contract-view .preview-sticky-header,
body.proposal-view .preview-sticky-header,
body.viewestimate .preview-sticky-header,
body.viewinvoice .preview-sticky-header,
body.contract-view .preview-sticky-container,
body.proposal-view .preview-sticky-container,
body.viewestimate .preview-sticky-container,
body.viewinvoice .preview-sticky-container,
body.contract-view .preview-top-wrapper .top,
body.proposal-view .preview-top-wrapper .top,
body.viewestimate .preview-top-wrapper .top,
body.viewinvoice .preview-top-wrapper .top {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Document content: balanced horizontal spacing */
body.viewinvoice .luum-doc-main,
body.viewestimate .luum-doc-main {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 24px !important;
}

@media (max-width: 768px) {

  body.viewinvoice .luum-doc-main,
  body.viewestimate .luum-doc-main {
    padding: 14px !important;
  }
}

/* Dark mode: company block text under doc number should stay readable */
html[data-theme="dark"] body.viewinvoice .invoice-html-company-info,
html[data-theme="dark"] body.viewestimate .estimate-html-company-info {
  color: rgba(255, 255, 255, 0.92) !important;
}

/* Proposal heading/content refresh */
body.proposal-view .luum-proposal-title {
  font-size: 2.1rem !important;
  line-height: 1.06 !important;
  letter-spacing: -0.03em;
}

body.proposal-view .luum-proposal-subject {
  margin-top: 10px !important;
  font-size: 1.12rem !important;
  line-height: 1.36 !important;
  color: var(--lg-text-secondary) !important;
  max-width: 32ch;
}

body.proposal-view .proposal-content {
  font-size: 0.95rem;
  line-height: 1.72;
}

/* Discussion tab polish (proposal + contract) */
body.proposal-view .luum-proposal-discussion .proposal-comment,
body.contract-view .luum-proposal-discussion .contract-comment {
  padding: 12px;
  border-radius: 14px;
  border: 1px solid var(--lg-border);
  background: var(--lg-bg-secondary);
  margin-bottom: 12px;
}

body.proposal-view .proposal-comment-input,
body.contract-view .proposal-comment-input {
  min-height: 110px;
  border-radius: 10px !important;
  resize: vertical;
}

body.proposal-view .proposal-comment-submit,
body.contract-view .proposal-comment-submit {
  min-width: 150px;
}

body.proposal-view .luum-discussion-item,
body.contract-view .luum-discussion-item {
  display: flex;
  gap: 10px;
  padding: 10px 12px;
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  background: var(--lg-bg-secondary);
}

body.proposal-view .luum-discussion-meta,
body.contract-view .luum-discussion-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 6px;
}

body.proposal-view .luum-discussion-author,
body.contract-view .luum-discussion-author {
  font-weight: 600;
}

body.proposal-view .luum-discussion-time,
body.contract-view .luum-discussion-time {
  opacity: 0.78;
}

body.proposal-view .luum-discussion-text,
body.contract-view .luum-discussion-text {
  line-height: 1.6;
}

/* Identity modal: clickability + clean theme styles */
body.identity-confirmation .modal-backdrop {
  z-index: 12010 !important;
}

body.identity-confirmation #identityConfirmationModal {
  z-index: 12020 !important;
}

body.identity-confirmation #identityConfirmationModal .modal-dialog {
  width: calc(100% - 24px) !important;
  max-width: 760px !important;
}

body.identity-confirmation #identityConfirmationModal .modal-content {
  border-radius: 16px !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
  box-shadow: 0 24px 60px rgba(2, 6, 23, 0.45) !important;
}

html[data-theme="light"] body.identity-confirmation #identityConfirmationModal .modal-content {
  background: #ffffff !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  box-shadow: 0 22px 56px rgba(15, 23, 42, 0.2) !important;
}

body.identity-confirmation #identityConfirmationModal .modal-header,
body.identity-confirmation #identityConfirmationModal .modal-body,
body.identity-confirmation #identityConfirmationModal .modal-footer {
  background: transparent !important;
}

body.identity-confirmation #identityConfirmationModal .signature-pad--body {
  border: 1px solid var(--lg-border) !important;
  border-radius: 12px !important;
  background: var(--lg-bg-tertiary) !important;
  padding: 6px;
}

html[data-theme="light"] body.identity-confirmation #identityConfirmationModal .signature-pad--body {
  background: #f8fafc !important;
}

body.identity-confirmation #identityConfirmationModal #signature {
  width: 100% !important;
  max-width: 100% !important;
  height: 160px !important;
}

body.identity-confirmation #identityConfirmationModal .dispay-block {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

body.identity-confirmation #identityConfirmationModal .dispay-block .btn {
  width: auto !important;
}

body.identity-confirmation #identityConfirmationModal .modal-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
}

body.identity-confirmation #identityConfirmationModal .modal-footer .e-sign-legal-text {
  flex: 1 1 100%;
  margin-bottom: 0;
}

body.identity-confirmation #identityConfirmationModal .modal-footer .btn {
  width: auto !important;
  min-width: 120px;
}

/* Document tables on mobile: clearer horizontal scroll affordance */
@media (max-width: 768px) {

  body.viewinvoice .table-responsive,
  body.viewestimate .table-responsive,
  body.proposal-view .table-responsive,
  body.contract-view .table-responsive {
    position: relative;
    overflow-x: auto !important;
    border: 1px solid var(--lg-border) !important;
    border-radius: 12px !important;
    background: var(--lg-bg-secondary);
    margin: 0 0 10px !important;
    padding-bottom: 4px;
  }

  body.viewinvoice .table-responsive::before,
  body.viewestimate .table-responsive::before,
  body.proposal-view .table-responsive::before,
  body.contract-view .table-responsive::before,
  body.viewinvoice .table-responsive::after,
  body.viewestimate .table-responsive::after,
  body.proposal-view .table-responsive::after,
  body.contract-view .table-responsive::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    width: 18px;
    pointer-events: none;
    z-index: 2;
  }

  body.viewinvoice .table-responsive::before,
  body.viewestimate .table-responsive::before,
  body.proposal-view .table-responsive::before,
  body.contract-view .table-responsive::before {
    left: 0;
    background: linear-gradient(90deg, var(--lg-bg-secondary), rgba(0, 0, 0, 0));
  }

  body.viewinvoice .table-responsive::after,
  body.viewestimate .table-responsive::after,
  body.proposal-view .table-responsive::after,
  body.contract-view .table-responsive::after {
    right: 0;
    background: linear-gradient(270deg, var(--lg-bg-secondary), rgba(0, 0, 0, 0));
  }

  body.viewinvoice .table-responsive>table,
  body.viewestimate .table-responsive>table,
  body.proposal-view .table-responsive>table,
  body.contract-view .table-responsive>table {
    min-width: 700px;
    margin-bottom: 0 !important;
  }

  body.viewinvoice .table-responsive::-webkit-scrollbar,
  body.viewestimate .table-responsive::-webkit-scrollbar,
  body.proposal-view .table-responsive::-webkit-scrollbar,
  body.contract-view .table-responsive::-webkit-scrollbar {
    height: 8px;
  }

  body.viewinvoice .table-responsive::-webkit-scrollbar-thumb,
  body.viewestimate .table-responsive::-webkit-scrollbar-thumb,
  body.proposal-view .table-responsive::-webkit-scrollbar-thumb,
  body.contract-view .table-responsive::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: rgba(var(--lg-accent-rgb), 0.48);
  }
}

/* Contracts list: safer mobile responsiveness */
.contracts-table-responsive {
  overflow-x: auto;
}

@media (max-width: 768px) {
  .contracts-table-responsive .table-contracts {
    min-width: 760px;
  }
}

/* Project page: keep action button compact and right aligned */
.project-page .new-task,
.project-page .new-task-btn {
  margin-left: auto !important;
  float: none !important;
  min-width: 126px;
  padding: 7px 12px !important;
  font-size: 0.8rem !important;
  line-height: 1.2 !important;
  border-radius: 10px !important;
}

.project-page .horizontal-scrollable-tabs .nav-tabs>li>a {
  font-size: 0.82rem !important;
  padding: 9px 11px !important;
  border-radius: 10px !important;
}

html[data-theme="light"] .project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a,
html[data-theme="light"] .project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:hover,
html[data-theme="light"] .project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:focus {
  background: rgba(37, 99, 235, 0.14) !important;
  color: #1d4ed8 !important;
}

html[data-theme="dark"] .project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a,
html[data-theme="dark"] .project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:hover,
html[data-theme="dark"] .project-page .horizontal-scrollable-tabs .nav-tabs>li.active>a:focus {
  background: rgba(var(--lg-accent-rgb), 0.28) !important;
  color: #ffffff !important;
}

/* Mobile navbar: no profile item inside hamburger list + stable collapse */
@media (max-width: 768px) {
  .navbar-glass .navbar-collapse .customers-nav-item-profile {
    display: none !important;
  }

  .navbar-glass .navbar-collapse.collapse {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  .navbar-glass .navbar-collapse.collapse.in {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }

  .navbar-glass .navbar-collapse.collapsing {
    display: block !important;
    overflow: hidden !important;
  }

  body.luumtech-nav-open {
    overflow: hidden;
  }
}

/* ===========================================
   2026-02 Polish Patch III
   =========================================== */

/* Signature modal: clearer hierarchy, better accessibility, and reliable click stacking */
body.identity-confirmation .modal-backdrop {
  z-index: 20040 !important;
}

body.identity-confirmation #identityConfirmationModal {
  z-index: 20050 !important;
  pointer-events: auto !important;
}

body.identity-confirmation #identityConfirmationModal .modal-dialog {
  margin: 32px auto !important;
  max-width: 780px !important;
}

body.identity-confirmation #identityConfirmationModal .modal-content {
  border-radius: 18px !important;
  overflow: hidden;
}

body.identity-confirmation #identityConfirmationModal .modal-header {
  padding: 18px 22px 14px !important;
  border-bottom: 1px solid var(--lg-border) !important;
  position: relative;
}

body.identity-confirmation #identityConfirmationModal .identity-modal-title {
  margin: 0 !important;
  font-size: 1.28rem !important;
  font-weight: 400 !important;
  letter-spacing: -0.01em;
  padding-right: 56px;
}

body.identity-confirmation #identityConfirmationModal .identity-modal-subtitle {
  margin: 8px 0 0 !important;
  color: var(--lg-text-secondary);
  font-size: 0.86rem;
}

body.identity-confirmation #identityConfirmationModal .identity-modal-close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid var(--lg-border);
  background: var(--lg-glass-bg);
  color: var(--lg-text-primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: var(--lg-transition);
}

body.identity-confirmation #identityConfirmationModal .identity-modal-close svg {
  width: 15px;
  height: 15px;
}

body.identity-confirmation #identityConfirmationModal .identity-modal-close:hover,
body.identity-confirmation #identityConfirmationModal .identity-modal-close:focus {
  border-color: rgba(var(--lg-accent-rgb), 0.45) !important;
  color: var(--lg-accent) !important;
  outline: none !important;
  box-shadow: none !important;
}

body.identity-confirmation #identityConfirmationModal .identity-field-label {
  display: inline-flex;
  align-items: center;
}

body.identity-confirmation #identityConfirmationModal .identity-required-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 8px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 0.66rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: #c62828;
  background: rgba(220, 38, 38, 0.12);
  border: 1px solid rgba(220, 38, 38, 0.2);
}

body.identity-confirmation #identityConfirmationModal .control-label .text-danger,
body.identity-confirmation #identityConfirmationModal label .text-danger {
  display: none !important;
}

body.identity-confirmation #identityConfirmationModal .identity-signature-help {
  margin: 8px 0 0 !important;
  color: var(--lg-text-muted);
  font-size: 0.79rem;
}

body.identity-confirmation #identityConfirmationModal .signature-pad--body {
  padding: 8px !important;
  border-radius: 14px !important;
}

body.identity-confirmation #identityConfirmationModal #signature {
  cursor: crosshair !important;
}

html[data-theme="dark"] body.identity-confirmation #identityConfirmationModal .signature-pad--body {
  background: linear-gradient(140deg, rgba(255, 255, 255, 0.06), rgba(15, 23, 42, 0.68)) !important;
}

html[data-theme="light"] body.identity-confirmation #identityConfirmationModal .signature-pad--body {
  background: linear-gradient(140deg, #ffffff, #eef4ff) !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
}

/* Action buttons: make pay/sign/accept actions theme blue */
body.viewinvoice #pay_now,
body.viewinvoice .invoice-html-pay-now-top,
body.contract-view .luum-doc-actions .accept,
body.proposal-view .luum-doc-actions .accept,
body.viewestimate .luum-doc-actions .accept,
body.identity-confirmation #identityConfirmationModal .btn-success {
  background: linear-gradient(135deg, #3b82f6, #2563eb) !important;
  border-color: #2563eb !important;
  color: #ffffff !important;
}

body.viewinvoice #pay_now:hover,
body.viewinvoice .invoice-html-pay-now-top:hover,
body.contract-view .luum-doc-actions .accept:hover,
body.proposal-view .luum-doc-actions .accept:hover,
body.viewestimate .luum-doc-actions .accept:hover,
body.identity-confirmation #identityConfirmationModal .btn-success:hover {
  background: linear-gradient(135deg, #4f94ff, #2b6deb) !important;
  border-color: #2b6deb !important;
}

/* Document page readability + responsive spacing */
html[data-theme="dark"] .company-name-formatted,
html[data-theme="dark"] .invoice-html-company-info .company-name-formatted,
html[data-theme="dark"] .estimate-html-company-info .company-name-formatted,
html[data-theme="dark"] .proposal-html-company-info .company-name-formatted,
html[data-theme="dark"] .contract-html-company-info .company-name-formatted {
  color: #ffffff !important;
}

@media (max-width: 768px) {

  body.contract-view .contract-html-subject,
  body.proposal-view .proposal-html-number,
  body.viewestimate .estimate-html-number,
  body.viewinvoice .invoice-html-number {
    font-size: 1.72rem !important;
    line-height: 1.12 !important;
  }

  body.contract-view .contract-html-subject small,
  body.proposal-view .proposal-html-subject {
    font-size: 1rem !important;
    line-height: 1.35 !important;
  }

  body.contract-view .panel-body,
  body.proposal-view .panel-body,
  body.viewestimate .panel-body,
  body.viewinvoice .panel-body {
    padding: 14px !important;
  }

  body.contract-view .luum-doc-actions,
  body.proposal-view .luum-doc-actions,
  body.viewestimate .luum-doc-actions,
  body.viewinvoice .luum-doc-actions {
    gap: 8px !important;
  }

  body.contract-view .luum-doc-actions .btn,
  body.proposal-view .luum-doc-actions .btn,
  body.viewestimate .luum-doc-actions .btn,
  body.viewinvoice .luum-doc-actions .btn {
    font-size: 0.9rem !important;
    min-height: 40px !important;
    padding: 10px 12px !important;
  }
}

/* Footer: keep lower, remove compressed appearance on short pages */
body.luumtech-theme #wrapper {
  min-height: calc(100vh - 170px);
}

.glass-footer {
  margin-top: 52px !important;
  padding: 22px 0 16px !important;
}

/* File upload area redesign */
#files-upload.dropzone {
  border: 1px dashed rgba(var(--lg-accent-rgb), 0.36) !important;
  border-radius: 16px !important;
  min-height: 220px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.75), rgba(241, 245, 255, 0.78)) !important;
  transition: var(--lg-transition);
}

html[data-theme="dark"] #files-upload.dropzone {
  background: linear-gradient(145deg, rgba(17, 24, 39, 0.96), rgba(15, 23, 42, 0.92)) !important;
  border-color: rgba(var(--lg-accent-rgb), 0.42) !important;
}

#files-upload.dropzone.dragover {
  border-color: rgba(var(--lg-accent-rgb), 0.7) !important;
  transform: translateY(-1px);
}

#files-upload.dropzone .luum-dropzone-message {
  margin: 0 !important;
  text-align: center;
}

#files-upload.dropzone .luum-dropzone-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  margin: 0 auto 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--lg-accent);
  background: rgba(var(--lg-accent-rgb), 0.12);
}

#files-upload.dropzone .luum-dropzone-icon svg {
  width: 24px;
  height: 24px;
}

#files-upload.dropzone .luum-dropzone-title {
  margin: 0;
  font-weight: 600;
  color: var(--lg-text-primary);
}

#files-upload.dropzone .luum-dropzone-subtitle {
  margin: 4px 0 0;
  font-size: 0.84rem;
  color: var(--lg-text-secondary);
}

/* KB redesign with animated wave hero */
.kb-page {
  max-width: 1180px;
  margin: 0 auto;
}

.kb-search-hero {
  border: 1px solid var(--lg-border);
  background: linear-gradient(145deg, rgba(15, 23, 42, 0.94), rgba(30, 41, 59, 0.88)) !important;
}

.kb-search-hero .kb-wave-bg {
  background: transparent !important;
}

.kb-search-hero .kb-wave-bg .kb-wave {
  position: absolute;
  inset: -30%;
  border-radius: 40%;
}

.kb-search-hero .kb-wave-bg .kb-wave-1 {
  background: radial-gradient(65% 70% at 28% 55%, rgba(59, 130, 246, 0.42), rgba(59, 130, 246, 0));
  animation: kbWaveMoveOne 18s linear infinite;
}

.kb-search-hero .kb-wave-bg .kb-wave-2 {
  background: radial-gradient(62% 74% at 70% 40%, rgba(147, 51, 234, 0.28), rgba(147, 51, 234, 0));
  animation: kbWaveMoveTwo 24s linear infinite reverse;
}

.kb-search-hero .kb-wave-bg .kb-wave-3 {
  background: radial-gradient(58% 72% at 45% 65%, rgba(45, 212, 191, 0.2), rgba(45, 212, 191, 0));
  animation: kbWaveMoveThree 30s ease-in-out infinite;
}

@keyframes kbWaveMoveOne {
  0% {
    transform: translate3d(-2%, 1%, 0) rotate(0deg);
  }

  50% {
    transform: translate3d(3%, -2%, 0) rotate(180deg);
  }

  100% {
    transform: translate3d(-2%, 1%, 0) rotate(360deg);
  }
}

@keyframes kbWaveMoveTwo {
  0% {
    transform: translate3d(2%, -1%, 0) rotate(0deg);
  }

  50% {
    transform: translate3d(-3%, 2%, 0) rotate(180deg);
  }

  100% {
    transform: translate3d(2%, -1%, 0) rotate(360deg);
  }
}

@keyframes kbWaveMoveThree {

  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }

  50% {
    transform: translate3d(1.2%, -1%, 0) scale(1.06);
  }
}

.kb-categories-grid,
.kb-category-articles-page {
  gap: 16px !important;
}

.kb-category-card,
.kb-article-item,
.kb-related-section,
.kb-article-main {
  border: 1px solid var(--lg-border) !important;
  border-radius: 16px !important;
  background: var(--lg-bg-secondary) !important;
}

/* Dark navbar icon buttons: remove flat black bubbles */
html[data-theme="dark"] .navbar-glass .nav-language-toggle,
html[data-theme="dark"] .navbar-glass .theme-toggle,
html[data-theme="dark"] .navbar-glass .navbar-toggle,
html[data-theme="dark"] .navbar-glass .mobile-profile-trigger,
html[data-theme="dark"] .navbar-glass .profile-dropdown-toggle {
  background: transparent !important;
  border-color: rgba(148, 163, 184, 0.36) !important;
}

html[data-theme="dark"] .dropdown-menu-glass .nav-icon {
  background: transparent !important;
}

/* ===========================================
   2026-02 KB + UI Tune
   =========================================== */

/* Bilgi Bankası: compact, cleaner hero + better search */
.kb-page {
  max-width: 1160px !important;
  margin: 0 auto !important;
}

.kb-search-hero {
  min-height: 250px !important;
  padding: 40px 24px 28px !important;
  border-radius: 20px !important;
  border: 1px solid rgba(148, 163, 184, 0.25) !important;
}

.kb-search-content {
  max-width: 760px !important;
}

.kb-search-title {
  font-size: 1.65rem !important;
  font-weight: 600 !important;
  letter-spacing: -0.02em !important;
}

.kb-search-subtitle {
  font-size: 0.92rem !important;
  margin-bottom: 18px !important;
}

.kb-search-form {
  max-width: 640px !important;
}

.kb-search-input-wrapper {
  border-radius: 14px !important;
  border: 1px solid rgba(148, 163, 184, 0.35) !important;
  background: rgba(2, 6, 23, 0.72) !important;
  overflow: hidden;
}

.kb-search-field {
  height: 56px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  padding-left: 50px !important;
  font-size: 1rem !important;
}

.kb-search-field:focus {
  animation: none !important;
  box-shadow: inset 0 0 0 1px rgba(var(--lg-accent-rgb), 0.55) !important;
}

.kb-search-btn {
  position: static !important;
  width: 56px !important;
  height: 56px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.kb-search-btn:hover {
  transform: none !important;
}

.kb-quick-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin-top: 14px;
}

.kb-quick-link {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  color: rgba(241, 245, 249, 0.92);
  text-decoration: none !important;
  font-size: 0.75rem;
  font-weight: 500;
  background: rgba(15, 23, 42, 0.44);
}

.kb-quick-link:hover {
  border-color: rgba(var(--lg-accent-rgb), 0.6);
  color: #ffffff;
}

.kb-hero-stats {
  margin-top: 14px !important;
}

.kb-stat {
  font-size: 0.79rem !important;
}

/* Bilgi Bankası: category list on first page only cards */
.kb-categories-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px !important;
}

@media (max-width: 900px) {
  .kb-categories-grid {
    grid-template-columns: 1fr !important;
  }
}

.kb-category-section {
  margin-bottom: 0 !important;
}

.kb-category-card {
  min-height: 106px !important;
  border-radius: 14px !important;
  padding: 16px 16px 14px !important;
  border: 1px solid rgba(148, 163, 184, 0.2) !important;
}

.kb-category-icon {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
}

.kb-category-icon svg {
  width: 16px !important;
  height: 16px !important;
  stroke-width: 1.8 !important;
}

.kb-category-name {
  font-size: 1rem !important;
  font-weight: 600 !important;
}

.kb-category-desc {
  font-size: 0.81rem !important;
}

.kb-category-meta {
  display: inline-flex !important;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.kb-category-count {
  font-size: 1.05rem !important;
  line-height: 1 !important;
}

.kb-category-count-label {
  font-size: 0.68rem;
  color: var(--lg-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* KB useful feedback buttons */
.kb-useful-btn.is-active {
  border-color: rgba(var(--lg-accent-rgb), 0.55) !important;
  color: var(--lg-accent) !important;
  background: rgba(var(--lg-accent-rgb), 0.12) !important;
}

.answer_response {
  margin-top: 6px;
  font-size: 0.79rem;
  color: var(--lg-text-secondary);
}

/* Profile hero animated background */
.profile-header-bg {
  overflow: hidden;
}

.profile-header-bg::before,
.profile-header-bg::after {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  border-radius: 999px;
  filter: blur(8px);
  opacity: 0.6;
}

.profile-header-bg::before {
  top: -130px;
  left: -50px;
  background: radial-gradient(circle, rgba(var(--lg-accent-rgb), 0.4), rgba(var(--lg-accent-rgb), 0));
  animation: profileOrbOne 11s ease-in-out infinite;
}

.profile-header-bg::after {
  top: -150px;
  right: -90px;
  background: radial-gradient(circle, rgba(45, 212, 191, 0.35), rgba(45, 212, 191, 0));
  animation: profileOrbTwo 14s ease-in-out infinite;
}

@keyframes profileOrbOne {

  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }

  50% {
    transform: translate3d(24px, 16px, 0) scale(1.12);
  }
}

@keyframes profileOrbTwo {

  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }

  50% {
    transform: translate3d(-18px, 12px, 0) scale(1.08);
  }
}

/* Navbar horizontal spacing parity */
.navbar-glass {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.navbar-glass .navbar-brand {
  margin-left: 0 !important;
}

.navbar-glass .navbar-nav.navbar-right {
  margin-right: 0 !important;
  padding-right: 0 !important;
}

/* Contracts table card radius */
.contracts-table-responsive {
  border: 1px solid var(--lg-border);
  border-radius: 14px;
  overflow: hidden;
}

.contracts-table-responsive .table-contracts {
  margin-bottom: 0 !important;
}

.contracts-table-responsive .table-contracts thead th:first-child {
  border-top-left-radius: 12px;
}

.contracts-table-responsive .table-contracts thead th:last-child {
  border-top-right-radius: 12px;
}

/* Open ticket form cleanup + native department select + better attachments */
.open-ticket-attachments-area .attachments .attachment {
  max-width: 100% !important;
}

.open-ticket-attachments-area .input-group {
  border: 1px dashed rgba(var(--lg-accent-rgb), 0.35);
  border-radius: 12px;
  padding: 6px;
  background: var(--lg-bg-secondary);
}

.open-ticket-attachments-area input[type="file"].form-control {
  height: 38px !important;
  border: 0 !important;
  padding: 6px 8px !important;
  background: transparent !important;
}

.open-ticket-attachments-area .add_more_attachments {
  width: 36px;
  height: 36px;
  border-radius: 10px !important;
}

.open-ticket-department-group .form-control.native-select {
  -webkit-appearance: menulist !important;
  -moz-appearance: menulist !important;
  appearance: menulist !important;
  background-image: none !important;
  padding-right: 12px !important;
}

/* Identity modal title color on dark */
html[data-theme="dark"] body.identity-confirmation #identityConfirmationModal .identity-modal-title {
  color: #ffffff !important;
}

/* Document status chips inside detail card */
.luum-doc-status-row {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 8px;
}

.luum-doc-status-chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.35);
  font-size: 0.74rem;
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.01em;
  background: rgba(148, 163, 184, 0.12);
  color: var(--lg-text-primary);
}

.luum-doc-status-chip.is-success {
  border-color: rgba(34, 197, 94, 0.4);
  background: rgba(34, 197, 94, 0.14);
  color: #16a34a;
}

.luum-doc-status-chip.is-warning {
  border-color: rgba(245, 158, 11, 0.42);
  background: rgba(245, 158, 11, 0.16);
  color: #d97706;
}

.luum-doc-status-chip.is-danger {
  border-color: rgba(239, 68, 68, 0.42);
  background: rgba(239, 68, 68, 0.16);
  color: #dc2626;
}

html[data-theme="dark"] .luum-doc-status-chip.is-success {
  color: #86efac;
}

html[data-theme="dark"] .luum-doc-status-chip.is-warning {
  color: #facc15;
}

html[data-theme="dark"] .luum-doc-status-chip.is-danger {
  color: #fca5a5;
}

/* Proposal heading card in content area */
body.proposal-view .luum-proposal-title-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  border: 1px solid var(--lg-border);
  border-radius: 14px;
  padding: 14px 14px 12px;
  margin-bottom: 14px;
  background: var(--lg-bg-tertiary);
}

body.proposal-view .luum-proposal-title-main {
  min-width: 0;
}

body.proposal-view .luum-proposal-number-inline {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--lg-text-primary);
}

body.proposal-view .luum-proposal-subject-inline {
  margin: 4px 0 0;
  font-size: 1.04rem;
  font-weight: 500;
  line-height: 1.3;
  color: var(--lg-text-secondary);
}

/* Open ticket paddings */
#open-new-ticket-form .panel-body {
  padding: 20px !important;
}

#open-new-ticket-form .panel-footer {
  padding: 12px 20px !important;
}

@media (max-width: 768px) {
  .luum-doc-status-row {
    margin-bottom: 10px;
  }

  .luum-doc-status-chip {
    font-size: 0.72rem;
    padding: 5px 9px;
  }

  body.proposal-view .luum-proposal-title-card {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ===========================================
   2026-02 Final Polish IV
   =========================================== */

/* Signature modal: keep interactive in light mode */
body.identity-confirmation #identityConfirmationModal {
  position: fixed !important;
}

body.identity-confirmation #identityConfirmationModal .modal-dialog,
body.identity-confirmation #identityConfirmationModal .modal-content {
  pointer-events: auto !important;
}

html[data-theme="light"] body.identity-confirmation .modal-backdrop.fade.in {
  opacity: 0.32 !important;
  pointer-events: none !important;
}

/* Required labels should sit next to field names and stay left aligned */
body.identity-confirmation #identityConfirmationModal .identity-label-wrap {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;
  text-align: left !important;
}

body.identity-confirmation #identityConfirmationModal .identity-signature-label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 12px 0 8px !important;
}

@media (max-width: 767px) {
  body.identity-confirmation #identityConfirmationModal .identity-label-wrap {
    width: 100%;
    padding: 0 15px 6px !important;
  }
}

/* Document top row: logo and actions on the same line */
body.contract-view .luum-doc-topbar,
body.proposal-view .luum-doc-topbar,
body.viewestimate .luum-doc-topbar,
body.viewinvoice .luum-doc-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

body.contract-view .luum-doc-logo,
body.proposal-view .luum-doc-logo,
body.viewestimate .luum-doc-logo,
body.viewinvoice .luum-doc-logo {
  margin: 0 !important;
}

body.contract-view .luum-doc-actions,
body.proposal-view .luum-doc-actions,
body.viewestimate .luum-doc-actions,
body.viewinvoice .luum-doc-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

body.contract-view .luum-doc-actions form,
body.proposal-view .luum-doc-actions form,
body.viewestimate .luum-doc-actions form,
body.viewinvoice .luum-doc-actions form {
  margin: 0 !important;
}

/* Contract title in content card + summary emphasis */
body.contract-view .luum-contract-title-card {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 14px;
  padding: 14px;
  border: 1px solid var(--lg-border);
  border-radius: 14px;
  background: var(--lg-bg-tertiary);
}

body.contract-view .luum-contract-number-inline {
  margin: 0;
  font-size: 0.92rem;
  color: var(--lg-text-muted);
}

body.contract-view .luum-contract-subject-inline {
  margin: 4px 0 0;
  font-size: 1.14rem;
  line-height: 1.25;
  color: var(--lg-text-primary);
}

body.contract-view .luum-contract-type-inline {
  margin: 4px 0 0;
  font-size: 0.9rem;
  color: var(--lg-text-secondary);
}

body.contract-view .luum-summary-card {
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  padding: 12px;
  background: var(--lg-bg-secondary);
}

body.contract-view .luum-summary-highlights {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body.contract-view .luum-summary-highlight {
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  padding: 10px 12px;
  background: var(--lg-bg-secondary);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

body.contract-view .luum-summary-highlight span {
  font-size: 0.76rem;
  color: var(--lg-text-muted);
}

body.contract-view .luum-summary-highlight strong {
  font-size: 0.96rem;
  color: var(--lg-text-primary);
}

body.contract-view .luum-summary-highlight.is-value strong {
  font-size: 1.08rem;
}

body.contract-view .luum-summary-grid {
  margin-top: 12px;
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  overflow: hidden;
}

body.contract-view .luum-summary-row {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 12px;
  border-bottom: 1px solid var(--lg-border);
}

body.contract-view .luum-summary-row:last-child {
  border-bottom: 0;
}

body.contract-view .luum-summary-row span {
  color: var(--lg-text-muted);
}

body.contract-view .luum-summary-row strong {
  color: var(--lg-text-primary);
  text-align: right;
}

/* Discussion tab form alignment */
body.proposal-view .proposal-comment,
body.contract-view .contract-comment {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

body.proposal-view .proposal-comment-input,
body.contract-view .proposal-comment-input {
  margin-bottom: 0 !important;
}

body.proposal-view .proposal-comment-submit,
body.contract-view .proposal-comment-submit {
  width: 100%;
  margin-top: 0 !important;
}

/* Project tabs: stable layout without broken scroller plugin visuals */
.project-page .project-tabs-shell.preview-tabs-top.panel-full-width-tabs,
.project-page .horizontal-scrollable-tabs.preview-tabs-top.panel-full-width-tabs {
  border: 1px solid var(--lg-border);
  border-radius: 14px;
  padding: 10px;
  background: var(--lg-bg-secondary);
  overflow: hidden;
}

html[data-theme="light"] .project-page .project-tabs-shell.preview-tabs-top.panel-full-width-tabs,
html[data-theme="light"] .project-page .horizontal-scrollable-tabs.preview-tabs-top.panel-full-width-tabs {
  background: #f8fafc !important;
}

html[data-theme="dark"] .project-page .project-tabs-shell.preview-tabs-top.panel-full-width-tabs,
html[data-theme="dark"] .project-page .horizontal-scrollable-tabs.preview-tabs-top.panel-full-width-tabs {
  background: #101622 !important;
}

.project-page .project-tabs-shell .scroller,
.project-page .horizontal-scrollable-tabs .scroller {
  display: none !important;
}

.project-page .project-tabs-shell .project-tabs-nav,
.project-page .project-tabs-shell .horizontal-tabs,
.project-page .horizontal-scrollable-tabs .horizontal-tabs {
  overflow: visible;
}

.project-page .project-tabs-shell .nav-tabs,
.project-page .horizontal-scrollable-tabs .nav-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  float: none !important;
  margin: 0 !important;
  border-bottom: 0 !important;
}

.project-page .project-tabs-shell .nav-tabs>li,
.project-page .horizontal-scrollable-tabs .nav-tabs>li {
  float: none !important;
  margin: 0 !important;
}

.project-page .project-tabs-shell .nav-tabs>li>a,
.project-page .horizontal-scrollable-tabs .nav-tabs>li>a {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
  border-radius: 10px !important;
  padding: 9px 12px !important;
  line-height: 1.25 !important;
  color: var(--lg-text-secondary) !important;
  border: 1px solid transparent !important;
}

html[data-theme="light"] .project-page .project-tabs-shell .nav-tabs>li.active>a,
html[data-theme="light"] .project-page .project-tabs-shell .nav-tabs>li.active>a:hover,
html[data-theme="light"] .project-page .project-tabs-shell .nav-tabs>li.active>a:focus {
  background: rgba(var(--lg-accent-rgb), 0.14) !important;
  color: #1d4ed8 !important;
  border-color: rgba(var(--lg-accent-rgb), 0.22) !important;
}

html[data-theme="dark"] .project-page .project-tabs-shell .nav-tabs>li.active>a,
html[data-theme="dark"] .project-page .project-tabs-shell .nav-tabs>li.active>a:hover,
html[data-theme="dark"] .project-page .project-tabs-shell .nav-tabs>li.active>a:focus {
  background: rgba(var(--lg-accent-rgb), 0.24) !important;
  color: #ffffff !important;
  border-color: rgba(var(--lg-accent-rgb), 0.42) !important;
}

@media (max-width: 992px) {

  .project-page .project-tabs-shell .project-tabs-nav,
  .project-page .project-tabs-shell .horizontal-tabs,
  .project-page .horizontal-scrollable-tabs .horizontal-tabs {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  .project-page .project-tabs-shell .nav-tabs,
  .project-page .horizontal-scrollable-tabs .nav-tabs {
    flex-wrap: nowrap;
    min-width: max-content;
  }
}

/* Project files area: match files page look */
#project-files-upload.dropzone {
  border: 1px dashed rgba(var(--lg-accent-rgb), 0.36) !important;
  border-radius: 16px !important;
  min-height: 190px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.76), rgba(241, 245, 255, 0.8)) !important;
}

html[data-theme="dark"] #project-files-upload.dropzone {
  background: linear-gradient(145deg, rgba(17, 24, 39, 0.96), rgba(15, 23, 42, 0.92)) !important;
}

.project-files-table-wrap {
  border: 1px solid var(--lg-border);
  border-radius: 14px;
  overflow: hidden;
}

.project-files-table {
  margin-bottom: 0 !important;
}

/* Navbar light mode controls */
html[data-theme="light"] .navbar-glass .nav-language-toggle,
html[data-theme="light"] .navbar-glass .theme-toggle {
  background: rgba(15, 23, 42, 0.06) !important;
  border-color: rgba(148, 163, 184, 0.45) !important;
}

html[data-theme="light"] .navbar-glass .nav-language-toggle:hover,
html[data-theme="light"] .navbar-glass .customers-nav-item-language.open .nav-language-toggle,
html[data-theme="light"] .navbar-glass .theme-toggle:hover {
  background: rgba(var(--lg-accent-rgb), 0.16) !important;
  border-color: rgba(var(--lg-accent-rgb), 0.5) !important;
}

html[data-theme="light"] .navbar-glass .customers-nav-item-profile>a.profile-dropdown-toggle:hover,
html[data-theme="light"] .navbar-glass .customers-nav-item-profile>a.profile-dropdown-toggle:focus,
html[data-theme="light"] .navbar-glass .customers-nav-item-profile.open>a.profile-dropdown-toggle {
  background: rgba(var(--lg-accent-rgb), 0.16) !important;
  color: #1d4ed8 !important;
}

/* Light mode page background balance */
html[data-theme="light"] body.luumtech-theme {
  background: linear-gradient(180deg, #ecf2f8 0%, #f4f7fb 100%) !important;
}

html[data-theme="light"] body.luumtech-theme #wrapper {
  background: transparent !important;
}

html[data-theme="light"] .glass-footer {
  background: #ffffff !important;
  border-top: 1px solid #e5e7eb !important;
}

/* KB hero: same size on all knowledge pages and stronger visual */
.kb-search-hero {
  min-height: 330px !important;
  border-radius: 24px !important;
  padding: 26px !important;
}

.kb-search-shell {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap: 24px;
  align-items: center;
  max-width: 1100px;
  margin: 0 auto;
}

.kb-search-copy {
  max-width: 560px;
}

.kb-search-panel {
  border: 0;
  background: transparent;
  padding: 0;
  box-shadow: none;
}

.kb-search-panel-title {
  margin: 0;
  font-size: 0.88rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.96);
  letter-spacing: 0.01em;
}

.kb-search-panel-subtitle {
  margin: 4px 0 10px;
  font-size: 0.77rem;
  color: rgba(255, 255, 255, 0.86);
}

.kb-search-panel .kb-search-form {
  max-width: 420px !important;
}

.kb-search-panel .kb-search-input-wrapper {
  border-radius: 14px !important;
  height: 46px !important;
  border: 1px solid rgba(255, 255, 255, 0.38) !important;
  background: rgba(255, 255, 255, 0.14) !important;
  -webkit-backdrop-filter: blur(14px) saturate(150%);
  backdrop-filter: blur(14px) saturate(150%);
}

.kb-search-panel .kb-input-icon {
  width: 16px;
  height: 16px;
  left: 14px;
  opacity: 0.84;
}

.kb-search-panel .kb-search-field {
  height: 44px !important;
  font-size: 0.87rem !important;
  padding-left: 40px !important;
}

.kb-search-panel .kb-search-btn {
  width: 34px !important;
  height: 34px !important;
  margin: 4px !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, 0.28) !important;
  border: 1px solid rgba(255, 255, 255, 0.28) !important;
}

.kb-search-panel .kb-search-btn svg {
  width: 14px;
  height: 14px;
}

.kb-quick-links {
  margin-top: 9px;
  justify-content: flex-start;
  gap: 10px;
}

.kb-quick-link {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
  color: rgba(255, 255, 255, 0.95) !important;
  font-size: 0.77rem !important;
  text-decoration: none !important;
}

.kb-quick-link:hover {
  color: #ffffff !important;
  text-decoration: underline !important;
  border: 0 !important;
}

html[data-theme="light"] .kb-search-hero {
  background:
    linear-gradient(112deg, rgba(3, 105, 161, 0.92) 0%, rgba(30, 64, 175, 0.78) 45%, rgba(100, 116, 139, 0.58) 45.5%, rgba(71, 85, 105, 0.62) 100%) !important;
}

html[data-theme="light"] .kb-search-panel-title,
html[data-theme="light"] .kb-search-panel-subtitle,
html[data-theme="light"] .kb-quick-link,
html[data-theme="light"] .kb-search-title,
html[data-theme="light"] .kb-search-subtitle,
html[data-theme="light"] .kb-stat {
  color: #ffffff !important;
}

html[data-theme="light"] .kb-search-panel .kb-search-input-wrapper {
  border-color: rgba(255, 255, 255, 0.46) !important;
  background: rgba(255, 255, 255, 0.16) !important;
}

/* KB category list: make article titles slightly smaller */
.kb-category-articles-page .kb-article-title,
.kb-category-articles-page .kb-article-header .kb-article-title {
  font-size: 0.98rem !important;
  margin: 0 !important;
  line-height: 1.3 !important;
}

.kb-category-articles-page .kb-articles-list-full .kb-article-item {
  padding: 14px 16px !important;
}

.kb-category-articles-page .kb-articles-list-full .kb-article-preview {
  font-size: 0.8rem !important;
}

/* KB cards and article page hero polish */
.kb-categories-grid .kb-category-name {
  font-size: 1.04rem !important;
  line-height: 1.3 !important;
}

.kb-article-hero-wrap .kb-search-hero {
  min-height: 330px !important;
}

/* Subscription template top row alignment parity */
body.subscriptionhtml .luum-doc-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

body.subscriptionhtml .luum-doc-logo {
  margin: 0 !important;
}

body.subscriptionhtml .luum-doc-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
}

body.subscriptionhtml .luum-doc-actions form {
  margin: 0 !important;
}

/* Project tabs: hard reset for legacy bootstrap/plugin leftovers */
.project-page .project-tabs-shell.preview-tabs-top::before,
.project-page .project-tabs-shell.preview-tabs-top::after,
.project-page .project-tabs-shell .nav-tabs::before,
.project-page .project-tabs-shell .nav-tabs::after {
  display: none !important;
  content: none !important;
}

.project-page .project-tabs-shell .nav-tabs>li>a:hover,
.project-page .project-tabs-shell .nav-tabs>li>a:focus {
  background: rgba(var(--lg-accent-rgb), 0.12) !important;
  color: var(--lg-text-primary) !important;
}

/* Profile header animated waves */
.profile-header-bg::before,
.profile-header-bg::after {
  display: none;
}

.profile-header-bg .profile-wave {
  position: absolute;
  inset: -30%;
  border-radius: 42%;
  pointer-events: none;
}

.profile-header-bg .profile-wave-1 {
  background: radial-gradient(58% 72% at 30% 54%, rgba(59, 130, 246, 0.4), rgba(59, 130, 246, 0));
  animation: profileWaveFloatOne 20s linear infinite;
}

.profile-header-bg .profile-wave-2 {
  background: radial-gradient(62% 78% at 68% 44%, rgba(14, 165, 233, 0.28), rgba(14, 165, 233, 0));
  animation: profileWaveFloatTwo 26s linear infinite reverse;
}

.profile-header-bg .profile-wave-3 {
  background: radial-gradient(52% 70% at 50% 72%, rgba(99, 102, 241, 0.26), rgba(99, 102, 241, 0));
  animation: profileWaveFloatThree 30s ease-in-out infinite;
}

@keyframes profileWaveFloatOne {
  0% {
    transform: translate3d(-2%, 1%, 0) rotate(0deg);
  }

  50% {
    transform: translate3d(3%, -1.5%, 0) rotate(180deg);
  }

  100% {
    transform: translate3d(-2%, 1%, 0) rotate(360deg);
  }
}

@keyframes profileWaveFloatTwo {
  0% {
    transform: translate3d(2%, -1%, 0) rotate(0deg);
  }

  50% {
    transform: translate3d(-3%, 2%, 0) rotate(180deg);
  }

  100% {
    transform: translate3d(2%, -1%, 0) rotate(360deg);
  }
}

@keyframes profileWaveFloatThree {

  0%,
  100% {
    transform: translate3d(0, 0, 0) scale(1);
  }

  50% {
    transform: translate3d(1.4%, -0.8%, 0) scale(1.04);
  }
}

@media (max-width: 992px) {
  .kb-search-shell {
    grid-template-columns: 1fr;
  }

  .kb-search-copy {
    max-width: 100%;
  }

  .kb-search-hero {
    min-height: 300px !important;
  }

  .kb-article-hero-wrap .kb-search-hero {
    min-height: 300px !important;
  }

  body.contract-view .luum-summary-highlights {
    grid-template-columns: 1fr;
  }
}

/* ===========================================
   2026-02 Final Polish V
   =========================================== */

/* KB hero: copy/stats left aligned and cleaner search area */
.kb-search-copy {
  text-align: left !important;
}

.kb-hero-stats {
  justify-content: flex-start !important;
}

.kb-search-panel {
  max-width: 420px;
  margin-left: 0;
}

/* Project pages: cleaner visual system */
.project-page .panel_s {
  border-radius: 16px !important;
  border: 1px solid var(--lg-border) !important;
  overflow: hidden;
}

.project-page .panel_s>.panel-body {
  padding: 16px 18px !important;
}

.project-page .section-heading-project {
  font-size: 1.18rem !important;
  font-weight: 600 !important;
  color: var(--lg-text-primary) !important;
}

.project-page .table>thead>tr>th {
  font-weight: 600;
  color: var(--lg-text-secondary);
}

.project-page .table>tbody>tr>td {
  vertical-align: middle;
}

/* Project activity stream */
.luum-project-activity-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.luum-project-activity-item {
  display: grid;
  grid-template-columns: auto 44px minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  background: var(--lg-bg-secondary);
  padding: 12px 14px;
}

.luum-project-activity-date {
  font-size: 0.8rem;
  color: var(--lg-text-muted);
  white-space: nowrap;
}

.luum-project-activity-avatar {
  width: 44px;
  height: 44px;
  border-radius: 999px;
  background: rgba(var(--lg-accent-rgb), 0.1);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.luum-project-activity-item .staff-profile-image-small,
.luum-project-activity-item .client-profile-image-small {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px;
  border-radius: 999px !important;
  object-fit: cover;
  display: block;
}

.luum-project-activity-fallback {
  width: 26px;
  height: 26px;
  color: var(--lg-accent);
}

.luum-project-activity-title {
  margin: 0;
  font-size: 0.93rem;
  color: var(--lg-text-primary);
}

.luum-project-activity-author {
  font-weight: 600;
}

.luum-project-activity-desc {
  font-weight: 500;
  color: var(--lg-text-secondary);
}

.luum-project-activity-meta {
  margin: 3px 0 0;
  font-size: 0.82rem;
  color: var(--lg-text-muted);
}

/* Project files page: dropzone and toolbar */
#project-files-upload.dropzone {
  min-height: 220px !important;
}

#project-files-upload.dropzone .luum-dropzone-message {
  margin: 0 !important;
  text-align: center;
}

#project-files-upload.dropzone .luum-dropzone-icon {
  width: 52px;
  height: 52px;
  border-radius: 14px;
  margin: 0 auto 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--lg-accent);
  background: rgba(var(--lg-accent-rgb), 0.12);
}

#project-files-upload.dropzone .luum-dropzone-icon svg {
  width: 24px;
  height: 24px;
}

#project-files-upload.dropzone .luum-dropzone-title {
  margin: 0;
  font-weight: 600;
  color: var(--lg-text-primary);
}

#project-files-upload.dropzone .luum-dropzone-subtitle {
  margin: 4px 0 0;
  font-size: 0.84rem;
  color: var(--lg-text-secondary);
}

.project-files-actions-left,
.project-files-actions-right {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.project-files-download-all {
  display: inline-flex !important;
  align-items: center !important;
  border-radius: 10px !important;
}

.project-files-table-wrap {
  margin-top: 4px;
}

.project-files-table thead th {
  font-size: 0.85rem;
}

.project-files-table td a {
  color: var(--lg-text-primary);
  font-weight: 500;
}

.project-files-table .project-file-image {
  width: 72px !important;
  height: auto;
  border-radius: 10px;
  border: 1px solid var(--lg-border);
  margin-right: 10px;
}

/* New task form: date and file controls */
.project-page #task-form .luum-project-task-dates .input-group-addon {
  cursor: pointer;
}

.project-page #task-form .luum-task-date-input {
  cursor: pointer;
}

.project-page #task-form .luum-file-picker {
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--lg-bg-secondary);
}

.project-page #task-form .luum-file-picker .luum-file-icon {
  border: 0;
  border-right: 1px solid var(--lg-border);
  background: rgba(var(--lg-accent-rgb), 0.08);
  color: var(--lg-accent);
}

.project-page #task-form .luum-file-picker .form-control {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.project-page #task-form .luum-file-picker .input-group-btn .btn {
  border: 0 !important;
  border-left: 1px solid var(--lg-border) !important;
  border-radius: 0 !important;
}

.project-page #task-form .luum-file-help {
  margin-top: 6px;
  color: var(--lg-text-muted);
  font-size: 0.78rem;
}

/* Contract summary typography + signature preview */
body.contract-view .luum-summary-highlight span,
body.contract-view .luum-summary-row span {
  font-weight: 500 !important;
}

body.contract-view .luum-summary-highlight strong,
body.contract-view .luum-summary-row strong {
  font-weight: 600 !important;
}

body.contract-view .luum-summary-grid {
  background: var(--lg-bg-secondary);
}

html[data-theme="light"] body.contract-view .luum-summary-card,
html[data-theme="light"] body.contract-view .luum-summary-grid,
html[data-theme="light"] body.contract-view .luum-summary-row {
  background: #ffffff !important;
}

body.contract-view .luum-signature-image-wrap {
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  background: var(--lg-bg-secondary);
  padding: 10px;
  margin-bottom: 10px;
}

body.contract-view .luum-signature-image {
  width: 100%;
  max-height: 150px;
  object-fit: contain;
  display: block;
}

/* Proposal summary card system */
body.proposal-view .luum-proposal-summary-highlights {
  margin-top: 12px;
}

body.proposal-view .luum-proposal-summary-grid {
  margin-top: 12px;
}

body.proposal-view .luum-proposal-summary-grid .luum-summary-row span {
  font-weight: 500;
}

body.proposal-view .luum-proposal-summary-grid .luum-summary-row strong {
  font-weight: 600;
}

html[data-theme="light"] body.proposal-view .luum-summary-card,
html[data-theme="light"] body.proposal-view .luum-summary-grid,
html[data-theme="light"] body.proposal-view .luum-summary-row {
  background: #ffffff !important;
}

body.proposal-view .proposal-attachments {
  margin-top: 12px;
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  background: var(--lg-bg-secondary);
  padding: 12px;
}

/* Ticket info separators */
.ticket-info .tw-divide-y>p,
.ticket-info .tw-divide-y>div {
  border-top-color: rgba(148, 163, 184, 0.32) !important;
}

html[data-theme="dark"] .ticket-info .tw-divide-y>p,
html[data-theme="dark"] .ticket-info .tw-divide-y>div {
  border-top-color: rgba(148, 163, 184, 0.28) !important;
}

/* Navbar spacing between last menu item and controls */
@media (min-width: 992px) {
  .navbar-glass .navbar-nav.navbar-right>li.customers-nav-item-language {
    margin-left: 14px !important;
  }
}

@media (max-width: 992px) {
  .luum-project-activity-item {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .luum-project-activity-avatar {
    width: 38px;
    height: 38px;
  }

  .project-files-actions-left,
  .project-files-actions-right {
    float: none !important;
    width: 100%;
    justify-content: flex-start;
    margin-bottom: 10px;
  }
}

/* ===========================================
   2026-02 Final Polish VI
   =========================================== */

/* Keep typography size stable while switching light/dark */
html[data-theme="light"] body.luumtech-theme,
html[data-theme="dark"] body.luumtech-theme {
  font-size: var(--lg-font-size-base) !important;
  line-height: 1.55;
}

/* Shared document top bar alignment */
body.contract-view .preview-sticky-container,
body.proposal-view .preview-sticky-container,
body.viewestimate .preview-sticky-container,
body.viewinvoice .preview-sticky-container,
body.subscriptionhtml .preview-sticky-container {
  width: 100% !important;
  max-width: 1170px !important;
  padding-left: 15px !important;
  padding-right: 15px !important;
}

body.contract-view .luum-doc-topbar,
body.proposal-view .luum-doc-topbar,
body.viewestimate .luum-doc-topbar,
body.viewinvoice .luum-doc-topbar,
body.subscriptionhtml .luum-doc-topbar {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Proposal summary should follow contract summary rhythm */
body.proposal-view .luum-summary-highlights {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

body.proposal-view .luum-summary-highlight span,
body.proposal-view .luum-summary-row span {
  font-weight: 500 !important;
}

body.proposal-view .luum-summary-highlight strong,
body.proposal-view .luum-summary-row strong {
  font-weight: 600 !important;
  font-size: 0.96rem;
}

body.proposal-view .luum-summary-highlight.is-value strong {
  font-size: 1.08rem;
}

/* Project tabs: always one line and horizontally scrollable */
.project-page .project-tabs-shell .project-tabs-nav,
.project-page .project-tabs-shell .horizontal-tabs,
.project-page .horizontal-scrollable-tabs .horizontal-tabs {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
}

.project-page .project-tabs-shell .nav-tabs,
.project-page .horizontal-scrollable-tabs .nav-tabs {
  flex-wrap: nowrap !important;
  min-width: max-content !important;
}

.project-page .project-tabs-shell .nav-tabs>li,
.project-page .horizontal-scrollable-tabs .nav-tabs>li {
  flex: 0 0 auto;
}

/* Project tickets button should stay compact */
.project-page .project-open-ticket-btn {
  padding: 7px 12px !important;
  border-radius: 10px !important;
  min-height: 34px !important;
  font-size: 0.8rem !important;
}

/* Native gantt view dropdown */
.project-page .project-gantt-native-select {
  -webkit-appearance: menulist !important;
  -moz-appearance: menulist !important;
  appearance: menulist !important;
  background-image: none !important;
  min-width: 170px;
  border-radius: 10px !important;
}

/* Statement lines in dark mode: remove harsh white separators */
.section-statement .statement-account-summary td+td,
.section-statement .statement-account-summary th+th {
  border-left: 0 !important;
}

html[data-theme="dark"] .section-statement .table.table-bordered>thead>tr>th,
html[data-theme="dark"] .section-statement .table.table-bordered>tbody>tr>td,
html[data-theme="dark"] .section-statement .table.table-bordered>tfoot>tr>td {
  border-color: rgba(148, 163, 184, 0.22) !important;
}

html[data-theme="dark"] .section-statement .table.table-striped>tbody>tr:nth-of-type(odd) {
  background: rgba(15, 23, 42, 0.3) !important;
}

/* Signature image readability by theme */
html[data-theme="dark"] body.contract-view .luum-signature-image {
  filter: none !important;
  mix-blend-mode: screen;
}

html[data-theme="light"] body.contract-view .luum-signature-image {
  filter: grayscale(1) contrast(1.85) brightness(0.22) !important;
  mix-blend-mode: multiply;
}

/* Unified attachment picker (ticket/task/request forms) */
.luum-attachment-picker {
  border: 1px dashed rgba(var(--lg-accent-rgb), 0.35) !important;
  border-radius: 12px !important;
  background: var(--lg-bg-secondary) !important;
  overflow: hidden;
}

.luum-attachment-picker .luum-file-icon {
  border: 0 !important;
  border-right: 1px solid var(--lg-border) !important;
  background: rgba(var(--lg-accent-rgb), 0.1) !important;
  color: var(--lg-accent) !important;
}

.luum-attachment-picker .form-control[type="file"] {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

.luum-attachment-picker .input-group-btn .btn {
  border: 0 !important;
  border-left: 1px solid var(--lg-border) !important;
  border-radius: 0 !important;
}

.open-ticket-attachments-area .luum-file-help,
.single-ticket-reply-area .luum-file-help,
.project-page #task-form .luum-file-help {
  margin-top: 6px;
  font-size: 0.78rem;
  color: var(--lg-text-muted);
}

/* Alerts: avoid double icon rendering */
.alert.alert-glass>i[class*="fa-"],
.alert.alert-glass>i.fa,
.alert.alert-glass>.fa {
  display: none !important;
}

/* Mobile/tablet spacing + overflow safety */
@media (max-width: 1024px) {
  body.luumtech-theme .panel_s>.panel-body {
    padding: 14px !important;
  }

  body.luumtech-theme .table-responsive {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  body.luumtech-theme .table-responsive>table {
    min-width: 680px;
  }

  .project-page .table-responsive>table {
    min-width: 760px;
  }

  .section-statement .table-responsive>table {
    min-width: 900px;
  }

  .kb-page {
    padding-left: 10px;
    padding-right: 10px;
  }

  .kb-search-hero {
    min-height: 220px !important;
    padding: 18px !important;
    border-radius: 16px !important;
  }

  .kb-search-shell {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    max-width: 100% !important;
  }

  .kb-search-panel,
  .kb-search-form,
  .kb-search-panel .kb-search-form {
    max-width: 100% !important;
    width: 100%;
  }

  .kb-search-field {
    height: 44px !important;
    padding-left: 42px !important;
    font-size: 0.9rem !important;
  }

  .kb-search-btn {
    width: 44px !important;
    height: 44px !important;
  }
}

@media (max-width: 991px) {
  .navbar-glass .navbar-collapse .customers-nav-item-profile {
    display: none !important;
  }

  .navbar-glass .navbar-collapse.collapse {
    display: none !important;
    height: 0 !important;
    overflow: hidden !important;
  }

  .navbar-glass .navbar-collapse.collapse.in {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }

  .navbar-glass .navbar-collapse.collapsing {
    display: block !important;
    overflow: hidden !important;
  }

  body.luumtech-nav-open {
    overflow: hidden;
  }
}

@media (max-width: 767px) {
  body.proposal-view .luum-summary-highlights {
    grid-template-columns: 1fr;
  }
}

/* ===========================================
   2026-02 Final Polish VII
   =========================================== */

/* Hide native "Choose File" button, keep custom picker shell */
.luum-attachment-picker input[type="file"]::file-selector-button,
.luum-file-picker input[type="file"]::file-selector-button {
  display: none !important;
}

.luum-attachment-picker input[type="file"]::-webkit-file-upload-button,
.luum-file-picker input[type="file"]::-webkit-file-upload-button {
  display: none !important;
}

.luum-attachment-picker input[type="file"],
.luum-file-picker input[type="file"] {
  color: var(--lg-text-secondary) !important;
}

/* Proposal item table should always stay visible and scrollable on small screens */
body.proposal-view .proposal-content .table-responsive {
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

body.proposal-view .proposal-content .table-responsive>table {
  min-width: 700px;
}

/* Desktop navbar right edge spacing (profile side) */
@media (min-width: 992px) {
  .navbar-glass .navbar-nav.navbar-right {
    padding-right: 8px !important;
  }

  .navbar-glass .navbar-nav.navbar-right>li.customers-nav-item-profile {
    margin-right: 8px !important;
  }
}

/* Mobile/tablet navbar layout stability */
@media (max-width: 991px) {
  .navbar-glass {
    width: calc(100% - 16px) !important;
    left: 8px !important;
    right: 8px !important;
    transform: none !important;
    max-width: none !important;
    padding: 8px 10px !important;
    box-sizing: border-box;
  }

  .navbar-glass .mobile-icons {
    display: inline-flex !important;
  }

  .navbar-glass .mobile-icons .navbar-toggle {
    display: inline-flex !important;
  }

  .navbar-glass .navbar-collapse {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 12px !important;
    border-radius: 16px !important;
    box-sizing: border-box;
  }

  .navbar-glass .navbar-collapse .navbar-nav.navbar-right {
    display: flex !important;
    flex-direction: column;
    width: 100%;
    gap: 8px;
    margin: 0 !important;
  }

  .navbar-glass .navbar-collapse .navbar-nav.navbar-right>li {
    width: 100%;
    margin: 0 !important;
  }

  .navbar-glass .navbar-collapse .navbar-nav.navbar-right>li>a {
    width: 100%;
    border-radius: 12px !important;
    justify-content: flex-start;
  }

  .navbar-glass .navbar-collapse .customers-nav-item-language,
  .navbar-glass .navbar-collapse .customers-nav-item-theme-toggle,
  .navbar-glass .navbar-collapse .customers-nav-item-profile {
    display: none !important;
  }
}

/* Mobile/tablet page padding and overflow safety */
@media (max-width: 991px) {

  body.luumtech-theme,
  body.luumtech-theme #wrapper {
    overflow-x: hidden;
  }

  body.luumtech-theme #wrapper {
    padding-left: 8px;
    padding-right: 8px;
    box-sizing: border-box;
  }

  body.luumtech-theme .panel_s>.panel-body {
    padding: 14px !important;
  }
}

/* Table overflow protection for all pages */
@media (max-width: 991px) {

  .panel_s .table-responsive,
  .project-page .table-responsive,
  .section-statement .table-responsive,
  .dataTables_wrapper {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
  }

  .panel_s .table-responsive>table,
  .dataTables_wrapper table.table {
    min-width: 680px;
  }

  .project-page .table-responsive>table,
  .project-page .dataTables_wrapper table.table {
    min-width: 760px;
  }

  .section-statement .table-responsive>table {
    min-width: 900px;
  }
}

/* Bottom bar should fully fit mobile width */
@media (max-width: 991px) {
  .bottom-bar {
    width: calc(100vw - 16px) !important;
    max-width: none !important;
    left: 8px !important;
    right: 8px !important;
    transform: none !important;
    box-sizing: border-box;
    overflow: hidden;
    padding: 6px 4px !important;
    gap: 0 !important;
  }

  .bottom-bar-item {
    min-width: 0 !important;
    flex: 1 1 0 !important;
    padding: 7px 5px !important;
  }

  .bottom-bar-label {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.has-bottom-bar {
    padding-bottom: 96px !important;
  }
}

/* Contract summary cards: keep spacing between number and signature blocks */
body.contract-view .luum-summary-signature {
  margin-top: 14px !important;
}

body.contract-view .luum-summary-grid+.luum-summary-signature {
  margin-top: 14px !important;
}

/* Notification icon duplication fix: use single icon style */
.float-alert.alert [data-notify="icon"] {
  display: none !important;
}

/* ===========================================
   2026-02 Final Polish VIII
   =========================================== */

/* Keep desktop navbar edge spacing symmetric (logo side vs profile side). */
@media (min-width: 992px) {
  .navbar-glass .navbar-nav.navbar-right {
    margin-right: 0 !important;
    padding-right: 16px !important;
  }

  .navbar-glass .navbar-nav.navbar-right>li.customers-nav-item-profile {
    margin-right: 0 !important;
  }
}

/* Force-hide native file chooser button in all custom attachment shells. */
.luum-attachment-picker .form-control[type="file"]::file-selector-button,
.luum-file-picker .form-control[type="file"]::file-selector-button,
.open-ticket-attachments-area .form-control[type="file"]::file-selector-button,
.single-ticket-reply-area .form-control[type="file"]::file-selector-button,
.project-page #task-form .form-control[type="file"]::file-selector-button {
  display: none !important;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

.luum-attachment-picker .form-control[type="file"]::-webkit-file-upload-button,
.luum-file-picker .form-control[type="file"]::-webkit-file-upload-button,
.open-ticket-attachments-area .form-control[type="file"]::-webkit-file-upload-button,
.single-ticket-reply-area .form-control[type="file"]::-webkit-file-upload-button,
.project-page #task-form .form-control[type="file"]::-webkit-file-upload-button {
  display: none !important;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  -webkit-appearance: none;
}

.luum-attachment-picker .form-control[type="file"],
.luum-file-picker .form-control[type="file"],
.open-ticket-attachments-area .form-control[type="file"],
.single-ticket-reply-area .form-control[type="file"],
.project-page #task-form .form-control[type="file"] {
  color: var(--lg-text-secondary) !important;
  padding-left: 10px !important;
  cursor: pointer;
}

/* Browser compatibility fallbacks for older Safari/Samsung/Firefox tools checks. */
.navbar-glass .customers-nav-item-login>a {
  min-width: -webkit-fill-available !important;
  min-width: max-content !important;
}

body.luumtech-theme.viewlogin .theme-switch,
body.luumtech-theme.viewregister .theme-switch {
  -webkit-user-select: none;
  user-select: none;
}

/* ===========================================
   2026-02 Final Polish IX
   =========================================== */

/* Use only one icon source in floating notifications. */
.float-alert.alert::after {
  display: none !important;
}

.float-alert.alert [data-notify="icon"] {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 8px;
  margin-right: 8px;
  background: rgba(239, 68, 68, 0.1);
  color: currentColor;
  font-size: 14px;
}

/* Proposal totals should stay fixed and never force horizontal scroll. */
body.proposal-view .luum-proposal-totals-table,
body.proposal-view .luum-proposal-totals-table>tbody>tr>td {
  min-width: 0 !important;
  white-space: normal !important;
}

/* Proposal item choose checkbox -> switch style (same language as profile switches). */
body.proposal-view input.select-item[type="checkbox"] {
  -webkit-appearance: none;
  appearance: none;
  width: 40px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(148, 163, 184, 0.28);
  position: relative;
  cursor: pointer;
  transition: all 0.2s ease;
  vertical-align: middle;
}

body.proposal-view input.select-item[type="checkbox"]::before {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
  transition: transform 0.2s ease;
}

body.proposal-view input.select-item[type="checkbox"]:checked {
  background: rgba(var(--lg-accent-rgb), 0.85);
  border-color: rgba(var(--lg-accent-rgb), 0.95);
}

body.proposal-view input.select-item[type="checkbox"]:checked::before {
  transform: translateX(18px);
}

/* Proposal summary visual rhythm (closer to contract summary cards). */
body.proposal-view .luum-summary-company {
  border-radius: 14px !important;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
  padding: 14px !important;
}

body.proposal-view .luum-summary-highlights {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;
}

body.proposal-view .luum-summary-highlight {
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  background: var(--lg-bg-secondary);
  padding: 10px 12px;
}

body.proposal-view .luum-summary-highlight span,
body.proposal-view .luum-summary-row span {
  font-weight: 500 !important;
  font-size: 0.8rem !important;
  color: var(--lg-text-muted) !important;
}

body.proposal-view .luum-summary-highlight strong,
body.proposal-view .luum-summary-row strong {
  font-weight: 600 !important;
  font-size: 1rem !important;
  color: var(--lg-text-primary) !important;
}

body.proposal-view .luum-proposal-summary-grid {
  margin-top: 12px;
  border: 1px solid var(--lg-border);
  border-radius: 12px;
  overflow: hidden;
  background: var(--lg-bg-secondary);
}

body.proposal-view .luum-proposal-summary-grid .luum-summary-row {
  padding: 10px 12px;
  border-bottom: 1px solid var(--lg-border);
}

body.proposal-view .luum-proposal-summary-grid .luum-summary-row:last-child {
  border-bottom: 0;
}

html[data-theme="light"] body.proposal-view .luum-summary-company,
html[data-theme="light"] body.proposal-view .luum-summary-highlight,
html[data-theme="light"] body.proposal-view .luum-proposal-summary-grid,
html[data-theme="light"] body.proposal-view .luum-proposal-summary-grid .luum-summary-row {
  background: #ffffff !important;
}

/* Project files list: show stable icon + filename metadata, avoid broken thumbnails. */
.project-page .luum-project-file-link {
  display: flex;
  align-items: center;
  gap: 10px;
}

.project-page .luum-project-file-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  border: 1px solid var(--lg-border);
  background: var(--lg-bg-secondary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--lg-accent);
  flex: 0 0 auto;
}

.project-page .luum-project-file-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.project-page .luum-project-file-title {
  color: var(--lg-text-primary);
  font-weight: 600;
  line-height: 1.3;
}

.project-page .luum-project-file-name {
  color: var(--lg-text-muted);
  font-size: 0.76rem;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Stat cards on mobile: compact single-line layout (proposals/invoices/projects/support). */
@media (max-width: 767px) {

  .aw-stat-grid,
  .aw-stat-grid-4,
  .aw-stat-grid-5,
  .lg-stat-grid {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .aw-stat-card,
  .lg-glass-card {
    min-height: 0 !important;
    padding: 10px 12px !important;
    border-radius: 12px !important;
  }

  .aw-stat-header {
    margin-bottom: 6px !important;
  }

  .aw-stat-body {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 10px;
  }

  .aw-stat-ring-wrap {
    display: none !important;
  }

  .aw-stat-num {
    font-size: 1rem !important;
  }
}

/* Tables in lists must always scroll on mobile/tablet. */
.table-responsive.luum-list-table-responsive {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 1024px) {

  .table-responsive.luum-list-table-responsive>table.table-invoices,
  .table-responsive.luum-list-table-responsive>table.table-estimates,
  .table-responsive.luum-list-table-responsive>table.table-proposals,
  .table-responsive.luum-list-table-responsive>table.table-projects,
  .table-responsive.luum-list-table-responsive>table.table-tickets {
    min-width: 760px !important;
  }
}

/* Project tabs should stay one row, horizontally scrollable, no wrap. */
.project-page .project-tabs-shell .project-tabs-nav,
.project-page .project-tabs-shell .horizontal-tabs {
  overflow-x: auto !important;
  overflow-y: hidden !important;
  -webkit-overflow-scrolling: touch;
}

.project-page .project-tabs-shell .nav-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  white-space: nowrap !important;
  min-width: max-content !important;
}

.project-page .project-tabs-shell .nav-tabs>li {
  float: none !important;
  flex: 0 0 auto !important;
}

/* Tablet/navbar behavior should follow mobile-like compact header. */
@media (max-width: 1199px) {
  .navbar-glass {
    width: calc(100% - 16px) !important;
    left: 8px !important;
    right: 8px !important;
    transform: none !important;
    max-width: none !important;
    padding: 8px 10px !important;
  }

  .navbar-glass .navbar-header {
    width: 100%;
    display: flex !important;
    align-items: center;
    justify-content: space-between;
  }

  .navbar-glass .mobile-icons {
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    margin-left: auto;
  }

  .navbar-glass .mobile-icons .navbar-toggle {
    display: inline-flex !important;
  }

  .navbar-glass .mobile-profile-trigger,
  .navbar-glass .mobile-icons .theme-toggle,
  .navbar-glass .mobile-icons .nav-language-toggle,
  .navbar-glass .mobile-icons .navbar-toggle {
    width: 36px !important;
    height: 36px !important;
  }

  .navbar-glass .mobile-profile-trigger .client-profile-image-small {
    width: 22px !important;
    height: 22px !important;
    min-width: 22px !important;
  }

  .navbar-glass .navbar-collapse {
    position: absolute !important;
    top: calc(100% + 8px) !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 12px !important;
    border-radius: 16px !important;
  }

  .navbar-glass .navbar-collapse .navbar-nav.navbar-right {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px;
    margin: 0 !important;
    width: 100%;
  }

  .navbar-glass .navbar-collapse .navbar-nav.navbar-right>li {
    width: 100%;
    margin: 0 !important;
  }

  .navbar-glass .navbar-collapse .navbar-nav.navbar-right>li>a {
    width: 100%;
    border-radius: 12px !important;
    justify-content: flex-start;
  }

  .navbar-glass .navbar-collapse .customers-nav-item-language,
  .navbar-glass .navbar-collapse .customers-nav-item-theme-toggle,
  .navbar-glass .navbar-collapse .customers-nav-item-profile {
    display: none !important;
  }

  body.luumtech-theme #wrapper {
    padding-left: 10px !important;
    padding-right: 10px !important;
  }

  .bottom-bar {
    width: calc(100% - 16px) !important;
    left: 8px !important;
    right: 8px !important;
    transform: none !important;
    max-width: none !important;
    overflow: hidden !important;
  }

  .bottom-bar-item {
    min-width: 0 !important;
    flex: 1 1 0 !important;
    padding: 6px 2px !important;
  }

  .bottom-bar-label {
    font-size: 0.68rem !important;
  }
}

@media (min-width: 1200px) {
  .navbar-glass {
    width: calc(100% - 32px) !important;
    max-width: 1360px !important;
  }

  .navbar-glass .navbar-nav.navbar-right {
    margin-right: 0 !important;
    padding-right: 16px !important;
  }

  .navbar-glass .navbar-nav.navbar-right>li.customers-nav-item-profile {
    margin-right: 16px !important;
  }
}

@media (min-width: 1200px) and (max-width: 1399px) {
  .navbar-glass .navbar-nav>li>a {
    padding: 8px 10px !important;
    font-size: 0.84rem !important;
  }
}

/* Invoice section header button alignment (mobile right aligned in same row). */
.aw-stat-section-header {
  display: flex !important;
  align-items: center;
  gap: 10px;
}

.aw-stat-section-btn {
  margin-left: auto !important;
  border-radius: 10px !important;
  min-height: 34px;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 7px 12px !important;
  font-size: 0.79rem !important;
  white-space: nowrap;
}

/* Unified animated wave look for Home/Profile/KB hero backgrounds. */
.aw-hero-wave-bg,
.profile-header-bg,
.kb-wave-bg {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background:
    radial-gradient(120% 100% at 20% 0%, rgba(87, 173, 255, 0.28), transparent 58%),
    radial-gradient(120% 100% at 80% 100%, rgba(43, 103, 255, 0.32), transparent 62%),
    linear-gradient(125deg, rgba(12, 37, 88, 0.9), rgba(14, 23, 58, 0.86));
}

.aw-hero-wave-bg .aw-wave,
.profile-header-bg .profile-wave,
.kb-wave-bg .kb-wave {
  position: absolute;
  width: 170%;
  height: 170%;
  border-radius: 44%;
  filter: blur(1px);
  opacity: 0.46;
  transform-origin: center;
  animation: luumUnifiedWave 20s linear infinite;
}

.aw-hero-wave-bg .aw-wave-1,
.profile-header-bg .profile-wave-1,
.kb-wave-bg .kb-wave-1 {
  left: -34%;
  top: -58%;
  background: radial-gradient(circle, rgba(116, 194, 255, 0.36) 0%, rgba(116, 194, 255, 0) 66%);
  animation-duration: 21s;
}

.aw-hero-wave-bg .aw-wave-2,
.profile-header-bg .profile-wave-2,
.kb-wave-bg .kb-wave-2 {
  right: -38%;
  bottom: -62%;
  background: radial-gradient(circle, rgba(62, 130, 255, 0.35) 0%, rgba(62, 130, 255, 0) 70%);
  animation-duration: 26s;
  animation-direction: reverse;
}

.aw-hero-wave-bg .aw-wave-3,
.profile-header-bg .profile-wave-3,
.kb-wave-bg .kb-wave-3 {
  left: -10%;
  bottom: -72%;
  background: radial-gradient(circle, rgba(161, 136, 255, 0.26) 0%, rgba(161, 136, 255, 0) 72%);
  animation-duration: 30s;
}

@keyframes luumUnifiedWave {
  from {
    transform: rotate(0deg) translate3d(0, 0, 0);
  }

  50% {
    transform: rotate(180deg) translate3d(0, -2%, 0);
  }

  to {
    transform: rotate(360deg) translate3d(0, 0, 0);
  }
}

html[data-theme="light"] .aw-hero-wave-bg,
html[data-theme="light"] .profile-header-bg,
html[data-theme="light"] .kb-wave-bg {
  background:
    radial-gradient(120% 100% at 15% 0%, rgba(49, 133, 255, 0.3), transparent 58%),
    radial-gradient(120% 100% at 85% 100%, rgba(78, 164, 255, 0.28), transparent 62%),
    linear-gradient(125deg, rgba(13, 74, 156, 0.92), rgba(22, 94, 187, 0.9));
}

/* Knowledge base hero text + search alignment */
.kb-search-copy,
.kb-hero-stats {
  text-align: left !important;
  justify-content: flex-start !important;
}

.kb-search-panel {
  max-width: 560px;
}

.kb-search-input-wrapper {
  min-height: 46px !important;
  border-radius: 14px !important;
}

html[data-theme="light"] .kb-search-field {
  color: #ffffff !important;
}

html[data-theme="light"] .kb-search-field::placeholder {
  color: rgba(255, 255, 255, 0.75) !important;
}

/* Footer should be wider and end with white strip (without changing page bg). */
footer.glass-footer {
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

footer.glass-footer::after {
  content: "";
  display: block;
  width: 100%;
  height: 24px;
  background: #ffffff;
}

footer.glass-footer>.container {
  width: 100%;
  max-width: none;
}

/* KVKK / privacy page: content card look. */
.privacy-policy-heading {
  margin-bottom: 14px;
  font-weight: 600 !important;
}

.privacy-policy {
  border: 1px solid var(--lg-border);
  border-radius: 14px;
  background: var(--lg-bg-secondary);
  padding: 16px;
}

html[data-theme="light"] .privacy-policy {
  background: #ffffff;
}

/* Statement white separators: keep subtle in dark mode too. */
.section-statement .table-bordered>tbody>tr>td,
.section-statement .table-bordered>thead>tr>th,
.section-statement .table-bordered>tfoot>tr>td {
  border-color: rgba(148, 163, 184, 0.28) !important;
}

html[data-theme="dark"] .section-statement .table-bordered>tbody>tr>td,
html[data-theme="dark"] .section-statement .table-bordered>thead>tr>th,
html[data-theme="dark"] .section-statement .table-bordered>tfoot>tr>td {
  border-color: rgba(255, 255, 255, 0.14) !important;
}

/* Keep typography stable between themes. */
html[data-theme="light"] body.luumtech-theme,
html[data-theme="dark"] body.luumtech-theme {
  font-size: var(--lg-font-size-base) !important;
}

/* Project activity/feed and project ticket CTA sizing polish. */
.project-page .luum-project-activity-avatar,
.project-page .luum-project-activity-avatar .staff-profile-image-small,
.project-page .luum-project-activity-avatar .client-profile-image-small {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  border-radius: 12px !important;
  object-fit: cover;
}

.project-page .new-ticket {
  margin-left: auto !important;
  width: auto !important;
  min-height: 36px !important;
  padding: 7px 12px !important;
  border-radius: 10px !important;
  font-size: 0.8rem !important;
}

/* ===========================================
   2026-02 Final Polish X
   =========================================== */

/* Float alerts: keep single icon only. */
.float-alert.alert::after {
  display: none !important;
}

.float-alert.alert [data-notify="icon"] {
  margin-right: 8px !important;
}

/* Proposal summary typography should stay compact. */
body.proposal-view .luum-summary-highlight span,
body.proposal-view .luum-summary-row span {
  font-size: 0.74rem !important;
  font-weight: 500 !important;
}

body.proposal-view .luum-summary-highlight strong,
body.proposal-view .luum-summary-row strong {
  font-size: 0.93rem !important;
  font-weight: 600 !important;
}

@media (max-width: 768px) {

  body.proposal-view .luum-summary-highlight strong,
  body.proposal-view .luum-summary-row strong {
    font-size: 0.88rem !important;
  }
}

/* Knowledge base suggestions (custom, liquid-glass). */
.kb-search-input-wrapper {
  position: relative;
  overflow: visible !important;
}

.kb-search-suggestions {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 46px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  border-radius: 12px;
  background: rgba(13, 18, 33, 0.84);
  -webkit-backdrop-filter: blur(14px) saturate(160%);
  backdrop-filter: blur(14px) saturate(160%);
  box-shadow: 0 12px 28px rgba(2, 6, 23, 0.32);
  overflow: hidden;
  z-index: 50;
}

.kb-search-suggestion-item {
  width: 100%;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.94);
  text-align: left;
  padding: 9px 12px;
  font-size: 0.82rem;
  transition: background 0.15s ease;
}

.kb-search-suggestion-item+.kb-search-suggestion-item {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.kb-search-suggestion-item:hover,
.kb-search-suggestion-item.is-active {
  background: rgba(var(--lg-accent-rgb), 0.22);
}

html[data-theme="light"] .kb-search-suggestions {
  border-color: rgba(255, 255, 255, 0.45);
  background: rgba(18, 47, 92, 0.52);
}

/* Hide native file-selector button and use clean picker shell text. */
.luum-file-picker input[type="file"]::file-selector-button,
.luum-attachment-picker input[type="file"]::file-selector-button,
.attachments input[type="file"]::file-selector-button {
  display: none !important;
}

.luum-file-picker input[type="file"]::-webkit-file-upload-button,
.luum-attachment-picker input[type="file"]::-webkit-file-upload-button,
.attachments input[type="file"]::-webkit-file-upload-button {
  display: none !important;
}

.luum-file-picker input[type="file"],
.luum-attachment-picker input[type="file"],
.attachments input[type="file"] {
  color: transparent !important;
  text-shadow: none !important;
  cursor: pointer;
}

.luum-selected-file-name {
  display: block;
  margin-top: 6px;
  font-size: 0.76rem;
  color: var(--lg-text-secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Files dropzone: always show custom message, hide default giant icon block. */
#files-upload.dropzone .dz-default.dz-message,
#project-files-upload.dropzone .dz-default.dz-message {
  display: none !important;
}

#files-upload.dropzone .luum-dropzone-message,
#project-files-upload.dropzone .luum-dropzone-message {
  display: block !important;
}

/* Shared file row style (project + files pages). */
.luum-project-file-link {
  display: flex;
  align-items: center;
  gap: 10px;
}

.luum-project-file-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--lg-accent);
  background: rgba(var(--lg-accent-rgb), 0.12);
  flex: 0 0 auto;
}

.luum-project-file-meta {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.luum-project-file-title,
.luum-project-file-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.luum-project-file-title {
  color: var(--lg-text-primary);
  font-size: 0.82rem;
  font-weight: 600;
}

.luum-project-file-name {
  color: var(--lg-text-muted);
  font-size: 0.74rem;
}

.gpicker,
#dropbox-chooser-files .dropbox-dropin-btn,
#dropbox-chooser-project-files .dropbox-dropin-btn {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  min-height: 34px;
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid var(--lg-border) !important;
  background: var(--lg-bg-secondary) !important;
  color: var(--lg-text-primary) !important;
}

/* Elegant compact scrollbars */
.project-page .project-tabs-shell .project-tabs-nav::-webkit-scrollbar,
.project-page .table-responsive::-webkit-scrollbar,
.table-responsive.luum-list-table-responsive::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.project-page .project-tabs-shell .project-tabs-nav::-webkit-scrollbar-track,
.project-page .table-responsive::-webkit-scrollbar-track,
.table-responsive.luum-list-table-responsive::-webkit-scrollbar-track {
  background: transparent;
}

.project-page .project-tabs-shell .project-tabs-nav::-webkit-scrollbar-thumb,
.project-page .table-responsive::-webkit-scrollbar-thumb,
.table-responsive.luum-list-table-responsive::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(var(--lg-accent-rgb), 0.42);
}

/* Project activity items: reduce heavy framed look. */
.luum-project-activity-item {
  border-color: rgba(148, 163, 184, 0.22) !important;
  box-shadow: none !important;
}

/* Mobile/tablet: keep invoice title left and statement button right on the same row. */
@media (max-width: 768px) {
  .aw-stat-section-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
    gap: 10px;
  }

  .aw-stat-section-title {
    min-width: 0;
    margin: 0 !important;
    font-size: 0.95rem !important;
  }

  .aw-stat-section-btn {
    margin-left: auto !important;
    flex: 0 0 auto;
  }
}

/* Tablet navbar should behave like mobile, including profile icon and rounded hamburger. */
@media (min-width: 769px) and (max-width: 1199px) {
  .navbar-glass .mobile-profile-dropdown {
    display: inline-flex !important;
  }

  .navbar-glass .mobile-icons .navbar-toggle,
  .navbar-glass .mobile-icons .theme-toggle,
  .navbar-glass .mobile-icons .nav-language-toggle,
  .navbar-glass .mobile-profile-trigger {
    border-radius: 999px !important;
  }
}

@media (min-width: 1200px) {
  .navbar-glass .mobile-profile-dropdown {
    display: none !important;
  }
}

/* Desktop navbar: centered, content-width feel, with right side spacing. */
@media (min-width: 1200px) {
  .navbar-glass {
    width: auto !important;
    max-width: calc(100vw - 32px) !important;
    padding: 11px 18px !important;
  }

  .navbar-glass .container {
    width: auto !important;
    max-width: none !important;
  }

  .navbar-glass .navbar-nav.navbar-right {
    padding-right: 18px !important;
  }

  .navbar-glass .navbar-nav.navbar-right>li.customers-nav-item-profile {
    margin-right: 18px !important;
  }
}

/* Dark mobile/tablet: remove bright borders/frames from project components. */
@media (max-width: 991px) {

  html[data-theme="dark"] .project-page .panel_s,
  html[data-theme="dark"] .project-page .panel_s .panel-body,
  html[data-theme="dark"] .project-page .table-responsive,
  html[data-theme="dark"] .project-page .table>thead>tr>th,
  html[data-theme="dark"] .project-page .table>tbody>tr>td {
    background: #0f1521 !important;
    border-color: rgba(148, 163, 184, 0.2) !important;
  }
}

/* ===========================================
   2026-02 Final Polish XI
   =========================================== */

/* Project tabs shell should be flat (no outer border/background). */
.project-page .project-tabs-shell.preview-tabs-top.panel-full-width-tabs,
.project-page .horizontal-scrollable-tabs.preview-tabs-top.panel-full-width-tabs {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Project page scrollbar: thinner and cleaner. */
.project-page .project-tabs-shell .project-tabs-nav::-webkit-scrollbar,
.project-page .project-tabs-shell .horizontal-tabs::-webkit-scrollbar,
.project-page .table-responsive::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}

.project-page .project-tabs-shell .project-tabs-nav::-webkit-scrollbar-thumb,
.project-page .project-tabs-shell .horizontal-tabs::-webkit-scrollbar-thumb,
.project-page .table-responsive::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(var(--lg-accent-rgb), 0.38);
}

/* Dark mode project tab icons/text should stay white. */
html[data-theme="dark"] .project-page .project-tabs-shell .nav-tabs>li>a,
html[data-theme="dark"] .project-page .project-tabs-shell .nav-tabs>li>a .menu-icon,
html[data-theme="dark"] .project-page .horizontal-scrollable-tabs .nav-tabs>li>a,
html[data-theme="dark"] .project-page .horizontal-scrollable-tabs .nav-tabs>li>a .menu-icon {
  color: rgba(255, 255, 255, 0.92) !important;
}

/* Proposal summary numeric typography aligned with contract summary rhythm. */
body.proposal-view .luum-summary-highlight span,
body.proposal-view .luum-summary-row span {
  font-size: 0.76rem !important;
  font-weight: 500 !important;
}

body.proposal-view .luum-summary-highlight strong,
body.proposal-view .luum-summary-row strong {
  font-size: 0.96rem !important;
  font-weight: 600 !important;
}

body.proposal-view .luum-summary-highlight.is-value strong {
  font-size: 1.06rem !important;
  font-weight: 600 !important;
}

/* Files, contracts, support, calendar components: consistent radius with invoice style. */
body.viewfiles .panel_s,
body.viewcontracts .panel_s,
body.viewtickets .panel_s,
body.viewcalendar .panel_s {
  border-radius: 16px !important;
  overflow: hidden;
}

body.viewfiles .panel_s .panel-body,
body.viewcontracts .panel_s .panel-body,
body.viewtickets .panel_s .panel-body,
body.viewcalendar .panel_s .panel-body {
  border-radius: 16px !important;
}

.luum-page-table-shell,
.contracts-table-responsive,
body.viewcalendar #calendar {
  border: 1px solid var(--lg-border);
  border-radius: 16px;
  overflow: hidden;
  background: var(--lg-bg-secondary);
}

/* Support analytics use aw-stat style spacing and rounding. */
body.viewtickets .aw-stat-section {
  margin-bottom: 18px !important;
}

body.viewtickets .aw-stat-card {
  border-radius: 16px !important;
}

/* Navbar hover states: unified blue tone for both modes. */
.navbar-glass .navbar-nav>li>a:hover,
.navbar-glass .navbar-nav>li>a:focus {
  background: rgba(var(--lg-accent-rgb), 0.16) !important;
  border-color: rgba(var(--lg-accent-rgb), 0.45) !important;
  color: #1d4ed8 !important;
}

html[data-theme="dark"] .navbar-glass .navbar-nav>li>a:hover,
html[data-theme="dark"] .navbar-glass .navbar-nav>li>a:focus {
  background: rgba(var(--lg-accent-rgb), 0.24) !important;
  border-color: rgba(var(--lg-accent-rgb), 0.55) !important;
  color: #ffffff !important;
}

/* Keep flag/theme/profile/hamburger hover in the same language. */
.navbar-glass .nav-language-toggle:hover,
.navbar-glass .theme-toggle:hover,
.navbar-glass .profile-dropdown-toggle:hover,
.navbar-glass .profile-dropdown-toggle:focus,
.navbar-glass .mobile-profile-trigger:hover,
.navbar-glass .mobile-profile-trigger:focus,
.navbar-glass .navbar-toggle:hover,
.navbar-glass .navbar-toggle:focus {
  background: rgba(var(--lg-accent-rgb), 0.2) !important;
  border-color: rgba(var(--lg-accent-rgb), 0.55) !important;
}

/* Mobile/desktop profile icon should sit like flag/theme buttons without white shell. */
.navbar-glass .mobile-profile-trigger {
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--lg-glass-bg) !important;
}

.navbar-glass .mobile-profile-trigger .client-profile-image-small {
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  object-fit: cover;
  border-radius: 50% !important;
}

.navbar-glass .profile-dropdown-toggle .client-profile-image-small {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  object-fit: cover;
  border-radius: 50% !important;
}

/* Drive/Dropbox choose buttons should stay visible. */
.gpicker,
.gpicker:hover,
.gpicker:focus {
  opacity: 1 !important;
  visibility: visible !important;
  color: #ffffff !important;
  border-color: rgba(var(--lg-accent-rgb), 0.62) !important;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.9), rgba(37, 99, 235, 0.86)) !important;
}

#dropbox-chooser-files,
#dropbox-chooser-project-files {
  display: inline-flex !important;
  align-items: center;
}

/* Remove white strip under footer copyright. */
footer.glass-footer::after {
  display: none !important;
  height: 0 !important;
}

/* Tablet bottom bar: desktop-like centered pill behavior. */
@media (min-width: 769px) and (max-width: 1199px) {
  .bottom-bar {
    width: min(760px, calc(100% - 24px)) !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    max-width: none !important;
    padding: 8px !important;
    gap: 6px;
    justify-content: center;
  }

  .bottom-bar-item {
    flex: 0 0 auto !important;
    min-width: 132px !important;
    padding: 8px 12px !important;
    border-radius: 12px !important;
  }

  .bottom-bar-label {
    font-size: 0.78rem !important;
  }
}

/* Mobile/tablet hamburger should not have white background. */
@media (max-width: 1199px) {
  .navbar-glass .navbar-toggle {
    background: var(--lg-glass-bg) !important;
    border: 1px solid var(--lg-border) !important;
    color: var(--lg-text-primary) !important;
  }

  html[data-theme="dark"] .navbar-glass .navbar-toggle,
  html[data-theme="dark"] .navbar-glass .navbar-toggle:hover,
  html[data-theme="dark"] .navbar-glass .navbar-toggle:focus {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: rgba(255, 255, 255, 0.2) !important;
    color: #ffffff !important;
  }
}

/* ===========================================
   CHECKBOX-PRIMARY → MODERN SWITCH TOGGLES
   Uses radial-gradient background-image for the
   thumb circle (works on <input> in all browsers).
   =========================================== */

/* Container layout */
.checkbox.checkbox-primary {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-top: 6px !important;
  margin-bottom: 6px !important;
  padding: 0 !important;
}

/* The input IS the switch track — radial-gradient draws the thumb */
.checkbox.checkbox-primary input[type="checkbox"] {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  position: relative !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 22px !important;
  background-color: rgba(148, 163, 184, 0.35) !important;
  background-image: radial-gradient(circle at 12px 11px, #ffffff 7px, transparent 7px) !important;
  background-repeat: no-repeat !important;
  border-radius: 310px !important;
  border: none !important;
  outline: none !important;
  cursor: pointer !important;
  transition: background-color 0.25s ease, background-image 0s !important;
  margin: 0 !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
  display: inline-block !important;
  vertical-align: middle !important;
  box-shadow: none !important;
}

/* Unchecked hover */
.checkbox.checkbox-primary input[type="checkbox"]:hover {
  background-color: rgba(148, 163, 184, 0.45) !important;
}

/* Checked — track turns accent, thumb shifts to right side */
.checkbox.checkbox-primary input[type="checkbox"]:checked {
  background-color: var(--lg-accent, #3b82f6) !important;
  background-image: radial-gradient(circle at 28px 11px, #ffffff 7px, transparent 7px) !important;
}

/* Remove any pseudo-elements on the input */
.checkbox.checkbox-primary input[type="checkbox"]::before,
.checkbox.checkbox-primary input[type="checkbox"]::after {
  display: none !important;
}

/* Label text styling */
.checkbox.checkbox-primary label {
  display: inline !important;
  padding-left: 0 !important;
  cursor: pointer !important;
  font-size: 0.8125rem !important;
  font-weight: 400 !important;
  color: var(--lg-text-secondary, #475569) !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  position: static !important;
}

/* Remove any existing label pseudo-elements from vendor */
.checkbox.checkbox-primary label::before,
.checkbox.checkbox-primary label::after {
  display: none !important;
  content: none !important;
}

/* ── Light mode ── */
html[data-theme="light"] .checkbox.checkbox-primary input[type="checkbox"] {
  background-color: #d1d5db !important;
  background-image: radial-gradient(circle at 12px 11px, #ffffff 7px, transparent 7px) !important;
}

html[data-theme="light"] .checkbox.checkbox-primary input[type="checkbox"]:checked {
  background-color: #3b82f6 !important;
  background-image: radial-gradient(circle at 28px 11px, #ffffff 7px, transparent 7px) !important;
}

html[data-theme="light"] .checkbox.checkbox-primary label {
  color: #374151 !important;
}

/* ── Dark mode ── */
html[data-theme="dark"] .checkbox.checkbox-primary input[type="checkbox"] {
  background-color: rgba(148, 163, 184, 0.25) !important;
  background-image: radial-gradient(circle at 12px 11px, #e2e8f0 7px, transparent 7px) !important;
}

html[data-theme="dark"] .checkbox.checkbox-primary input[type="checkbox"]:checked {
  background-color: var(--lg-accent, #3b82f6) !important;
  background-image: radial-gradient(circle at 28px 11px, #ffffff 7px, transparent 7px) !important;
}

html[data-theme="dark"] .checkbox.checkbox-primary label {
  color: #e2e8f0 !important;
}

/* ===========================================
   2026-03 Client Portal Polish
   =========================================== */

/* ── Items table: border-radius on all doc pages ── */
body.proposal-view .table-responsive,
body.viewinvoice .table-responsive,
body.viewestimate .table-responsive {
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid var(--lg-border, rgba(148, 163, 184, 0.15)) !important;
}

body.proposal-view .table.items-preview,
body.viewinvoice .table.items-preview,
body.viewestimate .table.items-preview,
body.proposal-view .table.items,
body.viewinvoice .table.items,
body.viewestimate .table.items {
  margin-bottom: 0 !important;
  border: 0 !important;
}

body.proposal-view .table.items-preview thead th,
body.viewinvoice .table.items-preview thead th,
body.viewestimate .table.items-preview thead th,
body.proposal-view .table.items thead th,
body.viewinvoice .table.items thead th,
body.viewestimate .table.items thead th {
  border-top: 0 !important;
}

/* ── Totals table: padding + border-radius ── */
body.proposal-view .luum-proposal-totals-table,
body.viewinvoice .col-md-6.col-md-offset-6>.table.text-right,
body.viewestimate .col-md-6.col-md-offset-6>.table.text-right {
  border-radius: 12px !important;
  border: 1px solid var(--lg-border, rgba(148, 163, 184, 0.15)) !important;
  overflow: hidden !important;
  margin-top: 12px !important;
}

body.proposal-view .luum-proposal-totals-table td,
body.viewinvoice .col-md-6.col-md-offset-6>.table.text-right td,
body.viewestimate .col-md-6.col-md-offset-6>.table.text-right td {
  padding: 10px 14px !important;
}

/* ── Payments table: border-radius ── */
body.viewinvoice .invoice-payments-table {
  border-radius: 12px !important;
  border: 1px solid var(--lg-border, rgba(148, 163, 184, 0.15)) !important;
  overflow: hidden !important;
}

body.viewinvoice .invoice-payments-table thead th {
  border-top: 0 !important;
}

/* ── Proposal sidebar: reduce font sizes ── */
body.proposal-view .luum-summary-highlight strong,
body.proposal-view .luum-summary-row strong {
  font-size: 0.88rem !important;
}

body.proposal-view .luum-proposal-summary-grid .luum-summary-row strong {
  font-size: 0.85rem !important;
}

/* ── Discussion / comment section ── */
body.proposal-view .luum-discussion-item .staff-profile-image-small,
body.proposal-view .luum-discussion-item .media-object.img-circle,
body.contract-view .luum-discussion-item .staff-profile-image-small,
body.contract-view .luum-discussion-item .media-object.img-circle {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border-radius: 50% !important;
  object-fit: cover;
}

body.proposal-view .luum-discussion-item,
body.contract-view .luum-discussion-item {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
}

body.proposal-view .luum-discussion-body,
body.contract-view .luum-discussion-body {
  flex: 1;
  min-width: 0;
}

body.proposal-view .luum-discussion-item .pull-left,
body.contract-view .luum-discussion-item .pull-left {
  float: none !important;
  flex: 0 0 auto;
}

/* ── Invoice: overdue banner + status chip ── */
body.viewinvoice .alert.alert-danger {
  border-radius: 10px !important;
  padding: 12px 16px !important;
  font-size: 0.85rem !important;
  display: flex;
  align-items: center;
  gap: 8px;
}

body.viewinvoice .luum-doc-status-chip {
  font-size: 0.78rem !important;
  padding: 5px 14px !important;
  border-radius: 20px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
}

/* ===========================================
   Navbar profile responsive stability
   Keep flag/theme/profile group fixed when
   the desktop navbar narrows (992px–1280px).
   =========================================== */
@media (min-width: 992px) {
  .navbar-glass .navbar-collapse {
    flex-wrap: nowrap !important;
  }

  .navbar-glass .navbar-nav.navbar-right {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    flex-shrink: 0 !important;
  }

  .navbar-glass .navbar-nav.navbar-right > li {
    flex-shrink: 0 !important;
    white-space: nowrap;
  }

  .navbar-glass .customers-nav-item-profile > a.profile-dropdown-toggle {
    display: inline-flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-wrap: nowrap !important;
    white-space: nowrap !important;
  }

  .navbar-glass .customers-nav-item-profile .profile-name,
  .navbar-glass .customers-nav-item-profile .client-profile-image-small,
  .navbar-glass .customers-nav-item-profile .dropdown-caret {
    flex-shrink: 0 !important;
  }

  .navbar-glass .customers-nav-item-profile .client-profile-image-small {
    margin: 0 !important;
  }
}

/* When the desktop nav becomes cramped, hide the profile name (avatar+caret stay)
   so the profile dropdown trigger never wraps onto a new line. */
@media (min-width: 992px) and (max-width: 1199px) {
  .navbar-glass .profile-name {
    display: none !important;
  }
}

/* Profile dropdown: align to right edge of trigger so the menu doesn't
   overflow beyond the navbar's right side on smaller desktop widths. */
@media (min-width: 992px) {
  .navbar-glass .customers-nav-item-profile > .dropdown-menu,
  .navbar-glass .customers-nav-item-profile.open > .dropdown-menu {
    right: 0 !important;
    left: auto !important;
  }
}

/* ===========================================
   /clients/contracts: match invoices layout
   Wrap "Türe Göre Sözleşmeler" + chart in
   aw-stat-section card; flatten inner panel.
   =========================================== */
.aw-stat-section-contracts .aw-contracts-chart-wrap {
  position: relative;
  height: 300px;
  width: 100%;
}

.aw-stat-section-contracts .aw-contracts-chart-wrap > canvas#contracts-by-type-chart {
  width: 100% !important;
  height: 100% !important;
}

/* Inside aw-stat-section, drop the panel's own background/shadow/border so the
   table sits flush on the rounded section background. */
.aw-stat-section .panel_s.panel-flush,
.aw-stat-section .panel_s.panel-flush > .panel-body {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  padding: 0 !important;
}

@media (max-width: 575px) {
  .aw-stat-section-contracts .aw-contracts-chart-wrap {
    height: 240px;
  }
}