/* SCN case-studies TABLE — tailwind utilities that the SCN cs-main markup uses
 * but that were PURGED from our copy of tailwind.680eb10e.css. These are NOT
 * custom/INNERLUXES rules: they are the exact, deterministic tailwind output for
 * the class names already present in SCN's table HTML, regenerated from the
 * exact palette in the bundle (white 255 255 255, blue-125 237 246 255,
 * blue-200 229 242 254, blue-350 173 216 255, blue-800 25 61 95). This lets the
 * table be styled entirely by SCN's own class names — no INNERLUXES selectors. */

/* hover states (filter rows + tabs) */
.hover\:bg-blue-125:hover{--tw-bg-opacity:1;background-color:rgb(237 246 255/var(--tw-bg-opacity))}
.hover\:bg-blue-200:hover{--tw-bg-opacity:1;background-color:rgb(229 242 254/var(--tw-bg-opacity))}

/* active-tab state ([&.active]:… → element itself when it also has .active) */
.\[\&\.active\]\:bg-white.active{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity))}
.\[\&\.active\]\:border.active{border-width:1px}
.\[\&\.active\]\:border-b-white.active{--tw-border-opacity:1;border-bottom-color:rgb(255 255 255/var(--tw-border-opacity))}
.\[\&\.active\]\:border-blue-350.active{--tw-border-opacity:1;border-color:rgb(173 216 255/var(--tw-border-opacity))}
.\[\&\.active\]\:text-blue-800.active{--tw-text-opacity:1;color:rgb(25 61 95/var(--tw-text-opacity))}
.\[\&\.active\]\:rounded-tl-1.active{border-top-left-radius:1px}
.\[\&\.active\]\:rounded-tr-1.active{border-top-right-radius:1px}

/* active filter panel */
.\[\&\.active\]\:block.active{display:block}

/* chevron flips when its tab (.group) is active */
.group.active .group-\[\.active\]\:rotate-180{transform:rotate(180deg)}

/* plain utilities the table uses that were also purged */
.rounded-tl-1{border-top-left-radius:1px}
.rounded-tr-1{border-top-right-radius:1px}
.border-b-white{--tw-border-opacity:1;border-bottom-color:rgb(255 255 255/var(--tw-border-opacity))}

@media (max-width:767px){
  .max-767\:\[\&\.active\]\:border-blue-350.active{--tw-border-opacity:1;border-color:rgb(173 216 255/var(--tw-border-opacity))}
  .max-767\:rounded-1{border-radius:1px}
  .max-767\:border-0{border-width:0}
}

/* truncate long filter names within their column (flex item needs min-width:0
   for the existing .text-truncate-scroll ellipsis to take effect) */
.csm-filter > .flex-1{min-width:0}

/* filter DISABLED state — SCN dims/greys filters that have no results
   ([&.disabled]:grayscale / :opacity-75 / :pointer-events-none were purged) */
.\[\&\.disabled\]\:grayscale.disabled{filter:grayscale(100%)}
.\[\&\.disabled\]\:pointer-events-none.disabled{pointer-events:none}
.\[\&\.disabled\]\:opacity-75.disabled{opacity:.75}
/* same effect bound to .csm-filter directly (our markup omits the [&.disabled] utility classes) */
.csm-filter.disabled{filter:grayscale(100%);opacity:.75;pointer-events:none}

/* hover preview check inside the box — SCN form-checkbox hover (the faint check
   that appears when you hover a filter row). .hover-children is on the row. */
@media (min-width:768px){
  .form-checkbox-label:hover .form-checkbox-checkmark,
  .hover-children:hover .form-checkbox-label .form-checkbox-checkmark{border-color:transparent}
  .form-checkbox-label:hover .form-checkbox-checkmark:after,
  .hover-children:hover .form-checkbox-label .form-checkbox-checkmark:after{opacity:.65}
}

/* long-name hover scroll: drop the ellipsis while the text is scrolling */
.csm-filter-name.scrolling{text-overflow:clip}

/* ── MOBILE table (SCN accordion) — these responsive utilities were purged ──
   Desktop: top tab row visible, wrapper tabs hidden, active panel below.
   Mobile (<=767): top row hidden, wrapper becomes a vertical accordion
   (each tab stacked directly above its panel), only 7 filters then "See more...". */
@media (min-width:768px){
  .min-768\:\[\&_\.csm-tab\]\:hidden .csm-tab{display:none}
  .min-768\:hidden{display:none}
  /* higher specificity so a later .flex in styles.css can't re-show it */
  .csm-filters .csm-see-more-filters-btn{display:none}
  .min-768\:max-1023\:right-8{right:8px}
}
@media (min-width:768px) and (max-width:1023px){
  .min-768\:max-1023\:right-8{right:8px}
}
@media (max-width:1279px){
  .max-1279\:mb-56{margin-bottom:56px}
  .max-1279\:right-4{right:4px}
}
@media (max-width:1023px){ .max-1023\:text-11{font-size:11px} }
@media (max-width:767px){
  .max-767\:hidden{display:none}
  .max-767\:flex{display:flex}
  .max-767\:flex-col{flex-direction:column}
  .max-767\:gap-4{gap:4px}
  .max-767\:mt-8{margin-top:8px}
  .max-767\:mb-24{margin-bottom:24px}
  .max-767\:mb-2{margin-bottom:2px}
  .max-767\:-mt-2{margin-top:-2px}
  .max-767\:border{border-width:1px}
  .max-767\:border-0{border-width:0}
  .max-767\:rounded-1{border-radius:1px}
  .max-767\:columns-1{columns:1}
  .max-767\:pl-16{padding-left:16px}
  .max-767\:py-6{padding-top:6px;padding-bottom:6px}
  /* filters hidden on mobile until "See more..." is pressed */
  .csm-filter-mobile-hidden{display:none}
  .csm-filters.show-all .csm-filter-mobile-hidden{display:flex}
  /* the column dividers don't make sense in single-column mobile */
  .csm-filters{column-gap:0}
}

/* scroll-to-top button — a clean CIRCLE that's clearly visible on light, dark,
   header and footer backgrounds (solid blue fill + white ring + drop shadow).
   The SCN tailwind position/rounded classes were purged, so define it fully. */
.cs-main .csm-go-top{
  position:fixed;left:calc(50% - 22px);bottom:-64px;
  width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#005eb8;border:none;cursor:pointer;padding:0;
  box-shadow:0 4px 16px rgba(0,0,0,.35),0 0 0 2px rgba(255,255,255,.75);
  transition:bottom .3s ease,background .2s ease,transform .2s ease;
  z-index:200;opacity:1;
}
.cs-main .csm-go-top.active{bottom:24px}
.cs-main .csm-go-top:hover{background:#004688;transform:translateY(-2px)}
.cs-main .csm-go-top i{color:#fff;font-size:14px;line-height:1}