/**
 * Colored borders for dashboard / info widgets (core + modules).
 * Loaded AFTER infobms-no-chrome-borders.css so border-color wins.
 * JS (infobms-widget-borders.js) may override with hash-based accents.
 */

:root {
  --infobms-widget-1: #F97316;
  --infobms-widget-2: #6366F1;
  --infobms-widget-3: #10B981;
  --infobms-widget-4: #EF4444;
  --infobms-widget-5: #0EA5E9;
  --infobms-widget-6: #EC4899;
  --infobms-widget-7: #8B5CF6;
  --infobms-widget-8: #14B8A6;
}

.infobms-widget,
.infobms-widget-border,
.info-box,
.small-box,
.dashboard-widget-full,
.dashboard-kpi-grid > div,
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200 {
  border-width: 2px !important;
  border-style: solid !important;
  border-color: var(--infobms-widget-2, #6366F1) !important;
  /* Soften gray Tailwind ring so the accent border reads clearly */
  --tw-ring-color: transparent !important;
  box-shadow: var(--shadow-card, 0 2px 8px rgba(0, 0, 0, 0.08));
}

/* Exclusions: filters, menus, product tiles, entity cards, quick-action pills */
.product_box.tw-rounded-xl,
.entity-directory .tw-rounded-xl,
.product_list .tw-rounded-xl.tw-ring-1.tw-ring-gray-200,
.dreams-product-col .tw-rounded-xl.tw-ring-1.tw-ring-gray-200,
.tw-dw-dropdown-content.tw-rounded-xl,
.tw-dw-dropdown-content .tw-rounded-xl.tw-ring-1.tw-ring-gray-200,
a.tw-rounded-lg.tw-ring-1.tw-ring-gray-200,
button.tw-rounded-lg.tw-ring-1.tw-ring-gray-200,
.components-filters .tw-rounded-xl.tw-ring-1.tw-ring-gray-200,
div[id^="pf_"].tw-rounded-xl.tw-ring-1.tw-ring-gray-200,
div[id^="pf_"] .tw-rounded-xl.tw-ring-1.tw-ring-gray-200 {
  border-width: 0 !important;
  border-color: transparent !important;
  --tw-ring-color: rgb(229 231 235) !important;
  box-shadow: inherit;
}

/* Cycle accents (deterministic “random” look across siblings) */
.infobms-widget:nth-child(8n + 1),
.infobms-widget-border:nth-child(8n + 1),
.info-box:nth-child(8n + 1),
.small-box:nth-child(8n + 1),
.dashboard-widget-full:nth-child(8n + 1),
.dashboard-kpi-grid > div:nth-child(8n + 1),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 1) {
  border-color: var(--infobms-widget-1) !important;
}

.infobms-widget:nth-child(8n + 2),
.infobms-widget-border:nth-child(8n + 2),
.info-box:nth-child(8n + 2),
.small-box:nth-child(8n + 2),
.dashboard-widget-full:nth-child(8n + 2),
.dashboard-kpi-grid > div:nth-child(8n + 2),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 2) {
  border-color: var(--infobms-widget-2) !important;
}

.infobms-widget:nth-child(8n + 3),
.infobms-widget-border:nth-child(8n + 3),
.info-box:nth-child(8n + 3),
.small-box:nth-child(8n + 3),
.dashboard-widget-full:nth-child(8n + 3),
.dashboard-kpi-grid > div:nth-child(8n + 3),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 3) {
  border-color: var(--infobms-widget-3) !important;
}

.infobms-widget:nth-child(8n + 4),
.infobms-widget-border:nth-child(8n + 4),
.info-box:nth-child(8n + 4),
.small-box:nth-child(8n + 4),
.dashboard-widget-full:nth-child(8n + 4),
.dashboard-kpi-grid > div:nth-child(8n + 4),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 4) {
  border-color: var(--infobms-widget-4) !important;
}

.infobms-widget:nth-child(8n + 5),
.infobms-widget-border:nth-child(8n + 5),
.info-box:nth-child(8n + 5),
.small-box:nth-child(8n + 5),
.dashboard-widget-full:nth-child(8n + 5),
.dashboard-kpi-grid > div:nth-child(8n + 5),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 5) {
  border-color: var(--infobms-widget-5) !important;
}

.infobms-widget:nth-child(8n + 6),
.infobms-widget-border:nth-child(8n + 6),
.info-box:nth-child(8n + 6),
.small-box:nth-child(8n + 6),
.dashboard-widget-full:nth-child(8n + 6),
.dashboard-kpi-grid > div:nth-child(8n + 6),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 6) {
  border-color: var(--infobms-widget-6) !important;
}

.infobms-widget:nth-child(8n + 7),
.infobms-widget-border:nth-child(8n + 7),
.info-box:nth-child(8n + 7),
.small-box:nth-child(8n + 7),
.dashboard-widget-full:nth-child(8n + 7),
.dashboard-kpi-grid > div:nth-child(8n + 7),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 7) {
  border-color: var(--infobms-widget-7) !important;
}

.infobms-widget:nth-child(8n + 8),
.infobms-widget-border:nth-child(8n + 8),
.info-box:nth-child(8n + 8),
.small-box:nth-child(8n + 8),
.dashboard-widget-full:nth-child(8n + 8),
.dashboard-kpi-grid > div:nth-child(8n + 8),
.tw-rounded-xl.tw-ring-1.tw-ring-gray-200:nth-child(8n + 8) {
  border-color: var(--infobms-widget-8) !important;
}

body.dark-mode .infobms-widget,
body.dark-mode .infobms-widget-border,
body.dark-mode .info-box,
body.dark-mode .small-box,
body.dark-mode .dashboard-widget-full,
body.dark-mode .dashboard-kpi-grid > div,
body.dark-mode .tw-rounded-xl.tw-ring-1.tw-ring-gray-200 {
  box-shadow: var(--shadow-card, 0 2px 8px rgba(0, 0, 0, 0.4));
}
