/* ===========================================================
   ORANGE THEME OVERRIDES
   Applies to: /orange/autumn.html, /orange/spring.html, /orange/summer.html
   =========================================================== */

/* ---------- Base tokens ---------- */
:root {
  --accent:       #f97316;           /* primary orange */
  --accent-2:     #fdba74;           /* lighter orange for gradients */
  --accent-glow:  249,115,22;        /* RGB for glows (no hash) */
}

/* ---------- Chip dot ---------- */
.brand .chip .dot {
  background: radial-gradient(
    circle at 35% 35%,
    #fed7aa 0 26%,
    #fdba74 27% 58%,
    var(--accent) 59% 100%
  );
  box-shadow: 0 0 10px rgba(var(--accent-glow), 0.35);
}

/* ---------- Card highlight ---------- */
.card.focused {
  border-color: var(--accent);
  box-shadow:
    0 0 20px rgba(var(--accent-glow), 0.5),
    0 18px 36px rgba(0, 0, 0, 0.38);
  filter: brightness(1.03);
}

/* ---------- Menu list items ---------- */
.side-item:hover,
.side-item.active {
  background: var(--accent);
  color: #fff;
}
.side-item .mi-step {
  color: var(--accent);
}
.side-item.active .mi-step {
  color: #7c2d12; /* deep orange-brown */
}

/* ---------- Scrollbar ---------- */
.side-list::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--accent), var(--accent-2));
  border-radius: 5px;
}
.side-list::-webkit-scrollbar-thumb:hover {
  background: var(--accent);
}

/* ---------- Carousel buttons ---------- */
.unit-main .nav-bar button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 2px solid #7c2d12;
  background: var(--accent);
  color: #fff;
  font-weight: 900;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.95;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
  transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.unit-main .nav-bar button:hover {
  transform: translateY(-2px);
  box-shadow:
    0 8px 24px rgba(0, 0, 0, 0.4),
    0 0 12px rgba(249, 115, 22, 0.8); /* soft orange glow on hover */
}

.unit-main .nav-bar button:disabled {
  opacity: 0.25;
  cursor: not-allowed;
  box-shadow: none;
}