/* Stores Avantage interaction system: consistent contrast, feedback and touch targets. */
:root {
  --action-primary: #94621f;
  --action-primary-hover: #754912;
  --action-primary-active: #633c0d;
  --action-secondary: #16463b;
  --action-secondary-hover: #0d352d;
  --action-disabled-bg: #dedbd4;
  --action-disabled-text: #686d69;
  --action-focus: #efc58f;
  --action-shadow: 0 9px 20px rgba(75, 46, 13, .18);
}

.button {
  min-height: 44px;
  border: 1px solid var(--action-primary);
  border-radius: 4px;
  background: var(--action-primary);
  color: #fff;
  box-shadow: inset 3px 0 0 rgba(255, 255, 255, .22);
  cursor: pointer;
  touch-action: manipulation;
  transition: background-color .16s ease, border-color .16s ease,
              color .16s ease, box-shadow .16s ease, transform .16s ease;
}

.button:hover {
  border-color: var(--action-primary-hover);
  background: var(--action-primary-hover);
  color: #fff;
  box-shadow: inset 3px 0 0 rgba(255, 255, 255, .28), var(--action-shadow);
  transform: translateY(-1px);
}

.button:active {
  border-color: var(--action-primary-active);
  background: var(--action-primary-active);
  box-shadow: inset 0 2px 5px rgba(0, 0, 0, .2);
  transform: translateY(0);
}

.button-light,
.button-secondary {
  border-color: var(--action-secondary);
  background: #fff;
  color: var(--action-secondary);
  box-shadow: none;
}

.button-light:hover,
.button-secondary:hover {
  border-color: var(--action-secondary);
  background: var(--action-secondary);
  color: #fff;
  box-shadow: 0 8px 18px rgba(13, 53, 45, .14);
}

.button-ghost {
  border-color: rgba(255, 255, 255, .58);
  background: transparent;
  color: #fff;
  box-shadow: none;
}

.button-ghost:hover {
  border-color: #fff;
  background: #fff;
  color: var(--action-secondary);
  box-shadow: none;
}

.button:focus-visible,
.room-button:focus-visible,
.choice-row button:focus-visible,
.faq-tools button:focus-visible,
.filter-density-toggle:focus-visible,
.catalog-return-button:focus-visible,
.guide-compare-more:focus-visible {
  outline: 3px solid var(--action-focus);
  outline-offset: 3px;
}

.button:disabled,
.button[aria-disabled="true"] {
  border-color: var(--action-disabled-bg);
  background: var(--action-disabled-bg);
  color: var(--action-disabled-text);
  box-shadow: none;
  cursor: not-allowed;
  opacity: 1;
  pointer-events: none;
  transform: none;
}

.button[aria-busy="true"] {
  cursor: progress;
}

.button[aria-busy="true"]::before {
  width: 14px;
  height: 14px;
  margin-right: 9px;
  border: 2px solid rgba(255, 255, 255, .42);
  border-top-color: #fff;
  border-radius: 50%;
  content: "";
  animation: stores-avantage-button-spin .7s linear infinite;
}

/* Selection controls use green; copper remains reserved for sales actions. */
.room-button,
.choice-row button,
.faq-tools button,
.filter-density-toggle,
.catalog-return-button,
.guide-compare-more {
  min-height: 44px;
  border-color: #b9c3be;
  background: #fff;
  color: var(--action-secondary);
  cursor: pointer;
  touch-action: manipulation;
  transition: background-color .16s ease, border-color .16s ease,
              color .16s ease, box-shadow .16s ease;
}

.room-button:hover,
.choice-row button:hover,
.faq-tools button:hover,
.filter-density-toggle:hover,
.catalog-return-button:hover,
.guide-compare-more:hover {
  border-color: var(--action-secondary);
  background: #edf3f0;
  color: var(--action-secondary);
  box-shadow: 0 5px 14px rgba(13, 53, 45, .1);
}

.room-button.is-active,
.choice-row button.is-active,
.faq-tools button[aria-pressed="true"] {
  border-color: var(--action-secondary);
  background: var(--action-secondary);
  color: #fff;
  box-shadow: inset 3px 0 0 rgba(255, 255, 255, .2);
}

@keyframes stores-avantage-button-spin { to { transform: rotate(360deg); } }

@media (hover: none) {
  .button:hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .button,
  .room-button,
  .choice-row button,
  .faq-tools button,
  .filter-density-toggle,
  .catalog-return-button,
  .guide-compare-more { transition: none; }
  .button[aria-busy="true"]::before { animation-duration: 1.4s; }
}