/* KCJ skin action hierarchy: coral is reserved for hero and purchase actions.
   Advice, browsing, selections and small utilities use quiet neutral controls. */
:root {
  --action-coral: #F2634A;
  --action-ink: #172824;
  --action-line: #c9d1cc;
  --action-soft: #f1f5f2;
}

/* Neutral by default, including AI entry points and the advisor submit button. */
:is(#header,#main,#footer,#overlay-root) :is(
  .button,.product-adviser-submit,.product-add,.shop-price-apply,
  .shop-menu-all,.gallery-thumbs button
) {
  background-color: #fff !important;
  border-color: var(--action-line) !important;
  color: var(--action-ink) !important;
  box-shadow: none;
}

/* Small card actions stay easy to tap without dominating each product. */
:is(#main,#overlay-root) .product-card .product-add {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border: 1px solid var(--action-line);
  border-radius: 50%;
}
:is(#main,#overlay-root) .product-card .product-add > svg {
  width: 19px;
  height: 19px;
}
:is(#header,#main,#footer,#overlay-root) :is(
  .modal-close,.drawer-close,.quantity button
) {
  background-color: transparent !important;
  color: var(--action-ink) !important;
}

/* Selections use a pale fill and a dark border, not coral. */
:is(#header,#main,#footer,#overlay-root) :is(
  .active-filters button,
  .discovery-tabs a[aria-current],
  .brand-letters a[aria-current],
  .care-topic-nav button[aria-pressed="true"],
  .account-nav a.active,
  .account-nav button.active,
  .account-nav a[aria-current="page"],
  .routine-time button[aria-pressed="true"],
  .product-option-choice[aria-checked="true"],
  .adviser-intents button[aria-pressed="true"],
  .adviser-variants button[aria-pressed="true"],
  .swatches button.active,
  .swatches button[aria-pressed="true"],
  .quiz-options button.selected,
  .quiz-choice:has(input:checked),
  .checkout-choice:has(input:checked),
  .innovation-nav a[aria-current],
  .texture-filter-chips a[aria-current],
  .origin-product-types a[aria-current],
  .shop-filter-option.is-selected,
  .shop-filter-option.is-active,
  .search-suggestions [role="option"][aria-selected="true"],
  .visual-picker-menu [role="option"][aria-selected="true"],
  .adviser-suggestions li[aria-selected="true"]
) {
  background-color: var(--action-soft) !important;
  border-color: var(--action-ink) !important;
  color: var(--action-ink) !important;
}
#main .adviser-intents button[aria-pressed="true"] {
  box-shadow: inset 0 -2px var(--action-ink);
}
:is(#main,#overlay-root) .shop-filter-option.is-selected .shop-filter-check {
  background-color: var(--action-ink) !important;
  border-color: var(--action-ink) !important;
  color: #fff !important;
}

@media (hover:hover) {
  :is(#header,#main,#footer,#overlay-root) :is(
    .button,.product-add,.product-adviser-submit,.shop-price-apply,
    .shop-menu-all,.gallery-thumbs button,.active-filters button,
    .icon-button,.icon-btn,.drawer-close,.nav-disclosure,
    .header-search > button[type="submit"],.product-quick,.quick-add,
    .quantity button,.shop-price-presets button,.product-option-choice,
    .adviser-intents button,.quiz-options button,.concern-links a,
    .concern-links button,.discovery-tabs a,.shop-filter-option,
    .search-suggestions [role="option"],.visual-picker-menu [role="option"],
    .adviser-suggestions li,.site-header .shop-menu-link,
    .site-header .menu-concern-grid > a,.footer-market > button,
    .advisor-discovery-modes a
  ):not(:disabled):not([aria-disabled="true"]):hover,
  :is(#main,#overlay-root) #coupon-form button:not(:disabled):hover {
    background-color: var(--action-soft) !important;
    border-color: var(--action-ink) !important;
    color: var(--action-ink) !important;
  }
}

/* Deliberate primary actions, including the existing homepage hero accent. */
:is(#main,#overlay-root) :is(
  .shop-home-hero .hero-actions > .button,
  .home-injectables .injectables-cta,
  .product-purchase .button[data-action="add-product"],
  .summary-card > .button[href$="#/checkout"],
  .bag-content > .button[href$="#/cart"],
  #checkout-details .button,
  #place-demo-order .button,
  #secure-checkout-form .button
) {
  background-color: var(--action-coral) !important;
  border-color: var(--action-coral) !important;
  color: var(--action-ink) !important;
}

/* Keep labels and icons legible on primary and neutral surfaces. */
:is(#header,#main,#footer,#overlay-root) :is(
  .button,.product-add,.modal-close,.drawer-close
) > svg,
:is(#main,#overlay-root) :is(
  .product-option-choice[aria-checked="true"],
  .shop-filter-option.is-selected,
  .checkout-choice:has(input:checked)
) :is(strong,small,b,span) {
  color: inherit !important;
}
:is(#header,#main,#footer,#overlay-root) :is(
  .button,.product-add,.product-adviser-submit,.shop-price-apply,
  .shop-menu-all,.modal-close,.drawer-close
):focus-visible {
  outline: 2px solid var(--action-ink) !important;
  outline-offset: 3px !important;
}