/* ===========================================================
   PCG THEME for Twenty CRM  —  consumer/Krayin-style light UI
   Loaded via <link> injected into index.html by
   /root/twenty-patches/apply-breakpoint-patch.sh (self-healing).
   Only STABLE selectors are used (semantic classes + aria state);
   Twenty's hashed emotion classes are deliberately avoided.
   Remove the <link> (or blank this file) to revert instantly.
   =========================================================== */

/* ---------- app canvas ---------- */
html.light body {
  background: linear-gradient(160deg, #EAF0FE 0%, #F3F7FE 45%, #F6F4FF 100%) !important;
}
html.light .page-layout-scroll-wrapper,
html.light .react-grid-layout { background: transparent !important; }

/* ---------- dashboard cards ---------- */
html.light .widget {
  background: #FFFFFF !important;
  border: 1px solid rgba(190, 207, 236, 0.50) !important;
  border-radius: 18px !important;
  box-shadow: 0 1px 2px rgba(23, 43, 84, 0.04),
              0 8px 22px -8px rgba(23, 43, 84, 0.12) !important;
  transition: box-shadow .2s ease, transform .2s ease, border-color .2s ease;
}
html.light .react-grid-item:hover .widget {
  border-color: rgba(99, 132, 232, 0.55) !important;
  box-shadow: 0 2px 5px rgba(23, 43, 84, 0.06),
              0 16px 36px -12px rgba(23, 43, 84, 0.22) !important;
  transform: translateY(-2px);
}

/* ---------- KPI numbers: big + brand blue ---------- */
html.light .widget h2 {
  font-size: 34px !important;
  font-weight: 700 !important;
  letter-spacing: -0.5px !important;
  color: #3B5BFD !important;
}

/* ---------- sidebar: rounded rows + solid blue active pill ---------- */
html.light a.navigation-drawer-item {
  border-radius: 10px !important;
  transition: background .15s ease;
}
html.light a.navigation-drawer-item:hover {
  background: rgba(59, 91, 253, 0.08) !important;
}
html.light a.navigation-drawer-item[aria-current] {
  background: linear-gradient(135deg, #3B5BFD 0%, #5B7BFF 100%) !important;
  box-shadow: 0 6px 14px -6px rgba(59, 91, 253, 0.65) !important;
}
html.light a.navigation-drawer-item[aria-current],
html.light a.navigation-drawer-item[aria-current] * { color: #FFFFFF !important; }
html.light a.navigation-drawer-item[aria-current] svg {
  color: #FFFFFF !important;
  stroke: #FFFFFF !important;
}

/* ---------- dark mode: keep it coherent if he ever flips back ---------- */
html.dark .widget {
  border-radius: 18px !important;
  border: 1px solid rgba(255, 255, 255, 0.07) !important;
}
html.dark a.navigation-drawer-item { border-radius: 10px !important; }
html.dark a.navigation-drawer-item[aria-current] {
  background: linear-gradient(135deg, #3B5BFD 0%, #5B7BFF 100%) !important;
}
html.dark a.navigation-drawer-item[aria-current],
html.dark a.navigation-drawer-item[aria-current] * { color: #FFFFFF !important; }