/* Keyzy Automation Hub — centralized color system.
   Light/dark surfaces stay neutral. One admin-controlled accent is used only
   for focus, selection, links, active borders and primary interactive states. */
:root{
  --keyzy-accent:#2563EB;
  --keyzy-accent-rgb:37,99,235;
  --keyzy-accent-contrast:#fff;
  --keyzy-accent-soft:color-mix(in srgb,var(--keyzy-accent) 11%,white);
  --keyzy-accent-soft-2:color-mix(in srgb,var(--keyzy-accent) 18%,white);
  --keyzy-accent-border:color-mix(in srgb,var(--keyzy-accent) 42%,#d4d4d8);
  --keyzy-accent-hover:color-mix(in srgb,var(--keyzy-accent) 86%,black);
  --keyzy-accent-focus:rgba(var(--keyzy-accent-rgb),.18);
  --keyzy-success:#16a34a;--keyzy-warning:#d97706;--keyzy-danger:#dc2626;
  --keyzy-info:var(--keyzy-accent);
  accent-color:var(--keyzy-accent);
}
.dark{
  --keyzy-accent-soft:color-mix(in srgb,var(--keyzy-accent) 17%,#09090b);
  --keyzy-accent-soft-2:color-mix(in srgb,var(--keyzy-accent) 25%,#09090b);
  --keyzy-accent-border:color-mix(in srgb,var(--keyzy-accent) 52%,#27272a);
  --keyzy-accent-hover:color-mix(in srgb,var(--keyzy-accent) 78%,white);
}
::selection{background:var(--keyzy-accent);color:var(--keyzy-accent-contrast)}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--keyzy-accent);outline-offset:2px}
.ui-input:focus{border-color:var(--keyzy-accent)!important;box-shadow:0 0 0 3px var(--keyzy-accent-focus)!important}
.keyzy-accent-text{color:var(--keyzy-accent)!important}.keyzy-accent-bg{background:var(--keyzy-accent)!important;color:var(--keyzy-accent-contrast)!important}.keyzy-accent-border{border-color:var(--keyzy-accent-border)!important}.keyzy-accent-soft{background:var(--keyzy-accent-soft)!important;color:var(--keyzy-accent)!important}.keyzy-accent-control{background:var(--keyzy-accent)!important;color:var(--keyzy-accent-contrast)!important;border-color:var(--keyzy-accent)!important}.keyzy-accent-link{color:var(--keyzy-accent)!important}.keyzy-highlight-metric {
  color: var(--keyzy-accent) !important;
}
.keyzy-highlight-card {
  border-color: var(--keyzy-accent-border) !important;
  background-image: linear-gradient(135deg, var(--keyzy-accent-soft), transparent 62%);
  box-shadow: inset 3px 0 0 var(--keyzy-accent);
}

.keyzy-neutral-chip{background:var(--ui-soft,#fafafa)!important;color:inherit!important;border-color:var(--ui-border,#e5e7eb)!important}

/* Normalize historical decorative purple/violet/blue utilities to one accent. */
[class*="text-purple-"],[class*="text-violet-"],[class*="text-blue-"]{color:var(--keyzy-accent)!important}
[class*="border-purple-"],[class*="border-violet-"],[class*="border-blue-"]{border-color:var(--keyzy-accent-border)!important}
:where(div,section,article,span,p,label)[class*="bg-purple-"],:where(div,section,article,span,p,label)[class*="bg-violet-"],:where(div,section,article,span,p,label)[class*="bg-blue-"]{background-color:var(--keyzy-accent-soft)!important}
:where(button,a,input[type="submit"])[class*="bg-purple-"],:where(button,a,input[type="submit"])[class*="bg-violet-"],:where(button,a,input[type="submit"])[class*="bg-blue-"]{background-color:var(--keyzy-accent)!important;color:var(--keyzy-accent-contrast)!important;border-color:var(--keyzy-accent)!important}
[class*="ring-purple-"],[class*="ring-violet-"],[class*="ring-blue-"]{--tw-ring-color:var(--keyzy-accent-focus)!important}
[class*="from-purple-"],[class*="from-violet-"],[class*="from-blue-"]{--tw-gradient-from:var(--keyzy-accent)!important;--tw-gradient-to:rgba(var(--keyzy-accent-rgb),0)!important}
[class*="to-purple-"],[class*="to-violet-"],[class*="to-blue-"]{--tw-gradient-to:var(--keyzy-accent-hover)!important}
[class*="via-purple-"],[class*="via-violet-"],[class*="via-blue-"]{--tw-gradient-via:var(--keyzy-accent)!important}

/* Neutral shells; color is reserved for state and interaction. */
.ui-card,.dev-card,.tbb-card,.pkg-modal,.mst-modal{border-color:var(--ui-border,#e5e7eb)}
.dev-card.adb-ok,.tbb-card.selected,[aria-selected="true"],[aria-pressed="true"]{border-color:var(--keyzy-accent-border)!important}
.badge-adb{background:var(--keyzy-accent-soft)!important;color:var(--keyzy-accent)!important}
.bot-bar-fill{background:var(--keyzy-accent)!important}

/* SweetAlert and shared interactive details. */
.swal2-popup.mst-toast .swal2-timer-progress-bar{background:var(--keyzy-accent)!important}
.mst-modal-confirm{box-shadow:0 0 0 1px var(--keyzy-accent-border)}
.dark .mst-modal-confirm{box-shadow:0 0 0 1px var(--keyzy-accent-border)}

/* Keep semantic colors meaningful: green=success, amber=warning, red=danger.
   Category labels and non-destructive actions remain neutral or use the accent. */
.keyzy-state-success{background:color-mix(in srgb,var(--keyzy-success) 12%,white)!important;border-color:color-mix(in srgb,var(--keyzy-success) 34%,#e5e7eb)!important;color:var(--keyzy-success)!important}
.keyzy-state-warning{background:color-mix(in srgb,var(--keyzy-warning) 12%,white)!important;border-color:color-mix(in srgb,var(--keyzy-warning) 34%,#e5e7eb)!important;color:var(--keyzy-warning)!important}
.keyzy-state-danger{background:color-mix(in srgb,var(--keyzy-danger) 10%,white)!important;border-color:color-mix(in srgb,var(--keyzy-danger) 34%,#e5e7eb)!important;color:var(--keyzy-danger)!important}
.dark .keyzy-state-success{background:color-mix(in srgb,var(--keyzy-success) 18%,#09090b)!important;color:#86efac!important}
.dark .keyzy-state-warning{background:color-mix(in srgb,var(--keyzy-warning) 18%,#09090b)!important;color:#fcd34d!important}
.dark .keyzy-state-danger{background:color-mix(in srgb,var(--keyzy-danger) 18%,#09090b)!important;color:#fca5a5!important}
.badge-on{background:color-mix(in srgb,var(--keyzy-success) 14%,white);color:var(--keyzy-success)}
.dark .badge-on{background:color-mix(in srgb,var(--keyzy-success) 20%,#09090b);color:#86efac}
.badge-off{background:color-mix(in srgb,var(--keyzy-danger) 12%,white);color:var(--keyzy-danger)}
.dark .badge-off{background:color-mix(in srgb,var(--keyzy-danger) 18%,#09090b);color:#fca5a5}

/* Keylines shared across public, account and admin navigation. */
.ui-card:hover{border-color:var(--keyzy-accent-border)}
.nav-item.active{box-shadow:inset 0 -2px 0 var(--keyzy-accent)}
.di.active{position:relative}
.di.active::before{content:"";position:absolute;left:5px;top:10px;bottom:10px;width:3px;border-radius:999px;background:var(--keyzy-accent)}
.pkg-modal-icon{background:var(--keyzy-accent)!important;color:var(--keyzy-accent-contrast)!important;box-shadow:0 8px 22px var(--keyzy-accent-focus)!important}
.pkg-search:focus{border-color:var(--keyzy-accent)!important;box-shadow:0 0 0 3px var(--keyzy-accent-focus)!important}
.pkg-count{background:var(--keyzy-accent-soft)!important;color:var(--keyzy-accent)!important}
.pkg-row:hover,.pkg-row:focus-visible{border-color:var(--keyzy-accent-border)!important;background:var(--keyzy-accent-soft)!important}
.pkg-copy{background:var(--keyzy-accent-soft-2)!important;color:var(--keyzy-accent)!important}