/*
 * AvyaKrafts theme A "Logo Purple & Orange" (WordPress child theme only).
 * Loaded AFTER the shared brand CSS, so it re-maps the brand variables.
 *
 *   base     warm white  #FFFAF3  /  surface  #F8F1E7
 *   primary  logo purple #7E3AC8  (links, headings, selected states) - 6.3:1 on white
 *   accent   logo orange #FF9E02  (main buttons, dark text on it)
 *   gold     #C9A45C decorative only;  ink #2A2030 text
 */
:root {
  --avya-ivory: #FFFFFF;          /* backgrounds: white + light orange only */
  --avya-cream: #FFF4E4;
  --avya-beige: #F3E2C8;
  --avya-blush: #FFE8C6;
  --avya-sage: #C9A45C;
  --avya-gold: #C9A45C;
  --avya-primary: #7E3AC8;
  --avya-primary-dark: #5E2A99;
  --avya-primary-tint: #F4EBFD;
  --avya-accent: #FF9E02;
  --avya-gold-deep: #7E3AC8;      /* links, eyebrows, prices */
  --avya-ink: #2A2030;
  --avya-muted: #5E5566;
  --avya-radius: 18px;
  --avya-radius-sm: 12px;
  --avya-shadow: 0 10px 30px rgba(42, 32, 48, 0.08);
  --avya-shadow-sm: 0 2px 10px rgba(42, 32, 48, 0.07);
  --avya-focus: 0 0 0 3px rgba(109, 52, 179, 0.4);
}

body { background: #fff url(../doodles.svg) 0 0 / 440px; }
a { text-underline-offset: 3px; }

/* ---- buttons ---- */
.btn, .avya-btn, .wp-block-button__link, .wp-element-button {
  background: var(--avya-accent);
  border-color: var(--avya-accent);
  color: #2A1A00 !important;
  font-weight: 700;
  letter-spacing: .01em;
  transition: background .15s, transform .15s, box-shadow .15s;
}
.btn:hover, .avya-btn:hover, .wp-block-button__link:hover, .wp-element-button:hover {
  background: #F08C00;
  border-color: #F08C00;
  color: #2A1A00 !important;
  transform: translateY(-1px);
  box-shadow: var(--avya-shadow-sm);
}
.btn--ghost, .avya-btn--ghost, .wp-block-button.is-style-outline .wp-block-button__link {
  background: transparent;
  color: var(--avya-primary) !important;
  border: 2px solid var(--avya-primary);
}
.btn--ghost:hover, .avya-btn--ghost:hover, .wp-block-button.is-style-outline .wp-block-button__link:hover {
  background: var(--avya-primary-tint);
  color: var(--avya-primary-dark) !important;
}

/* ---- header / footer ---- */
.site-header { background: #2B1840; border-bottom: 3px solid var(--avya-accent); box-shadow: 0 4px 18px rgba(43, 24, 64, .25); }
.site-footer { background: #1F1426; color: #EFE7F7; }
.site-footer a { color: #fff; }
.site-footer h2 { color: #fff; }
.footer__small, .site-footer .has-small-font-size { border-color: rgba(255, 255, 255, .15); color: #CBB9DE; }

/* ---- sections ---- */
.hero {
  background:
    radial-gradient(900px 420px at 88% -12%, #FFE3BA 0, transparent 62%),
    url(../doodles.svg) 0 0 / 440px,
    #fff;
}
.section--tint, .page-head, .section--blush { background: var(--avya-cream) url(../doodles.svg) 0 0 / 440px; }
.eyebrow { color: var(--avya-primary); }
.hero__word em { color: var(--avya-primary); }
.steps li::before { background: var(--avya-primary-tint); color: var(--avya-primary-dark); }
.checklist li::before { color: var(--avya-primary); }
a.cat:hover { border-color: var(--avya-primary); }
.card, .gal figure, .steps li, a.cat, .review { border-color: var(--avya-beige); }
.chip[aria-pressed="true"] { background: var(--avya-primary); border-color: var(--avya-primary); color: #fff; }
.draft-note, .confirm { background: #FFF1D6; }

/* ---- customizer ---- */
.avya-progress li.is-current > span { background: var(--avya-primary); color: #fff; }
.avya-progress li > button { background: var(--avya-primary-tint); color: var(--avya-primary-dark); }
.avya-card.is-selected, .avya-opt.is-selected, .avya-swatch.is-selected {
  border-color: var(--avya-primary);
  box-shadow: 0 0 0 2px var(--avya-primary) inset;
}
.avya-card:hover, .avya-opt:hover { border-color: var(--avya-primary); }
.avya-card__art { background: var(--avya-cream); }
.avya-preview__toggle { background: var(--avya-primary-tint); }
.avya-totals__amt { color: var(--avya-primary-dark); }
.avya-check input, .avya-field input[type=checkbox] { accent-color: var(--avya-primary); }
.avya-qty__ctl button { background: var(--avya-primary-tint); border-color: #D9C6F0; color: var(--avya-primary-dark); }
.avya-ref { background: var(--avya-primary-tint); color: var(--avya-primary-dark); }
.avya-upload input[type=file] { background: var(--avya-cream); border-color: #D9C6F0; }

/* ---- photo cards + "photo needed" placeholders (owner replaces them with real photos) ---- */
a.card { display: block; text-decoration: none; color: inherit; padding: 0; overflow: hidden; }
a.card > h3, a.card > p { padding: 0 18px; }
a.card > h3 { margin-top: 14px; color: var(--avya-primary); }
a.card > p { padding-bottom: 16px; margin: 0; }
a.card > img, a.card > .photo-needed { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
a.card:hover { box-shadow: var(--avya-shadow); }
.split img { width: 100%; max-height: 520px; object-fit: cover; border-radius: var(--avya-radius); }
.photo-needed {
  display: grid; place-items: center; text-align: center; padding: 16px; min-height: 160px;
  background: repeating-linear-gradient(45deg, #FDF1DE 0 12px, #FFFAF3 12px 24px);
  border: 2px dashed var(--avya-accent); border-radius: var(--avya-radius-sm);
  color: #7A4B00; font-weight: 700; font-size: .95rem;
}
a.card > .photo-needed { border-radius: 0; border-width: 0 0 2px; }
a.card { position: relative; }
a.card .badge { position: absolute; top: 10px; left: 10px; background: #2A2030; color: #fff; font-size: .78rem; font-weight: 700; letter-spacing: .02em; padding: 4px 10px; border-radius: 999px; }
.steps li { position: relative; text-align: center; }
.steps li::before { position: absolute; top: 14px; left: 14px; }
.steps li img { display: block; width: 100%; max-width: 190px; aspect-ratio: 1; margin: 0 auto 6px; border-radius: 50%; }
@media (max-width: 600px) { .steps { grid-template-columns: 1fr 1fr; gap: 12px; } .steps li { padding: 16px 10px; } .steps li img { max-width: 120px; } }
@media (max-width: 600px) { .site-header .wp-block-site-logo img { width: 58px !important; } }

/* ---- dark header (2026-11-06): logo on a white badge, menu next to round account/cart icons ---- */
.site-header > .wp-block-group { gap: 10px; justify-content: flex-start !important; }
.site-header .site-logo-img a { display: grid; place-items: center; width: 70px; height: 70px; background: #fff; border-radius: 50%; padding: 6px; box-shadow: 0 0 0 3px var(--avya-accent); transition: transform .3s; }
.site-header .site-logo-img a:hover { transform: rotate(-6deg) scale(1.05); }
.site-header .site-logo-img img { width: 100% !important; height: auto; }
.site-header .wp-block-navigation { margin-left: auto; margin-right: 8px; gap: 4px; color: #fff; }
.site-header .wp-block-navigation-item__content { color: #fff; padding: 8px 12px !important; border-radius: 999px; font-weight: 600; transition: background .2s, color .2s; }
.site-header .wp-block-navigation-item__content:hover,
.site-header .current-menu-item > .wp-block-navigation-item__content { background: rgba(255, 158, 2, .18); color: #FFC062; }
.site-header .wc-block-customer-account__link,
.site-header .wc-block-mini-cart__button {
  display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, .7); color: #fff !important; background: transparent; position: relative;
  transition: background .2s, border-color .2s, transform .2s;
}
.site-header .wc-block-customer-account__link:hover,
.site-header .wc-block-mini-cart__button:hover { background: var(--avya-accent); border-color: var(--avya-accent); color: #2A1A00 !important; transform: translateY(-2px); }
.site-header .wc-block-customer-account__link svg, .site-header .wc-block-mini-cart__icon { color: inherit; fill: currentColor; width: 22px; height: 22px; }
.site-header .wc-block-mini-cart__badge { position: absolute; top: -4px; right: -4px; background: var(--avya-accent); color: #2A1A00; border-color: #2B1840; }
.site-header .wc-block-mini-cart__amount { display: none; }
.site-header .wp-block-navigation__responsive-container-open { color: #fff; }
.site-header .wp-block-navigation__responsive-container.is-menu-open { background: #fff !important; }
.site-header .is-menu-open .wp-block-navigation-item__content { color: var(--avya-ink); font-size: 1.25rem; }
@media (max-width: 600px) {
  .site-header .site-logo-img a { width: 56px; height: 56px; padding: 4px; }
  .site-header .site-logo-img img { width: 100% !important; }
  .site-header .wc-block-customer-account__link, .site-header .wc-block-mini-cart__button { width: 40px; height: 40px; }
}

/* ---- "alive" feel: lively buttons, lifting cards, a pop on selection ---- */
.btn, .avya-btn, .wp-block-button__link, .wp-element-button { position: relative; overflow: hidden; transition: background .2s, transform .2s cubic-bezier(.3,1.6,.5,1), box-shadow .2s; }
.btn::after, .avya-btn::after, .wp-block-button__link::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 30%, rgba(255,255,255,.55) 50%, transparent 70%);
  transform: translateX(-120%); transition: transform .6s;
}
.btn:hover::after, .avya-btn:hover::after, .wp-block-button__link:hover::after { transform: translateX(120%); }
.btn:hover, .avya-btn:hover, .wp-block-button__link:hover, .wp-element-button:hover { transform: translateY(-3px) scale(1.03); box-shadow: 0 8px 20px rgba(245, 140, 0, .35); }
.btn:active, .avya-btn:active, .wp-block-button__link:active, .wp-element-button:active { transform: scale(.96); box-shadow: none; }

.card, a.cat, .gal figure, .steps li, .review, .avya-card, .avya-opt, .avya-swatch, .chip {
  transition: transform .25s cubic-bezier(.3,1.4,.5,1), box-shadow .25s, border-color .2s;
}
a.card:hover, a.cat:hover, .gal figure:hover, .steps li:hover, .review:hover, .avya-card:hover, .avya-opt:hover {
  transform: translateY(-6px) rotate(-.4deg); box-shadow: 0 16px 34px rgba(126, 58, 200, .16);
}
a.card > img, .gal img { transition: transform .5s; }
a.card:hover > img, .gal figure:hover img { transform: scale(1.06); }
.steps li:hover img { animation: avya-wiggle .6s; }
.avya-swatch:hover, .chip:hover { transform: translateY(-2px) scale(1.06); }
.avya-card.is-selected, .avya-opt.is-selected, .avya-swatch.is-selected, .chip[aria-pressed="true"] { animation: avya-pop .35s cubic-bezier(.3,1.6,.5,1); }
@keyframes avya-pop { 0% { transform: scale(.94); } 60% { transform: scale(1.05); } 100% { transform: scale(1); } }
@keyframes avya-wiggle { 0%,100% { transform: rotate(0); } 25% { transform: rotate(-5deg); } 75% { transform: rotate(5deg); } }

/* ---- floating WhatsApp button (rendered by the plugin) ---- */
.avya-wa {
  position: fixed; right: calc(18px + env(safe-area-inset-right)); bottom: calc(18px + env(safe-area-inset-bottom)); z-index: 90;
  width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center;
  background: #25D366; color: #fff; box-shadow: 0 8px 22px rgba(0, 0, 0, .25); transition: transform .2s;
  animation: avya-wa-pulse 2.6s infinite;
}
.avya-wa:hover { transform: scale(1.1); color: #fff; }
.avya-wa svg { width: 32px; height: 32px; fill: currentColor; }
@keyframes avya-wa-pulse { 0%, 70%, 100% { box-shadow: 0 8px 22px rgba(0,0,0,.25), 0 0 0 0 rgba(37,211,102,.5); } 35% { box-shadow: 0 8px 22px rgba(0,0,0,.25), 0 0 0 14px rgba(37,211,102,0); } }
/* the designer's sticky price bar sits at the bottom on phones: lift the button above it */
@media (max-width: 919px) { body:has(.avya-totals) .avya-wa { bottom: calc(96px + env(safe-area-inset-bottom)); } }
.avya-contact-list a[href^="tel:"] { font-weight: 700; }

@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }