/*
 * Shared button depth policy.
 *
 * Keep this stylesheet last on every page. Page-specific styles own color,
 * sizing and layout; this file is the single authority for elevation so a
 * local edit cannot bring back a detached, solid "3D ledge" under a button.
 */
:root {
  --button-shadow-primary: 0 6px 16px rgba(44, 101, 75, .18);
  --button-shadow-primary-hover: 0 9px 20px rgba(44, 101, 75, .22);
  --button-shadow-primary-active: 0 2px 6px rgba(44, 101, 75, .16);
  --button-shadow-danger: 0 6px 16px rgba(201, 52, 41, .20);
  --button-shadow-neutral: 0 5px 14px rgba(32, 37, 30, .10);
}

/* Controls are flat by default. Elevation is opt-in through semantic actions. */
:where(button, input[type="button"], input[type="submit"], input[type="reset"], [role="button"]) {
  box-shadow: none !important;
}

:where(
  .login-card button:not(.password-visibility),
  .owner-page .store-profile-form button,
  .owner-page .business-status button,
  .owner-page .product-add-form > button,
  .owner-page .product-edit-actions button[type="submit"],
  .owner-page .category-add-form button,
  .owner-page .category-edit-form button[type="submit"],
  .owner-page .seat-add-form button,
  .owner-page .seat-edit-form button[type="submit"],
  .owner-page .staff-form button,
  .owner-page .staff-edit-actions button[type="submit"],
  .owner-page .heat-setting button,
  .owner-page .operation-setting button,
  .owner-page .order-sound-setting button[type="submit"],
  .owner-page .owner-account-forms button,
  .owner-page [data-show-staff-qr],
  .owner-page .print-qr,
  .owner-page .move-table-button,
  .served-button,
  .made-button,
  .send-order,
  .checkout-button,
  .lp-header-cta,
  .affiliate-primary
) {
  box-shadow: var(--button-shadow-primary) !important;
}

:where(.login-card .passkey-login, .platform-header .passkey-register) {
  box-shadow: var(--button-shadow-neutral) !important;
}

:where(.danger-solid, button.danger, button[data-danger="true"]) {
  box-shadow: var(--button-shadow-danger) !important;
}

@media (hover: hover) {
  :where(
    .login-card button:not(.password-visibility),
    .owner-page .store-profile-form button,
    .owner-page .business-status button,
    .owner-page .product-add-form > button,
    .owner-page .product-edit-actions button[type="submit"],
    .owner-page .category-add-form button,
    .owner-page .category-edit-form button[type="submit"],
    .owner-page .seat-add-form button,
    .owner-page .seat-edit-form button[type="submit"],
    .owner-page .staff-form button,
    .owner-page .staff-edit-actions button[type="submit"],
    .owner-page .heat-setting button,
    .owner-page .operation-setting button,
    .owner-page .order-sound-setting button[type="submit"],
    .owner-page .owner-account-forms button,
    .owner-page [data-show-staff-qr],
    .owner-page .print-qr,
    .owner-page .move-table-button,
    .served-button,
    .made-button,
    .send-order,
    .checkout-button,
    .lp-header-cta,
    .affiliate-primary
  ):not(:disabled):hover {
    box-shadow: var(--button-shadow-primary-hover) !important;
  }
}

:where(
  .login-card button:not(.password-visibility),
  .owner-page .store-profile-form button,
  .owner-page .business-status button,
  .owner-page .product-add-form > button,
  .owner-page .product-edit-actions button[type="submit"],
  .owner-page .category-add-form button,
  .owner-page .category-edit-form button[type="submit"],
  .owner-page .seat-add-form button,
  .owner-page .seat-edit-form button[type="submit"],
  .owner-page .staff-form button,
  .owner-page .staff-edit-actions button[type="submit"],
  .owner-page .heat-setting button,
  .owner-page .operation-setting button,
  .owner-page .order-sound-setting button[type="submit"],
  .owner-page .owner-account-forms button,
  .owner-page [data-show-staff-qr],
  .owner-page .print-qr,
  .owner-page .move-table-button,
  .served-button,
  .made-button,
  .send-order,
  .checkout-button,
  .lp-header-cta,
  .affiliate-primary
):not(:disabled):active {
  box-shadow: var(--button-shadow-primary-active) !important;
}

:where(button, input[type="button"], input[type="submit"], input[type="reset"]):disabled {
  box-shadow: none !important;
}

@media (prefers-reduced-motion: reduce) {
  :where(button, input[type="button"], input[type="submit"], input[type="reset"], [role="button"]) {
    transition-duration: .01ms !important;
  }
}
