/*
 * buttons.css — ANZ v3 Button Component
 *
 * Namespace: .anz-v3-btn (NEW component namespace per Phase 3 design decision)
 * The legacy Bootstrap-shadow layer (.btn-primary, .btn-secondary, .btn-ghost)
 * lives in v3-shell.css for pages that still use Bootstrap class names.
 * New Phase 4 markup should use .anz-v3-btn-* classes from this file.
 *
 * Variants: primary / secondary / tertiary / ghost / danger
 * All selectors scoped: body.anz-v3 .anz-v3-btn*
 * No hex values — var(--...) only.
 * No !important except documented legacy-scrub.
 *
 * Brand: brand PDF page 4 — Coral Reef for request moments (primary),
 *        Pacific Blue outlined for secondary, Grey for tertiary/default.
 * Phase 4 pages: all pages depend on this component.
 * Provenance: docs/07-ia-composition.md §3.2, §3.5
 */


/* ===================================================================
 * BASE — shared across all .anz-v3-btn variants
 * =================================================================== */

body.anz-v3 .anz-v3-btn {
  align-items: center;
  border: 2px solid transparent;
  border-radius: var(--radius-md);
  cursor: pointer;
  display: inline-flex;
  font-family: var(--font-family);
  font-size: var(--type-body-m-size);
  font-weight: var(--font-weight-medium);
  justify-content: center;
  line-height: 1;
  min-width: 0;
  padding: var(--space-3) var(--space-8);
  text-decoration: none;
  text-transform: none;
  transition:
    background-color var(--motion-fast) var(--motion-exit),
    border-color var(--motion-fast) var(--motion-exit),
    box-shadow var(--motion-fast) var(--motion-exit),
    color var(--motion-fast) var(--motion-exit);
  user-select: none;
  vertical-align: middle;
}

body.anz-v3 .anz-v3-btn:disabled,
body.anz-v3 .anz-v3-btn[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.45;
  pointer-events: none;
}

body.anz-v3 .anz-v3-btn:focus-visible {
  outline: var(--focus-ring-width) solid var(--focus-ring-color);
  outline-offset: var(--focus-ring-offset);
}


/* ===================================================================
 * PRIMARY — Pacific Blue background, Cloud White text
 * =================================================================== */

body.anz-v3 .anz-v3-btn-primary {
  background-color: var(--anz-pacific-blue);
  border-color: var(--anz-pacific-blue);
  color: var(--anz-cloud-white);
}

body.anz-v3 .anz-v3-btn-primary1 {
    background-color: var(--anz-cloud-white);
    border-color: var(--anz-pacific-blue);
    color: var(--anz-pacific-blue);
}

body.anz-v3 .anz-v3-btn-primary:focus,
body.anz-v3 .anz-v3-btn-primary:hover {
  background-color: var(--anz-pacific-blue);
  border-color: var(--anz-pacific-blue);
  box-shadow: var(--shadow-md);
  color: var(--anz-cloud-white);
  filter: brightness(0.92);
  text-decoration: none;
}

body.anz-v3 .anz-v3-btn-primary:active {
  filter: brightness(0.85);
}

/* Larger variant for the cart primary CTA. */
body.anz-v3 .anz-v3-btn-large {
  font-size: var(--type-body-l-size, 18px);
  font-weight: var(--font-weight-bold, 700);
  padding: var(--space-4, 16px) var(--space-10, 48px);
}


/* ===================================================================
 * SECONDARY — Pacific Blue outlined
 * Per Phase 2 reviewer: Register button on Login defaults to secondary
 * (Pacific Blue outlined) unless IA specifies otherwise in Phase 4.
 * =================================================================== */

body.anz-v3 .anz-v3-btn-secondary {
  background-color: transparent;
  border-color: var(--anz-pacific-blue);
  color: var(--anz-pacific-blue);
}

body.anz-v3 .anz-v3-btn-secondary:focus,
body.anz-v3 .anz-v3-btn-secondary:hover {
  background-color: var(--anz-pacific-blue);
  border-color: var(--anz-pacific-blue);
  color: var(--text-on-primary);
  text-decoration: none;
}

body.anz-v3 .anz-v3-btn-secondary:active {
  filter: brightness(0.92);
}


/* ===================================================================
 * TERTIARY — subtle Grey outlined (low-emphasis actions)
 * =================================================================== */

body.anz-v3 .anz-v3-btn-tertiary {
  background-color: transparent;
  border-color: var(--border-strong);
  color: var(--text-secondary);
}

body.anz-v3 .anz-v3-btn-tertiary:focus,
body.anz-v3 .anz-v3-btn-tertiary:hover {
  background-color: var(--bg-soft);
  border-color: var(--border-strong);
  color: var(--text);
  text-decoration: none;
}

body.anz-v3 .anz-v3-btn-tertiary:active {
  background-color: var(--border);
}


/* ===================================================================
 * GHOST — text-only link-style button
 * =================================================================== */

body.anz-v3 .anz-v3-btn-ghost {
  background-color: transparent;
  border-color: transparent;
  color: var(--link);
  padding-left: 0;
  padding-right: 0;
}

body.anz-v3 .anz-v3-btn-ghost:focus,
body.anz-v3 .anz-v3-btn-ghost:hover {
  background-color: transparent;
  border-color: transparent;
  color: var(--link-hover);
  text-decoration: underline;
}


/* ===================================================================
 * GHOST INVERSE — outline button for use on Pacific Blue backgrounds
 * =================================================================== */

body.anz-v3 .anz-v3-btn-ghost-inverse {
  background-color: transparent;
  border-color: var(--anz-cloud-white);
  color: var(--anz-cloud-white);
}

body.anz-v3 .anz-v3-btn-ghost-inverse:focus,
body.anz-v3 .anz-v3-btn-ghost-inverse:hover {
  background-color: var(--anz-cloud-white);
  border-color: var(--anz-cloud-white);
  color: var(--anz-pacific-blue);
  text-decoration: none;
}


/* ===================================================================
 * DANGER — destructive actions
 * =================================================================== */

body.anz-v3 .anz-v3-btn-danger {
  background-color: var(--anz-coral-reef);
  border-color: var(--anz-coral-reef);
  color: var(--text-on-primary);
}

body.anz-v3 .anz-v3-btn-danger:focus,
body.anz-v3 .anz-v3-btn-danger:hover {
  box-shadow: var(--shadow-md);
  color: var(--text-on-primary);
  filter: brightness(0.88);
  text-decoration: none;
}

body.anz-v3 .anz-v3-btn-danger:active {
  filter: brightness(0.78);
}


/* ===================================================================
 * SIZE MODIFIERS
 * =================================================================== */

body.anz-v3 .anz-v3-btn-sm {
  font-size: var(--type-body-s-size);
  padding: var(--space-2) var(--space-4);
}

body.anz-v3 .anz-v3-btn-lg {
  font-size: var(--type-body-l-size);
  padding: var(--space-4) var(--space-12);
}

body.anz-v3 .anz-v3-btn-full {
  justify-content: center;
  width: 100%;
}


/* ===================================================================
 * RESPONSIVE
 * =================================================================== */

@media (max-width: 768px) {
  body.anz-v3 .anz-v3-btn-full-mobile {
    justify-content: center;
    width: 100%;
  }
}


/* ===================================================================
 * REDUCED MOTION
 * =================================================================== */

@media (prefers-reduced-motion: reduce) {
  body.anz-v3 .anz-v3-btn {
    transition: none;
  }
}