/*
 * Aurum Blocks — Custom overrides & animations
 * Tailwind handles utility classes via CDN; this file adds
 * custom component styles and scroll-triggered animations.
 */

/* ── AURUM Typography System (ported from React theme.css) ── */
:root {
  --font-serif: 'Cormorant Garamond', serif;
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

body {
  background: #0B0B0C;
  color: #F2F2F0;
  font-family: var(--font-sans);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin: 0;
  padding: 0;
}

/* Keep WordPress Gutenberg editor default light background. */
body.block-editor-page,
.editor-styles-wrapper,
.block-editor-iframe__body {
  background: #fff !important;
  color: inherit !important;
}

h1 {
  font-family: var(--font-serif);
  font-size: 3.5rem;
  font-weight: 300;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin: 0;
}

h2 {
  font-family: var(--font-serif);
  font-size: 2.5rem;
  font-weight: 300;
  line-height: 1.2;
  letter-spacing: -0.01em;
  margin: 0;
}

h3 {
  font-family: var(--font-serif);
  font-size: 1.75rem;
  font-weight: 400;
  line-height: 1.3;
  margin: 0;
}

h4 {
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  margin: 0;
}

p {
  font-family: var(--font-sans);
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.7;
  color: #A8A8A8;
  margin: 0;
}

a { text-decoration: none; }

/* ── Scroll animations ── */
.aurum-animate {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.8s cubic-bezier(0.4,0,0.2,1),
              transform 0.8s cubic-bezier(0.4,0,0.2,1);
}
.aurum-animate.from-left  { transform: translateX(-30px); }
.aurum-animate.from-right { transform: translateX(30px); }
.aurum-animate.visible {
  opacity: 1;
  transform: translate(0,0);
}
.aurum-delay-1 { transition-delay: .1s; }
.aurum-delay-2 { transition-delay: .2s; }
.aurum-delay-3 { transition-delay: .3s; }
.aurum-delay-4 { transition-delay: .4s; }
.aurum-delay-5 { transition-delay: .5s; }
.aurum-delay-7 { transition-delay: .7s; }

/* ── Hero entrance ── */
@keyframes aurum-hero-scale {
  from { transform: scale(1.1); opacity: 0; }
  to   { transform: scale(1);   opacity: 1; }
}
.aurum-hero-bg-anim img {
  animation: aurum-hero-scale 1.2s cubic-bezier(0.4,0,0.2,1) forwards;
}

/* ── Product card hover ── */
.aurum-product-card { transition: border-color .5s ease; }
.aurum-product-card:hover { border-color: #C6A65A !important; }
.aurum-product-card img { transition: transform .7s ease; }
.aurum-product-card:hover img { transform: scale(1.05); }
.aurum-product-card .aurum-hover-border {
  position: absolute; inset: 0;
  border: 2px solid #C6A65A;
  opacity: 0; transition: opacity .5s ease;
  pointer-events: none;
}
.aurum-product-card:hover .aurum-hover-border { opacity: 1; }

/* ── Category tabs ── */
.aurum-cat-tab { transition: all .5s ease; cursor: pointer; }
.aurum-cat-tab:hover { border-color: #C6A65A !important; }
.aurum-cat-tab.active { border-color: #C6A65A !important; background: rgba(198,166,90,.05); }
.aurum-cat-tab.active h4 { color: #C6A65A !important; }

/* ── Skeleton pulse ── */
@keyframes aurum-pulse {
  0%,100% { opacity:1; }
  50%     { opacity:.5; }
}
.aurum-skeleton {
  background: #2A2A2A;
  border-radius: .25rem;
  animation: aurum-pulse 2s cubic-bezier(.4,0,.6,1) infinite;
}

/* ── Scroll indicator ── */
.aurum-scroll-line {
  width: 1px; height: 4rem;
  background: linear-gradient(to bottom, #C6A65A, transparent);
}

/* ── Gold bullet ── */
.aurum-bullet {
  width: 4px; height: 4px; flex-shrink: 0;
  background: #C6A65A;
  margin-top: .625rem; margin-right: .75rem;
}

/* ── Step card ── */
.aurum-step-card { transition: border-color .5s ease; }
.aurum-step-card:hover { border-color: #C6A65A !important; }

/* ── Decorative corner ── */
.aurum-deco {
  display: none !important; /* Completely hidden */
}

/* ── Checkout: compact form + payment + Place order ── */
.aurum-checkout-form {
  padding: 1.25rem 1.5rem !important;
}

/* Aurum Checkout design tokens for third-party UI (accordion) */
#aurum-checkout-form,
#aurum-checkout-form * {
  --colorBackground: #0B0B0C !important;
  --colorText: #F2F2F0 !important;
  --colorTextSecondary: #A8A8A8 !important;
  --colorTextPlaceholder: #A8A8A8 !important;
}

/* Ensure accordion backgrounds inside payment UI stay black */
#aurum-checkout-form .p-Accordion.p-Accordion--spaced {
  background-color: #0B0B0C !important;
}
.aurum-checkout-form .aurum-checkout-fields input,
.aurum-checkout-form .aurum-checkout-fields select,
.aurum-checkout-form .aurum-checkout-fields textarea {
  transition: border-color .25s ease;
}
.aurum-checkout-form .aurum-checkout-fields input:focus,
.aurum-checkout-form .aurum-checkout-fields select:focus,
.aurum-checkout-form .aurum-checkout-fields textarea:focus {
  outline: none;
  border-color: #C6A65A !important;
}

/* Payment methods: clean Aurum card, no WC arrows/triangles */
#aurum-checkout-form #payment {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid #2A2A2A;
  background: #151515;
  color: #F2F2F0;
}
#aurum-checkout-form #payment .payment_methods {
  list-style: none;
  margin: 0 0 1rem 0;
  padding: 0;
}
#aurum-checkout-form #payment .payment_methods li {
  margin: 0 0 .5rem 0;
  padding: 0;
  list-style: none;
}
#aurum-checkout-form #payment .woocommerce-NoticeGroup,
#aurum-checkout-form #payment .woocommerce-NoticeGroup-checkout,
#aurum-checkout-form #payment ul.woocommerce-error,
#aurum-checkout-form #payment .woocommerce-error,
#aurum-checkout-form #payment .stripe-source-errors,
#aurum-checkout-form #payment .wc-stripe-error {
  display: block !important;
  margin: 0 0 1rem 1rem !important;
  padding: .875rem 1rem !important;
  background: rgba(140, 36, 36, 0.18) !important;
  border: 1px solid rgba(198, 166, 90, 0.35) !important;
  color: #F2F2F0 !important;
  list-style: none !important;
}
#aurum-checkout-form #payment .woocommerce-error li,
#aurum-checkout-form #payment .stripe-source-errors li {
  color: #F2F2F0 !important;
  margin: 0 !important;
}
/* Remove WooCommerce triangle/arrow and default icons */
#aurum-checkout-form #payment .wc_payment_method::before,
#aurum-checkout-form #payment .wc_payment_method::after,
#aurum-checkout-form #payment .payment_box::before,
#aurum-checkout-form #payment .payment_box::after,
#aurum-checkout-form #payment .wc_payment_method *::before,
#aurum-checkout-form #payment .wc_payment_method *::after {
  display: none !important;
  content: none !important;
  background: none !important;
  border: none !important;
}
#aurum-checkout-form #payment .wc_payment_method,
#aurum-checkout-form #payment .payment_box {
  background-image: none !important;
}
#aurum-checkout-form #payment .wc_payment_method {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: .75rem;
  padding: .5rem 0;
  margin-left: 1rem;
  background: transparent;
  border: none;
  border-radius: 0;
  cursor: pointer;
}
#aurum-checkout-form #payment .wc_payment_method input[name="payment_method"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
#aurum-checkout-form #payment .wc_payment_method > label {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  padding: .75rem 1.25rem;
  border-radius: 999px;
  border: 1px solid #2A2A2A;
  background: #151515;
  color: #F2F2F0;
  font-size: .8125rem;
  font-weight: 500;
  cursor: pointer;
  margin: 0;
  min-width: 0;
}
#aurum-checkout-form #payment .wc_payment_method > label::before {
  content: '₣';
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 999px;
  border: 1px solid #C6A65A;
  color: #C6A65A;
  font-size: .8rem;
}
/* Hide description only for Cash on delivery; keep it for card gateways */
#aurum-checkout-form #payment .payment_method_cod .payment_box {
  display: none !important;
}

/* Stripe / Visa-Debit: visible only when selected, styled in Aurum theme */
#aurum-checkout-form #payment .payment_method_stripe .payment_box {
  display: none !important;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box {
  display: block !important;
  margin: .75rem 0 0 1rem;
  padding: 1rem;
  border: 1px solid #2A2A2A;
  border-radius: .25rem;
  background: #151515;
  color: #D4D4D4;
  font-size: .8125rem;
  line-height: 1.6;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) #wc-stripe-upe-form,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .wc-upe-form,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .wc-payment-form {
  margin: 0 !important;
  padding: 0 !important;
  background: #0B0B0C !important;
  border: 0 !important;
  box-shadow: none !important;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) fieldset,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .wc-stripe-upe-element,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .wc-stripe-upe-element-container,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .wc-stripe-upe-element-wrapper {
  background: #0B0B0C !important;
  border-color: #2A2A2A !important;
  box-shadow: none !important;
}

/* Specific accordion/fieldset inside Stripe UPE (your selector) */
#aurum-checkout-form #payment > ul > li.wc_payment_method.payment_method_stripe > div > fieldset:nth-child(4) {
  background: #0B0B0C !important;
  border: 1px solid #2A2A2A !important;
  border-radius: .25rem !important;
  color: #F2F2F0 !important;
}
#aurum-checkout-form #payment .payment_method_stripe .payment_box a {
  color: #C6A65A;
}
#aurum-checkout-form #payment .payment_method_stripe .payment_box a:hover {
  color: #d4b56d;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box label,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box span,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box p {
  color: #D4D4D4 !important;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box input[type="text"],
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box input[type="tel"],
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box input[type="email"],
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box select,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .StripeElement,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .wc-stripe-elements-field {
  background: #0B0B0C !important;
  color: #F2F2F0 !important;
  border: 1px solid #2A2A2A !important;
  border-radius: .25rem !important;
  box-shadow: none !important;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .wc-stripe-upe-element iframe {
  border-radius: .25rem !important;
}
/* Stripe UPE iframe wrapper sometimes keeps a light bottom border; force Aurum border color */
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .wc-stripe-upe-element,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .wc-stripe-upe-element-container,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .wc-stripe-upe-element-wrapper {
  border-color: #2A2A2A !important;
  background: #0B0B0C !important;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box input[type="checkbox"] {
  accent-color: #C6A65A;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .save-source-checkbox,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .woocommerce-SavedPaymentMethods-saveNew,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .wc-stripe-save-source {
  display: flex;
  align-items: center;
  gap: .625rem;
  margin-top: .875rem;
  padding-top: .875rem;
  border-top: 1px solid #2A2A2A;
}
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .save-source-checkbox label,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .woocommerce-SavedPaymentMethods-saveNew label,
#aurum-checkout-form #payment .payment_method_stripe:has(input:checked) .payment_box .wc-stripe-save-source label {
  color: #D4D4D4 !important;
  font-size: .8rem;
  cursor: pointer;
}
#aurum-checkout-form #payment .wc_payment_method:has(input:checked) > label {
  border-color: #C6A65A;
  background: rgba(198,166,90,.06);
  color: #C6A65A;
}

/* Place order row */
#aurum-checkout-form .form-row.place-order {
  margin: 1rem 0 0 0;
  padding: 0;
}
#aurum-checkout-form .form-row.place-order .woocommerce-privacy-policy-text {
  color: #A8A8A8;
  font-size: .75rem;
  margin-bottom: .75rem;
  line-height: 1.5;
}
#aurum-checkout-form #place_order {
  display: inline-block;
  width: auto;
  min-width: 12rem;
  padding: .875rem 2rem;
  background: #C6A65A !important;
  color: #0B0B0C !important;
  border: 1px solid #C6A65A !important;
  font-size: .75rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  font-weight: 500;
  cursor: pointer;
  transition: background .25s ease, color .25s ease, border-color .25s ease;
}
#aurum-checkout-form #place_order:hover {
  background: #d4b56d !important;
  border-color: #d4b56d !important;
  color: #0B0B0C !important;
}

/* ── Order received / Thank you page — Aurum styling ── */
.aurum-order-received .woocommerce-order {
  color: #F2F2F0;
  font-family: var(--font-sans);
}
.aurum-order-received .woocommerce-thankyou-order-received-text {
  color: #F2F2F0;
  font-size: 1.125rem;
  margin-bottom: 1.5rem;
}
.aurum-order-received .woocommerce-order-overview {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  border-bottom: 1px solid #2A2A2A;
  padding-bottom: 1.5rem;
}
.aurum-order-received .woocommerce-order-overview li {
  color: #D4D4D4;
  font-size: .875rem;
}
.aurum-order-received .woocommerce-order-overview li strong {
  color: #F2F2F0;
  font-weight: 500;
}
.aurum-order-received .woocommerce-order-details,
.aurum-order-received .woocommerce-customer-details {
  margin-top: 2rem;
}
.aurum-order-received .woocommerce-order-details h2,
.aurum-order-received .woocommerce-column__title,
.aurum-order-received .woocommerce-customer-details h2 {
  color: #C6A65A;
  font-family: var(--font-serif);
  font-size: 1.5rem;
  font-weight: 400;
  margin: 0 0 1rem 0;
  letter-spacing: .05em;
}
.aurum-order-received .woocommerce-table--order-details,
.aurum-order-received table.woocommerce-table {
  width: 100%;
  border: 1px solid #2A2A2A;
  border-collapse: collapse;
  background: #151515;
  margin: 0 0 1rem 0;
}
.aurum-order-received .woocommerce-table th,
.aurum-order-received .woocommerce-table td {
  padding: .75rem 1rem;
  border: 1px solid #2A2A2A;
  text-align: left;
  color: #F2F2F0;
  font-size: .875rem;
}
.aurum-order-received .woocommerce-table th {
  color: #A8A8A8;
  font-weight: 500;
}
.aurum-order-received .woocommerce-table a {
  color: #C6A65A;
}
.aurum-order-received .woocommerce-table a:hover {
  color: #d4b56d;
}
.aurum-order-received address {
  color: #D4D4D4;
  font-size: .875rem;
  line-height: 1.6;
  font-style: normal;
}
.aurum-order-received .payment_box {
  display: none !important;
}

/* ── Text grid links (contact info) ── */
.wp-block-aurum-text-grid p a {
  color: inherit;
  text-decoration: none;
  border-bottom: none;
  transition: color .25s ease;
  overflow-wrap: anywhere;
}

.wp-block-aurum-text-grid p a:hover {
  color: #D4D4D4;
}

/* ── Contact form block ── */
.aurum-contact-info,
.aurum-contact-panel {
  background: transparent;
  padding: 0;
}

.aurum-contact-label {
  display: block;
  margin-bottom: .75rem;
  color: #F2F2F0;
  font-size: .75rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  font-family: var(--font-sans);
  font-weight: 500;
}

.aurum-contact-input {
  width: 100%;
  background: #0B0B0C;
  border: 1px solid #2A2A2A;
  color: #F2F2F0;
  padding: .95rem 1rem;
  outline: none;
  transition: border-color .25s ease, box-shadow .25s ease;
  font-family: var(--font-sans);
  font-size: .95rem;
  line-height: 1.4;
}
.aurum-contact-input::placeholder {
  color: #666;
}

.aurum-contact-input:focus {
  border-color: #C6A65A;
  box-shadow: none;
}

.aurum-contact-select {
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, #A8A8A8 50%), linear-gradient(135deg, #A8A8A8 50%, transparent 50%);
  background-position: calc(100% - 18px) calc(1em + 3px), calc(100% - 12px) calc(1em + 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  padding-right: 2.5rem;
}

.aurum-contact-textarea {
  min-height: 10rem;
  resize: vertical;
}

.aurum-contact-submit {
  display: inline-block;
  border: 1px solid #C6A65A;
  color: #0B0B0C;
  background: #C6A65A;
  padding: 1rem 2.5rem;
  font-size: .75rem;
  letter-spacing: .25em;
  text-transform: uppercase;
  font-weight: 500;
  transition: all .3s ease;
  cursor: pointer;
}

.aurum-contact-submit:hover {
  background: #d4b56d;
  border-color: #d4b56d;
  color: #0B0B0C;
}

.aurum-contact-submit:disabled {
  opacity: .6;
  cursor: not-allowed;
}

.aurum-contact-note {
  margin-top: 1rem;
  color: #888;
  font-size: .75rem;
  line-height: 1.5;
}

.aurum-contact-feedback {
  margin-bottom: 1.25rem;
  padding: .875rem 1rem;
  border: 1px solid #2A2A2A;
  background: #0B0B0C;
  color: #C6A65A;
  font-size: .875rem;
}

.aurum-contact-feedback[data-state="error"] {
  border-color: #8C2424;
  color: #F2F2F0;
}

.aurum-contact-item-title {
  color: #F2F2F0;
  text-transform: uppercase;
  font-size: .95rem;
  letter-spacing: .12em;
  font-family: var(--font-sans);
  font-weight: 500;
  margin-bottom: .45rem;
}

.aurum-contact-item-value {
  color: #A8A8A8;
  font-size: 1.05rem;
  font-family: var(--font-sans);
  line-height: 1.6;
  margin-bottom: .2rem;
}
.aurum-contact-item-value a {
  color: inherit;
}

.aurum-contact-item-desc {
  color: #8A8A8A;
  font-size: .95rem;
  line-height: 1.6;
}

.aurum-business-hours {
  margin-top: 2.2rem;
  padding-top: 1.4rem;
  border-top: 1px solid #2A2A2A;
}

.aurum-business-hour-row {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  color: #A8A8A8;
  font-size: 1rem;
  line-height: 1.7;
}

@media (max-width: 768px) {
  .aurum-contact-info,
  .aurum-contact-panel {
    padding: 0;
  }

  .aurum-contact-submit {
    width: 100%;
    text-align: center;
  }

  .aurum-contact-item-value {
    font-size: 1.35rem;
  }

  .aurum-business-hour-row {
    font-size: .92rem;
  }
}