/*
 * Button Component — Patsanis Framework v2.8
 *
 * Variants: primary, secondary, outline, ghost
 * Sizes: sm, md (default), lg
 * Supports anchors, buttons, optional icons and disabled states.
 */

.btn {
  --btn-bg: transparent;
  --btn-color: var(--color-text);
  --btn-border: transparent;
  --btn-shadow: none;
  --btn-hover-bg: var(--btn-bg);
  --btn-hover-color: var(--btn-color);
  --btn-hover-border: var(--btn-border);
  --btn-hover-shadow: var(--btn-shadow);

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .625rem;
  min-height: 52px;
  padding: .875rem 1.625rem;
  border: 1px solid var(--btn-border);
  border-radius: var(--button-radius, var(--radius-sm));
  background: var(--btn-bg);
  color: var(--btn-color);
  box-shadow: var(--btn-shadow);
  font: inherit;
  font-size: .9375rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition:
    transform var(--button-transition, 180ms ease),
    box-shadow var(--button-transition, 180ms ease),
    background-color var(--button-transition, 180ms ease),
    border-color var(--button-transition, 180ms ease),
    color var(--button-transition, 180ms ease);
}

.btn:hover {
  transform: translateY(-2px);
  border-color: var(--btn-hover-border);
  background: var(--btn-hover-bg);
  color: var(--btn-hover-color);
  box-shadow: var(--btn-hover-shadow);
  text-decoration: none;
}

.btn:active {
  transform: translateY(0);
  box-shadow: none;
}

.btn:focus-visible {
  outline: 3px solid var(--button-focus-ring, rgba(212, 175, 55, .58));
  outline-offset: 3px;
}

.btn[disabled],
.btn.is-disabled,
.btn[aria-disabled="true"] {
  opacity: .52;
  pointer-events: none;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

/* Primary action — brand purple */
.btn-primary {
  --btn-bg: var(--color-primary);
  --btn-color: #fff;
  --btn-border: var(--color-primary);
  --btn-shadow: 0 10px 24px rgba(65, 19, 112, .22);
  --btn-hover-bg: var(--color-primary-dark);
  --btn-hover-color: #fff;
  --btn-hover-border: var(--color-primary-dark);
  --btn-hover-shadow: 0 15px 32px rgba(65, 19, 112, .30);
}

/* Secondary action — restrained premium gold */
.btn-secondary {
  --btn-bg: var(--color-secondary);
  --btn-color: var(--color-secondary-ink, #251d08);
  --btn-border: var(--color-secondary);
  --btn-shadow: 0 10px 24px rgba(212, 175, 55, .22);
  --btn-hover-bg: var(--color-secondary-dark);
  --btn-hover-color: var(--color-secondary-ink, #251d08);
  --btn-hover-border: var(--color-secondary-dark);
  --btn-hover-shadow: 0 15px 32px rgba(190, 151, 40, .30);
}

.btn-outline {
  --btn-bg: transparent;
  --btn-color: var(--color-primary);
  --btn-border: rgba(65, 19, 112, .48);
  --btn-hover-bg: rgba(65, 19, 112, .07);
  --btn-hover-color: var(--color-primary-dark);
  --btn-hover-border: var(--color-primary);
  --btn-hover-shadow: 0 12px 28px rgba(65, 19, 112, .11);
}

.btn-ghost {
  --btn-bg: transparent;
  --btn-color: var(--color-primary);
  --btn-border: transparent;
  --btn-hover-bg: rgba(65, 19, 112, .07);
  --btn-hover-color: var(--color-primary-dark);
  --btn-hover-border: transparent;
}

/* Existing telephone CTA remains a purple primary action. */
.btn-call {
  --btn-bg: var(--color-primary);
  --btn-color: #fff;
  --btn-border: var(--color-primary);
  --btn-shadow: 0 10px 24px rgba(65, 19, 112, .22);
  --btn-hover-bg: var(--color-primary-dark);
  --btn-hover-color: #fff;
  --btn-hover-border: var(--color-primary-dark);
  --btn-hover-shadow: 0 15px 32px rgba(65, 19, 112, .30);
}

.btn-sm {
  min-height: 42px;
  padding: .6875rem 1.125rem;
  font-size: .8125rem;
}

.btn-lg {
  min-height: 58px;
  padding: 1rem 1.875rem;
  font-size: 1rem;
}

.btn-block {
  width: 100%;
}

.btn-icon {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.btn-icon svg {
  width: 1.1em;
  height: 1.1em;
  fill: currentColor;
}

@media (prefers-reduced-motion: reduce) {
  .btn { transition: none; }
  .btn:hover { transform: none; }
}

/* Header support CTA: gold means direct contact or support. */
.remote-header-btn,
.remote-download {
  --btn-bg: var(--color-secondary);
  --btn-color: var(--color-secondary-ink, #251d08);
  --btn-border: var(--color-secondary);
  --btn-shadow: 0 10px 24px rgba(212, 175, 55, .22);
  --btn-hover-bg: var(--color-secondary-dark);
  --btn-hover-color: var(--color-secondary-ink, #251d08);
  --btn-hover-border: var(--color-secondary-dark);
  --btn-hover-shadow: 0 15px 32px rgba(190, 151, 40, .30);
}


/* Alpha.6 Button System 2.1 */
.btn { min-height: 50px; line-height: 1; }
.btn-icon svg { width: 1.1em; height: 1.1em; display:block; }
.btn:hover:not(.is-disabled) .btn-icon:last-child { transform: translateX(2px); }
.btn-icon { transition: transform var(--button-transition); }
.btn:focus-visible { outline: 3px solid var(--button-focus-ring); outline-offset: 3px; }
.btn.is-loading { position:relative; color:transparent !important; pointer-events:none; }
.btn.is-loading::after { content:""; position:absolute; width:1rem; height:1rem; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:patsanis-spin .75s linear infinite; color:#fff; }
@keyframes patsanis-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce){.btn.is-loading::after{animation:none}}

/* RC5.1 — Contact CTA rule
 * Every action that starts direct communication uses the corporate gold.
 */
.btn-call,
.btn-contact {
  --btn-bg: var(--color-secondary, #FFC20E);
  --btn-color: var(--color-secondary-ink, #251d08);
  --btn-border: var(--color-secondary, #FFC20E);
  --btn-shadow: 0 10px 24px rgba(212, 175, 55, .24);
  --btn-hover-bg: var(--color-secondary-dark, #e3aa00);
  --btn-hover-color: var(--color-secondary-ink, #251d08);
  --btn-hover-border: var(--color-secondary-dark, #e3aa00);
  --btn-hover-shadow: 0 15px 32px rgba(190, 151, 40, .32);
}


/* RC Final CTA hierarchy: quote is gold; phone call is secondary purple outline. */
.header-actions .btn-call {
  --btn-bg: #fff;
  --btn-color: var(--color-primary, #411370);
  --btn-border: var(--color-primary, #411370);
  --btn-shadow: none;
  --btn-hover-bg: var(--color-primary, #411370);
  --btn-hover-color: #fff;
  --btn-hover-border: var(--color-primary, #411370);
  --btn-hover-shadow: 0 10px 24px rgba(65, 19, 112, .20);
  border-width: 2px;
}