/* v721 Unified Customer Brand Interactions
   Production-only presentation contract.
   Purpose: remove device-dependent/default-blue/default-white interaction states from
   Customer/Public surfaces. All interactive states resolve from the same v691 brand tokens.
   Semantic status colors (success/warning/error/open/closed) remain semantic by design. */

:is(
  body.customer-page-v115,
  body.public-page-v667,
  body.reserve-v49,
  body.track-v42,
  body.confirmation-page-v20,
  body.compliance-page-v228,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
){
  --tt-interaction-primary:var(--tt-primary);
  --tt-interaction-on-primary:var(--tt-on-primary-safe);
  --tt-interaction-secondary:var(--tt-secondary);
  --tt-interaction-on-secondary:color-mix(in srgb,var(--tt-primary) 58%,var(--tt-card-heading-safe) 42%);
  --tt-interaction-link:color-mix(in srgb,var(--tt-primary) 58%,var(--tt-heading-safe) 42%);
  --tt-interaction-card-link:color-mix(in srgb,var(--tt-primary) 58%,var(--tt-card-heading-safe) 42%);
  --tt-interaction-focus:color-mix(in srgb,var(--tt-primary) 42%,transparent);
}

/* Primary-action family. Legacy navy/orange literals are deliberately normalized here. */
:is(
  body.customer-page-v115,
  body.public-page-v667,
  body.reserve-v49,
  body.track-v42,
  body.confirmation-page-v20,
  body.compliance-page-v228,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
) :is(
  .account-btn-v717:not(.account-btn-secondary-v717):not(.account-btn-danger-v717):not(.account-logout-v717),
  .btn-v115:not(.btn-soft-v115):not(.btn-danger-v115),
  .button,
  .order,
  .primary-cta,
  .add-btn,
  .checkout-btn,
  .place-order,
  .modal-add,
  .modal-add-button-v33,
  .customer-primary-action-v568,
  .customer-cart-checkout-v568,
  .customer-category-open-v494,
  .customer-menu-nav-v494 button,
  .customer-more-heading-v497 button,
  .customer-search-context-v497 button,
  .gc-buy-button-v705,
  .compliance-btn-primary-v228,
  .btn-dark-v155,
  .v155-live-track,
  .live-tracking-history-v153,
  .customer-live-location-v205 a,
  .fulfillment-exception-actions-v587 .primary,
  .live-delivery-v207__actions a:not(.is-disabled),
  .live-delivery-v207__actions button:not(:disabled),
  .live-delivery-v321__scroll-map:not(:disabled),
  .track-footer-v42 a,
  .track-footer-v42 button,
  #manual-refresh-v42,
  #receipt-form-v47 button,
  #reserve-form-v49 button,
  .pwa-v321-btn,
  .coupon-row-v121 button,
  .coupon-code-v120,
  .customer-account-pill-v115.orange,
  .customer-account-pill-v115.dark,
  .mode-btn.active,
  [data-fulfillment-choice].active,
  [data-fulfillment-choice][aria-pressed="true"]
){
  background:var(--tt-interaction-primary)!important;
  color:var(--tt-interaction-on-primary)!important;
  border-color:var(--tt-interaction-primary)!important;
  text-decoration:none!important;
}

/* Fine-pointer hover must stay inside the configured brand family. No white swap, no blue UA state. */
@media (hover:hover) and (pointer:fine){
  :is(
    body.customer-page-v115,
    body.public-page-v667,
    body.reserve-v49,
    body.track-v42,
    body.confirmation-page-v20,
    body.compliance-page-v228,
    body.gift-store-v705,
    body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
  ) :is(
    .account-btn-v717:not(.account-btn-secondary-v717):not(.account-btn-danger-v717):not(.account-logout-v717),
    .btn-v115:not(.btn-soft-v115):not(.btn-danger-v115),
    .button,.order,.primary-cta,.add-btn,.checkout-btn,.place-order,.modal-add,.modal-add-button-v33,
    .customer-primary-action-v568,.customer-cart-checkout-v568,.customer-category-open-v494,
    .customer-menu-nav-v494 button,.customer-more-heading-v497 button,.customer-search-context-v497 button,
    .gc-buy-button-v705,.compliance-btn-primary-v228,.btn-dark-v155,.v155-live-track,.live-tracking-history-v153,
    .customer-live-location-v205 a,.fulfillment-exception-actions-v587 .primary,
    .live-delivery-v207__actions a:not(.is-disabled),.live-delivery-v207__actions button:not(:disabled),
    .live-delivery-v321__scroll-map:not(:disabled),.track-footer-v42 a,.track-footer-v42 button,
    #manual-refresh-v42,#receipt-form-v47 button,#reserve-form-v49 button,.pwa-v321-btn,
    .coupon-row-v121 button,.customer-account-pill-v115.orange,.customer-account-pill-v115.dark,
    .mode-btn.active,[data-fulfillment-choice].active,[data-fulfillment-choice][aria-pressed="true"]
  ):hover{
    background:color-mix(in srgb,var(--tt-interaction-primary) 91%,#000 9%)!important;
    color:var(--tt-interaction-on-primary)!important;
    border-color:color-mix(in srgb,var(--tt-interaction-primary) 91%,#000 9%)!important;
  }
}

/* Secondary controls are neutral surfaces with brand-aware text/borders; hover gets only a brand tint. */
:is(
  body.customer-page-v115,
  body.public-page-v667,
  body.reserve-v49,
  body.track-v42,
  body.confirmation-page-v20,
  body.compliance-page-v228,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
) :is(
  .account-btn-secondary-v717,
  .btn-soft-v115,
  .gc-secondary-button-v705,
  .secondary-cta,
  .reserve-link-v306,
  .customer-account-pill-v115.light,
  .mode-btn:not(.active),
  [data-fulfillment-choice]:not(.active):not([aria-pressed="true"]),
  .live-delivery-v321__secondary-link a
){
  background:var(--tt-interaction-secondary)!important;
  color:var(--tt-interaction-on-secondary)!important;
  border-color:color-mix(in srgb,var(--tt-interaction-on-secondary) 24%,transparent)!important;
  text-decoration:none!important;
}

@media (hover:hover) and (pointer:fine){
  :is(
    body.customer-page-v115,
    body.public-page-v667,
    body.reserve-v49,
    body.track-v42,
    body.confirmation-page-v20,
    body.compliance-page-v228,
    body.gift-store-v705,
    body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
  ) :is(
    .account-btn-secondary-v717,.btn-soft-v115,.gc-secondary-button-v705,.secondary-cta,
    .reserve-link-v306,.customer-account-pill-v115.light,.mode-btn:not(.active),
    [data-fulfillment-choice]:not(.active):not([aria-pressed="true"]),.live-delivery-v321__secondary-link a
  ):hover{
    background:color-mix(in srgb,var(--tt-interaction-secondary) 88%,var(--tt-interaction-primary) 12%)!important;
    color:var(--tt-interaction-on-secondary)!important;
    border-color:color-mix(in srgb,var(--tt-interaction-primary) 42%,var(--tt-interaction-secondary))!important;
  }
}

/* Active category/minor selector controls use brand rather than legacy navy. */
body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"] :is(
  .customer-category-mini-v497.active,
  .cat-chip.active
){
  background:color-mix(in srgb,var(--tt-primary) 13%,var(--tt-card-bg))!important;
  color:var(--tt-card-link-safe)!important;
  border-color:color-mix(in srgb,var(--tt-primary) 55%,transparent)!important;
}

/* Text-link states cannot fall back to browser blue/purple. Context determines the readable brand foreground. */
:is(
  body.customer-page-v115,
  body.compliance-page-v228,
  body.reserve-v49,
  body.track-v42,
  body.confirmation-page-v20,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
) a:any-link:not(.account-btn-v717):not(.btn-v115):not(.gc-buy-button-v705):not(.gc-secondary-button-v705):not(.pwa-v321-btn):not(.reserve-link-v306):not(.customer-account-pill-v115):not(.primary-cta):not(.secondary-cta):not(.add-btn):not(.button):not(.order){
  color:var(--tt-interaction-link)!important;
}

body.public-page-v667 main a:any-link:not(.button):not(.order){color:var(--tt-interaction-link)!important}
body.public-page-v667 .public-header-v662 a:any-link{color:var(--tt-header-text-safe)!important}
body.public-page-v667 .public-footer-v662 a:any-link,
body.reserve-v49 .reservation-public-footer-v692 a:any-link{color:var(--tt-footer-text-safe)!important}

@media (hover:hover) and (pointer:fine){
  :is(
    body.customer-page-v115,
    body.compliance-page-v228,
    body.reserve-v49,
    body.track-v42,
    body.confirmation-page-v20,
    body.gift-store-v705,
    body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
  ) a:any-link:not(.account-btn-v717):not(.btn-v115):not(.gc-buy-button-v705):not(.gc-secondary-button-v705):not(.pwa-v321-btn):not(.reserve-link-v306):not(.customer-account-pill-v115):not(.primary-cta):not(.secondary-cta):not(.add-btn):not(.button):not(.order):hover,
  body.public-page-v667 main a:any-link:not(.button):not(.order):hover{
    color:color-mix(in srgb,var(--tt-interaction-link) 88%,var(--tt-heading-safe) 12%)!important;
  }
  body.public-page-v667 .public-header-v662 a:any-link:hover{color:var(--tt-header-text-safe)!important}
  body.public-page-v667 .public-footer-v662 a:any-link:hover,
  body.reserve-v49 .reservation-public-footer-v692 a:any-link:hover{color:var(--tt-footer-text-safe)!important}
}

/* Keyboard focus and field focus use the same primary brand on desktop, tablet and mobile. */
:is(
  body.customer-page-v115,
  body.public-page-v667,
  body.reserve-v49,
  body.track-v42,
  body.confirmation-page-v20,
  body.compliance-page-v228,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
) :is(a,button,input,select,textarea,[tabindex]):focus-visible{
  outline:3px solid var(--tt-interaction-focus)!important;
  outline-offset:2px!important;
}

:is(
  body.customer-page-v115,
  body.reserve-v49,
  body.track-v42,
  body.compliance-page-v228,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
) :is(input,select,textarea):focus{
  border-color:var(--tt-primary)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--tt-primary) 18%,transparent)!important;
}

/* Checked/selected customer controls use the configured brand rather than browser/default blue. */
:is(
  body.customer-page-v115,
  body.reserve-v49,
  body.track-v42,
  body.compliance-page-v228,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
) :is(input[type="checkbox"],input[type="radio"]){
  accent-color:var(--tt-primary)!important;
}
body.notification-page-v720 .toggle-v720 input:checked + .toggle-track-v720{background:var(--tt-primary)!important}

/* Disabled and semantic danger controls stay visually distinct; never turn into active brand CTAs. */
:is(
  body.customer-page-v115,
  body.reserve-v49,
  body.track-v42,
  body.confirmation-page-v20,
  body.compliance-page-v228,
  body.gift-store-v705,
  body.shop-page[data-table-order="false"][data-staff-table-order="false"][data-staff-quick-order="false"]
) :is(button:disabled,[aria-disabled="true"],.is-disabled){
  cursor:not-allowed!important;
}