/**
 * @file
 * Styling for the CWS Mobile Category off-canvas nav.
 *
 * - Improves toggle hit-area
 * - Rotates chevron when expanded
 * - Keeps layout tight for off-canvas use
 */

.arw-category-menu .arw-category-toggle {
  /* Make the chevron easier to tap on mobile */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 0.25rem;
  line-height: 1;
}

/* Make icon white. */
.arw-category-menu .arw-category-toggle .cws-chevron {
  color: #fff !important;   /* currentColor for stroke */
  stroke: currentColor;
  transition: transform 0.15s ease-in-out;
  transform: rotate(0deg);
}

/* Rotate when opened. */
.arw-category-menu .arw-category-toggle[aria-expanded="true"] .cws-chevron {
  transform: rotate(90deg);
}

/**
 * Make the collapse toggle icon white.
 */
.arw-category-menu .arw-category-toggle .bi,
.arw-category-menu .arw-category-toggle .cws-chevron {
  color: #fff !important;     /* For Bootstrap Icons */
  fill: #fff !important;       /* For inline SVG paths */
  stroke: #fff !important;     /* If SVG uses stroke */
}

/* Also turn white when expanded (rotation preserved). */
.arw-category-menu .arw-category-toggle[aria-expanded="true"] .bi,
.arw-category-menu .arw-category-toggle[aria-expanded="true"] .cws-chevron {
  color: #fff !important;
  fill: #fff !important;
  stroke: #fff !important;
}