/* Light mode refinements (subtle "shaded" / modern feel) */

:root[data-bs-theme="light"] body{
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(80,170,255,.10), transparent 60%),
    radial-gradient(900px 520px at 95% 0%, rgba(198,107,255,.10), transparent 55%),
    linear-gradient(180deg, #f6f7fb 0%, #f3f5f9 100%) !important;
}

/* Slightly glassy navbar/header */
:root[data-bs-theme="light"] .navbar.bg-white{
  background: rgba(255,255,255,.72) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(15,23,42,.08);
  box-shadow: 0 10px 30px rgba(15,23,42,.08) !important;
}

/* Cards (avoid affecting custom dashboard cards that already style themselves) */
:root[data-bs-theme="light"] .card:not(.kpi-card):not(.insight-card):not(.nav-card):not(.card-clean):not(.feature-card):not(.price-card):not(.testimonial-card){
  border: 1px solid rgba(15,23,42,.06);
  box-shadow: 0 10px 28px rgba(15,23,42,.06);
}

/* Page main panel: gentle border + shadow */
:root[data-bs-theme="light"] main{
  box-shadow: 0 12px 34px rgba(15,23,42,.08) !important;
  border-color: rgba(15,23,42,.08) !important;
}

/* Glassy card headers + table headers */
:root[data-bs-theme="light"] .card-header{
  background: rgba(248,250,252,.85) !important;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-bottom: 1px solid rgba(15,23,42,.06) !important;
}

:root[data-bs-theme="light"] .table thead th,
:root[data-bs-theme="light"] .table thead td{
  background: rgba(248,250,252,.92) !important;
  border-bottom-color: rgba(15,23,42,.08) !important;
}

/* Buttons: shaded / modern */
:root[data-bs-theme="light"] .btn-primary{
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,0) 55%),
    linear-gradient(180deg, #6f42c1 0%, #5a32ad 100%) !important;
  border-color: #522aa4 !important;
  box-shadow: 0 10px 22px rgba(111,66,193,.22);
}

:root[data-bs-theme="light"] .btn-primary:hover,
:root[data-bs-theme="light"] .btn-primary:focus{
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 55%),
    linear-gradient(180deg, #7a4bd0 0%, #5a32ad 100%) !important;
  border-color: #4b249b !important;
  box-shadow: 0 12px 26px rgba(111,66,193,.28);
  transform: translateY(-1px);
}

:root[data-bs-theme="light"] .btn-outline-primary{
  color: #5a32ad !important;
  border-color: rgba(90,50,173,.55) !important;
  background: rgba(111,66,193,.06);
}

:root[data-bs-theme="light"] .btn-outline-primary:hover,
:root[data-bs-theme="light"] .btn-outline-primary:focus{
  box-shadow: 0 10px 22px rgba(111,66,193,.18);
  transform: translateY(-1px);
}

/* Some pages use a "btn-animate" shimmer overlay; reduce wash-out on light outline buttons */
:root[data-bs-theme="light"] .btn-outline-primary.btn-animate::before{
  background: linear-gradient(110deg, transparent 0%, rgba(255,255,255,.22) 45%, transparent 60%) !important;
  transform: translateX(-140%) !important;
}
:root[data-bs-theme="light"] .btn-outline-primary.btn-animate:hover::before{
  transform: translateX(140%) !important;
}

/* Inputs: subtle shading */
:root[data-bs-theme="light"] .form-control,
:root[data-bs-theme="light"] .form-select{
  background-color: rgba(255,255,255,.86);
  border-color: rgba(15,23,42,.12);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
}

:root[data-bs-theme="light"] .form-control:focus,
:root[data-bs-theme="light"] .form-select:focus{
  border-color: rgba(111,66,193,.45);
  box-shadow: 0 0 0 .25rem rgba(111,66,193,.12);
}