/*
 * Padrão global de botões.
 * Mantém fundos sólidos, textos em maiúsculas e cores semânticas nas confirmações.
 */
:where(
  button:not(.btn-close),
  .btn:not(.btn-close),
  input[type="button"],
  input[type="submit"],
  input[type="reset"]
) {
  text-transform: uppercase !important;
}

/*
 * A área de trabalho usa superfícies planas. Header, sidebar, login e os
 * pop-overs do topo não pertencem a estes escopos e conservam seu visual.
 */
body.app-shell #conteudoPrincipal :is(button, .btn, input[type="button"], input[type="submit"], input[type="reset"]):not(.btn-close),
body.app-shell .modal :is(button, .btn, input[type="button"], input[type="submit"], input[type="reset"]):not(.btn-close),
body.app-shell .back-to-top {
  background-image: none !important;
  box-shadow: none !important;
}

body.app-shell #conteudoPrincipal *,
body.app-shell .modal *,
body.app-shell .toast,
body.app-shell .required-field-hint,
body.app-shell .view-mode-tip,
body.app-shell .cart-send-validation-hint {
  box-shadow: none !important;
}

body.app-shell #conteudoPrincipal :is(
  .cart-item-card__controls,
  .cart-item-card__quantity,
  .cart-item-card__media
) {
  background: rgba(255, 255, 255, .82) !important;
}

body.app-shell #conteudoPrincipal .cart-checkout-totals {
  background: rgba(196, 211, 224, .72) !important;
}

/* Sombras de foco/validação são indicadores funcionais, não relevo visual. */
body.app-shell #conteudoPrincipal .required-field-shake,
body.app-shell #conteudoPrincipal .cart-required-shake,
body.app-shell #conteudoPrincipal :is(input, select, textarea).is-required-invalid:focus,
body.app-shell #conteudoPrincipal :is(input, select, textarea)[aria-invalid="true"]:focus,
body.app-shell #conteudoPrincipal .xbz-number-stepper:has(> .is-required-invalid:focus),
body.app-shell #conteudoPrincipal .xbz-number-stepper:has(> [aria-invalid="true"]:focus),
body.app-shell #conteudoPrincipal .xbz-combobox.is-invalid .xbz-combobox__trigger:focus,
body.app-shell #conteudoPrincipal .xbz-combobox.is-invalid .xbz-combobox__trigger:focus-visible,
body.app-shell #conteudoPrincipal .required-validation-attempted .input-group:has(.input-quantidade.is-required-invalid:focus) {
  box-shadow:
    0 0 0 3px var(--required-field-focus-ring),
    0 5px 14px var(--required-field-focus-shadow) !important;
}

body.app-shell #conteudoPrincipal :is(button, .btn):not(.btn-close):focus-visible,
body.app-shell .modal :is(button, .btn):not(.btn-close):focus-visible,
body.app-shell .back-to-top:focus-visible {
  outline: 2px solid currentColor !important;
  outline-offset: 2px;
}

/* Ações circulares do cabeçalho continuam translúcidas, porém sem gradiente. */
#tokenTopo,
#favoritosTopo,
#carrinhoTopo {
  background-color: rgba(255, 255, 255, .66) !important;
}

#tokenTopo[aria-expanded="true"],
#favoritosTopo[aria-expanded="true"],
#tokenTopo:focus-visible,
#favoritosTopo:focus-visible,
#carrinhoTopo:focus-visible {
  background-color: rgba(255, 255, 255, .82) !important;
}

@media (hover: hover) and (pointer: fine) {
  #carrinhoTopo:hover,
  #favoritosTopo:hover,
  #tokenTopo:hover {
    background-color: rgba(255, 255, 255, .82) !important;
  }
}

/* Botões principais mantêm uma cor sólida em todos os estados. */
.cart-submit-button--dock,
.cart-mobile-layout .cart-summary-panel .cart-submit-button {
  background: var(--cart-blue, #003865) !important;
}

.cart-submit-button--dock::after {
  background: none !important;
}

.cart-submit-button--dock:hover,
.cart-submit-button--dock:focus-visible,
.cart-mobile-layout .cart-summary-panel .cart-submit-button:hover,
.cart-mobile-layout .cart-summary-panel .cart-submit-button:focus-visible {
  background: #064872 !important;
  color: #fff !important;
}

.cart-page__continue:hover,
.cart-page__continue:focus-visible {
  background: #ffb72f !important;
}

.orders-cancel-modal__button--primary,
.cart-selection-modal__button--all,
.cart-message-modal .modal-footer .btn-primary {
  background: var(--brand-blue, #003865) !important;
}

.orders-cancel-modal__button--primary:hover,
.orders-cancel-modal__button--primary:focus-visible,
.cart-selection-modal__button--all:hover,
.cart-selection-modal__button--all:focus-visible,
.cart-message-modal .modal-footer .btn-primary:hover,
.cart-message-modal .modal-footer .btn-primary:focus-visible {
  background: #064872 !important;
}

/* Respostas binárias: SIM é positivo; NÃO é negativo. */
#btnAplicarTodosSim,
.orders-cancel-modal__button--confirm {
  border-color: #269c69 !important;
  background: #269c69 !important;
  color: #fff !important;
}

#btnAplicarTodosNao,
.orders-cancel-modal__button--keep {
  border-color: #c74250 !important;
  background: #c74250 !important;
  color: #fff !important;
}

#btnAplicarTodosSim:hover,
#btnAplicarTodosSim:focus-visible,
.orders-cancel-modal__button--confirm:hover,
.orders-cancel-modal__button--confirm:focus-visible {
  border-color: #1f8157 !important;
  background: #1f8157 !important;
  color: #fff !important;
}

#btnAplicarTodosNao:hover,
#btnAplicarTodosNao:focus-visible,
.orders-cancel-modal__button--keep:hover,
.orders-cancel-modal__button--keep:focus-visible {
  border-color: #aa3541 !important;
  background: #aa3541 !important;
  color: #fff !important;
}

:where(
  #btnAplicarTodosSim,
  #btnAplicarTodosNao,
  .orders-cancel-modal__button--confirm,
  .orders-cancel-modal__button--keep
) :is(i, span) {
  color: inherit !important;
}

/*
 * Feedback global de ponteiro: todos os controles com comportamento de botão
 * sobem e ampliam discretamente sem alterar o espaço ocupado no layout.
 * As propriedades individuais compõem com transforms próprios dos componentes.
 */
@media (hover: hover) and (pointer: fine) {
  body.motion-system-ready :is(
    button,
    .btn,
    [role="button"],
    .nav-link,
    .showcase-detail__external-action,
    .showcase-detail__mobile-external-action,
    .product-image-viewer__actions a,
    input[type="button"],
    input[type="submit"],
    input[type="reset"]
  ):not(:is(
    .xbz-combobox__trigger,
    .xbz-combobox__option,
    .xbz-number-stepper__button,
    .btn-decrement,
    .btn-increment,
    .btn-decremento,
    .btn-incremento,
    [data-image-action="zoom-out"],
    [data-image-action="zoom-in"],
    .view-toggle .btn,
    .showcase-view-toggle button,
    [role="switch"]
  )) {
    translate: 0 0;
    scale: 1;
    transition:
      translate 160ms cubic-bezier(.2, .8, .2, 1),
      scale 160ms cubic-bezier(.2, .8, .2, 1),
      transform 160ms cubic-bezier(.2, .8, .2, 1) !important;
  }

  body.motion-system-ready :is(
    button,
    .btn,
    [role="button"],
    .nav-link,
    .showcase-detail__external-action,
    .showcase-detail__mobile-external-action,
    .product-image-viewer__actions a,
    input[type="button"],
    input[type="submit"],
    input[type="reset"]
  ):not(:is(
    .xbz-combobox__trigger,
    .xbz-combobox__option,
    .xbz-number-stepper__button,
    .btn-decrement,
    .btn-increment,
    .btn-decremento,
    .btn-incremento,
    [data-image-action="zoom-out"],
    [data-image-action="zoom-in"],
    .view-toggle .btn,
    .showcase-view-toggle button,
    [role="switch"]
  )):not(:disabled):not([disabled]):not([aria-disabled="true"]):not(.disabled):hover {
    translate: 0 -2px;
    scale: 1.015;
  }

  body.motion-system-ready :is(
    button,
    .btn,
    [role="button"],
    .nav-link,
    .showcase-detail__external-action,
    .showcase-detail__mobile-external-action,
    .product-image-viewer__actions a,
    input[type="button"],
    input[type="submit"],
    input[type="reset"]
  ):not(:is(
    .xbz-combobox__trigger,
    .xbz-combobox__option,
    .xbz-number-stepper__button,
    .btn-decrement,
    .btn-increment,
    .btn-decremento,
    .btn-incremento,
    [data-image-action="zoom-out"],
    [data-image-action="zoom-in"],
    .view-toggle .btn,
    .showcase-view-toggle button,
    [role="switch"]
  )):not(:disabled):not([disabled]):not([aria-disabled="true"]):not(.disabled):active {
    translate: 0 -1px;
    scale: .975;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.motion-system-ready :is(
    button,
    .btn,
    [role="button"],
    .nav-link,
    .showcase-detail__external-action,
    .showcase-detail__mobile-external-action,
    .product-image-viewer__actions a,
    input[type="button"],
    input[type="submit"],
    input[type="reset"]
  ) {
    translate: none !important;
    scale: none !important;
    transition: none !important;
  }
}
/* Hover clareia cores escuras e escurece cores claras, preservando o tom. */
body.app-shell :is(.cart-footer-submit, .cart-submit-button--dock, .cart-send-item,
  .orders-btn-search, .orders-btn-open-product, .orders-cancel-modal__button--primary,
  .cart-selection-modal__button--all, .cart-message-modal .btn-primary) {
  --action-background: var(--brand-blue, #003865);
  --action-hover-background: color-mix(in srgb, var(--action-background) 88%, white);
  --action-color: #fff;
}
body.app-shell :is(.cart-clear-button, .orders-btn-cancel, .btn-remover-item,
  .cart-message-modal .btn-danger, #btnAplicarTodosNao, .orders-cancel-modal__button--keep) {
  --action-background: #b42332;
  --action-hover-background: color-mix(in srgb, var(--action-background) 90%, white);
  --action-color: #fff;
}
body.app-shell :is(.orders-btn-reorder, #btnAplicarTodosSim, .orders-cancel-modal__button--confirm) {
  --action-background: #269c69;
  --action-hover-background: color-mix(in srgb, var(--action-background) 92%, white);
  --action-color: #fff;
}
body.app-shell :is(.cart-page__continue, .showcase-related__add, .showcase-detail__add, .btn-adicionar-carrinho) {
  --action-background: var(--brand-gold, #ffb500);
  --action-hover-background: color-mix(in srgb, var(--action-background) 90%, black);
  --action-color: var(--brand-blue, #003865);
}
body.app-shell :is(.cart-footer-submit, .cart-submit-button--dock, .cart-send-item,
  .orders-btn-search, .orders-btn-open-product, .orders-btn-reorder, .orders-btn-cancel,
  .orders-cancel-modal__button--primary, .orders-cancel-modal__button--confirm,
  .orders-cancel-modal__button--keep, .cart-selection-modal__button--all,
  .cart-message-modal .btn-primary, .cart-message-modal .btn-danger,
  #btnAplicarTodosSim, #btnAplicarTodosNao, .btn-remover-item,
  .cart-page__continue, .showcase-related__add, .showcase-detail__add, .btn-adicionar-carrinho):not(:disabled):not([aria-disabled="true"]) {
  background: var(--action-background) !important;
  border-color: var(--action-background) !important;
  color: var(--action-color) !important;
  transition: background-color 160ms cubic-bezier(.2,.8,.2,1), border-color 160ms cubic-bezier(.2,.8,.2,1), scale 160ms cubic-bezier(.2,.8,.2,1) !important;
}
@media (hover: hover) and (pointer: fine) {
  body.app-shell :is(.cart-footer-submit, .cart-submit-button--dock, .cart-send-item,
    .orders-btn-search, .orders-btn-open-product, .orders-btn-reorder, .orders-btn-cancel,
    .orders-cancel-modal__button--primary, .orders-cancel-modal__button--confirm,
    .orders-cancel-modal__button--keep, .cart-selection-modal__button--all,
    .cart-message-modal .btn-primary, .cart-message-modal .btn-danger,
    #btnAplicarTodosSim, #btnAplicarTodosNao, .btn-remover-item,
    .cart-page__continue, .showcase-related__add, .showcase-detail__add, .btn-adicionar-carrinho):not(:disabled):not([aria-disabled="true"]):hover {
    background: var(--action-background) !important;
    border-color: var(--action-background) !important;
    color: var(--action-color) !important;
    background: var(--action-hover-background) !important;
    border-color: var(--action-hover-background) !important;
    filter: none !important;
    translate: none !important;
    transform: none !important;
    scale: 1.015;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.app-shell :is(button, .btn) {
    scale: none !important;
    transition: none !important;
  }
}
/* Adicionar nos cards: feedback de cor suave, sem deslocamento. */
@media (hover: hover) and (pointer: fine) {
  body.app-shell #conteudoPrincipal :is(.product-card, .showcase-card) .btn-adicionar-carrinho:not(:disabled):not([aria-disabled="true"]):hover {
    background: var(--brand-gold, #ffb500) !important;
    color: var(--brand-blue, #003865) !important;
    background: color-mix(in srgb, var(--brand-gold, #ffb500) 97%, black) !important;
    border-color: color-mix(in srgb, var(--brand-gold, #ffb500) 97%, black) !important;
    filter: none !important;
    scale: none !important;
    translate: none !important;
    transform: none !important;
  }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  body.app-shell #conteudoPrincipal :is(.product-card, .showcase-card) .btn-adicionar-carrinho:not(:disabled):not([aria-disabled="true"]):hover {
    scale: 1.015 !important;
  }
}
/* Ícone e rótulo recebem somente a escala do botão, sem movimento próprio. */
body.app-shell :is(button, .btn):has(> i):has(> span):not([role="switch"]) > :is(i, span),
body.app-shell :is(button, .btn):has(> svg):has(> span):not([role="switch"]) > :is(svg, span) {
  transform: none !important;
  translate: none !important;
  scale: none !important;
  rotate: none !important;
}
/* Ícones das ações de pedido: caixa estável e centralizada em todos os estados. */
body.app-shell :is(.orders-btn-reorder, .orders-btn-cancel, .btn-remover-item) > i.bi {
  display: inline-flex !important;
  width: 1em;
  height: 1em;
  flex: 0 0 1em;
  align-items: center;
  justify-content: center;
  margin: 0;
  line-height: 1;
  color: inherit !important;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  rotate: none !important;
  transition: none !important;
}
body.app-shell :is(.orders-btn-reorder, .orders-btn-cancel, .btn-remover-item) > i.bi::before {
  display: block;
  vertical-align: 0;
  line-height: 1;
  transform: none !important;
  translate: none !important;
  scale: none !important;
  rotate: none !important;
}
