@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Jost:wght@300;400;500;600;700&display=swap');
:root {
  --azi-black: #09080a;
  --azi-gold: #C9A95C;
  --azi-cream: #E8DCC8;
  --azi-muted: rgba(232, 220, 200, 0.62);
  --azi-line: rgba(201, 169, 92, 0.18);
}
html,
body {
  background: var(--azi-black) !important;
  color: var(--azi-cream);
}
.elementor-location-header,
header.site-header {
  background: var(--azi-black) !important;
  border-bottom: 1px solid var(--azi-line) !important;
}
.elementor-location-footer,
footer.site-footer {
  background: var(--azi-black) !important;
  border-top: 1px solid var(--azi-line) !important;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}
.site-header img,
header img,
.elementor-location-header img {
  max-width: 135px !important;
  max-height: 125px !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}
.site-footer img,
footer img,
.elementor-location-footer img {
  max-width: 135px !important;
  max-height: 125x !important;
  width: auto !important;
  height: auto !important;
  object-fit: contain !important;
}
@media (max-width: 767px) {
  .site-header img,
  header img,
  .elementor-location-header img {
    max-width: 88px !important;
    max-height: 62px !important;
  }
  .site-footer img,
  footer img,
  .elementor-location-footer img {
    max-width: 84px !important;
    max-height: 58px !important;
  }
}
body.page-id-58,
body.elementor-page-58,
body.home {
  background: #050405 !important;
  overflow-x: hidden !important;
}
body.page-id-58 .site-main,
body.page-id-58 .content-area,
body.page-id-58 article,
body.page-id-58 .entry-content,
body.page-id-58 .elementor,
body.page-id-58 .elementor-section,
body.page-id-58 .elementor-container,
body.page-id-58 .elementor-widget-container,
body.elementor-page-58 .site-main,
body.elementor-page-58 .content-area,
body.elementor-page-58 article,
body.elementor-page-58 .entry-content,
body.elementor-page-58 .elementor,
body.elementor-page-58 .elementor-section,
body.elementor-page-58 .elementor-container,
body.elementor-page-58 .elementor-widget-container {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.page-id-58 .azi-min,
body.elementor-page-58 .azi-min {
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
body.page-id-58 .azi-min__candle,
body.elementor-page-58 .azi-min__candle {
  border-radius: 28px !important;
  clip-path: inset(0 round 28px) !important;
  object-fit: cover !important;
}
body.page-id-58 .azi-min__candle,
body.elementor-page-58 .azi-min__candle,
body.home .azi-min__candle {
  width: min(430px, 78vw) !important;
  height: auto !important;
  display: block !important;
  margin: -2px auto 40px !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  opacity: 0.9 !important;
  mix-blend-mode: lighten !important;
  filter:
    saturate(0.65)
    contrast(0.95)
    brightness(0.74)
    blur(0.2px)
    drop-shadow(0 22px 90px rgba(184, 91, 32, 0.22)) !important;
  -webkit-mask-image:
    radial-gradient(ellipse at center,
      #000 0%,
      #000 26%,
      rgba(0, 0, 0, 0.62) 42%,
      rgba(0, 0, 0, 0.20) 58%,
      transparent 76%) !important;
  mask-image:
    radial-gradient(ellipse at center,
      #000 0%,
      #000 26%,
      rgba(0, 0, 0, 0.62) 42%,
      rgba(0, 0, 0, 0.20) 58%,
      transparent 76%) !important;
}
body.page-id-58 .azi-min__form {
  margin-bottom: 10px !important;
}
body.page-id-58 .azi-min__social {
  margin-top: -2px !important;
}
@media (max-width: 767px) {
  html,
  body {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    background: #050405 !important;
    overflow-x: hidden !important;
  }
  body.home,
  body.page-id-52,
  body.page-id-58,
  body.elementor-page-58 {
    margin: 0 !important;
    padding: 0 !important;
    background: #050405 !important;
    overflow-x: hidden !important;
  }
  .azi-min {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100svh !important;
    margin: 0 !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    position: relative !important;
    background:
      radial-gradient(circle at 50% 18%, rgba(184, 96, 36, 0.055), transparent 18rem),
      #050405 !important;
  }
  .azi-min__wrap {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 100svh !important;
    margin: 0 auto !important;
    padding: 44px 20px 34px !important;
    align-items: center !important;
    text-align: center !important;
  }
  .azi-min__logo {
    width: min(300px, 78vw) !important;
    margin: 0 auto 42px !important;
  }
  .azi-min__form {
    width: calc(100vw - 40px) !important;
    max-width: 360px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .azi-min__candle {
    width: min(280px, 72vw) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    opacity: 0.52 !important;
  }
}
.azi-min__form button,
.azi-min__form button:hover,
.azi-min__form button:focus,
.azi-min__form button:focus-visible,
.azi-min__form button:active {
  background: transparent !important;
  color: #b8733e !important;
  -webkit-text-fill-color: #b8733e !important;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}
.azi-min__form:focus-within {
  border-color: rgba(184, 115, 62, 0.72) !important;
  box-shadow: 0 0 38px rgba(184, 91, 32, 0.10) !important;
}
/* ── Ascunde header/footer Hello Elementor pe pagina Home (ID 42) ── */
body.page-id-42 .site-header,
body.page-id-42 header.site-header,
body.page-id-42 .elementor-location-header,
body.page-id-42 #masthead,
body.page-id-42 #site-header,
body.page-id-42 .site-footer,
body.page-id-42 footer.site-footer,
body.page-id-42 .elementor-location-footer,
body.page-id-42 #colophon,
body.page-id-42 .page-header,
body.page-id-42 .entry-title,
body.page-id-42 h1.entry-title {
  display: none !important;
}
body.page-id-42 {
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.page-id-42 .site-main,
body.page-id-42 .content-area,
body.page-id-42 article,
body.page-id-42 .entry-content,
body.page-id-42 .elementor-widget-html,
body.page-id-42 .elementor-widget-container,
body.page-id-42 .elementor-section,
body.page-id-42 .elementor-container,
body.page-id-42 .e-con,
body.page-id-42 .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
/* ── AZI Rituals — Homepage v7 (page ID 42) ── */
@import url("https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,400&family=Jost:wght@300;400;500;600;700&display=swap");
body.page-id-42 .hidden-launch { display:none !important; }
body.page-id-42 {
    --gold:#8B6914;
    --gold-light:#C9A95C;
    --biscuit:#C4A882;
    --cream:#E8DCC8;
    --bg:#050405;
    --bg-soft:#0c0b0a;
    --line: rgba(232,220,200,0.14);
    --texture-swirl: url("https://azirituals.ro/wp-content/uploads/2026/07/azi-texture-swirl.png");
  }
body.page-id-42 * {box-sizing:border-box; margin:0; padding:0;}
html {scroll-behavior:smooth;}
body.page-id-42 {
    background:var(--bg);
    color:var(--cream);
    font-family:"Jost", sans-serif;
    font-weight:300;
    line-height:1.6;
    overflow-x:hidden;
    position:relative;
  }
body.page-id-42::before {
    content:"";
    position:fixed;
    inset:-12%;
    width:124%; height:124%;
    background-image:var(--texture-swirl);
    background-size:1500px 1500px;
    background-repeat:repeat;
    opacity:0.05;
    mix-blend-mode:screen;
    pointer-events:none;
    z-index:-1;
    animation:textureDrift 160s linear infinite;
  }
@keyframes textureDrift {
    from{ transform:translate(0,0) rotate(0deg); }
    to{ transform:translate(-3%,-2%) rotate(1.2deg); }
  }
@media (prefers-reduced-motion: reduce) {
body.page-id-42::before { animation:none; }
}
body.page-id-42 #page-smoke-canvas {
    position:fixed; inset:0; width:100%; height:100%;
    z-index:-1; opacity:0.4; mix-blend-mode:screen; pointer-events:none;
  }
body.page-id-42 .reveal {
    opacity:0; transform:translateY(24px);
    transition:opacity .8s ease, transform .8s ease;
  }
body.page-id-42 .reveal.revealed { opacity:1; transform:translateY(0); }
@media (prefers-reduced-motion: reduce) {
body.page-id-42 .reveal { opacity:1; transform:none; transition:none; }
}
body.page-id-42 h1, body.page-id-42 h2, body.page-id-42 h3, body.page-id-42 h4 {
    font-family:"Cormorant Garamond", serif;
    font-weight:400;
    letter-spacing:0.02em;
  }
body.page-id-42 a {color:inherit; text-decoration:none;}
body.page-id-42 .eyebrow {
    font-family:"Jost", sans-serif;
    font-size:0.72rem;
    letter-spacing:0.32em;
    text-transform:uppercase;
    color:var(--gold-light);
    display:inline-block;
    margin-bottom:18px;
  }
body.page-id-42 .eyebrow-title {
    font-family:"Cormorant Garamond", serif;
    font-size:clamp(1.8rem,3.4vw,2.6rem);
    font-weight:700;
    letter-spacing:0.04em;
    text-transform:none;
    color:var(--cream);
  }
body.page-id-42 .wrap {max-width:1180px; margin:0 auto; padding:0 32px;}
@media (max-width:480px) {
body.page-id-42 .wrap { padding:0 20px; }
}
body.page-id-42 .divider {
    width:48px; height:1px; background:var(--gold);
    margin:28px auto; opacity:0.7;
  }
body.page-id-42 header {
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:22px 40px;
    background:linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
    backdrop-filter:blur(2px);
  }
body.page-id-42 header::after {
    content:"";
    position:absolute; left:0; right:0; top:100%; height:60px;
    background:linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
    backdrop-filter:blur(1px);
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
    mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
    pointer-events:none;
  }
body.page-id-42 .header-left {display:flex; align-items:center; gap:40px;}
body.page-id-42 .logo-mark {display:flex; align-items:center; gap:10px;}
body.page-id-42 .logo-mark img {height:36px; width:auto; display:block;}
body.page-id-42 nav {display:flex; gap:30px; font-size:0.8rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:500;}
body.page-id-42 nav a {opacity:0.85; transition:opacity .3s, color .3s; position:relative;}
body.page-id-42 nav a:hover {opacity:1; color:var(--gold-light);}
body.page-id-42 .header-icons {display:flex; align-items:center; gap:22px; font-size:0.82rem; letter-spacing:0.06em; text-transform:uppercase; opacity:0.85;}
body.page-id-42 .lang-toggle {
    display:flex; align-items:center; gap:6px; font-size:0.72rem; letter-spacing:0.08em;
    border:1px solid var(--line); padding:5px 6px; border-radius:20px;
  }
body.page-id-42 .lang-toggle button {
    background:transparent; border:none; color:var(--biscuit); cursor:pointer;
    font-family:"Jost", sans-serif; font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase;
    padding:4px 9px; border-radius:14px; transition:background .3s, color .3s;
  }
body.page-id-42 .lang-toggle button.active { background:var(--gold); color:var(--bg); font-weight:600; }
body.page-id-42 .hamburger {
    display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:4px;
  }
body.page-id-42 .hamburger span { width:22px; height:1.5px; background:var(--cream); transition:transform .3s, opacity .3s; }
body.page-id-42 .hamburger.open span:nth-child(1) { transform:translateY(6.5px) rotate(45deg); }
body.page-id-42 .hamburger.open span:nth-child(2) { opacity:0; }
body.page-id-42 .hamburger.open span:nth-child(3) { transform:translateY(-6.5px) rotate(-45deg); }
body.page-id-42 .mobile-nav {
    display:none;
    position:fixed; top:0; right:0; bottom:0; width:min(78vw, 320px);
    background:var(--bg-soft); border-left:1px solid var(--line);
    z-index:200; padding:90px 32px 40px;
    transform:translateX(100%); transition:transform .4s ease;
    flex-direction:column; gap:26px;
  }
body.page-id-42 .mobile-nav.open { transform:translateX(0); }
body.page-id-42 .mobile-nav a {
    font-size:1rem; letter-spacing:0.08em; text-transform:uppercase; font-weight:500; color:var(--cream);
  }
body.page-id-42 .mobile-nav .mobile-divider { height:1px; background:var(--line); margin:6px 0; }
body.page-id-42 .nav-scrim {
    display:none; position:fixed; inset:0; background:rgba(5,4,5,0.6); z-index:150;
    opacity:0; transition:opacity .35s ease; pointer-events:none;
  }
body.page-id-42 .nav-scrim.open { opacity:1; pointer-events:auto; }
@media (max-width:880px) {
body.page-id-42 .header-left {gap:18px;}
body.page-id-42 nav {gap:14px; font-size:0.66rem;}
}
@media (max-width:680px) {
body.page-id-42 header { padding:18px 22px; }
body.page-id-42 .logo-mark img { height:36px; }
body.page-id-42 nav { display:none; }
body.page-id-42 .header-icons { gap:14px; font-size:0.7rem; }
body.page-id-42 .header-icons a { display:none; }
body.page-id-42 .lang-toggle { font-size:0.66rem; }
body.page-id-42 .hamburger { display:flex; }
body.page-id-42 .mobile-nav, body.page-id-42 .nav-scrim { display:flex; }
body.page-id-42 .tagline-bar { font-size:0.58rem; letter-spacing:0.16em; padding:6px 16px 0; }
}
body.page-id-42 .hero {
    position:relative;
    min-height:92vh;
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    text-align:center;
    padding:110px 24px 46px;
    overflow:hidden;
  }
body.page-id-42 #liquid-ether-canvas {
    position:absolute; inset:0; width:100%; height:100%;
    z-index:1; opacity:0.65; mix-blend-mode:screen; pointer-events:auto;
    -webkit-mask-image: radial-gradient(ellipse 65% 60% at 50% 45%, #000 0%, rgba(0,0,0,0.7) 45%, transparent 82%);
    mask-image: radial-gradient(ellipse 65% 60% at 50% 45%, #000 0%, rgba(0,0,0,0.7) 45%, transparent 82%);
  }
body.page-id-42 .hero-glow {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:900px; height:900px; border-radius:50%;
    background:radial-gradient(circle, rgba(139,105,20,0.18) 0%, rgba(139,105,20,0.04) 45%, transparent 70%);
    pointer-events:none;
  }
body.page-id-42 .hero-logo {
    position:relative; z-index:2;
    width:min(480px, 70vw);
    height:auto;
    margin-bottom:8px;
    filter: drop-shadow(0 0 40px rgba(139,105,20,0.25));
    animation: emerge 1.6s ease-out;
  }
@keyframes emerge {
    from{opacity:0; transform:translateY(14px) scale(0.97);}
    to{opacity:1; transform:translateY(0) scale(1);}
  }
body.page-id-42 .hero h1 {
    position:relative; z-index:2;
    font-size:clamp(2.2rem, 5vw, 3.6rem);
    font-weight:400; font-style:italic;
    max-width:760px;
    margin-bottom:18px;
  }
body.page-id-42 .hero p.sub {
    position:relative; z-index:2;
    max-width:480px; font-size:1rem; color:var(--biscuit); margin-bottom:38px;
  }
body.page-id-42 .cta-row {position:relative; z-index:2; display:flex; gap:18px; flex-wrap:wrap; justify-content:center;}
body.page-id-42 .btn {
    position:relative; overflow:hidden;
    padding:15px 34px; font-size:0.78rem; letter-spacing:0.18em; text-transform:uppercase;
    font-weight:700;
    border:1px solid var(--gold); transition:transform .3s ease, box-shadow .3s ease, color .3s ease; cursor:pointer; background:transparent; color:var(--cream);
  }
body.page-id-42 .btn:hover { transform:translateY(-3px); box-shadow:0 10px 24px rgba(139,105,20,0.28); }
body.page-id-42 .btn::after {
    content:"";
    position:absolute; left:0; top:0; bottom:0; width:0%;
    background:var(--gold-light);
    transition:width .4s ease;
    z-index:0;
  }
body.page-id-42 .btn:hover::after { width:100%; }
body.page-id-42 .btn-solid::after { background:var(--gold-light); }
body.page-id-42 .btn-ghost::after { background:rgba(139,105,20,0.16); }
body.page-id-42 .btn span.btn-label { position:relative; z-index:1; }
body.page-id-42 .btn::before {
    content:"";
    position:absolute; inset:0;
    background-image:var(--texture-swirl);
    background-size:500px 500px;
    background-position:center;
    opacity:0.16;
    mix-blend-mode:soft-light;
    pointer-events:none;
  }
body.page-id-42 .btn-solid::before { mix-blend-mode:multiply; opacity:0.22; }
body.page-id-42 .btn-solid { background:var(--gold); color:var(--bg); border-color:var(--gold); }
body.page-id-42 .btn-solid:hover { background:var(--gold-light); border-color:var(--gold-light); }
body.page-id-42 .btn-ghost:hover { background:rgba(139,105,20,0.12); }
body.page-id-42 section { padding:30px 0; position:relative; }
body.page-id-42 #deck { padding-top:14px; }
body.page-id-42 .marquee-wrap { margin-bottom:-10px; }
body.page-id-42 .section-head { text-align:center; max-width:620px; margin:0 auto 28px; }
body.page-id-42 .section-head h2 { font-size:clamp(1.8rem,3.4vw,2.6rem); margin-bottom:14px; }
body.page-id-42 .section-head p { color:var(--biscuit); font-size:0.95rem; }
body.page-id-42 .section-alt { background:var(--bg-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
body.page-id-42 .collection-track {
    display:flex; flex-wrap:wrap; justify-content:center; gap:28px; padding:10px 32px 14px;
  }
body.page-id-42 .candle-card {
    min-width:300px; max-width:320px;
    border:1px solid var(--line);
    padding:34px 28px;
    background:linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
    transition:border-color .3s, transform .3s;
  }
body.page-id-42 .candle-card:hover { border-color:var(--gold); transform:translateY(-4px); }
body.page-id-42 .candle-num { font-size:0.75rem; color:var(--gold-light); letter-spacing:0.18em; }
body.page-id-42 .candle-visual {
    width:100%; height:220px; margin:18px 0 22px;
    background:radial-gradient(ellipse at 50% 30%, rgba(196,168,130,0.22), rgba(5,4,5,0.6)), var(--texture-swirl);
    background-size:cover, 900px 900px;
    background-position:center, center 30%;
    background-blend-mode:normal, soft-light;
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
  }
body.page-id-42 .candle-visual .flame {
    width:6px; height:26px; border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;
    background:linear-gradient(180deg, #ffd98a, var(--gold));
    box-shadow:0 0 24px 6px rgba(201,169,92,0.5);
    animation:flicker 2.4s ease-in-out infinite;
  }
@keyframes flicker { 0%,100%{transform:scaleY(1) rotate(0deg);} 50%{transform:scaleY(1.08) rotate(1deg);} }
body.page-id-42 .candle-card h3 { font-size:1.5rem; margin-bottom:10px; }
body.page-id-42 .candle-card p { font-size:0.88rem; color:var(--biscuit); margin-bottom:18px; }
body.page-id-42 .try-link { font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold-light); border-bottom:1px solid var(--gold-light); padding-bottom:3px; }
@media (max-width:480px) {
body.page-id-42 .collection-track, body.page-id-42 .tea-track { padding:10px 16px 14px; }
body.page-id-42 .candle-card, body.page-id-42 .tea-card { min-width:0; width:100%; max-width:340px; }
}
body.page-id-42 .deck-wrap { display:flex; flex-direction:column; align-items:center; gap:26px; }
body.page-id-42 .ritual-deck {
    position:relative;
    width:320px; max-width:88vw; height:200px;
  }
body.page-id-42 .deck-card {
    position:absolute; inset:0;
    border:1px solid var(--line);
    background:linear-gradient(rgba(12,11,10,0.96), rgba(12,11,10,0.96)), var(--texture-swirl);
    background-size:cover, 700px 700px;
    background-blend-mode:normal, soft-light;
    transition:transform .5s ease;
  }
body.page-id-42 .deck-card-2 { transform:translate(10px,8px) rotate(4deg); z-index:1; }
body.page-id-42 .deck-card-3 { transform:translate(-8px,12px) rotate(-3deg); z-index:0; }
body.page-id-42 .ritual-deck:hover .deck-card-2 { transform:translate(16px,12px) rotate(7deg); }
body.page-id-42 .ritual-deck:hover .deck-card-3 { transform:translate(-14px,16px) rotate(-6deg); }
body.page-id-42 .ritual-card {
    position:relative; z-index:2;
    width:100%; height:100%; perspective:1200px; cursor:pointer;
  }
body.page-id-42 .ritual-card-inner {
    position:relative; width:100%; height:100%; text-align:center;
    transition:transform 0.7s; transform-style:preserve-3d;
    border:1px solid var(--gold); display:flex; align-items:center; justify-content:center;
  }
body.page-id-42 .ritual-card.flipped .ritual-card-inner { transform:rotateY(180deg); }
body.page-id-42 .ritual-face {
    position:absolute; inset:0; backface-visibility:hidden;
    display:flex; flex-direction:column; align-items:center; justify-content:center; padding:24px;
    background:linear-gradient(rgba(12,11,10,0.86), rgba(12,11,10,0.86)), var(--texture-swirl);
    background-size:cover, 480px 480px;
    background-position:center, center;
    background-blend-mode:normal, soft-light;
    animation:ritualTextureDrift 18s ease-in-out infinite;
    overflow:hidden;
  }
@keyframes ritualTextureDrift {
    0%{ background-position:center, 0% 0%; }
    50%{ background-position:center, 100% 100%; }
    100%{ background-position:center, 0% 0%; }
  }
body.page-id-42 .ritual-card-inner { box-shadow:0 0 0 0 rgba(139,105,20,0); animation:ritualGlow 3.4s ease-in-out infinite; }
@keyframes ritualGlow {
    0%,100%{ box-shadow:0 0 14px 0 rgba(139,105,20,0.15); }
    50%{ box-shadow:0 0 26px 4px rgba(201,169,92,0.4); }
  }
body.page-id-42 .ritual-face.back { transform:rotateY(180deg); font-family:"Cormorant Garamond",serif; font-style:italic; font-size:1.15rem; }
body.page-id-42 .ritual-glyph {
    font-size:1.6rem; color:var(--gold-light);
    animation:glyphPulse 2.4s ease-in-out infinite;
  }
@keyframes glyphPulse { 0%,100%{ opacity:0.55; transform:scale(1); } 50%{ opacity:1; transform:scale(1.12); } }
body.page-id-42 .draw-again {
    background:transparent; border:none; cursor:pointer;
    font-family:"Jost", sans-serif; font-size:0.75rem; letter-spacing:0.14em; text-transform:uppercase;
    color:var(--gold-light); border-bottom:1px solid var(--gold-light); padding-bottom:3px;
    opacity:0; transform:translateY(-6px); pointer-events:none;
    transition:opacity .4s ease, transform .4s ease, color .3s ease;
  }
body.page-id-42 .draw-again.visible { opacity:1; transform:translateY(0); pointer-events:auto; }
body.page-id-42 .draw-again:hover { color:var(--cream); }
body.page-id-42 .transition-band {
    text-align:center; padding:40px 0;
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  }
body.page-id-42 .transition-band p {
    font-family:"Cormorant Garamond", serif; font-style:italic;
    font-size:clamp(1.3rem, 2.4vw, 1.7rem); color:var(--cream);
    max-width:640px; margin:0 auto;
  }
body.page-id-42 .tea-track {
    display:flex; flex-wrap:wrap; justify-content:center; gap:28px; padding:10px 32px 14px;
  }
body.page-id-42 .tea-card {
    min-width:300px; max-width:320px;
    border:1px solid var(--line);
    padding:34px 28px;
    background:linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
    transition:border-color .3s, transform .3s;
  }
body.page-id-42 .tea-card:hover { border-color:var(--gold); transform:translateY(-4px); }
body.page-id-42 .tea-visual-box {
    width:100%; height:220px; margin:18px 0 22px;
    background:radial-gradient(ellipse at 50% 30%, rgba(196,168,130,0.22), rgba(5,4,5,0.6)), var(--texture-swirl);
    background-size:cover, 900px 900px;
    background-position:center, center 30%;
    background-blend-mode:normal, soft-light;
    border:1px solid var(--line);
    display:flex; align-items:center; justify-content:center;
  }
body.page-id-42 .tea-card h3 { font-size:1.5rem; margin-bottom:10px; }
body.page-id-42 .tea-card .tea-desc { font-size:0.88rem; color:var(--biscuit); margin-bottom:14px; }
body.page-id-42 .tea-card .tea-ingredients-line { font-size:0.78rem; color:var(--biscuit); margin-bottom:18px; letter-spacing:0.02em; }
body.page-id-42 .tea-visual .steam {
    width:5px; height:30px; border-radius:50%;
    background:linear-gradient(180deg, rgba(232,220,200,0.05), var(--biscuit));
    box-shadow:0 0 18px 3px rgba(196,168,130,0.35);
    animation:flicker 2.8s ease-in-out infinite;
  }
body.page-id-42 .tea-visual .steam:nth-child(2) { animation-delay:.4s; }
body.page-id-42 .tea-visual .steam:nth-child(3) { animation-delay:.8s; }
body.page-id-42 .tea-visual { display:flex; gap:10px; align-items:flex-end; }
body.page-id-42 .tea-pair-label { font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--gold-light); }
body.page-id-42 .benefits-row {
    display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
    gap:0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    padding:18px 10px;
  }
body.page-id-42 .benefit-item {
    display:flex; align-items:center; gap:10px;
    padding:8px 26px; position:relative;
  }
body.page-id-42 .benefit-item:not(:last-child)::after {
    content:"";
    position:absolute; right:0; top:50%; transform:translateY(-50%);
    width:4px; height:4px; border-radius:50%; background:var(--gold);
    opacity:0.6;
  }
body.page-id-42 .benefit-item .glyph {
    width:18px; height:18px; border:none; border-radius:0;
    display:flex; align-items:center; justify-content:center; color:var(--gold-light);
    font-family:"Cormorant Garamond",serif; font-size:1rem; flex-shrink:0;
  }
body.page-id-42 .benefit-item p { font-size:0.78rem; letter-spacing:0.02em; color:var(--biscuit); white-space:nowrap; }
@media (max-width:880px) {
body.page-id-42 .benefit-item { padding:8px 16px; }
body.page-id-42 .benefit-item p { white-space:normal; font-size:0.74rem; }
}
body.page-id-42 .marquee-wrap {
    overflow:hidden; width:100%;
    padding:14px 0;
    border-top:1px solid var(--line); border-bottom:1px solid var(--line);
    -webkit-mask-image: linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
    mask-image: linear-gradient(to right, transparent 0%, #000 6%, #000 94%, transparent 100%);
  }
body.page-id-42 .marquee-track {
    display:flex; gap:56px; width:max-content;
    animation:marqueeScroll 34s linear infinite;
  }
@media (max-width:480px) {
body.page-id-42 .marquee-track { gap:34px; animation-duration:22s; }
}
@keyframes marqueeScroll {
    from{ transform:translateX(0); }
    to{ transform:translateX(-50%); }
  }
@media (prefers-reduced-motion: reduce) {
body.page-id-42 .marquee-track { animation:none; }
}
body.page-id-42 .ingredient-pill {
    position:relative;
    padding:6px 0; font-size:0.85rem; letter-spacing:0.1em; text-transform:uppercase; color:var(--biscuit);
    transition:color .3s;
    white-space:nowrap; flex-shrink:0;
  }
body.page-id-42 .ingredient-pill::after {
    content:"✦";
    position:absolute; right:-32px; top:50%; transform:translateY(-50%);
    font-size:0.6rem; color:var(--gold);
    opacity:0.6;
  }
body.page-id-42 .ingredient-pill:hover { color:var(--gold-light); }
body.page-id-42 .journal-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
body.page-id-42 .journal-card { border:1px solid var(--line); padding:28px 26px; transition:border-color .3s, transform .3s; }
body.page-id-42 .journal-card:hover { border-color:var(--gold); transform:translateY(-4px); }
body.page-id-42 .journal-card .eyebrow { margin-bottom:14px; }
body.page-id-42 .journal-card h4 { font-size:1.35rem; font-weight:600; margin-bottom:10px; }
body.page-id-42 .journal-card p { font-size:0.85rem; color:var(--biscuit); }
@media (max-width:880px) {
body.page-id-42 .journal-grid {grid-template-columns:1fr;}
}
body.page-id-42 footer { padding:56px 0 26px; border-top:1px solid var(--line); }
body.page-id-42 .footer-top {
    display:grid; grid-template-columns:1fr 1fr;
    gap:50px; padding-bottom:50px; border-bottom:1px solid var(--line); margin-bottom:30px;
  }
body.page-id-42 .footer-brand { display:none; }
body.page-id-42 .footer-logo { height:42px; width:auto; }
body.page-id-42 .footer-col h5 {
    font-size:0.72rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold-light); margin-bottom:18px;
  }
body.page-id-42 .footer-col a { display:block; font-size:0.85rem; color:var(--biscuit); margin-bottom:12px; transition:color .3s; }
body.page-id-42 .footer-col a:hover { color:var(--cream); }
body.page-id-42 .newsletter-form { display:flex; border:1px solid var(--line); margin-top:6px; }
body.page-id-42 .newsletter-form input {
    flex:1; background:transparent; border:none; outline:none; color:var(--cream);
    padding:12px 14px; font-family:"Jost",sans-serif; font-size:0.85rem;
  }
body.page-id-42 .newsletter-form button {
    background:var(--gold); color:var(--bg); border:none; padding:0 18px;
    font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase; cursor:pointer;
    font-weight:700; font-family:"Jost", sans-serif;
  }
body.page-id-42 .newsletter-msg { font-size:0.75rem; color:var(--gold-light); margin-top:8px; min-height:1em; }
body.page-id-42 .footer-bottom {
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
    font-size:0.75rem; color:var(--biscuit);
  }
body.page-id-42 .socials { display:flex; gap:16px; }
body.page-id-42 .socials a {
    width:32px; height:32px; border:1px solid var(--line); border-radius:50%;
    display:flex; align-items:center; justify-content:center; font-size:0.75rem; transition:border-color .3s, color .3s;
  }
body.page-id-42 .socials a:hover { border-color:var(--gold); color:var(--gold-light); }
@media (max-width:880px) {
body.page-id-42 .footer-top {grid-template-columns:1fr; gap:36px;}
}
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Shop Page (body.woocommerce-shop) — FINAL ─────── */
/* ══════════════════════════════════════════════════════════ */
/* ── Hide default Hello Elementor header/footer + WooCommerce chrome ── */
body.woocommerce-shop .site-header,
body.woocommerce-shop header.site-header,
body.woocommerce-shop .elementor-location-header,
body.woocommerce-shop #masthead,
body.woocommerce-shop #site-header,
body.woocommerce-shop .site-footer,
body.woocommerce-shop footer.site-footer,
body.woocommerce-shop .elementor-location-footer,
body.woocommerce-shop #colophon,
body.woocommerce-shop .woocommerce-products-header,
body.woocommerce-shop h1.page-title,
body.woocommerce-shop .woocommerce-breadcrumb,
body.woocommerce-shop .woocommerce-result-count,
body.woocommerce-shop .woocommerce-ordering,
body.woocommerce-shop .page-header,
body.woocommerce-shop .entry-title {
  display: none !important;
}
body.woocommerce-shop {
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.woocommerce-shop .site-main,
body.woocommerce-shop .content-area,
body.woocommerce-shop article,
body.woocommerce-shop .entry-content,
body.woocommerce-shop .elementor-widget-html,
body.woocommerce-shop .elementor-widget-container,
body.woocommerce-shop .elementor-section,
body.woocommerce-shop .elementor-container,
body.woocommerce-shop .e-con,
body.woocommerce-shop .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
/* ── Base tokens / reset / ambient texture (mirrors Home) ── */
body.woocommerce-shop {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
  --texture-swirl: url("https://azirituals.ro/wp-content/uploads/2026/09/azi-texture-swirl-1200.webp");
}
body.woocommerce-shop * { box-sizing: border-box; }
body.woocommerce-shop {
  background: var(--bg);
  color: var(--cream);
  font-family: "Jost", sans-serif;
  font-weight: 300;
  line-height: 1.6;
  overflow-x: hidden;
  position: relative;
}
body.woocommerce-shop::before {
  content: "";
  position: fixed;
  inset: -12%;
  width: 124%; height: 124%;
  background-image: var(--texture-swirl);
  background-size: 1500px 1500px;
  background-repeat: repeat;
  opacity: 0.09;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: -1;
  animation: textureDrift 160s linear infinite;
}
body.woocommerce-shop #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
body.woocommerce-shop h1,
body.woocommerce-shop h2,
body.woocommerce-shop h3,
body.woocommerce-shop h4 {
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  letter-spacing: 0.02em;
  margin: 0;
}
body.woocommerce-shop p { margin: 0; }
body.woocommerce-shop a { color: inherit; text-decoration: none; }
body.woocommerce-shop .hidden-launch { display: none !important; }
body.woocommerce-shop .wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
@media (max-width: 480px) { body.woocommerce-shop .wrap { padding: 0 20px; } }
body.woocommerce-shop .eyebrow {
  font-family: "Jost", sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--gold-light);
  display: inline-block;
  margin-bottom: 18px;
}
/* ── Header / Nav (identical to Home) ── */
body.woocommerce-shop header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.woocommerce-shop header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.woocommerce-shop .header-left { display: flex; align-items: center; gap: 40px; }
body.woocommerce-shop .logo-mark { display: flex; align-items: center; gap: 10px; }
body.woocommerce-shop .logo-mark img { height: 36px; width: auto; display: block; }
body.woocommerce-shop nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.woocommerce-shop nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; }
body.woocommerce-shop nav a:hover { opacity: 1; color: var(--gold-light); }
body.woocommerce-shop .header-icons { display: flex; align-items: center; gap: 22px; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85; }
body.woocommerce-shop .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.woocommerce-shop .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
}
body.woocommerce-shop .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.woocommerce-shop .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.woocommerce-shop .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.woocommerce-shop .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.woocommerce-shop .hamburger.open span:nth-child(2) { opacity: 0; }
body.woocommerce-shop .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.woocommerce-shop .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.woocommerce-shop .mobile-nav.open { transform: translateX(0); }
body.woocommerce-shop .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.woocommerce-shop .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.woocommerce-shop .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.woocommerce-shop .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.woocommerce-shop .header-left { gap: 18px; }
  body.woocommerce-shop nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.woocommerce-shop header { padding: 18px 22px; }
  body.woocommerce-shop nav { display: none; }
  body.woocommerce-shop .header-icons { gap: 14px; font-size: 0.7rem; }
  body.woocommerce-shop .header-icons a { display: none; }
  body.woocommerce-shop .lang-toggle { font-size: 0.66rem; }
  body.woocommerce-shop .hamburger { display: flex; }
  body.woocommerce-shop .mobile-nav, body.woocommerce-shop .nav-scrim { display: flex; }
}
/* ── Shop Hero ── */
body.woocommerce-shop .shop-hero {
  position: relative;
  min-height: 44vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 168px 24px 40px;
  overflow: hidden;
}
body.woocommerce-shop .shop-hero-glow {
  position: absolute; top: 46%; left: 50%; transform: translate(-50%, -50%);
  width: 640px; height: 640px; border-radius: 50%;
  background: radial-gradient(circle, rgba(139,105,20,0.16) 0%, rgba(139,105,20,0.03) 45%, transparent 70%);
  pointer-events: none; z-index: 0;
}
body.woocommerce-shop .shop-hero h1,
body.woocommerce-shop .shop-hero .eyebrow,
body.woocommerce-shop .shop-hero p.sub,
body.woocommerce-shop .shop-divider {
  position: relative; z-index: 1;
}
body.woocommerce-shop .shop-hero .eyebrow {
  font-size: clamp(1.05rem, 2.2vw, 1.35rem);
  font-weight: 700;
  letter-spacing: 0.26em;
  margin-bottom: 20px;
}
body.woocommerce-shop .shop-hero h1 {
  font-size: clamp(2.375rem, 5vw, 3.8125rem);
  font-style: italic;
  max-width: 780px;
  margin: 0 auto 0;
  line-height: 1.1;
}
body.woocommerce-shop .shop-divider {
  width: 48px; height: 1px; background: var(--gold);
  margin: 22px auto 18px; opacity: 0.7;
}
body.woocommerce-shop .shop-hero p.sub {
  max-width: 540px;
  margin: 0 auto;
  font-size: 1rem;
  color: var(--biscuit);
}
@media (max-width: 680px) {
  body.woocommerce-shop .shop-hero { padding: 140px 20px 44px; min-height: 44vh; }
}
/* ── Reveal-on-scroll ── */
body.woocommerce-shop .reveal {
  opacity: 0; transform: translateY(24px);
  transition: opacity .8s ease, transform .8s ease;
}
body.woocommerce-shop .reveal.revealed { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  body.woocommerce-shop .reveal { opacity: 1; transform: none; transition: none; }
}
/* ── Category tabs band — full-width, framed between two hairlines ── */
body.woocommerce-shop .shop-tabs-band {
  width: 100%;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 30px 0;
}
body.woocommerce-shop .shop-tabs-label {
  display: block;
  text-align: center;
  font-size: 0.68rem; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--biscuit); opacity: 0.7; margin: 0 0 14px;
}
body.woocommerce-shop .shop-tabs {
  display: flex; justify-content: center; flex-wrap: wrap; gap: 34px;
  padding: 0 32px;
  margin: 0;
  list-style: none;
}
body.woocommerce-shop .shop-tabs a {
  font-size: 0.78rem; letter-spacing: 0.14em; text-transform: uppercase;
  font-weight: 700;
  color: var(--biscuit); padding: 6px 0 8px; position: relative;
  transition: color .3s;
}
body.woocommerce-shop .shop-tabs a:hover { color: var(--gold-light); }
body.woocommerce-shop .shop-tabs a.active { color: var(--gold-light); }
body.woocommerce-shop .shop-tabs a.active::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--gold);
}
@media (max-width: 600px) {
  body.woocommerce-shop .shop-tabs { gap: 18px; font-size: 0.7rem; padding: 0 20px; }
  body.woocommerce-shop .shop-tabs-band { padding: 22px 0; }
}
/* ── Product grid (restyled native WooCommerce output) ── */
body.woocommerce-shop ul.products {
  display: flex !important;
  flex-wrap: wrap;
  justify-content: center;
  gap: 28px;
  list-style: none !important;
  max-width: 1180px;
  margin: 8px auto 0 !important;
  padding: 4px 32px 20px !important;
  box-sizing: border-box;
}
body.woocommerce-shop ul.products li.product {
  width: 320px !important;
  max-width: 320px;
  margin: 0 !important;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 0 0 30px !important;
  text-align: center;
  transition: border-color .3s, transform .3s, opacity .25s ease;
  position: relative;
  float: none !important;
  overflow: hidden;
}
body.woocommerce-shop ul.products li.product:hover { border-color: var(--gold); transform: translateY(-4px); }
body.woocommerce-shop ul.products li.product img {
  width: 100%; height: 320px; object-fit: contain; object-position: center;
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5));
  padding: 26px;
  box-sizing: border-box;
  border-bottom: 1px solid var(--line);
  margin: 0 0 24px !important;
  border-radius: 0 !important;
  transition: transform .6s ease;
}
body.woocommerce-shop ul.products li.product:hover img { transform: scale(1.035); }
body.woocommerce-shop ul.products li.product .woocommerce-loop-product__title {
  font-size: 1.5rem; font-weight: 400; color: var(--cream);
  margin: 0 20px 10px !important; padding: 0 !important;
}
body.woocommerce-shop ul.products li.product .price {
  font-family: "Jost", sans-serif; font-size: 0.92rem; margin-bottom: 18px; display: block;
}
body.woocommerce-shop ul.products li.product .price del { color: var(--biscuit); opacity: 0.55; margin-right: 8px; }
body.woocommerce-shop ul.products li.product .price ins { color: var(--gold-light); font-weight: 600; text-decoration: none; }
body.woocommerce-shop ul.products li.product .onsale {
  display: none;
}
body.woocommerce-shop ul.products li.product a.button,
body.woocommerce-shop ul.products li.product a.add_to_cart_button {
  display: inline-block;
  background: transparent; color: var(--cream);
  border: 1px solid var(--gold);
  padding: 12px 28px;
  font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
  font-family: "Jost", sans-serif;
  transition: background .3s, color .3s;
}
body.woocommerce-shop ul.products li.product a.button:hover,
body.woocommerce-shop ul.products li.product a.add_to_cart_button:hover {
  background: var(--gold); color: var(--bg);
}
body.woocommerce-shop ul.products li.product { position: relative; }
body.woocommerce-shop .azi-wishlist-btn {
  position: absolute !important; top: 14px; right: 14px; z-index: 5;
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(5,4,5,0.7) !important; border: 1px solid rgba(232,220,200,0.3) !important;
  display: flex !important; align-items: center; justify-content: center; cursor: pointer;
  transition: border-color .3s, background .3s; padding: 0; margin: 0;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.woocommerce-shop .azi-wishlist-btn svg {
  width: 18px; height: 18px; fill: none !important;
  stroke: var(--cream) !important; stroke-width: 2 !important;
  stroke-linecap: round; stroke-linejoin: round;
  display: block !important;
}
body.woocommerce-shop .azi-wishlist-btn:hover { border-color: var(--gold) !important; background: rgba(5,4,5,0.85) !important; }
body.woocommerce-shop .azi-wishlist-btn.azi-active { border-color: var(--gold) !important; }
body.woocommerce-shop .azi-wishlist-btn.azi-active svg { fill: var(--gold-light) !important; stroke: var(--gold-light) !important; }
@keyframes shopSaleGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(139,105,20,0); }
  50% { box-shadow: 0 0 14px 2px rgba(201,169,92,0.45); }
}
@media (max-width: 480px) {
  body.woocommerce-shop ul.products { padding: 10px 16px 20px !important; }
  body.woocommerce-shop ul.products li.product { width: 100% !important; max-width: 340px; }
}
/* ── Empty category state ── */
body.woocommerce-shop .shop-empty-state {
  display: none;
  text-align: center;
  padding: 60px 24px 80px;
  transition: opacity .3s ease;
}
body.woocommerce-shop .shop-empty-state h3 {
  font-style: italic; font-size: clamp(1.6rem, 3vw, 2.2rem); margin-bottom: 14px;
}
body.woocommerce-shop .shop-empty-state p { color: var(--biscuit); font-size: 0.9rem; }
/* ── Ritual note band — subtle ── */
body.woocommerce-shop .ritual-note-band {
  text-align: center;
  padding: 40px 24px 46px;
  border-top: 1px solid var(--line);
}
body.woocommerce-shop .ritual-note-band .eyebrow {
  margin-bottom: 12px;
  opacity: 0.85;
}
body.woocommerce-shop .ritual-note-band p {
  color: var(--biscuit);
  font-size: 0.8rem;
  max-width: 480px;
  margin: 0 auto;
  line-height: 1.7;
  opacity: 0.8;
}
/* ── Footer (identical to Home) ── */
body.woocommerce-shop footer { padding: 56px 0 26px; border-top: 1px solid var(--line); }
body.woocommerce-shop .footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
body.woocommerce-shop .footer-brand { display: none; }
body.woocommerce-shop .footer-col h5 { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 18px; }
body.woocommerce-shop .footer-col a { display: block; font-size: 0.85rem; color: var(--biscuit); margin-bottom: 12px; transition: color .3s; }
body.woocommerce-shop .footer-col a:hover { color: var(--cream); }
body.woocommerce-shop .newsletter-form { display: flex; border: 1px solid var(--line); margin-top: 6px; }
body.woocommerce-shop .newsletter-form input { flex: 1; background: transparent; border: none; outline: none; color: var(--cream); padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; }
body.woocommerce-shop .newsletter-form button { background: var(--gold); color: var(--bg); border: none; padding: 0 18px; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-weight: 700; font-family: "Jost", sans-serif; }
body.woocommerce-shop .newsletter-msg { font-size: 0.75rem; color: var(--gold-light); margin-top: 8px; min-height: 1em; }
body.woocommerce-shop .footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 0.75rem; color: var(--biscuit); }
body.woocommerce-shop .socials { display: flex; gap: 16px; }
body.woocommerce-shop .socials a { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; transition: border-color .3s, color .3s; }
body.woocommerce-shop .socials a:hover { border-color: var(--gold); color: var(--gold-light); }
@media (max-width: 880px) { body.woocommerce-shop .footer-top { grid-template-columns: 1fr; gap: 36px; } }
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Rituals Page (body.page-id-120) — Header ─── */
/* ══════════════════════════════════════════════════════════ */
body.page-id-120 .site-header,
body.page-id-120 header.site-header,
body.page-id-120 .elementor-location-header,
body.page-id-120 #masthead,
body.page-id-120 #site-header,
body.page-id-120 .page-header,
body.page-id-120 .entry-title,
body.page-id-120 h1.entry-title {
  display: none !important;
}
body.page-id-120 {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
}
body.page-id-120 a { text-decoration: none; }
body.page-id-120 header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.page-id-120 header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.page-id-120 .header-left { display: flex; align-items: center; gap: 40px; }
body.page-id-120 .logo-mark { display: flex; align-items: center; gap: 10px; }
body.page-id-120 .logo-mark img { height: 36px; width: auto; display: block; }
body.page-id-120 nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.page-id-120 nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.page-id-120 nav a:hover { opacity: 1; color: var(--gold-light); }
body.page-id-120 .header-icons { display: flex; align-items: center; gap: 22px; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85; }
body.page-id-120 .header-icons a { color: var(--cream); }
body.page-id-120 .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.page-id-120 .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
}
body.page-id-120 .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.page-id-120 .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.page-id-120 .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.page-id-120 .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.page-id-120 .hamburger.open span:nth-child(2) { opacity: 0; }
body.page-id-120 .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.page-id-120 .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.page-id-120 .mobile-nav.open { transform: translateX(0); }
body.page-id-120 .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.page-id-120 .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.page-id-120 .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.page-id-120 .nav-scrim.open { opacity: 1; pointer-events: auto; }
body.page-id-120 #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
@media (max-width: 880px) {
  body.page-id-120 .header-left { gap: 18px; }
  body.page-id-120 nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.page-id-120 header { padding: 18px 22px; }
  body.page-id-120 nav { display: none; }
  body.page-id-120 .header-icons { gap: 14px; font-size: 0.7rem; }
  body.page-id-120 .header-icons a { display: none; }
  body.page-id-120 .lang-toggle { font-size: 0.66rem; }
  body.page-id-120 .hamburger { display: flex; }
  body.page-id-120 .mobile-nav, body.page-id-120 .nav-scrim { display: flex; }
}
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Azi Journal Page (body.page-id-122) ── */
/* ══════════════════════════════════════════════════════════ */
body.page-id-122 .site-header,
body.page-id-122 header.site-header,
body.page-id-122 .elementor-location-header,
body.page-id-122 #masthead,
body.page-id-122 #site-header,
body.page-id-122 .site-footer,
body.page-id-122 footer.site-footer,
body.page-id-122 .elementor-location-footer,
body.page-id-122 #colophon,
body.page-id-122 .page-header,
body.page-id-122 .entry-title,
body.page-id-122 h1.entry-title {
  display: none !important;
}
body.page-id-122 {
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.page-id-122 .site-main,
body.page-id-122 .content-area,
body.page-id-122 article,
body.page-id-122 .entry-content,
body.page-id-122 .elementor-widget-html,
body.page-id-122 .elementor-widget-container,
body.page-id-122 .elementor-section,
body.page-id-122 .elementor-container,
body.page-id-122 .e-con,
body.page-id-122 .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
body.page-id-122 {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
}
body.page-id-122 a { text-decoration: none; }
body.page-id-122 .wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
@media (max-width: 480px) { body.page-id-122 .wrap { padding: 0 20px; } }
body.page-id-122 #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
body.page-id-122 header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.page-id-122 header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.page-id-122 .header-left { display: flex; align-items: center; gap: 40px; }
body.page-id-122 .logo-mark { display: flex; align-items: center; gap: 10px; }
body.page-id-122 .logo-mark img { height: 36px; width: auto; display: block; }
body.page-id-122 nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.page-id-122 nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.page-id-122 nav a:hover { opacity: 1; color: var(--gold-light); }
body.page-id-122 .header-icons { display: flex; align-items: center; gap: 22px; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85; }
body.page-id-122 .header-icons a { color: var(--cream); }
body.page-id-122 .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.page-id-122 .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
}
body.page-id-122 .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.page-id-122 .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.page-id-122 .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.page-id-122 .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.page-id-122 .hamburger.open span:nth-child(2) { opacity: 0; }
body.page-id-122 .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.page-id-122 .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.page-id-122 .mobile-nav.open { transform: translateX(0); }
body.page-id-122 .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.page-id-122 .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.page-id-122 .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.page-id-122 .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.page-id-122 .header-left { gap: 18px; }
  body.page-id-122 nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.page-id-122 header { padding: 18px 22px; }
  body.page-id-122 nav { display: none; }
  body.page-id-122 .header-icons { gap: 14px; font-size: 0.7rem; }
  body.page-id-122 .header-icons a { display: none; }
  body.page-id-122 .lang-toggle { font-size: 0.66rem; }
  body.page-id-122 .hamburger { display: flex; }
  body.page-id-122 .mobile-nav, body.page-id-122 .nav-scrim { display: flex; }
}
body.page-id-122 footer { padding: 56px 0 26px; border-top: 1px solid var(--line); }
body.page-id-122 .footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
body.page-id-122 .footer-brand { display: none; }
body.page-id-122 .footer-col h5 { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 18px; }
body.page-id-122 .footer-col a { display: block; font-size: 0.85rem; color: var(--biscuit); margin-bottom: 12px; transition: color .3s; }
body.page-id-122 .footer-col a:hover { color: var(--cream); }
body.page-id-122 .newsletter-form { display: flex; border: 1px solid var(--line); margin-top: 6px; }
body.page-id-122 .newsletter-form input { flex: 1; background: transparent; border: none; outline: none; color: var(--cream); padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; }
body.page-id-122 .newsletter-form button { background: var(--gold); color: var(--bg); border: none; padding: 0 18px; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-weight: 700; font-family: "Jost", sans-serif; }
body.page-id-122 .newsletter-msg { font-size: 0.75rem; color: var(--gold-light); margin-top: 8px; min-height: 1em; }
body.page-id-122 .footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 0.75rem; color: var(--biscuit); }
body.page-id-122 .socials { display: flex; gap: 16px; }
body.page-id-122 .socials a { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; transition: border-color .3s, color .3s; }
body.page-id-122 .socials a:hover { border-color: var(--gold); color: var(--gold-light); }
@media (max-width: 880px) { body.page-id-122 .footer-top { grid-template-columns: 1fr; gap: 36px; } }
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Flame Glow Identity (logo + CTA buttons) ── */
/* ══════════════════════════════════════════════════════════ */
@keyframes aziFlameGlowLogo {
  0%, 100% {
    filter: drop-shadow(0 0 5px rgba(201,169,92,0.30)) drop-shadow(0 0 12px rgba(139,105,20,0.16));
  }
  50% {
    filter: drop-shadow(0 0 11px rgba(201,169,92,0.55)) drop-shadow(0 0 24px rgba(139,105,20,0.30));
  }
}
body.page-id-42 .logo-mark img,
body.woocommerce-shop .logo-mark img,
body.page-id-120 .logo-mark img,
body.page-id-122 .logo-mark img,
body.page-id-20 .logo-mark img {
  animation: aziFlameGlowLogo 3.6s ease-in-out infinite;
}
@keyframes aziFlameGlowBtn {
  0%, 100% {
    box-shadow: 0 0 0 0 rgba(139,105,20,0), 0 0 8px 0 rgba(201,169,92,0.10);
  }
  50% {
    box-shadow: 0 0 16px 2px rgba(201,169,92,0.26), 0 0 30px 5px rgba(139,105,20,0.15);
  }
}
body.page-id-42 .btn {
  animation: aziFlameGlowBtn 3.8s ease-in-out infinite;
}
body.page-id-42 .btn-solid {
  animation: aziFlameGlowBtn 3.2s ease-in-out infinite;
}
body.woocommerce-shop ul.products li.product a.button,
body.woocommerce-shop ul.products li.product a.add_to_cart_button {
  animation: aziFlameGlowBtn 3.8s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  body.page-id-42 .logo-mark img,
  body.woocommerce-shop .logo-mark img,
  body.page-id-120 .logo-mark img,
  body.page-id-122 .logo-mark img,
  body.page-id-20 .logo-mark img,
  body.page-id-42 .btn,
  body.page-id-42 .btn-solid,
  body.woocommerce-shop ul.products li.product a.button,
  body.woocommerce-shop ul.products li.product a.add_to_cart_button {
    animation: none;
  }
}
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Account Page (body.page-id-20) ── */
/* Custom dashboard skin over native [woocommerce_my_account]  */
/* Real data (name, orders, addresses) still comes from WooCommerce */
/* ══════════════════════════════════════════════════════════ */
/* ── Hide default Hello Elementor header/footer + WC chrome ── */
body.page-id-20 .site-header,
body.page-id-20 header.site-header,
body.page-id-20 .elementor-location-header,
body.page-id-20 #masthead,
body.page-id-20 #site-header,
body.page-id-20 .site-footer,
body.page-id-20 footer.site-footer,
body.page-id-20 .elementor-location-footer,
body.page-id-20 #colophon,
body.page-id-20 .page-header,
body.page-id-20 .entry-title,
body.page-id-20 h1.entry-title,
body.page-id-20 .woocommerce-breadcrumb {
  display: none !important;
}
body.page-id-20 {
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.page-id-20 .site-main,
body.page-id-20 .content-area,
body.page-id-20 article,
body.page-id-20 .entry-content,
body.page-id-20 .elementor-widget-html,
body.page-id-20 .elementor-widget-container,
body.page-id-20 .elementor-section,
body.page-id-20 .elementor-container,
body.page-id-20 .e-con,
body.page-id-20 .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
/* ── Base tokens (mirrors Home/Shop/Rituals/Journal) ── */
body.page-id-20 {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
  --texture-swirl: url("https://azirituals.ro/wp-content/uploads/2026/09/azi-texture-swirl-1200.webp");
}
body.page-id-20 * { box-sizing: border-box; }
body.page-id-20 {
  background: var(--bg);
  color: var(--cream);
  font-family: "Jost", sans-serif;
  font-weight: 300;
  line-height: 1.6;
  overflow-x: hidden;
  position: relative;
}
body.page-id-20 #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
body.page-id-20 h1, body.page-id-20 h2, body.page-id-20 h3, body.page-id-20 h4 {
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  letter-spacing: 0.02em;
  margin: 0;
}
body.page-id-20 p { margin: 0; }
body.page-id-20 a { color: inherit; text-decoration: none; }
body.page-id-20 .wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
@media (max-width: 480px) { body.page-id-20 .wrap { padding: 0 20px; } }
body.page-id-20 .eyebrow {
  font-family: "Jost", sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--gold-light);
  display: inline-block;
  margin-bottom: 18px;
}
/* ── Header / Nav (identical to Home/Shop/Rituals/Journal) ── */
body.page-id-20 header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.page-id-20 header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.page-id-20 .header-left { display: flex; align-items: center; gap: 40px; }
body.page-id-20 .logo-mark { display: flex; align-items: center; gap: 10px; }
body.page-id-20 .logo-mark img { height: 36px; width: auto; display: block; }
body.page-id-20 nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.page-id-20 nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.page-id-20 nav a:hover { opacity: 1; color: var(--gold-light); }
body.page-id-20 .header-icons { display: flex; align-items: center; gap: 22px; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85; }
body.page-id-20 .header-icons a { color: var(--cream); }
body.page-id-20 .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.page-id-20 .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
}
body.page-id-20 .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.page-id-20 .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.page-id-20 .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.page-id-20 .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.page-id-20 .hamburger.open span:nth-child(2) { opacity: 0; }
body.page-id-20 .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.page-id-20 .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.page-id-20 .mobile-nav.open { transform: translateX(0); }
body.page-id-20 .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.page-id-20 .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.page-id-20 .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.page-id-20 .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.page-id-20 .header-left { gap: 18px; }
  body.page-id-20 nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.page-id-20 header { padding: 18px 22px; }
  body.page-id-20 nav { display: none; }
  body.page-id-20 .header-icons { gap: 14px; font-size: 0.7rem; }
  body.page-id-20 .header-icons a { display: none; }
  body.page-id-20 .lang-toggle { font-size: 0.66rem; }
  body.page-id-20 .hamburger { display: flex; }
  body.page-id-20 .mobile-nav, body.page-id-20 .nav-scrim { display: flex; }
}
/* ── Account intro / hero ── */
body.page-id-20 .account-hero {
  position: relative;
  padding: 150px 24px 30px;
  text-align: center;
  overflow: hidden;
}
body.page-id-20 .account-hero-glow {
  position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%);
  width: 640px; height: 640px; border-radius: 50%;
  background: radial-gradient(circle, rgba(139,105,20,0.14) 0%, rgba(139,105,20,0.03) 45%, transparent 70%);
  pointer-events: none; z-index: 0;
}
body.page-id-20 .account-hero .eyebrow,
body.page-id-20 .account-hero h1 { position: relative; z-index: 1; }
body.page-id-20 .account-hero h1 {
  font-size: clamp(1.9rem, 3.6vw, 2.7rem);
  font-style: italic;
}
@media (max-width: 680px) {
  body.page-id-20 .account-hero { padding: 122px 20px 24px; }
}
/* ── Dashboard grid: sidebar + content ── */
body.page-id-20 .woocommerce {
  max-width: 1180px;
  margin: 0 auto !important;
  padding: 30px 32px 90px !important;
  display: grid;
  grid-template-columns: 250px 1fr;
  gap: 36px;
  align-items: start;
}
@media (max-width: 480px) {
  body.page-id-20 .woocommerce { padding: 20px 20px 70px !important; }
}
@media (max-width: 880px) {
  body.page-id-20 .woocommerce { grid-template-columns: 1fr; }
}
/* ── Sidebar navigation (restyled native WooCommerce nav) ── */
body.page-id-20 .woocommerce-MyAccount-navigation {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 10px;
  position: sticky;
  top: 110px;
}
@media (max-width: 880px) {
  body.page-id-20 .woocommerce-MyAccount-navigation { position: static; }
}
body.page-id-20 .woocommerce-MyAccount-navigation ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 3px;
  margin: 0; padding: 0;
}
body.page-id-20 .woocommerce-MyAccount-navigation-link {
  order: 2;
}
body.page-id-20 .woocommerce-MyAccount-navigation-link--dashboard { order: 1; }
body.page-id-20 .woocommerce-MyAccount-navigation-link--orders { order: 2; }
body.page-id-20 .woocommerce-MyAccount-navigation-link--downloads { order: 3; }
body.page-id-20 .woocommerce-MyAccount-navigation-link--edit-address { order: 4; }
body.page-id-20 .woocommerce-MyAccount-navigation-link--edit-account { order: 5; }
body.page-id-20 .woocommerce-MyAccount-navigation-link--customer-logout {
  order: 9;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
body.page-id-20 .woocommerce-MyAccount-navigation-link a {
  display: block;
  padding: 13px 16px;
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--biscuit);
  transition: background .3s ease, color .3s ease;
}
body.page-id-20 .woocommerce-MyAccount-navigation-link a:hover {
  background: rgba(139,105,20,0.10);
  color: var(--gold-light);
}
body.page-id-20 .woocommerce-MyAccount-navigation-link.is-active a {
  background: rgba(139,105,20,0.16);
  color: var(--gold-light);
  position: relative;
}
body.page-id-20 .woocommerce-MyAccount-navigation-link.is-active a::before {
  content: "";
  position: absolute; left: 0; top: 8px; bottom: 8px; width: 2px;
  background: var(--gold);
}
body.page-id-20 .woocommerce-MyAccount-navigation-link--customer-logout a {
  color: var(--biscuit);
  opacity: 0.75;
}
body.page-id-20 .woocommerce-MyAccount-navigation-link--customer-logout a:hover {
  color: var(--cream);
  background: transparent;
  opacity: 1;
}
/* ── Content area ── */
body.page-id-20 .woocommerce-MyAccount-content {
  min-width: 0;
}
/* Dashboard welcome card (default WC paragraphs) */
body.page-id-20 .woocommerce-MyAccount-content > p {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 26px 28px;
  font-size: 0.92rem;
  color: var(--biscuit);
  margin-bottom: 18px !important;
}
body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 1.35rem;
  color: var(--cream);
  line-height: 1.5;
}
body.page-id-20 .woocommerce-MyAccount-content > p strong { color: var(--gold-light); font-weight: 600; }
body.page-id-20 .woocommerce-MyAccount-content > p a {
  color: var(--gold-light);
  border-bottom: 1px solid var(--gold-light);
  padding-bottom: 1px;
}
body.page-id-20 .woocommerce-MyAccount-content > p a:hover { color: var(--cream); }
/* ── Orders table ── */
body.page-id-20 table.woocommerce-orders-table,
body.page-id-20 table.shop_table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--line);
  font-size: 0.85rem;
}
body.page-id-20 table.woocommerce-orders-table thead th {
  text-align: left;
  padding: 14px 16px;
  font-size: 0.68rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--gold-light);
  border-bottom: 1px solid var(--line);
  font-weight: 600;
}
body.page-id-20 table.woocommerce-orders-table tbody td {
  padding: 16px;
  border-bottom: 1px solid var(--line);
  color: var(--biscuit);
}
body.page-id-20 table.woocommerce-orders-table tbody tr:last-child td { border-bottom: none; }
body.page-id-20 table.woocommerce-orders-table tbody tr:hover td { background: rgba(139,105,20,0.05); }
body.page-id-20 .woocommerce-orders-table__cell-order-number a { color: var(--cream); font-weight: 500; }
body.page-id-20 mark.order-status {
  background: transparent !important;
  color: var(--gold-light) !important;
  font-size: 0.72rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0 !important;
}
body.page-id-20 .woocommerce-orders-table__cell-order-actions a {
  display: inline-block;
  border: 1px solid var(--gold);
  color: var(--cream);
  padding: 8px 16px;
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 700;
  transition: background .3s, color .3s;
  margin: 2px 4px 2px 0;
}
body.page-id-20 .woocommerce-orders-table__cell-order-actions a:hover { background: var(--gold); color: var(--bg); }
@media (max-width: 600px) {
  body.page-id-20 table.woocommerce-orders-table thead { display: none; }
  body.page-id-20 table.woocommerce-orders-table,
  body.page-id-20 table.woocommerce-orders-table tbody,
  body.page-id-20 table.woocommerce-orders-table tr,
  body.page-id-20 table.woocommerce-orders-table td { display: block; width: 100%; border: none; }
  body.page-id-20 table.woocommerce-orders-table tr {
    border: 1px solid var(--line);
    margin-bottom: 14px;
    padding: 6px 4px;
  }
  body.page-id-20 table.woocommerce-orders-table td {
    display: flex; justify-content: space-between; align-items: center;
    padding: 10px 14px; border-bottom: 1px solid var(--line);
  }
  body.page-id-20 table.woocommerce-orders-table td:last-child { border-bottom: none; }
  body.page-id-20 table.woocommerce-orders-table td::before {
    content: attr(data-title);
    font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--gold-light);
    margin-right: 12px;
  }
}
/* No orders yet state */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info {
  list-style: none;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 22px 26px;
  font-size: 0.9rem;
  color: var(--biscuit);
  margin-bottom: 18px;
}
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info a.button,
body.page-id-20 .woocommerce-MyAccount-content a.button {
  display: inline-block;
  margin-top: 10px;
  background: var(--gold);
  color: var(--bg);
  border: 1px solid var(--gold);
  padding: 12px 26px;
  font-size: 0.72rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 700;
  transition: background .3s, color .3s;
}
body.page-id-20 .woocommerce-MyAccount-content a.button:hover { background: var(--gold-light); border-color: var(--gold-light); }
/* ── Addresses ── */
body.page-id-20 .woocommerce-Addresses {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  list-style: none;
}
@media (max-width: 680px) {
  body.page-id-20 .woocommerce-Addresses { grid-template-columns: 1fr; }
}
body.page-id-20 .woocommerce-Address {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 26px 28px;
  transition: border-color .3s;
}
body.page-id-20 .woocommerce-Address:hover { border-color: var(--gold); }
body.page-id-20 .woocommerce-Address-title {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px;
}
body.page-id-20 .woocommerce-Address-title h2,
body.page-id-20 .woocommerce-Address-title h3 {
  font-size: 1.15rem;
  color: var(--cream);
}
body.page-id-20 .woocommerce-Address-title a.edit {
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold-light);
  border-bottom: 1px solid var(--gold-light);
  padding-bottom: 2px;
}
body.page-id-20 .woocommerce-Address-title a.edit:hover { color: var(--cream); }
body.page-id-20 .woocommerce-Address address {
  font-style: normal;
  font-size: 0.88rem;
  color: var(--biscuit);
  line-height: 1.9;
}
/* ── Edit account / edit address forms ── */
body.page-id-20 form.woocommerce-EditAccountForm,
body.page-id-20 form.woocommerce-address-fields,
body.page-id-20 form.edit-account,
body.page-id-20 form.woocommerce-form {
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 32px;
}
body.page-id-20 .woocommerce-form-row,
body.page-id-20 p.form-row {
  margin-bottom: 20px !important;
}
body.page-id-20 .woocommerce-form-row label,
body.page-id-20 p.form-row label {
  display: block;
  font-size: 0.7rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--gold-light);
  margin-bottom: 8px;
}
body.page-id-20 .woocommerce-form-row .required,
body.page-id-20 p.form-row .required { color: var(--gold); text-decoration: none; }
body.page-id-20 .woocommerce-form-row input.input-text,
body.page-id-20 .woocommerce-form-row select,
body.page-id-20 p.form-row input.input-text,
body.page-id-20 p.form-row select {
  width: 100%;
  background: transparent;
  border: 1px solid var(--line);
  color: var(--cream);
  padding: 12px 14px;
  font-family: "Jost", sans-serif;
  font-size: 0.88rem;
  transition: border-color .3s;
}
body.page-id-20 .woocommerce-form-row input.input-text:focus,
body.page-id-20 p.form-row input.input-text:focus {
  outline: none;
  border-color: var(--gold);
}
body.page-id-20 fieldset {
  border: none;
  border-top: 1px solid var(--line);
  margin-top: 26px;
  padding-top: 22px;
}
body.page-id-20 fieldset legend {
  font-family: "Cormorant Garamond", serif;
  font-size: 1.2rem;
  color: var(--cream);
  padding: 0 4px 0 0;
  margin-bottom: 12px;
}
body.page-id-20 form button.woocommerce-Button,
body.page-id-20 form button[name="save_account_details"],
body.page-id-20 form button[name="save_address"] {
  background: var(--gold);
  color: var(--bg);
  border: 1px solid var(--gold);
  padding: 14px 32px;
  font-size: 0.75rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  font-family: "Jost", sans-serif;
  cursor: pointer;
  transition: background .3s, border-color .3s;
  margin-top: 8px;
}
body.page-id-20 form button.woocommerce-Button:hover { background: var(--gold-light); border-color: var(--gold-light); }
/* ── Ritualurile Favorite (wishlist grid) ── */
body.page-id-20 .azi-wishlist-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px;
}
body.page-id-20 .azi-wishlist-card {
  border: 1px solid var(--line); background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 20px; text-align: center; transition: border-color .3s, transform .3s;
}
body.page-id-20 .azi-wishlist-card:hover { border-color: var(--gold); transform: translateY(-3px); }
body.page-id-20 .azi-wishlist-card img { width: 100%; height: 150px; object-fit: contain; margin-bottom: 14px; }
body.page-id-20 .azi-wishlist-card h4 { font-size: 1.1rem; color: var(--cream); margin-bottom: 6px; }
body.page-id-20 .azi-wishlist-price { font-size: 0.85rem; color: var(--gold-light); display: block; margin-bottom: 14px; }
body.page-id-20 .azi-wishlist-remove {
  background: transparent; border: none; color: var(--biscuit); opacity: 0.75; cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.page-id-20 .azi-wishlist-remove:hover { color: var(--gold-light); opacity: 1; }
body.page-id-20 .woocommerce-MyAccount-content > p a.button {
  display: inline-block; margin-top: 10px; background: var(--gold); color: var(--bg);
  border: 1px solid var(--gold); padding: 12px 26px; font-size: 0.72rem; letter-spacing: 0.14em;
  text-transform: uppercase; font-weight: 700; transition: background .3s, color .3s;
}
body.page-id-20 .woocommerce-MyAccount-content > p a.button:hover { background: var(--gold-light); border-color: var(--gold-light); }
/* ── Lost Password / Reset Password screens ── */
body.page-id-20 .woocommerce:has(form.woocommerce-ResetPassword),
body.page-id-20 .woocommerce:has(form.woocommerce-form-lost-password) {
  min-height: 62vh; display: flex; flex-direction: column; align-items: center; justify-content: center;
}
body.page-id-20 .woocommerce:has(form.woocommerce-ResetPassword) > p:first-child,
body.page-id-20 .woocommerce:has(form.woocommerce-form-lost-password) > p:first-child {
  max-width: 460px; text-align: center; color: var(--biscuit); font-size: 0.92rem;
  line-height: 1.7; margin: 0 0 20px;
}
body.page-id-20 form.woocommerce-ResetPassword,
body.page-id-20 form.woocommerce-form.woocommerce-form-lost-password {
  max-width: 460px; width: 100%; margin: 0; padding: 32px;
  border: 1px solid var(--line); background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
}
body.page-id-20 .woocommerce > p,
body.page-id-20 .woocommerce-form-lost-password > p:first-child {
  max-width: 460px; margin: 40px auto 0; padding: 0 4px;
  font-size: 0.92rem; color: var(--biscuit); line-height: 1.7; text-align: center;
}
body.page-id-20 form.woocommerce-ResetPassword p.form-row,
body.page-id-20 form.woocommerce-form-lost-password p.form-row { margin: 0 0 18px; }
body.page-id-20 form.woocommerce-ResetPassword label,
body.page-id-20 form.woocommerce-form-lost-password label {
  display: block; font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--gold-light); margin-bottom: 8px;
}
body.page-id-20 form.woocommerce-ResetPassword input.input-text,
body.page-id-20 form.woocommerce-form-lost-password input.input-text {
  width: 100%; background: transparent; border: 1px solid var(--line); color: var(--cream);
  padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.9rem;
  -webkit-appearance: none; appearance: none; border-radius: 0;
}
body.page-id-20 form.woocommerce-ResetPassword input.input-text:focus,
body.page-id-20 form.woocommerce-form-lost-password input.input-text:focus { outline: none; border-color: var(--gold); }
body.page-id-20 form.woocommerce-ResetPassword button,
body.page-id-20 form.woocommerce-form-lost-password button {
  width: 100%; background: var(--gold); color: #050405; border: 1px solid var(--gold);
  padding: 13px; font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  font-family: "Jost", sans-serif; cursor: pointer; transition: background .25s ease;
  -webkit-appearance: none; appearance: none;
}
body.page-id-20 form.woocommerce-ResetPassword button:hover,
body.page-id-20 form.woocommerce-form-lost-password button:hover { background: var(--gold-light); }
/* Generic WooCommerce notices (success / error / info) across page-id-20 —
   these were rendering with WordPress's default white/red boxes. */
body.page-id-20 .woocommerce-message,
body.page-id-20 .woocommerce-error,
body.page-id-20 .woocommerce-info,
body.page-id-20 .woocommerce-NoticeGroup {
  list-style: none; max-width: 460px; margin: 30px auto 0; padding: 16px 20px 16px 36px;
  border: 1px solid var(--gold); border-top: 3px solid var(--gold);
  background: rgba(139,105,20,0.08); color: var(--cream);
  font-size: 0.86rem; line-height: 1.6; position: relative;
}
body.page-id-20 .woocommerce-error { border-color: #c97b5a; border-top-color: #c97b5a; background: rgba(201,123,90,0.08); }
body.page-id-20 .woocommerce-message::before,
body.page-id-20 .woocommerce-info::before { content: "✦"; position: absolute; left: 14px; top: 15px; color: var(--gold-light); }
body.page-id-20 .woocommerce-error::before { content: "!"; position: absolute; left: 15px; top: 14px; color: #c97b5a; font-weight: 700; }
body.page-id-20 .woocommerce-message li,
body.page-id-20 .woocommerce-error li,
body.page-id-20 .woocommerce-info li { margin: 0; }
body.page-id-20 .woocommerce-message a,
body.page-id-20 .woocommerce-error a { color: var(--gold-light); border-bottom: 1px solid var(--gold-light); }
/* ── Footer (identical to Home/Shop/Journal) ── */
body.page-id-20 footer { padding: 56px 0 26px; border-top: 1px solid var(--line); }
body.page-id-20 .footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
body.page-id-20 .footer-brand { display: none; }
body.page-id-20 .footer-col h5 { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 18px; }
body.page-id-20 .footer-col a { display: block; font-size: 0.85rem; color: var(--biscuit); margin-bottom: 12px; transition: color .3s; }
body.page-id-20 .footer-col a:hover { color: var(--cream); }
body.page-id-20 .newsletter-form { display: flex; border: 1px solid var(--line); margin-top: 6px; }
body.page-id-20 .newsletter-form input { flex: 1; background: transparent; border: none; outline: none; color: var(--cream); padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; }
body.page-id-20 .newsletter-form button { background: var(--gold); color: var(--bg); border: none; padding: 0 18px; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-weight: 700; font-family: "Jost", sans-serif; }
body.page-id-20 .newsletter-msg { font-size: 0.75rem; color: var(--gold-light); margin-top: 8px; min-height: 1em; }
body.page-id-20 .footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 0.75rem; color: var(--biscuit); }
body.page-id-20 .socials { display: flex; gap: 16px; }
body.page-id-20 .socials a { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; transition: border-color .3s, color .3s; }
body.page-id-20 .socials a:hover { border-color: var(--gold); color: var(--gold-light); }
@media (max-width: 880px) { body.page-id-20 .footer-top { grid-template-columns: 1fr; gap: 36px; } }
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Login Page (body.page-id-548) ── */
/* ══════════════════════════════════════════════════════════ */
body.page-id-548 .site-header,
body.page-id-548 header.site-header,
body.page-id-548 .elementor-location-header,
body.page-id-548 #masthead,
body.page-id-548 #site-header,
body.page-id-548 .site-footer,
body.page-id-548 footer.site-footer,
body.page-id-548 .elementor-location-footer,
body.page-id-548 #colophon,
body.page-id-548 .page-header,
body.page-id-548 .entry-title,
body.page-id-548 h1.entry-title {
  display: none !important;
}
body.page-id-548 {
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.page-id-548 .site-main,
body.page-id-548 .content-area,
body.page-id-548 article,
body.page-id-548 .entry-content,
body.page-id-548 .elementor-widget-html,
body.page-id-548 .elementor-widget-container,
body.page-id-548 .elementor-section,
body.page-id-548 .elementor-container,
body.page-id-548 .e-con,
body.page-id-548 .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
  gap: 0 !important;
  row-gap: 0 !important;
  column-gap: 0 !important;
}
body.page-id-548 {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
}
body.page-id-548 * { box-sizing: border-box; }
body.page-id-548 {
  color: var(--cream);
  font-family: "Jost", sans-serif;
  font-weight: 300;
  line-height: 1.6;
  overflow-x: hidden;
  position: relative;
}
body.page-id-548 h1, body.page-id-548 h2, body.page-id-548 h3 {
  font-family: "Cormorant Garamond", serif; font-weight: 400; letter-spacing: 0.02em; margin: 0;
}
body.page-id-548 p { margin: 0; }
body.page-id-548 a { color: inherit; text-decoration: none; }
body.page-id-548 .wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
@media (max-width: 480px) { body.page-id-548 .wrap { padding: 0 20px; } }
body.page-id-548 .eyebrow {
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold-light); display: inline-block; margin-bottom: 18px;
}
body.page-id-548 #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
body.page-id-548 header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.page-id-548 header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.page-id-548 .header-left { display: flex; align-items: center; gap: 40px; }
body.page-id-548 .logo-mark { display: flex; align-items: center; gap: 10px; }
body.page-id-548 .logo-mark img { height: 36px; width: auto; display: block; }
body.page-id-548 nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.page-id-548 nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.page-id-548 nav a:hover { opacity: 1; color: var(--gold-light); }
body.page-id-548 .header-icons { display: flex; align-items: center; gap: 22px; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85; }
body.page-id-548 .header-icons a { color: var(--cream); }
body.page-id-548 .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.page-id-548 .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.page-id-548 .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.page-id-548 .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.page-id-548 .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.page-id-548 .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.page-id-548 .hamburger.open span:nth-child(2) { opacity: 0; }
body.page-id-548 .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.page-id-548 .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.page-id-548 .mobile-nav.open { transform: translateX(0); }
body.page-id-548 .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.page-id-548 .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.page-id-548 .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.page-id-548 .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.page-id-548 .header-left { gap: 18px; }
  body.page-id-548 nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.page-id-548 header { padding: 18px 22px; }
  body.page-id-548 nav { display: none; }
  body.page-id-548 .header-icons { gap: 14px; font-size: 0.7rem; }
  body.page-id-548 .header-icons a { display: none; }
  body.page-id-548 .lang-toggle { font-size: 0.66rem; }
  body.page-id-548 .hamburger { display: flex; }
  body.page-id-548 .mobile-nav, body.page-id-548 .nav-scrim { display: flex; }
}
body.page-id-548 .login-hero {
  position: relative; padding: 168px 24px 30px; text-align: center; overflow: hidden;
}
body.page-id-548 .login-hero-glow {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 640px; height: 640px; border-radius: 50%;
  background: radial-gradient(circle, rgba(139,105,20,0.20) 0%, rgba(139,105,20,0.05) 45%, transparent 72%);
  pointer-events: none; z-index: 0;
  animation: page548HeroGlowPulse 6s ease-in-out infinite;
}
body.page-id-548 .login-hero-smoke {
  position: absolute; inset: -20% -10%; z-index: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 40% 60% at 30% 40%, rgba(232,220,200,0.05), transparent 70%),
    radial-gradient(ellipse 50% 70% at 70% 60%, rgba(201,169,92,0.06), transparent 70%);
  filter: blur(6px);
  animation: page548HeroSmokeDrift 18s ease-in-out infinite alternate;
}
@keyframes page548HeroGlowPulse {
  0%, 100% { opacity: 0.75; transform: translate(-50%, -50%) scale(1); }
  50% { opacity: 1; transform: translate(-50%, -50%) scale(1.08); }
}
@keyframes page548HeroSmokeDrift {
  0% { transform: translate(0, 0) rotate(0deg); }
  100% { transform: translate(-3%, 2%) rotate(1.5deg); }
}
body.page-id-548 .login-hero .eyebrow,
body.page-id-548 .login-hero h1,
body.page-id-548 .login-hero p { position: relative; z-index: 1; }
body.page-id-548 .login-hero h1 {
  font-size: clamp(1.9rem, 3.6vw, 2.7rem);
  font-style: normal; text-transform: uppercase; letter-spacing: 0.05em; font-weight: 500;
  margin-bottom: 12px; transition: opacity .25s ease;
}
body.page-id-548 .login-hero p { color: var(--biscuit); font-size: 0.9rem; transition: opacity .25s ease; }
@media (max-width: 680px) {
  body.page-id-548 .login-hero { padding: 140px 20px 26px; }
}
body.page-id-548 .auth-layout {
  max-width: 980px; margin: 0 auto 50px; padding: 185px 24px 0;
  display: flex; align-items: stretch; gap: 0;
}
@media (max-width: 680px) {
  body.page-id-548 .auth-layout { padding: 155px 20px 0; }
}
body.page-id-548 .auth-wrap-header { text-align: center; margin-bottom: 14px; }
body.page-id-548 .auth-wrap-header h1 {
  font-size: clamp(1.4rem, 2.4vw, 1.7rem); font-style: normal; text-transform: uppercase;
  letter-spacing: 0.05em; font-weight: 500; margin-bottom: 6px; transition: opacity .25s ease;
}
body.page-id-548 .auth-wrap-header p { color: var(--biscuit); font-size: 0.82rem; transition: opacity .25s ease; }
body.page-id-548 .auth-brand-panel {
  flex: 1; position: relative; overflow: hidden;
  border: 1px solid var(--line); border-right: none;
  padding: 48px 42px; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
  background: linear-gradient(180deg, rgba(196,168,130,0.05), transparent);
}
body.page-id-548 .brand-panel-glow {
  position: absolute; top: 20%; left: 50%; transform: translate(-50%, -50%);
  width: 380px; height: 380px; border-radius: 50%;
  background: radial-gradient(circle, rgba(139,105,20,0.16) 0%, rgba(139,105,20,0.03) 45%, transparent 72%);
  pointer-events: none;
}
body.page-id-548 .brand-logo {
  position: relative; z-index: 1;
  width: min(260px, 80%); height: auto; display: block; margin: 0 auto 34px;
  image-rendering: -webkit-optimize-contrast;
}
body.page-id-548 .brand-quote {
  position: relative; z-index: 1;
  font-family: "Cormorant Garamond", serif; font-style: italic; font-weight: 400;
  font-size: clamp(1.5rem, 2.6vw, 1.9rem); line-height: 1.5; color: var(--cream);
  margin-bottom: 26px; text-align: center;
}
body.page-id-548 .brand-divider { position: relative; z-index: 1; display: block; width: 40px; height: 1px; background: var(--gold); opacity: 0.7; margin: 0 auto 26px; }
body.page-id-548 .brand-sub { position: relative; z-index: 1; font-size: 0.88rem; color: var(--biscuit); line-height: 1.7; max-width: 320px; text-align: center; margin: 0 auto; }
@media (max-width: 880px) {
  body.page-id-548 .auth-brand-panel { display: none; }
  body.page-id-548 .auth-layout { max-width: 460px; }
}
body.page-id-548 .auth-wrap { flex: 1; max-width: 460px; margin: 0; padding: 0; }
@media (max-width: 880px) { body.page-id-548 .auth-wrap { max-width: 100%; margin: 0 auto; } }
body.page-id-548 .auth-tabs { display: flex; border: 1px solid var(--line); }
body.page-id-548 .auth-tabs button {
  flex: 1; position: relative; overflow: hidden;
  background: var(--bg-soft); border: none; color: var(--biscuit);
  font-family: "Jost", sans-serif; font-size: 0.74rem; letter-spacing: 0.14em; text-transform: uppercase;
  font-weight: 700; padding: 16px 10px; cursor: pointer; transition: background .25s ease, color .25s ease;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.page-id-548 .auth-tabs button::before {
  content: ""; position: absolute; inset: 0;
  background-image: url("https://azirituals.ro/wp-content/uploads/2026/09/azi-texture-swirl-1200.webp");
  background-size: 500px 500px; background-position: center;
  opacity: 0; mix-blend-mode: soft-light; transition: opacity .25s ease; pointer-events: none;
}
body.page-id-548 .auth-tabs button:focus { outline: none; }
body.page-id-548 .auth-tabs button.active {
  background: var(--gold); color: var(--bg); font-weight: 700;
}
body.page-id-548 .auth-tabs button.active::before { opacity: 0.22; mix-blend-mode: multiply; }
body.page-id-548 .auth-card {
  border: 1px solid rgba(232,220,200,0.08); border-top: none;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 24px 28px 26px;
}
body.page-id-548 .auth-card h2,
body.page-id-548 .woocommerce > h2 { display: none !important; }
body.page-id-548 .u-columns.col2-set {
  display: block; margin: 0 !important; padding: 0 !important; min-height: 0 !important;
  border: none !important; height: auto !important;
}
body.page-id-548 .u-columns.col2-set::before,
body.page-id-548 .u-columns.col2-set::after { content: none !important; display: none !important; }
body.page-id-548 .u-column1.col-1,
body.page-id-548 .u-column2.col-2 { display: none; width: 100%; float: none; margin: 0 !important; padding: 0 !important; }
body.page-id-548 .u-column1.col-1.azi-active,
body.page-id-548 .u-column2.col-2.azi-active { display: block; }
body.page-id-548 form.woocommerce-form-login,
body.page-id-548 form.woocommerce-form-register { margin: 0 !important; padding: 0 !important; }
body.page-id-548 .woocommerce-privacy-policy-text { display: none !important; }
body.page-id-548 .woocommerce-form-register p.form-row:empty,
body.page-id-548 .woocommerce-form-login p.form-row:empty,
body.page-id-548 .woocommerce-form-register > div:empty { display: none !important; }
body.page-id-548 .woocommerce-form-login p.form-row,
body.page-id-548 .woocommerce-form-register p.form-row { margin: 0 0 14px; }
body.page-id-548 .woocommerce-form-login label,
body.page-id-548 .woocommerce-form-register label {
  display: block; font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--gold-light); margin-bottom: 8px;
}
body.page-id-548 .woocommerce-form-login label .required,
body.page-id-548 .woocommerce-form-register label .required { color: var(--gold); margin-left: 2px; }
body.page-id-548 .woocommerce-form-login input.input-text,
body.page-id-548 .woocommerce-form-register input.input-text {
  width: 100%; background: transparent !important;
  border: none !important; border-bottom: 1px solid rgba(232,220,200,0.22) !important;
  color: var(--cream); padding: 10px 2px; font-family: "Jost", sans-serif; font-size: 0.9rem;
  transition: border-color .3s; -webkit-appearance: none; appearance: none; border-radius: 0;
}
body.page-id-548 .woocommerce-form-login input.input-text:focus,
body.page-id-548 .woocommerce-form-register input.input-text:focus {
  outline: none !important; box-shadow: none !important; border-bottom-color: var(--gold) !important;
}
body.page-id-548 .woocommerce-form-register .form-row-first,
body.page-id-548 .woocommerce-form-register .form-row-last {
  display: inline-block; width: calc(50% - 10px); vertical-align: top;
}
body.page-id-548 .woocommerce-form-register .form-row-first { margin-right: 20px; }
@media (max-width: 600px) {
  body.page-id-548 .woocommerce-form-register .form-row-first,
  body.page-id-548 .woocommerce-form-register .form-row-last { width: 100%; margin-right: 0; }
}
body.page-id-548 .woocommerce-form-register .clear { display: block; height: 0; }
body.page-id-548 .woocommerce-form-login__rememberme {
  display: flex; align-items: center; gap: 8px; font-size: 0.8rem; color: var(--biscuit);
  margin-bottom: 22px; cursor: pointer; font-weight: 400; text-transform: none; letter-spacing: normal;
}
body.page-id-548 .woocommerce-form-login__rememberme input[type="checkbox"] {
  width: 15px; height: 15px; accent-color: var(--gold); cursor: pointer; -webkit-tap-highlight-color: transparent;
}
body.page-id-548 .woocommerce-LostPassword {
  text-align: right; margin-top: -14px; margin-bottom: 22px;
}
body.page-id-548 .woocommerce-LostPassword a {
  font-size: 0.8rem; color: var(--gold-light); border-bottom: 1px solid var(--gold-light); padding-bottom: 1px; font-weight: 700;
}
body.page-id-548 .woocommerce-LostPassword a:hover { color: var(--cream); }
body.page-id-548 .azi-terms-row label,
body.page-id-548 .azi-newsletter-row label {
  display: flex; align-items: flex-start; gap: 10px; font-size: 0.8rem; color: var(--biscuit);
  text-transform: none; letter-spacing: normal; font-weight: 400; cursor: pointer; line-height: 1.55;
  text-align: left;
}
body.page-id-548 .azi-terms-row label span,
body.page-id-548 .azi-newsletter-row label span,
body.page-id-548 .azi-terms-row,
body.page-id-548 .azi-newsletter-row { text-align: left !important; }
body.page-id-548 .azi-terms-row input[type="checkbox"],
body.page-id-548 .azi-newsletter-row input[type="checkbox"] {
  margin-top: 3px; width: 15px; height: 15px; accent-color: var(--gold); cursor: pointer; flex-shrink: 0;
}
body.page-id-548 .azi-terms-row a { color: var(--gold-light); border-bottom: 1px solid var(--gold-light); padding-bottom: 1px; }
body.page-id-548 .azi-terms-row a:hover { color: var(--cream); }
body.page-id-548 .woocommerce-form-login__submit,
body.page-id-548 .woocommerce-form-register__submit {
  width: 100%; background: var(--gold); color: #050405; border: 1px solid var(--gold);
  padding: 12px; font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  font-family: "Jost", sans-serif; cursor: pointer; transition: background .25s ease, border-color .25s ease;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.page-id-548 .woocommerce-form-login__submit:hover,
body.page-id-548 .woocommerce-form-login__submit:focus,
body.page-id-548 .woocommerce-form-register__submit:hover,
body.page-id-548 .woocommerce-form-register__submit:focus {
  background: var(--gold-light); border-color: var(--gold-light); color: #050405; outline: none;
}
body.page-id-548 .auth-note { text-align: center; font-size: 0.78rem; color: var(--biscuit); margin-top: 20px; opacity: 0.8; }
body.page-id-548 .auth-divider {
  display: flex; align-items: center; text-align: center; gap: 14px;
  margin: 14px 0 12px; font-size: 0.7rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--biscuit); opacity: 0.7;
}
body.page-id-548 .auth-divider::before, body.page-id-548 .auth-divider::after { content: ""; flex: 1; height: 1px; background: var(--line); }
body.page-id-548 .social-row { display: flex; gap: 12px; margin-bottom: 4px; }
body.page-id-548 .social-btn {
  flex: 1; display: flex; align-items: center; justify-content: center; gap: 10px;
  background: transparent; border: 1px solid var(--line); color: var(--cream);
  padding: 12px; font-family: "Jost", sans-serif; font-size: 0.8rem; font-weight: 500;
  cursor: pointer; transition: border-color .25s ease, background .25s ease;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.page-id-548 .social-btn:hover,
body.page-id-548 .social-btn:focus,
body.page-id-548 .social-btn:active { border-color: var(--gold); background: rgba(139,105,20,0.10); color: var(--cream); outline: none; }
body.page-id-548 .password-input,
body.page-id-20 .password-input { position: relative !important; display: block !important; width: 100%; }
body.page-id-548 .show-password-input,
body.page-id-20 .show-password-input {
  position: absolute !important; right: 12px; top: 50%; transform: translateY(-50%);
  width: 18px; height: 18px; cursor: pointer; z-index: 2;
  color: var(--gold-light) !important; fill: var(--gold-light) !important; opacity: 0.9;
  filter: brightness(0) saturate(100%) invert(82%) sepia(28%) saturate(561%) hue-rotate(357deg) brightness(101%) contrast(93%);
}
body.page-id-548 .show-password-input svg,
body.page-id-20 .show-password-input svg,
body.page-id-548 .show-password-input svg path,
body.page-id-20 .show-password-input svg path { fill: var(--gold-light) !important; stroke: var(--gold-light) !important; }
body.page-id-548 .show-password-input:hover,
body.page-id-20 .show-password-input:hover { opacity: 1; }
body.page-id-548 .woocommerce-password-strength {
  text-align: center; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase;
  font-weight: 600; font-family: "Jost", sans-serif;
  border: 1px solid var(--line) !important; border-top: none !important;
  padding: 10px; margin: -1px 0 18px !important; background: var(--bg-soft) !important;
}
body.page-id-548 .woocommerce-password-strength.strong {
  color: #9fd88f !important; background: rgba(159,216,143,0.08) !important; border-color: rgba(159,216,143,0.3) !important;
}
body.page-id-548 .woocommerce-password-strength.good {
  color: var(--gold-light) !important; background: rgba(201,169,92,0.1) !important; border-color: rgba(201,169,92,0.3) !important;
}
body.page-id-548 .woocommerce-password-strength.bad {
  color: #e0a17a !important; background: rgba(224,161,122,0.08) !important; border-color: rgba(224,161,122,0.3) !important;
}
body.page-id-548 .woocommerce-password-strength.short {
  color: #e08a8a !important; background: rgba(224,138,138,0.08) !important; border-color: rgba(224,138,138,0.3) !important;
}
body.page-id-548 .woocommerce-password-hint {
  display: block; font-size: 0.76rem; color: var(--biscuit); opacity: 0.75; line-height: 1.6;
  margin: 0 0 18px; font-style: italic; font-family: "Cormorant Garamond", serif;
}
body.page-id-548 input:-webkit-autofill,
body.page-id-548 input:-webkit-autofill:hover,
body.page-id-548 input:-webkit-autofill:focus,
body.page-id-548 input:-webkit-autofill:active {
  -webkit-text-fill-color: var(--cream) !important;
  -webkit-box-shadow: 0 0 0px 1000px var(--bg-soft) inset !important;
  box-shadow: 0 0 0px 1000px var(--bg-soft) inset !important;
  border-bottom-color: var(--gold) !important;
  caret-color: var(--cream);
  transition: background-color 9999s ease-in-out 0s;
}
body.page-id-548 input:focus,
body.page-id-548 input:focus-visible {
  outline: none !important; box-shadow: none !important; -webkit-box-shadow: none !important;
}
body.page-id-548 ul.woocommerce-error,
body.page-id-548 .woocommerce-NoticeGroup {
  list-style: none; margin: 0 0 18px; padding: 14px 18px 14px 34px;
  border: 1px solid var(--gold); background: rgba(139,105,20,0.1);
  font-size: 0.84rem; color: var(--cream); line-height: 1.6; position: relative;
}
body.page-id-548 ul.woocommerce-error li { margin: 0; text-align: left; }
body.page-id-548 ul.woocommerce-error::before {
  content: "✦"; position: absolute; left: 14px; top: 14px; color: var(--gold-light); font-size: 0.9em;
}
body.page-id-548 footer { padding: 56px 0 26px; border-top: 1px solid var(--line); text-align: center; font-size: 0.75rem; color: var(--biscuit); }
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Header Icons (Wishlist/Account/Cart) — sitewide ── */
/* ══════════════════════════════════════════════════════════ */
body.page-id-42 .header-icons .icon-item,
body.woocommerce-shop .header-icons .icon-item,
body.page-id-120 .header-icons .icon-item,
body.page-id-122 .header-icons .icon-item,
body.page-id-548 .header-icons .icon-item,
body.page-id-20 .header-icons .icon-item {
  display: flex; align-items: center; gap: 7px; position: relative;
  color: var(--cream); opacity: 0.85; transition: color .3s, opacity .3s;
}
body.page-id-42 .header-icons .icon-item:hover,
body.woocommerce-shop .header-icons .icon-item:hover,
body.page-id-120 .header-icons .icon-item:hover,
body.page-id-122 .header-icons .icon-item:hover,
body.page-id-548 .header-icons .icon-item:hover,
body.page-id-20 .header-icons .icon-item:hover { color: var(--gold-light); opacity: 1; }
body.page-id-42 .header-icons .icon-item svg,
body.woocommerce-shop .header-icons .icon-item svg,
body.page-id-120 .header-icons .icon-item svg,
body.page-id-122 .header-icons .icon-item svg,
body.page-id-548 .header-icons .icon-item svg,
body.page-id-20 .header-icons .icon-item svg {
  width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; flex-shrink: 0;
}
body.page-id-42 .header-icons .icon-label,
body.woocommerce-shop .header-icons .icon-label,
body.page-id-120 .header-icons .icon-label,
body.page-id-122 .header-icons .icon-label,
body.page-id-548 .header-icons .icon-label,
body.page-id-20 .header-icons .icon-label { font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; }
body.page-id-42 .header-icons .wishlist-icon.azi-has-items svg,
body.woocommerce-shop .header-icons .wishlist-icon.azi-has-items svg,
body.page-id-120 .header-icons .wishlist-icon.azi-has-items svg,
body.page-id-122 .header-icons .wishlist-icon.azi-has-items svg,
body.page-id-548 .header-icons .wishlist-icon.azi-has-items svg,
body.page-id-20 .header-icons .wishlist-icon.azi-has-items svg { fill: var(--gold-light); stroke: var(--gold-light); }
body.page-id-42 .header-icons .icon-badge,
body.woocommerce-shop .header-icons .icon-badge,
body.page-id-120 .header-icons .icon-badge,
body.page-id-122 .header-icons .icon-badge,
body.page-id-548 .header-icons .icon-badge,
body.page-id-20 .header-icons .icon-badge {
  position: absolute; top: -7px; right: -9px;
  background: var(--gold); color: var(--bg); font-size: 0.6rem; font-weight: 700;
  width: 15px; height: 15px; border-radius: 50%; align-items: center; justify-content: center;
  display: flex; line-height: 1;
}
@media (max-width: 680px) {
  body.page-id-42 .header-icons .icon-label,
  body.woocommerce-shop .header-icons .icon-label,
  body.page-id-120 .header-icons .icon-label,
  body.page-id-122 .header-icons .icon-label,
  body.page-id-548 .header-icons .icon-label,
  body.page-id-20 .header-icons .icon-label { display: none; }
  body.page-id-42 .header-icons .icon-item.wishlist-icon,
  body.page-id-42 .header-icons a.icon-item,
  body.woocommerce-shop .header-icons .icon-item.wishlist-icon,
  body.woocommerce-shop .header-icons a.icon-item,
  body.page-id-120 .header-icons .icon-item.wishlist-icon,
  body.page-id-120 .header-icons a.icon-item,
  body.page-id-122 .header-icons .icon-item.wishlist-icon,
  body.page-id-122 .header-icons a.icon-item,
  body.page-id-548 .header-icons .icon-item.wishlist-icon,
  body.page-id-548 .header-icons a.icon-item,
  body.page-id-20 .header-icons .icon-item.wishlist-icon,
  body.page-id-20 .header-icons a.icon-item { display: none; }
}
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Standalone Wishlist Page ([azi_wishlist_page]) ── */
/* ══════════════════════════════════════════════════════════ */
.azi-wishlist-page-empty {
  max-width: 480px; margin: 60px auto; padding: 50px 32px; text-align: center;
  border: 1px solid rgba(232,220,200,0.14);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
}
.azi-wishlist-page-glyph {
  display: block; font-size: 1.8rem; color: #C9A95C; margin-bottom: 18px;
}
.azi-wishlist-page-empty h2 {
  font-family: "Cormorant Garamond", serif; font-weight: 400; font-style: italic;
  font-size: clamp(1.5rem, 3vw, 1.9rem); color: #E8DCC8; margin: 0 0 14px;
}
.azi-wishlist-page-empty p {
  font-family: "Jost", sans-serif; font-size: 0.9rem; color: #C4A882; line-height: 1.7; margin: 0 0 28px;
}
.azi-wishlist-page-cta {
  display: inline-block; background: #8B6914; color: #050405; border: 1px solid #8B6914;
  padding: 13px 30px; font-family: "Jost", sans-serif; font-size: 0.75rem; letter-spacing: 0.14em;
  text-transform: uppercase; font-weight: 700; text-decoration: none; transition: background .25s ease;
}
.azi-wishlist-page-cta:hover { background: #C9A95C; border-color: #C9A95C; }
.azi-wishlist-page-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 24px;
  max-width: 1180px; margin: 40px auto; padding: 0 32px;
}
.azi-wishlist-page-card {
  border: 1px solid rgba(232,220,200,0.14);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 24px; text-align: center; transition: border-color .3s, transform .3s;
}
.azi-wishlist-page-card:hover { border-color: #8B6914; transform: translateY(-3px); }
.azi-wishlist-page-card img { width: 100%; height: 180px; object-fit: contain; margin-bottom: 16px; }
.azi-wishlist-page-card h4 {
  font-family: "Cormorant Garamond", serif; font-weight: 400; font-size: 1.2rem;
  color: #E8DCC8; margin: 0 0 8px;
}
.azi-wishlist-page-price { font-family: "Jost", sans-serif; font-size: 0.85rem; color: #C9A95C; display: block; margin-bottom: 16px; }
.azi-wishlist-remove {
  background: transparent; border: none; color: #C4A882; opacity: 0.75; cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.68rem; letter-spacing: 0.1em; text-transform: uppercase;
  -webkit-appearance: none; appearance: none;
}
.azi-wishlist-remove:hover { color: #C9A95C; opacity: 1; }
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Cart Page (body.page-id-18) — REDESIGN ── */
/* Fixes: word-wrap bug on product name (table-layout:fixed      */
/* replaced with flex rows), and adds white accents so the page  */
/* isn't 100% gold-on-black.                                     */
/* ══════════════════════════════════════════════════════════ */
body.page-id-18 .site-header,
body.page-id-18 header.site-header,
body.page-id-18 .elementor-location-header,
body.page-id-18 #masthead,
body.page-id-18 #site-header,
body.page-id-18 .site-footer,
body.page-id-18 footer.site-footer,
body.page-id-18 .elementor-location-footer,
body.page-id-18 #colophon,
body.page-id-18 .page-header,
body.page-id-18 .entry-title,
body.page-id-18 h1.entry-title,
body.page-id-18 .woocommerce-breadcrumb {
  display: none !important;
}
body.page-id-18 {
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.page-id-18 .site-main,
body.page-id-18 .content-area,
body.page-id-18 article,
body.page-id-18 .entry-content,
body.page-id-18 .elementor-widget-html,
body.page-id-18 .elementor-widget-container,
body.page-id-18 .elementor-section,
body.page-id-18 .elementor-container,
body.page-id-18 .e-con,
body.page-id-18 .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
  gap: 0 !important;
}
body.page-id-18 {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
  --white: #F7F4EE;
  --white-strong: #FFFFFF;
}
body.page-id-18 * { box-sizing: border-box; }
body.page-id-18 {
  color: var(--cream);
  font-family: "Jost", sans-serif;
  font-weight: 300;
  line-height: 1.6;
  overflow-x: hidden;
  position: relative;
}
body.page-id-18 h1, body.page-id-18 h2, body.page-id-18 h3 {
  font-family: "Cormorant Garamond", serif; font-weight: 400; letter-spacing: 0.02em; margin: 0;
  color: var(--white-strong);
}
body.page-id-18 p { margin: 0; }
body.page-id-18 a { color: inherit; text-decoration: none; }
body.page-id-18 .wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
@media (max-width: 480px) { body.page-id-18 .wrap { padding: 0 20px; } }
body.page-id-18 .eyebrow {
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold-light); display: inline-block; margin-bottom: 14px;
}
body.page-id-18 #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
/* ── Header / Nav — identical to rest of site ── */
body.page-id-18 header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.page-id-18 header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.page-id-18 .header-left { display: flex; align-items: center; gap: 40px; }
body.page-id-18 .logo-mark { display: flex; align-items: center; gap: 10px; }
body.page-id-18 .logo-mark img { height: 36px; width: auto; display: block; }
body.page-id-18 nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.page-id-18 nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.page-id-18 nav a:hover { opacity: 1; color: var(--gold-light); }
body.page-id-18 .header-icons { display: flex; align-items: center; gap: 22px; }
body.page-id-18 .header-icons .icon-item {
  display: flex; align-items: center; gap: 7px; position: relative;
  color: var(--cream); opacity: 0.85; transition: color .3s, opacity .3s;
}
body.page-id-18 .header-icons .icon-item:hover { color: var(--gold-light); opacity: 1; }
body.page-id-18 .header-icons .icon-item svg {
  width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; flex-shrink: 0;
}
body.page-id-18 .header-icons .icon-label { font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; }
body.page-id-18 .header-icons .wishlist-icon.azi-has-items svg { fill: var(--gold-light); stroke: var(--gold-light); }
body.page-id-18 .header-icons .icon-badge {
  position: absolute; top: -7px; right: -9px;
  background: var(--gold); color: var(--bg); font-size: 0.6rem; font-weight: 700;
  width: 15px; height: 15px; border-radius: 50%; align-items: center; justify-content: center;
  display: flex; line-height: 1;
}
/* Defensive fallback: if the cart-count number is markup we haven't
   explicitly styled (a different badge/count class than .icon-badge),
   force it visible instead of default black-on-transparent text. */
body.page-id-18 .header-icons .cart-icon .icon-badge,
body.page-id-18 .header-icons .cart-icon .cart-contents-count,
body.page-id-18 .header-icons .cart-icon [class*="count"],
body.page-id-18 .header-icons .cart-icon .icon-label {
  color: var(--cream) !important;
}
body.page-id-18 .header-icons .cart-icon .icon-badge,
body.page-id-18 .header-icons .cart-icon [class*="badge"] {
  color: var(--bg) !important;
  background: var(--gold) !important;
}
body.page-id-18 .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.page-id-18 .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
}
body.page-id-18 .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.page-id-18 .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.page-id-18 .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.page-id-18 .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.page-id-18 .hamburger.open span:nth-child(2) { opacity: 0; }
body.page-id-18 .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.page-id-18 .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.page-id-18 .mobile-nav.open { transform: translateX(0); }
body.page-id-18 .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.page-id-18 .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.page-id-18 .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.page-id-18 .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.page-id-18 .header-left { gap: 18px; }
  body.page-id-18 nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.page-id-18 header { padding: 18px 22px; }
  body.page-id-18 nav { display: none; }
  body.page-id-18 .header-icons { gap: 14px; }
  body.page-id-18 .header-icons .icon-label { display: none; }
  body.page-id-18 .header-icons a.icon-item { display: none; }
  body.page-id-18 .lang-toggle { font-size: 0.66rem; }
  body.page-id-18 .hamburger { display: flex; }
  body.page-id-18 .mobile-nav, body.page-id-18 .nav-scrim { display: flex; }
}
/* ── Cart hero (from [azi_cart_hero] shortcode) ──
   Made into a full-bleed band (edge to edge, own subtle background +
   hairline) instead of text floating on the same flat black as the
   rest of the page — reads as a distinct section, less "simplistic". */
body.page-id-18 .cart-hero {
  width: 100%;
  padding: 160px 24px 44px;
  text-align: center;
  background: linear-gradient(180deg, rgba(196,168,130,0.05), transparent);
  border-bottom: 1px solid var(--line);
  margin-bottom: 8px;
}
/* Matches the hero title size used on Shop (woocommerce-shop .shop-hero h1)
   and Home, so the Cart title no longer looks undersized next to them. */
body.page-id-18 .cart-hero h1 {
  font-size: clamp(2.375rem, 5vw, 3.8125rem);
  font-style: italic; color: var(--white-strong);
  max-width: 780px; margin: 0 auto; line-height: 1.1;
}
@media (max-width: 680px) { body.page-id-18 .cart-hero { padding: 120px 20px 32px; } }
/* Broadened from "p.cart-empty.woocommerce-info" — if WooCommerce
   renders this notice as something other than a literal <p> tag (it
   varies by version), the old selector silently matched nothing.
   Matching on the "cart-empty" class alone, regardless of element/
   tag, is more robust. This is WooCommerce's own default "Your cart
   is currently empty." notice — redundant since the [azi_cart_hero]
   shortcode already shows its own "Your cart is quiet, for now"
   message for the empty state. */
body.page-id-18 .cart-empty { display: none !important; }
/* Generic WooCommerce notices ("Cart updated.", coupon errors, etc.) —
   were rendering inline as a permanent white box + black text (invisible
   against the dark theme, AND stuck in the page instead of going away).
   Now a floating toast, fixed to the top of the viewport, that the
   companion JS (azi-mini-cart-drawer.js) auto-dismisses after a few
   seconds — see the "Notice toast auto-dismiss" block there. */
body.page-id-18 .woocommerce-message,
body.page-id-18 .woocommerce-error,
body.page-id-18 .woocommerce-info,
body.page-id-18 .woocommerce-NoticeGroup,
body.page-id-18 ul.woocommerce-error {
  list-style: none !important; width: max-content !important; max-width: min(90vw, 480px) !important;
  position: fixed !important; top: 100px !important; left: 50% !important; right: auto !important;
  transform: translateX(-50%) !important;
  margin: 0 !important; padding: 15px 22px 15px 40px !important;
  border: 1px solid var(--gold); border-top: 3px solid var(--gold);
  background: #0c0b0a !important; color: var(--cream) !important;
  font-size: 0.85rem; line-height: 1.5;
  box-shadow: 0 14px 34px rgba(0,0,0,0.45);
  z-index: 500 !important;
  opacity: 1; transition: opacity .4s ease, transform .4s ease;
}
body.page-id-18 .woocommerce-message.azi-toast-hide,
body.page-id-18 .woocommerce-error.azi-toast-hide,
body.page-id-18 .woocommerce-info.azi-toast-hide {
  opacity: 0 !important; transform: translateX(-50%) translateY(-14px) !important;
}
body.page-id-18 .woocommerce-error { border-color: #c97b5a; border-top-color: #c97b5a; }
body.page-id-18 .woocommerce-message::before,
body.page-id-18 .woocommerce-info::before { content: "✦"; position: absolute; left: 16px; top: 15px; color: var(--gold-light); }
body.page-id-18 .woocommerce-error::before { content: "!"; position: absolute; left: 17px; top: 14px; color: #c97b5a; font-weight: 700; }
body.page-id-18 .woocommerce-message li,
body.page-id-18 .woocommerce-error li,
body.page-id-18 .woocommerce-info li { margin: 0; color: var(--cream) !important; }
body.page-id-18 .woocommerce-message a,
body.page-id-18 .woocommerce-error a { color: var(--gold-light); border-bottom: 1px solid var(--gold-light); }
@media (max-width: 680px) {
  body.page-id-18 .woocommerce-message,
  body.page-id-18 .woocommerce-error,
  body.page-id-18 .woocommerce-info { top: 90px; }
}

/* blockUI — the grey fog + spinner WooCommerce shows over the cart
   table/totals while an AJAX request (Update cart, coupon, quantity
   change) is in flight. Default is a plain white overlay + a tiny
   black circle, which is what those unexplained "white boxes" were.
   Restyled to match the dark theme with a thin gold spinner. */
body.page-id-18 .blockUI.blockOverlay {
  background: rgba(5,4,5,0.55) !important;
  border-radius: 4px;
}
body.page-id-18 .blockUI.blockOverlay::before {
  content: "";
  position: absolute; top: 50%; left: 50%; width: 26px; height: 26px;
  margin: -13px 0 0 -13px;
  border: 2px solid rgba(232,220,200,0.25);
  border-top-color: var(--gold-light);
  border-radius: 50%;
  animation: azi-spin 0.8s linear infinite;
}
@keyframes azi-spin { to { transform: rotate(360deg); } }
/* On an empty cart, .woocommerce-cart-form and .cart-collaterals don't
   exist at all — so this paragraph is the only real child of the
   2-column grid (.woocommerce), and without an explicit grid-area it
   lands in just ONE of the two columns. text-align:center then only
   centers it inside that narrow column, not the actual page — which
   is why it sat off to the side instead of centered. Spanning the
   full grid width fixes it regardless of which column it landed in. */
body.page-id-18 p.return-to-shop {
  grid-column: 1 / -1;
  text-align: center;
  margin: 46px 0 70px;
}
body.page-id-18 p.return-to-shop a.button {
  display: inline-block; background: var(--gold); color: var(--bg); border: 1px solid var(--gold);
  padding: 15px 36px; font-size: 0.75rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
body.page-id-18 p.return-to-shop a.button:hover {
  background: var(--gold-light); border-color: var(--gold-light);
  transform: translateY(-3px); box-shadow: 0 10px 24px rgba(139,105,20,0.28);
}
/* ── Cart layout wrapper: two-column grid ──
   IMPORTANT: WooCommerce inserts a .woocommerce-notices-wrapper as an
   EXTRA direct child of .woocommerce, before the cart form. With a plain
   2-column grid and implicit placement, that empty wrapper eats the
   first (1fr) column and pushes the actual cart form into the narrow
   360px column — which is exactly what produced the squeezed layout /
   word-by-word wrapped product name. Fixing this with explicit
   grid-template-areas so placement no longer depends on child order. */
body.page-id-18 .woocommerce {
  max-width: 1100px; margin: 40px auto 100px !important; padding: 0 32px !important;
  display: grid;
  grid-template-columns: 1fr 400px;
  grid-template-areas: "cartform totals";
  gap: 48px; align-items: start;
}
body.page-id-18 .woocommerce-notices-wrapper { display: contents; }
body.page-id-18 .woocommerce-cart-form { grid-area: cartform; }
body.page-id-18 .cart-collaterals { grid-area: totals; }
@media (max-width: 880px) {
  body.page-id-18 .woocommerce {
    grid-template-columns: 1fr;
    grid-template-areas: "cartform" "totals";
    padding: 0 20px !important;
  }
}
/* ── Cart items table — FLEX ROWS (fixes the word-by-word wrap bug
   caused by table-layout:fixed miscalculating the name column) ── */
body.page-id-18 table.shop_table.cart,
body.page-id-18 .woocommerce-cart-form table.cart {
  width: 100%; border-collapse: collapse; border-top: 1px solid var(--line);
  table-layout: auto;
}
body.page-id-18 table.cart thead { display: none; }
body.page-id-18 table.cart tbody tr.cart_item {
  display: flex;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid var(--line);
  padding: 22px 0;
}
body.page-id-18 table.cart tbody tr.cart_item:last-child { border-bottom: none; }
body.page-id-18 table.cart tbody tr.cart_item td {
  border: none !important;
  padding: 0 !important;
  background: transparent !important;
  vertical-align: middle;
}
body.page-id-18 table.cart td.product-remove { order: 1; flex: 0 0 20px; }
body.page-id-18 table.cart td.product-thumbnail { order: 2; flex: 0 0 64px; }
body.page-id-18 table.cart td.product-name { order: 3; flex: 1 1 160px; min-width: 0; }
body.page-id-18 table.cart td.product-price { order: 4; flex: 0 0 74px; text-align: right; padding-right: 4px !important; }
body.page-id-18 table.cart td.product-quantity { order: 5; flex: 0 0 96px; }
body.page-id-18 table.cart td.product-subtotal { order: 6; flex: 0 0 90px; text-align: right; padding-right: 6px !important; }
body.page-id-18 table.cart td.product-remove a.remove {
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%; color: var(--biscuit) !important;
  font-size: 1.1rem; background: transparent !important; transition: color .3s, background .3s;
}
body.page-id-18 table.cart td.product-remove a.remove:hover { color: var(--gold-light) !important; background: rgba(139,105,20,0.12) !important; }
body.page-id-18 table.cart td.product-thumbnail img {
  width: 64px; height: 64px; object-fit: contain; border: 1px solid var(--line);
  background: radial-gradient(ellipse at 50% 30%, rgba(196,168,130,0.14), rgba(5,4,5,0.5));
  padding: 8px;
  display: block;
}
/* Name column — forced to a single line (truncates with … in the rare
   case a name is genuinely too long for the available width, instead
   of breaking word-by-word like before). Freed up space by trimming
   thumbnail/price/qty/subtotal widths and the row gap above. */
body.page-id-18 table.cart td.product-name {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}
body.page-id-18 table.cart td.product-name a {
  font-family: "Cormorant Garamond", serif; font-size: 1.15rem;
  color: var(--white-strong);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  line-height: 1.3;
}
body.page-id-18 table.cart td.product-name .variation {
  font-family: "Jost", sans-serif; font-size: 0.76rem; color: var(--biscuit);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%;
}
body.page-id-18 table.cart td.product-price {
  font-family: "Jost", sans-serif; font-size: 0.85rem; color: var(--biscuit); white-space: nowrap;
}
body.page-id-18 table.cart td.product-subtotal {
  font-family: "Jost", sans-serif; font-size: 0.95rem; color: var(--gold-light); font-weight: 600; white-space: nowrap;
}
/* Quantity — native input + injected +/- buttons */
body.page-id-18 .quantity { display: flex; align-items: center; border: 1px solid var(--line); width: fit-content; }
body.page-id-18 .quantity input.qty {
  width: 34px; text-align: center; background: transparent; border: none;
  border-left: 1px solid var(--line); border-right: 1px solid var(--line);
  color: var(--white-strong); font-family: "Jost", sans-serif; font-size: 0.9rem; height: 32px;
  -webkit-appearance: none; appearance: none; -moz-appearance: textfield;
}
body.page-id-18 .quantity input.qty::-webkit-inner-spin-button,
body.page-id-18 .quantity input.qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
body.page-id-18 .azi-qty-btn {
  width: 32px; height: 32px; background: transparent; border: none; color: var(--cream);
  font-family: "Jost", sans-serif; font-size: 1rem; cursor: pointer; transition: background .2s, color .2s;
  -webkit-appearance: none; appearance: none;
}
body.page-id-18 .azi-qty-btn:hover { background: rgba(139,105,20,0.15); color: var(--gold-light); }
/* Replace the browser-default blue focus ring with a themed gold one */
body.page-id-18 .azi-qty-btn:focus,
body.page-id-18 .azi-qty-btn:focus-visible,
body.page-id-18 .quantity input.qty:focus,
body.page-id-18 .quantity input.qty:focus-visible {
  outline: none;
  box-shadow: inset 0 0 0 1px var(--gold-light);
}
/* Cart actions row (coupon + Update cart) — WooCommerce does NOT
   render a <tfoot> on the Cart page; this row is the LAST <tr> of
   <tbody>, a single <td class="actions" colspan="6">. The old rules
   here targeted "table.cart tfoot ..." which never matched anything
   in the real markup — that's why Update Cart rendered as a bare
   unstyled browser button. Fixed to target td.actions directly. */
body.page-id-18 table.cart tr:not(.cart_item) td.actions {
  border: none !important; background: transparent !important; padding: 24px 0 0 !important;
}
/* Coupon form */
body.page-id-18 .woocommerce-cart-form .coupon { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; margin-top: 20px; }
body.page-id-18 .woocommerce-cart-form .coupon input#coupon_code {
  background: transparent; border: 1px solid var(--line); color: var(--white-strong);
  padding: 10px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; min-width: 160px;
  -webkit-appearance: none; appearance: none; border-radius: 0;
}
body.page-id-18 .woocommerce-cart-form .coupon input#coupon_code::placeholder { color: rgba(247,244,238,0.4); }
body.page-id-18 .woocommerce-cart-form .coupon input#coupon_code:focus { outline: none; border-color: var(--gold); }
body.page-id-18 .woocommerce-cart-form .coupon button[name="apply_coupon"] {
  background: transparent; color: var(--biscuit); border: 1px solid var(--line);
  padding: 10px 20px; font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer;
  transition: border-color .3s, color .3s; -webkit-appearance: none; appearance: none; border-radius: 0;
  font-family: "Jost", sans-serif; font-weight: 500;
}
body.page-id-18 .woocommerce-cart-form .coupon button[name="apply_coupon"]:hover { border-color: var(--gold); color: var(--gold-light); }
body.page-id-18 table.cart td.actions button[name="update_cart"] {
  margin-left: 20px; background: linear-gradient(135deg, var(--gold-light), var(--gold));
  color: #050405; border: 1px solid var(--gold);
  padding: 11px 22px; font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
  -webkit-appearance: none; appearance: none; border-radius: 0;
  font-family: "Jost", sans-serif; font-weight: 700; opacity: 1;
}
body.page-id-18 table.cart td.actions button[name="update_cart"]:disabled {
  background: transparent; color: var(--biscuit); opacity: 0.4; cursor: not-allowed; border-color: var(--line);
}
body.page-id-18 table.cart td.actions button[name="update_cart"]:not(:disabled):hover {
  transform: translateY(-1px); box-shadow: 0 8px 20px rgba(201,169,92,0.28);
}
@media (max-width: 768px) {
  body.page-id-18 table.cart tbody tr.cart_item {
    flex-wrap: wrap;
  }
  body.page-id-18 table.cart td.product-remove { order: 1; }
  body.page-id-18 table.cart td.product-thumbnail { order: 2; }
  body.page-id-18 table.cart td.product-name { order: 3; flex: 1 1 calc(100% - 96px); }
  body.page-id-18 table.cart td.product-price { order: 4; flex: 0 0 100%; text-align: left; margin-left: 76px; margin-top: 4px; }
  body.page-id-18 table.cart td.product-quantity { order: 5; flex: 0 0 100%; margin-left: 76px; margin-top: 8px; }
  body.page-id-18 table.cart td.product-subtotal { order: 6; flex: 0 0 100%; text-align: left; margin-left: 76px; margin-top: 8px; }
  body.page-id-18 table.cart td.actions button[name="update_cart"] { margin-left: 0; margin-top: 12px; display: block; }
  body.page-id-18 table.cart.shop_table_responsive tr.cart_item,
  body.page-id-18 table.cart.shop_table_responsive td { float: none !important; }
  body.page-id-18 table.cart td::before { display: none !important; content: "" !important; }
  body.page-id-18 table.cart td.product-remove,
  body.page-id-18 table.cart td.product-thumbnail,
  body.page-id-18 table.cart td.product-name,
  body.page-id-18 table.cart td.product-price,
  body.page-id-18 table.cart td.product-quantity,
  body.page-id-18 table.cart td.product-subtotal {
    width: auto !important;
  }
}
/* ── Cart totals sidebar ──
   NOTE: .cart_totals is nested INSIDE .cart-collaterals in WooCommerce's
   markup (not a sibling) — styling both with a border+padding box
   produced a visible "double box" effect. Only the outer wrapper gets
   the card treatment now; the inner element is just spacing. */
body.page-id-18 .cart-collaterals {
  /* Softer, borderless card — a faint tint instead of a hard-edged
     rectangle, so it reads as part of the page rather than a floating
     box dropped on top of it.
     Also sticky: now that the left column can grow taller than the
     totals box (upsell cards, free-shipping bar), a static box left
     a big dead gap below it. Sticky keeps it aligned with whatever
     you're looking at instead of looking orphaned at the top. */
  border: none;
  background: linear-gradient(180deg, rgba(196,168,130,0.05), rgba(196,168,130,0.015));
  border-radius: 4px;
  padding: 34px 32px;
  position: sticky;
  top: 110px;
  align-self: start;
}
@media (max-width: 880px) {
  body.page-id-18 .cart-collaterals { position: static; top: auto; }
}
body.page-id-18 .cart_totals {
  border: none; background: transparent; padding: 0;
}
body.page-id-18 .cart_totals h2 {
  font-size: 1.2rem; margin-bottom: 16px; padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
  color: var(--white-strong);
  text-align: center;
}
/* REGRESSION FIX: table-layout:fixed + fixed 38%/62% column widths +
   word-wrap:break-word (added to fix cramped margins) backfired badly —
   it forced "Shipment" and "177,00 lei" to break mid-word/mid-number
   because the fixed columns weren't wide enough at that font size.
   Back to natural auto layout; breathing room now comes purely from
   the box's own padding + a small left gutter on the value column,
   with nowrap on the short label/price text so it can never fracture. */
body.page-id-18 .cart_totals table.shop_table { width: 100%; border-collapse: collapse; table-layout: auto; }
body.page-id-18 .cart_totals table.shop_table tr th,
body.page-id-18 .cart_totals table.shop_table tr td {
  padding: 10px 0; border: none; border-bottom: 1px solid var(--line);
  font-size: 0.9rem; color: var(--biscuit); font-weight: 400; text-align: left;
  white-space: nowrap;
}
body.page-id-18 .cart_totals table.shop_table tr td { text-align: right; color: var(--white); padding-left: 14px; }
/* The shipping row's value cell has real multi-word content (method
   name, "Shipping to X.", "Change address") — that one SHOULD wrap
   normally, and reads better left-aligned rather than right-aligned. */
body.page-id-18 .cart_totals table.shop_table tr.shipping td {
  white-space: normal; text-align: left; padding-left: 14px;
}
body.page-id-18 .cart_totals .woocommerce-shipping-destination,
body.page-id-18 .cart_totals .shipping-calculator-button { padding-right: 2px; }
body.page-id-18 .cart_totals table.shop_table tr.order-total th,
body.page-id-18 .cart_totals table.shop_table tr.order-total td {
  color: var(--white-strong); font-size: 1.05rem; font-weight: 600; border-bottom: none;
  border-top: 1px solid var(--gold-light); padding-top: 16px;
}
body.page-id-18 .cart_totals table.shop_table tr.order-total td { color: var(--gold-light); font-size: 1.2rem; }
body.page-id-18 .cart_totals .woocommerce-shipping-methods { list-style: none; margin: 0; padding: 0; font-size: 0.85rem; }
/* The blank gap between "Shipment" and "Total" is the hidden
   change-address form (country/state/postcode selects) — it sits
   collapsed but its background/border got reset to transparent
   by the rules above, so instead of disappearing it just went
   invisible while still taking up layout height. Force it fully
   out of flow so it can't reserve space. */
body.page-id-18 .cart_totals .shipping-calculator-form { display: none !important; }
body.page-id-18 .cart_totals .woocommerce-shipping-destination,
body.page-id-18 .cart_totals .shipping-calculator-button {
  display: inline-block; margin: 2px 0 0; line-height: 1.4; font-size: 0.82rem;
}
body.page-id-18 .cart_totals tr.shipping td { padding-bottom: 10px; }
body.page-id-18 .wc-proceed-to-checkout { margin-top: 18px; }
/* Was transitioning "background" from a gradient to a solid color on
   hover — browsers can't interpolate between the two, so it just
   snapped instantly instead of animating (the "weird" hover glitch).
   Rebuilt to match the homepage's primary button (.btn.btn-solid):
   solid fill + lift + shadow, all properties that actually animate. */
body.page-id-18 .wc-proceed-to-checkout a.checkout-button {
  display: block; width: 100%; text-align: center;
  background: var(--gold);
  color: #050405 !important; border: 1px solid var(--gold);
  border-radius: 0;
  padding: 15px; font-size: 0.78rem; letter-spacing: 0.16em; text-transform: uppercase; font-weight: 700;
  cursor: pointer; transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
body.page-id-18 .wc-proceed-to-checkout a.checkout-button:hover {
  background: var(--gold-light); border-color: var(--gold-light);
  transform: translateY(-3px); box-shadow: 0 10px 24px rgba(139,105,20,0.28);
}
/* Apple Pay / Google Pay — moved to the Checkout page (see the
   .woocommerce-checkout rules further down), where there's enough
   width for Stripe to lay them out side by side on its own. Hiding
   them here in the Cart sidebar so they don't show twice.
   NOTE: the real fix is in WooCommerce → Settings → Payments →
   Stripe → "Payment Request Button Locations" — untick Cart, tick
   Checkout. This CSS is just a safety net in case that setting is
   left as-is or isn't available on your Stripe plugin version. */
body.page-id-18 .cart_totals [class*="express-checkout"],
body.page-id-18 .cart_totals [class*="payment-request"],
body.page-id-18 .cart_totals [id*="express-checkout"] {
  display: none !important;
}

/* ── Checkout page: Apple Pay / Google Pay side by side ──
   .woocommerce-checkout is a body class WooCommerce adds
   automatically on the Checkout page, regardless of its page ID,
   so this works without needing that page's numeric ID. */
.woocommerce-checkout [class*="express-checkout"],
.woocommerce-checkout [class*="payment-request"],
.woocommerce-checkout [id*="express-checkout"] {
  width: 100% !important;
  max-width: 640px;
  margin: 0 auto 28px !important;
}
.woocommerce-checkout #payment,
.woocommerce-checkout .woocommerce-checkout-payment {
  max-width: 640px;
}
/* ── Footer (identical to rest of site) ── */
body.page-id-18 footer { padding: 56px 0 26px; border-top: 1px solid var(--line); }
body.page-id-18 .footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
body.page-id-18 .footer-brand { display: none; }
body.page-id-18 .footer-col h5 { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 18px; }
body.page-id-18 .footer-col a { display: block; font-size: 0.85rem; color: var(--biscuit); margin-bottom: 12px; transition: color .3s; }
body.page-id-18 .footer-col a:hover { color: var(--cream); }
body.page-id-18 .newsletter-form { display: flex; border: 1px solid var(--line); margin-top: 6px; }
body.page-id-18 .newsletter-form input { flex: 1; background: transparent; border: none; outline: none; color: var(--cream); padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; }
body.page-id-18 .newsletter-form button { background: var(--gold); color: var(--bg); border: none; padding: 0 18px; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-weight: 700; font-family: "Jost", sans-serif; }
body.page-id-18 .newsletter-msg { font-size: 0.75rem; color: var(--gold-light); margin-top: 8px; min-height: 1em; }
body.page-id-18 .footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 0.75rem; color: var(--biscuit); }
body.page-id-18 .socials { display: flex; gap: 16px; }
body.page-id-18 .socials a { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; transition: border-color .3s, color .3s; }
body.page-id-18 .socials a:hover { border-color: var(--gold); color: var(--gold-light); }
@media (max-width: 880px) { body.page-id-18 .footer-top { grid-template-columns: 1fr; gap: 36px; } }

/* ── Cart free-shipping bar (azi-cart-freeship-and-upsell.php) ── */
body.page-id-18 .azi-freeship { margin-bottom: 20px; }
body.page-id-18 .azi-freeship__label { font-family: "Jost", sans-serif; font-size: 0.8rem; color: var(--biscuit); margin: 0 0 8px; }
body.page-id-18 .azi-freeship__label strong { color: var(--gold-light); }
body.page-id-18 .azi-freeship__label--done { color: var(--gold-light); }
body.page-id-18 .azi-freeship__track { width: 100%; height: 4px; background: var(--line); border-radius: 2px; overflow: hidden; }
body.page-id-18 .azi-freeship__fill { height: 100%; background: linear-gradient(90deg, var(--gold), var(--gold-light)); transition: width .3s ease; }

/* ── Cart upsell cards (azi-cart-freeship-and-upsell.php) ── */
body.page-id-18 .azi-cart-upsell { margin: 24px 0 4px; padding-top: 22px; border-top: 1px solid var(--line); }
body.page-id-18 .azi-cart-upsell__title { font-family: "Jost", sans-serif; font-size: 0.75rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--biscuit); margin: 0 0 16px; }
body.page-id-18 .azi-cart-upsell__grid { display: flex; gap: 16px; flex-wrap: wrap; }
body.page-id-18 .azi-cart-upsell__card {
  display: flex; flex-direction: column; align-items: center; width: 130px; text-align: center;
  padding: 14px 10px 12px; border: 1px solid var(--line); border-radius: 2px;
  transition: border-color .2s ease, transform .2s ease;
}
body.page-id-18 .azi-cart-upsell__card:hover { border-color: var(--gold-light); transform: translateY(-2px); }
body.page-id-18 .azi-cart-upsell__link { display: flex; flex-direction: column; align-items: center; text-decoration: none; }
body.page-id-18 .azi-cart-upsell__img img { width: 70px; height: 70px; object-fit: cover; border-radius: 2px; margin-bottom: 8px; }
body.page-id-18 .azi-cart-upsell__name { font-family: "Cormorant Garamond", serif; font-size: 0.95rem; color: var(--white-strong); line-height: 1.3; }
body.page-id-18 .azi-cart-upsell__price { font-family: "Jost", sans-serif; font-size: 0.8rem; color: var(--gold-light); margin-top: 4px; }
body.page-id-18 .azi-cart-upsell__add { margin-top: 10px; width: 100%; }
body.page-id-18 .azi-cart-upsell__btn {
  display: block; width: 100%; text-align: center; text-decoration: none;
  background: transparent; color: var(--gold-light); border: 1px solid var(--gold);
  padding: 7px 0; font-family: "Jost", sans-serif; font-size: 0.68rem; letter-spacing: 0.1em;
  text-transform: uppercase; font-weight: 600; transition: background .2s ease, color .2s ease;
}
body.page-id-18 .azi-cart-upsell__btn:hover { background: var(--gold); color: #050405; }
body.page-id-18 .azi-cart-upsell__btn.loading { opacity: 0.6; pointer-events: none; }
body.page-id-18 .azi-cart-upsell__btn.added::after { content: " ✓"; }
body.page-id-18 .azi-cart-upsell__btn--view { color: var(--biscuit); border-color: var(--line); }
body.page-id-18 .azi-cart-upsell__btn--view:hover { background: transparent; color: var(--gold-light); border-color: var(--gold); }
@media (max-width: 480px) { body.page-id-18 .azi-cart-upsell__card { width: 100px; } }

/* ── Slide-in mini-cart drawer (site-wide, NOT scoped to page-id-18 —
   it needs to work from every product/shop page) ──
   Uses the same design tokens as the Cart page; falls back to literal
   values since --gold/--white etc. are only defined per page-id block. */
.azi-drawer-overlay {
  position: fixed; inset: 0; background: rgba(5,4,5,0.6);
  opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility .3s ease;
  z-index: 9998;
}
body.azi-drawer-open .azi-drawer-overlay { opacity: 1; visibility: visible; }
.azi-drawer {
  position: fixed; top: 0; right: 0; height: 100%; width: min(400px, 92vw);
  background: #0c0b0a; border-left: 1px solid rgba(232,220,200,0.14);
  transform: translateX(100%); transition: transform .35s ease;
  z-index: 9999; display: flex; flex-direction: column;
}
body.azi-drawer-open .azi-drawer { transform: translateX(0); }
.azi-drawer__head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 24px; border-bottom: 1px solid rgba(232,220,200,0.14);
}
.azi-drawer__title { font-family: "Cormorant Garamond", serif; font-size: 1.3rem; color: #FFFFFF; }
.azi-drawer__close {
  background: none; border: none; color: #E8DCC8; font-size: 1.6rem; line-height: 1;
  cursor: pointer; padding: 0 4px;
}
.azi-drawer__body { flex: 1; overflow-y: auto; padding: 20px 24px; }
.azi-drawer__loading, .azi-drawer__empty { font-family: "Jost", sans-serif; font-size: 0.85rem; color: #C4A882; text-align: center; margin-top: 30px; }
.azi-drawer__empty a { color: #C9A95C; }
.azi-drawer__shop-link {
  display: block; text-align: center; margin-top: 14px; color: #C9A95C; font-family: "Jost", sans-serif; font-size: 0.85rem;
}
.azi-drawer__items { display: flex; flex-direction: column; gap: 16px; }
.azi-drawer__item { display: flex; align-items: center; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid rgba(232,220,200,0.1); }
.azi-drawer__item-img img { width: 56px; height: 56px; object-fit: cover; border-radius: 2px; }
.azi-drawer__item-info { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.azi-drawer__item-name { font-family: "Cormorant Garamond", serif; font-size: 1rem; color: #FFFFFF; }
.azi-drawer__item-meta { font-family: "Jost", sans-serif; font-size: 0.75rem; color: #C4A882; }
.azi-drawer__item-price { font-family: "Jost", sans-serif; font-size: 0.85rem; color: #C9A95C; font-weight: 700; }
.azi-drawer__subtotal {
  display: flex; justify-content: space-between; margin-top: 18px; padding-top: 16px;
  border-top: 1px solid rgba(232,220,200,0.14); font-family: "Jost", sans-serif; color: #F7F4EE; font-size: 0.95rem; font-weight: 600;
}
.azi-drawer__actions { display: flex; flex-direction: column; gap: 10px; margin-top: 20px; }
.azi-drawer__btn {
  display: block; text-align: center; padding: 14px; font-family: "Jost", sans-serif;
  font-size: 0.75rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
  text-decoration: none; border: 1px solid #8B6914; transition: background .25s ease, color .25s ease;
}
.azi-drawer__btn--ghost { color: #F7F4EE; background: transparent; }
.azi-drawer__btn--ghost:hover { background: rgba(201,169,92,0.1); }
.azi-drawer__btn--solid { background: linear-gradient(135deg, #C9A95C, #8B6914); color: #050405; }
.azi-drawer__btn--solid:hover { filter: brightness(1.08); }

/* ============================================================
   AZI RITUALS — Checkout page
   ------------------------------------------------------------
   NOTE ON THE HEADER: the plain-text "Home / Rituals / AZI
   Journal / My account / Cart" nav you're seeing (instead of the
   logo + icon header used everywhere else) means this page is
   rendering with a DIFFERENT page template than the rest of the
   site — not a missing-CSS problem. CSS can't add markup that
   isn't in the page at all. In wp-admin, open the Checkout page →
   Page Attributes (or the equivalent panel for your builder) →
   check which Template it's using, and switch it to match Cart/
   Shop/etc. Once it's using the same template, the same header/
   footer CSS already in this file will apply to it automatically.

   NOTE ON SELECTORS BELOW: this checkout looks like it may be
   using WooCommerce's newer block-based Checkout (Express
   Checkout heading, Order summary card, "Add coupons" accordion
   are its signatures) rather than the classic shortcode — which
   uses completely different class names (wc-block-* instead of
   #order_review, .woocommerce-billing-fields, etc.). Rather than
   guess at exact block class names and risk another wrong pass,
   everything here targets plain HTML input/select/textarea/button
   types and generic heading tags inside .woocommerce-checkout —
   those exist no matter which checkout system rendered them, so
   this is safe either way. If specific sections still look
   unstyled after this, send a screenshot of just that section and
   I'll tighten the selector.
   ============================================================ */
.woocommerce-checkout {
  background: #050405;
}
.woocommerce-checkout,
.woocommerce-checkout p,
.woocommerce-checkout label,
.woocommerce-checkout span {
  font-family: "Jost", sans-serif;
  color: #E8DCC8;
}
.woocommerce-checkout h1,
.woocommerce-checkout h2,
.woocommerce-checkout h3,
.woocommerce-checkout legend {
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  color: #FFFFFF;
}
.woocommerce-checkout h1 { font-size: clamp(2rem, 4vw, 2.8rem); font-style: italic; }
.woocommerce-checkout h2,
.woocommerce-checkout legend { font-size: 1.4rem; margin-bottom: 18px; }

/* Form fields — the actual glaring white boxes */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="search"],
.woocommerce-checkout input[type="number"],
.woocommerce-checkout input:not([type]),
.woocommerce-checkout select,
.woocommerce-checkout textarea {
  background: #0c0b0a !important;
  border: 1px solid rgba(232,220,200,0.18) !important;
  color: #F7F4EE !important;
  border-radius: 2px;
  padding: 14px 16px;
  font-family: "Jost", sans-serif;
  font-size: 0.9rem;
  box-shadow: none !important;
}
.woocommerce-checkout input::placeholder,
.woocommerce-checkout textarea::placeholder { color: rgba(247,244,238,0.4) !important; }
.woocommerce-checkout input:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout textarea:focus {
  outline: none !important;
  border-color: #C9A95C !important;
}
.woocommerce-checkout input[type="checkbox"],
.woocommerce-checkout input[type="radio"] {
  accent-color: #C9A95C;
}

/* Divider ("Or continue below") and section separators */
.woocommerce-checkout hr { border-color: rgba(232,220,200,0.14); }

/* Order summary card */
.woocommerce-checkout aside,
.woocommerce-checkout [class*="order-summary"],
.woocommerce-checkout [class*="sidebar"] {
  background: linear-gradient(180deg, rgba(196,168,130,0.05), rgba(196,168,130,0.015));
  border-radius: 4px;
}

/* Place order / pay button */
.woocommerce-checkout button[type="submit"],
.woocommerce-checkout #place_order,
.woocommerce-checkout .checkout-button {
  background: #8B6914;
  color: #050405 !important;
  border: 1px solid #8B6914;
  border-radius: 0;
  padding: 15px 28px;
  font-family: "Jost", sans-serif;
  font-size: 0.78rem;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
.woocommerce-checkout button[type="submit"]:hover,
.woocommerce-checkout #place_order:hover {
  background: #C9A95C;
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(139,105,20,0.28);
}
/* AZI — Cart hero title size fix. Paste this at the very END of your
   existing Additional CSS box — do NOT delete/replace anything else.
   The !important guarantees it wins even if an older rule above it
   is setting a smaller size. */
body.page-id-18 .cart-hero h1 {
  font-size: clamp(2.375rem, 5vw, 3.8125rem) !important;
  max-width: 780px !important;
  margin: 0 auto !important;
  line-height: 1.1 !important;
}
/* AZI — Cart hero "YOUR CART" label: bigger + bold, matching Shop.
   Paste at the very END of your existing Additional CSS — don't
   delete anything else. */
body.page-id-18 .cart-hero .eyebrow {
  font-size: clamp(1.05rem, 2.2vw, 1.35rem) !important;
  font-weight: 700 !important;
  letter-spacing: 0.26em !important;
  margin-bottom: 20px !important;
}

/* AZI — Move "Return to Shop" button higher on the empty cart page.
   Paste at the very END of your existing Additional CSS — don't
   delete anything else. */
body.page-id-18 p.return-to-shop {
  margin-top: 0 !important;
}
/* AZI — Shrink the empty black area around "Return to Shop".
   Paste at the very END of your existing Additional CSS — don't
   delete anything else. */
body.page-id-18 p.return-to-shop {
  margin-bottom: 20px !important;
}
body.page-id-18 .woocommerce:has(p.return-to-shop) {
  margin-bottom: 40px !important;
}
/* 
 * /* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Wishlist Page (body.page-id-552) ── */
/* ══════════════════════════════════════════════════════════ */
body.page-id-552 .site-header,
body.page-id-552 header.site-header,
body.page-id-552 .elementor-location-header,
body.page-id-552 #masthead,
body.page-id-552 #site-header,
body.page-id-552 .site-footer,
body.page-id-552 footer.site-footer,
body.page-id-552 .elementor-location-footer,
body.page-id-552 #colophon,
body.page-id-552 .page-header,
body.page-id-552 .entry-title,
body.page-id-552 h1.entry-title {
  display: none !important;
}
body.page-id-552 {
  margin: 0 !important;
  padding: 0 !important;
  background: #050405 !important;
}
body.page-id-552 .site-main,
body.page-id-552 .content-area,
body.page-id-552 article,
body.page-id-552 .entry-content,
body.page-id-552 .elementor-widget-html,
body.page-id-552 .elementor-widget-container,
body.page-id-552 .elementor-section,
body.page-id-552 .elementor-container,
body.page-id-552 .e-con,
body.page-id-552 .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
body.page-id-552 {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
  --texture-swirl: url("https://azirituals.ro/wp-content/uploads/2026/09/azi-texture-swirl-1200.webp");
}
body.page-id-552 * { box-sizing: border-box; }
body.page-id-552 {
  background: var(--bg);
  color: var(--cream);
  font-family: "Jost", sans-serif;
  font-weight: 300;
  line-height: 1.6;
  overflow-x: hidden;
  position: relative;
}
body.page-id-552::before {
  content: "";
  position: fixed;
  inset: -12%;
  width: 124%; height: 124%;
  background-image: var(--texture-swirl);
  background-size: 1500px 1500px;
  background-repeat: repeat;
  opacity: 0.09;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: -1;
  animation: textureDrift 160s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  body.page-id-552::before { animation: none; }
}
body.page-id-552 h1, body.page-id-552 h2, body.page-id-552 h3, body.page-id-552 h4 {
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  letter-spacing: 0.02em;
  margin: 0;
}
body.page-id-552 p { margin: 0; }
body.page-id-552 a { color: inherit; text-decoration: none; }
body.page-id-552 .wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
@media (max-width: 480px) { body.page-id-552 .wrap { padding: 0 20px; } }
body.page-id-552 .eyebrow {
  font-family: "Jost", sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--gold-light);
  display: inline-block;
  margin-bottom: 18px;
}
body.page-id-552 #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
/* ── Header / Nav (identical to Home/Shop/Rituals/Journal/Account/Login) ── */
body.page-id-552 header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.page-id-552 header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.page-id-552 .header-left { display: flex; align-items: center; gap: 40px; }
body.page-id-552 .logo-mark { display: flex; align-items: center; gap: 10px; }
body.page-id-552 .logo-mark img { height: 36px; width: auto; display: block; }
body.page-id-552 nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.page-id-552 nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.page-id-552 nav a:hover { opacity: 1; color: var(--gold-light); }
body.page-id-552 .header-icons { display: flex; align-items: center; gap: 22px; }
body.page-id-552 .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.page-id-552 .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
}
body.page-id-552 .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.page-id-552 .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.page-id-552 .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.page-id-552 .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.page-id-552 .hamburger.open span:nth-child(2) { opacity: 0; }
body.page-id-552 .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.page-id-552 .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.page-id-552 .mobile-nav.open { transform: translateX(0); }
body.page-id-552 .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.page-id-552 .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.page-id-552 .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.page-id-552 .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.page-id-552 .header-left { gap: 18px; }
  body.page-id-552 nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.page-id-552 header { padding: 18px 22px; }
  body.page-id-552 nav { display: none; }
  body.page-id-552 .header-icons { gap: 14px; }
  body.page-id-552 .header-icons .icon-label { display: none; }
  body.page-id-552 .header-icons a.icon-item { display: none; }
  body.page-id-552 .lang-toggle { font-size: 0.66rem; }
  body.page-id-552 .hamburger { display: flex; }
  body.page-id-552 .mobile-nav, body.page-id-552 .nav-scrim { display: flex; }
}
/* ── Header icon styling (wishlist/login/account/cart) ── */
body.page-id-552 .header-icons .icon-item {
  display: flex; align-items: center; gap: 7px; position: relative;
  color: var(--cream); opacity: 0.85; transition: color .3s, opacity .3s;
}
body.page-id-552 .header-icons .icon-item:hover { color: var(--gold-light); opacity: 1; }
body.page-id-552 .header-icons .icon-item svg {
  width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; flex-shrink: 0;
}
body.page-id-552 .header-icons .icon-label { font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; }
body.page-id-552 .header-icons .wishlist-icon.azi-has-items svg { fill: var(--gold-light); stroke: var(--gold-light); }
body.page-id-552 .header-icons .icon-badge {
  position: absolute; top: -7px; right: -9px;
  background: var(--gold); color: var(--bg); font-size: 0.6rem; font-weight: 700;
  width: 15px; height: 15px; border-radius: 50%; align-items: center; justify-content: center;
  display: flex; line-height: 1;
}
/* ── Wishlist hero (mirrors Shop hero proportions, tighter bottom gap) ── */
body.page-id-552 .wishlist-hero {
  position: relative;
  min-height: auto;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
  padding: 168px 24px 46px;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
body.page-id-552 .wishlist-hero-glow {
  position: absolute; top: 46%; left: 50%; transform: translate(-50%, -50%);
  width: 640px; height: 640px; border-radius: 50%;
  background: radial-gradient(circle, rgba(139,105,20,0.16) 0%, rgba(139,105,20,0.03) 45%, transparent 70%);
  pointer-events: none; z-index: 0;
}
body.page-id-552 .wishlist-hero .eyebrow,
body.page-id-552 .wishlist-hero h1,
body.page-id-552 .wishlist-hero p.sub,
body.page-id-552 .wishlist-divider {
  position: relative; z-index: 1;
}
body.page-id-552 .wishlist-hero .eyebrow {
  font-size: clamp(1.05rem, 2.2vw, 1.35rem);
  font-weight: 700;
  letter-spacing: 0.26em;
  margin-bottom: 20px;
}
body.page-id-552 .wishlist-hero h1 {
  font-size: clamp(2.375rem, 5vw, 3.8125rem);
  font-style: italic;
  max-width: 780px;
  margin: 0 auto;
  line-height: 1.1;
}
body.page-id-552 .wishlist-divider {
  width: 48px; height: 1px; background: var(--gold);
  margin: 22px auto 18px; opacity: 0.7;
}
body.page-id-552 .wishlist-hero p.sub {
  max-width: 540px; margin: 0 auto; font-size: 1rem; color: var(--biscuit);
}
@media (max-width: 680px) {
  body.page-id-552 .wishlist-hero { padding: 140px 20px 40px; }
}
/* ── Wishlist grid/empty spacing (tighter than the generic default) ── */
body.page-id-552 .azi-wishlist-page-grid {
  margin-top: 40px !important;
}
body.page-id-552 .azi-wishlist-page-empty {
  margin-top: 40px !important;
}
/* ── Wishlist card content centering ── */
body.page-id-552 .azi-wishlist-page-card {
  text-align: center !important;
}
body.page-id-552 .azi-wishlist-page-card .price,
body.page-id-552 .azi-wishlist-page-price {
  display: block !important;
  text-align: center !important;
  width: 100%;
  float: none !important;
}
/* ── Remove button: single clean rule, no duplicates ── */
body.page-id-552 .azi-wishlist-remove {
  display: inline-block !important;
  float: none !important;
  background: transparent !important;
  border: 1px solid var(--gold) !important;
  color: var(--cream) !important;
  padding: 12px 20px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer;
  transition: background .3s ease, color .3s ease;
  -webkit-appearance: none;
  appearance: none;
  outline: none !important;
}
body.page-id-552 .azi-wishlist-page-card {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}
/* ── Footer (identical to rest of site) ── */
body.page-id-552 footer { padding: 56px 0 26px; border-top: 1px solid var(--line); }
body.page-id-552 .footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
body.page-id-552 .footer-brand { display: none; }
body.page-id-552 .footer-col h5 { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 18px; }
body.page-id-552 .footer-col a { display: block; font-size: 0.85rem; color: var(--biscuit); margin-bottom: 12px; transition: color .3s; }
body.page-id-552 .footer-col a:hover { color: var(--cream); }
body.page-id-552 .newsletter-form { display: flex; border: 1px solid var(--line); margin-top: 6px; }
body.page-id-552 .newsletter-form input { flex: 1; background: transparent; border: none; outline: none; color: var(--cream); padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; }
body.page-id-552 .newsletter-form button { background: var(--gold); color: var(--bg); border: none; padding: 0 18px; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-weight: 700; font-family: "Jost", sans-serif; }
body.page-id-552 .newsletter-msg { font-size: 0.75rem; color: var(--gold-light); margin-top: 8px; min-height: 1em; }
body.page-id-552 .footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 0.75rem; color: var(--biscuit); }
body.page-id-552 .socials { display: flex; gap: 16px; }
body.page-id-552 .socials a { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; transition: border-color .3s, color .3s; }
body.page-id-552 .socials a:hover { border-color: var(--gold); color: var(--gold-light); }
@media (max-width: 880px) { body.page-id-552 .footer-top { grid-template-columns: 1fr; gap: 36px; } }
body.page-id-552 .azi-wishlist-page-grid {
  grid-template-columns: repeat(auto-fit, minmax(240px, 300px)) !important;
  justify-content: center !important;
}
/* AZI — My Account dashboard: force flexbox layout (sidebar + content).
   Paste this at the very END of your existing Additional CSS —
   don't delete/replace anything else. */
body.page-id-20 .woocommerce {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 30px 32px 90px !important;
  gap: 36px !important;
}
body.page-id-20 .woocommerce > nav.woocommerce-MyAccount-navigation {
  flex: 0 0 250px !important;
  width: 250px !important;
  max-width: 250px !important;
  box-sizing: border-box !important;
}
body.page-id-20 .woocommerce > .woocommerce-MyAccount-content {
  flex: 1 1 0% !important;
  width: auto !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}
@media (max-width: 880px) {
  body.page-id-20 .woocommerce {
    flex-direction: column !important;
  }
  body.page-id-20 .woocommerce > nav.woocommerce-MyAccount-navigation {
    width: 100% !important;
    max-width: 100% !important;
    flex-basis: auto !important;
  }
}
/* AZI — My Account polish pass #2. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else. */

/* 1) Addresses page: same flexbox fix as the dashboard grid — the
   native 2-col grid on .woocommerce-Addresses was staggering the
   two boxes instead of lining them up side by side. */
body.page-id-20 .woocommerce-Addresses {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
  list-style: none !important;
}
body.page-id-20 .woocommerce-Addresses > .woocommerce-Address {
  flex: 1 1 calc(50% - 12px) !important;
  min-width: 260px !important;
  box-sizing: border-box !important;
}
@media (max-width: 680px) {
  body.page-id-20 .woocommerce-Addresses > .woocommerce-Address {
    flex: 1 1 100% !important;
  }
}

/* 2) Empty-state cards (Orders / Downloads / Payment methods / no
   saved addresses) — was rendering as WooCommerce's default cramped
   left-aligned notice with the button squeezed next to the text.
   Now a centered card matching the Wishlist page's empty state. */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  max-width: 460px !important;
  margin: 30px auto !important;
  padding: 46px 36px !important;
}
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info::before,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message::before {
  position: static !important;
  display: block !important;
  font-size: 1.7rem !important;
  margin: 0 0 16px !important;
}
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info a.button,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message a.button {
  margin-top: 20px !important;
}
body.page-id-20 .woocommerce-Address .woocommerce-info,
body.page-id-20 .woocommerce-Address p:only-child {
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
  text-align: center !important;
  color: var(--biscuit) !important;
  font-size: 0.88rem !important;
}
/* AZI — My Account polish pass #3. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else. */

/* 1) Remove "Downloads" from the sidebar nav (not relevant — no
   digital products). The /my-account/downloads/ URL still exists,
   it's just no longer linked from the menu. */
body.page-id-20 .woocommerce-MyAccount-navigation-link--downloads {
  display: none !important;
}

/* 2) Addresses — two-column layout, safer sizing so it can't
   round into a forced wrap (that's what caused the two boxes to
   stack full-width instead of sitting side by side). */
body.page-id-20 .woocommerce-Addresses {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 24px !important;
  list-style: none !important;
}
body.page-id-20 .woocommerce-Addresses > .woocommerce-Address {
  flex: 0 1 calc(50% - 13px) !important;
  width: calc(50% - 13px) !important;
  min-width: 240px !important;
  box-sizing: border-box !important;
}
@media (max-width: 680px) {
  body.page-id-20 .woocommerce-Addresses > .woocommerce-Address {
    width: 100% !important;
    flex: 1 1 100% !important;
  }
}

/* Section labels ("Billing address" / "Shipping address") — make
   sure they're visibly styled so the two boxes read as two distinct
   sections, not duplicates of the same thing. */
body.page-id-20 .woocommerce-Addresses h2,
body.page-id-20 .woocommerce-Addresses h3,
body.page-id-20 .woocommerce-Address-title h2,
body.page-id-20 .woocommerce-Address-title h3 {
  font-family: "Cormorant Garamond", serif !important;
  font-size: 1.1rem !important;
  color: var(--cream) !important;
  margin: 0 0 12px !important;
  display: block !important;
}

/* "Add billing address" / "Add shipping address" link — was falling
   back to the theme's default pink link color since nothing targeted
   it directly. Catch it by its href pattern (reliable regardless of
   the exact class WooCommerce gives it) and give it the brand
   gold-on-black button treatment, uppercase, no pink. */
body.page-id-20 .woocommerce-MyAccount-content a[href*="edit-address"] {
  display: inline-block !important;
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  padding: 10px 20px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  transition: background .3s ease, border-color .3s ease;
}
body.page-id-20 .woocommerce-MyAccount-content a[href*="edit-address"]:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}

/* 3) Payment methods — "Add payment method" renders as a link OUTSIDE
   the empty-state card (a sibling, not nested inside it), which is
   why it wasn't picking up the earlier centering fix. Center it and
   pull it up close under the card instead of floating disconnected. */
body.page-id-20 .woocommerce-MyAccount-content > a.button {
  display: block !important;
  width: fit-content !important;
  margin: 0 auto 30px !important;
}
/* AZI — My Account polish pass #4. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else. */

/* 1) BUG FIX from the previous pass: my "Add address" button rule
   was scoped too broadly (`.woocommerce-MyAccount-content
   a[href*="edit-address"]`) and accidentally caught the inline text
   link "shipping and billing addresses" inside the Dashboard's
   welcome paragraph too — turning normal sentence text into a big
   gold button mid-sentence. Re-scoping to ONLY the Addresses page
   wrapper (`.woocommerce-Addresses`), which doesn't exist on the
   Dashboard, so the paragraph link is left alone as plain text. */
body.page-id-20 .woocommerce-MyAccount-content a[href*="edit-address"] {
  all: unset !important;
  color: var(--gold-light) !important;
  border-bottom: 1px solid var(--gold-light) !important;
  padding-bottom: 1px !important;
  cursor: pointer !important;
}
body.page-id-20 .woocommerce-Addresses a[href*="edit-address"] {
  all: unset !important;
  display: inline-block !important;
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  padding: 10px 20px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .3s ease, border-color .3s ease;
}
body.page-id-20 .woocommerce-Addresses a[href*="edit-address"]:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}

/* 2) Account hero title — was using the smaller generic .eyebrow/h1
   sizing instead of the bold-eyebrow + large-italic-h1 pattern used
   on Shop/Rituals/Wishlist. Matching that pattern now for consistency
   across all page titles. */
body.page-id-20 .account-hero .eyebrow {
  font-size: clamp(1.05rem, 2.2vw, 1.35rem) !important;
  font-weight: 700 !important;
  letter-spacing: 0.26em !important;
  margin-bottom: 20px !important;
}
body.page-id-20 .account-hero h1 {
  font-size: clamp(2.375rem, 5vw, 3.8125rem) !important;
  font-style: italic !important;
  max-width: 780px !important;
  margin: 0 auto !important;
  line-height: 1.1 !important;
}
/* AZI — Payment Methods page fix. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else. */

/* 1) "Add Payment Method" form — brand the surrounding chrome
   (card tab, labels, Country dropdown, disclaimer text, submit
   button). NOTE: the actual card number / expiration / CVC fields
   are rendered by Stripe as a secure embedded frame — that specific
   piece is controlled by Stripe's own settings, not by this site's
   CSS, so it will keep its light background regardless. Everything
   around it (the card, the button, the dropdown) is fully brandable
   and is what this fixes. */
body.page-id-20 ul.payment_methods {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.page-id-20 ul.payment_methods li {
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.05), transparent) !important;
  padding: 22px 26px !important;
}
body.page-id-20 ul.payment_methods label {
  color: var(--cream) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.95rem !important;
}
body.page-id-20 ul.payment_methods input[type="radio"] {
  accent-color: var(--gold) !important;
}
body.page-id-20 .payment_box {
  background: var(--bg-soft) !important;
  border: 1px solid var(--line) !important;
  padding: 24px !important;
  margin-top: 16px !important;
  border-radius: 2px !important;
}
body.page-id-20 .payment_box p,
body.page-id-20 .payment_box label,
body.page-id-20 .payment_box legend,
body.page-id-20 .payment_box span {
  color: var(--biscuit) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.82rem !important;
}
body.page-id-20 .payment_box select {
  width: 100% !important;
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  color: var(--cream) !important;
  padding: 12px 14px !important;
  font-family: "Jost", sans-serif !important;
  border-radius: 0 !important;
  margin-top: 6px !important;
}
body.page-id-20 form#add_payment_method button,
body.page-id-20 .payment_box button {
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  padding: 14px 32px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  border-radius: 0 !important;
  transition: background .25s ease, border-color .25s ease;
}
body.page-id-20 form#add_payment_method button:hover,
body.page-id-20 .payment_box button:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}

/* 2) Loading overlay (blockUI) while the form submits — was the
   same jarring pale-grey box we fixed on the Cart page. Same dark
   overlay + thin gold spinner here. */
body.page-id-20 .blockUI.blockOverlay {
  background: rgba(5,4,5,0.55) !important;
  border-radius: 4px;
}
body.page-id-20 .blockUI.blockOverlay::before {
  content: "";
  position: absolute; top: 50%; left: 50%; width: 26px; height: 26px;
  margin: -13px 0 0 -13px;
  border: 2px solid rgba(232,220,200,0.25);
  border-top-color: var(--gold-light);
  border-radius: 50%;
  animation: azi-spin 0.8s linear infinite;
}

/* 3) Action notices ("Payment method deleted.", "...successfully
   added.") — these are transient, so they now auto-fade after ~4s
   (pure CSS, no JS). Kept separate from .woocommerce-info, which is
   the permanent "No saved methods found." text and should NOT fade.
   Also killing the stray blue focus outline and pinning it flush to
   the top of the content column instead of floating with extra gap. */
body.page-id-20 .woocommerce-MyAccount-content {
  margin-top: 0 !important;
}
@keyframes aziNoticeAutoFade {
  0%, 82% { opacity: 1; }
  100% { opacity: 0; }
}
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-error {
  outline: none !important;
  animation: aziNoticeAutoFade 4.5s ease forwards !important;
  pointer-events: none !important;
  margin-top: 0 !important;
}
/* AZI — Payment Methods page fix. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else. */

/* 1) "Add Payment Method" form — brand the surrounding chrome
   (card tab, labels, Country dropdown, disclaimer text, submit
   button). NOTE: the actual card number / expiration / CVC fields
   are rendered by Stripe as a secure embedded frame — that specific
   piece is controlled by Stripe's own settings, not by this site's
   CSS, so it will keep its light background regardless. Everything
   around it (the card, the button, the dropdown) is fully brandable
   and is what this fixes. */
body.page-id-20 ul.payment_methods {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.page-id-20 ul.payment_methods li {
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.05), transparent) !important;
  padding: 22px 26px !important;
}
body.page-id-20 ul.payment_methods label {
  color: var(--cream) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.95rem !important;
}
body.page-id-20 ul.payment_methods input[type="radio"] {
  accent-color: var(--gold) !important;
}
body.page-id-20 .payment_box {
  background: var(--bg-soft) !important;
  border: 1px solid var(--line) !important;
  padding: 24px !important;
  margin-top: 16px !important;
  border-radius: 2px !important;
}
body.page-id-20 .payment_box p,
body.page-id-20 .payment_box label,
body.page-id-20 .payment_box legend,
body.page-id-20 .payment_box span {
  color: var(--biscuit) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.82rem !important;
}
body.page-id-20 .payment_box select {
  width: 100% !important;
  background: var(--bg) !important;
  border: 1px solid var(--line) !important;
  color: var(--cream) !important;
  padding: 12px 14px !important;
  font-family: "Jost", sans-serif !important;
  border-radius: 0 !important;
  margin-top: 6px !important;
}
body.page-id-20 form#add_payment_method button,
body.page-id-20 .payment_box button {
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  padding: 14px 32px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  border-radius: 0 !important;
  transition: background .25s ease, border-color .25s ease;
}
body.page-id-20 form#add_payment_method button:hover,
body.page-id-20 .payment_box button:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}

/* 2) Loading overlay (blockUI) while the form submits — was the
   same jarring pale-grey box we fixed on the Cart page. Same dark
   overlay + thin gold spinner here. */
body.page-id-20 .blockUI.blockOverlay {
  background: rgba(5,4,5,0.55) !important;
  border-radius: 4px;
}
body.page-id-20 .blockUI.blockOverlay::before {
  content: "";
  position: absolute; top: 50%; left: 50%; width: 26px; height: 26px;
  margin: -13px 0 0 -13px;
  border: 2px solid rgba(232,220,200,0.25);
  border-top-color: var(--gold-light);
  border-radius: 50%;
  animation: azi-spin 0.8s linear infinite;
}

/* 3) Action notices ("Payment method deleted.", "...successfully
   added.") — these are transient, so they now auto-fade after ~4s
   (pure CSS, no JS). Kept separate from .woocommerce-info, which is
   the permanent "No saved methods found." text and should NOT fade.
   Also killing the stray blue focus outline and pinning it flush to
   the top of the content column instead of floating with extra gap. */
body.page-id-20 .woocommerce-MyAccount-content {
  margin-top: 0 !important;
}
@keyframes aziNoticeAutoFade {
  0%, 82% { opacity: 1; }
  100% { opacity: 0; }
}
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-error {
  outline: none !important;
  animation: aziNoticeAutoFade 4.5s ease forwards !important;
  pointer-events: none !important;
  margin-top: 0 !important;
}
/* AZI — My Account polish pass #6. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else.

   "Browse the Collection" on Ritualurile Favorite wasn't caught by
   the earlier button-stacking fix because it uses a different class
   (the custom wishlist snippet's own button, not the standard
   WooCommerce a.button). Catching it by any class name containing
   "button", "cta", or "btn" instead, so it's not dependent on
   guessing the exact class. */
body.page-id-20 .woocommerce-MyAccount-content a[class*="button"],
body.page-id-20 .woocommerce-MyAccount-content a[class*="cta"],
body.page-id-20 .woocommerce-MyAccount-content a[class*="btn"] {
  display: block !important;
  width: fit-content !important;
  margin: 18px auto 0 !important;
}
/* AZI — My Account polish pass #7. Paste at the very END of your
   existing Additional CSS — replacing/superseding the previous
   button-stacking rule from pass #6 (that one kept the button inside
   the bordered card, just on its own line — this pulls it fully
   outside/below the card instead). Don't delete anything else. */
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="button"]),
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="cta"]),
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="btn"]) {
  position: relative !important;
}
body.page-id-20 .woocommerce-MyAccount-content a[class*="button"],
body.page-id-20 .woocommerce-MyAccount-content a[class*="cta"],
body.page-id-20 .woocommerce-MyAccount-content a[class*="btn"] {
  display: block !important;
  width: fit-content !important;
  position: absolute !important;
  left: 50% !important;
  top: 100% !important;
  transform: translateX(-50%) !important;
  margin-top: 24px !important;
}
/* AZI — My Account polish pass #8. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else.

   Orders (native WooCommerce "No order has been made yet.") had a
   gold ✦ icon above the text; Ritualurile Favorite ("You have no
   favourite rituals yet.") is the custom wishlist snippet's own
   markup and never had one. Removing the icon from the WooCommerce
   side so both empty states match — plain italic text, same card,
   same button treatment underneath. */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info::before,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message::before {
  content: none !important;
  display: none !important;
}
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message {
  padding: 26px 32px !important;
}
/* AZI — My Account polish pass #9. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else.
   This supersedes pass #8's icon-removal rule (same intent, made
   more thorough) and adds the matching italic-serif text style so
   Orders/Downloads/Payment Methods empty states look identical to
   the Dashboard greeting and Ritualurile Favorite — same border,
   same padding, same italic type, no icon anywhere. */

/* Kill the ✦ icon wherever it's still coming from (the original
   rule that adds it, plus the pass #8 attempt, both get overridden
   here with maximum specificity so this one wins regardless of
   paste order in the file). */
body.page-id-20 .woocommerce-message::before,
body.page-id-20 .woocommerce-info::before,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message::before,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info::before {
  content: none !important;
  display: none !important;
}

/* Match the card + text treatment exactly to the Dashboard greeting
   / Ritualurile Favorite empty state: italic serif, cream color,
   same padding, same border. */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info {
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent) !important;
  padding: 26px 28px !important;
  font-family: "Cormorant Garamond", serif !important;
  font-style: italic !important;
  font-size: 1.35rem !important;
  color: var(--cream) !important;
  line-height: 1.5 !important;
  margin-bottom: 18px !important;
}
/* AZI — My Account polish pass #10. Paste at the very END of your
   existing Additional CSS — don't delete/replace anything else.

   That empty black box was WooCommerce's own `.woocommerce-notices-
   wrapper` — a div it always inserts as the first child of the
   content area, even when there's nothing to show. It was eating
   real width in the layout instead of collapsing to nothing. Same
   fix already used on the Cart page: `display: contents` removes
   its own box entirely (no width, no gap) while leaving any real
   notices inside it to render normally if they ever appear. */
body.page-id-20 .woocommerce-notices-wrapper {
  display: contents !important;
}
/* AZI — My Account: unified empty-state card + button treatment.
   Paste at the very END of your Additional CSS. This SUPERSEDES the
   position:absolute button trick from an earlier pass (the one that
   set position:relative on the card and position:absolute on the
   button) — that trick is the likely cause of the phantom gap, since
   an absolutely-positioned button is pulled out of normal flow and
   can leave the card's box sized/placed unpredictably. This version
   uses plain flexbox instead: predictable, no absolute positioning,
   no leftover gaps. Covers Dashboard's greeting, Orders, Downloads,
   Payment Methods (native WooCommerce .woocommerce-info /
   .woocommerce-message) AND the custom "Favorite Rituals" empty
   state, so all of them render identically. */

/* Card: flex column, centered, same border/padding/type everywhere */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message,
body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent) !important;
  padding: 32px 28px !important;
  margin: 0 0 18px !important;
  font-family: "Cormorant Garamond", serif !important;
  font-style: italic !important;
  font-size: 1.35rem !important;
  color: var(--cream) !important;
  line-height: 1.5 !important;
}

/* No icon anywhere */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info::before,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message::before {
  content: none !important;
  display: none !important;
}

/* Button inside a card: plain flex child, static position, gold/black,
   centered below the text with breathing room above it */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info a[class*="button"],
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info a[class*="cta"],
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info a[class*="btn"],
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message a[class*="button"],
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message a[class*="cta"],
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message a[class*="btn"],
body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type a[class*="button"],
body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type a[class*="cta"],
body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type a[class*="btn"] {
  position: static !important;
  transform: none !important;
  display: inline-block !important;
  margin: 22px auto 0 !important;
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  padding: 10px 24px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.68rem !important;
  font-style: normal !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .3s ease, border-color .3s ease !important;
}
body.page-id-20 .woocommerce-MyAccount-content a[class*="button"]:hover,
body.page-id-20 .woocommerce-MyAccount-content a[class*="cta"]:hover,
body.page-id-20 .woocommerce-MyAccount-content a[class*="btn"]:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}

/* Undo the earlier position:relative hack on the card's parent —
   no longer needed now the button is static, not absolute */
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="button"]),
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="cta"]),
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="btn"]) {
  position: static !important;
}
/* AZI — corectează regresia adusă de azi-account-unified-final.css.
   Paragraful de salut de pe Dashboard ("Hello aziadmin (not aziadmin?
   Log out)") e o singură propoziție cu linkuri inline — flex-column
   l-a rupt pe rânduri separate pentru fiecare bucată de text. Doar
   notice-urile goale (Orders/Downloads/Payment "No X yet") aveau
   nevoie de flex-column; paragraful de Dashboard rămâne bloc normal.
   Lipește la finalul CSS-ului, după azi-account-unified-final.css. */
body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type {
  display: block !important;
  text-align: left !important;
}
/* AZI — face "Favorite Rituals" (empty) identic cu "Orders" (empty):
   text centrat sus, buton centrat dedesubt, nu unul lângă altul.
   Butonul "BROWSE THE COLLECTION" vine din snippet-ul custom de
   wishlist, nu din markup-ul nativ WooCommerce, deci regula anterioară
   (.woocommerce-info / .woocommerce-message) nu l-a prins. Aici țintim
   orice cutie care conține direct un link tip buton, indiferent de
   clasa exactă — dar excludem explicit .woocommerce-MyAccount-content
   ca să nu împachetăm din greșeală toată pagina Payment Methods
   (care are un buton copil-direct, dar și alt conținut lângă el).
   Lipește la finalul CSS-ului, după celelalte fișiere azi-account-*. */
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="button" i]):not(.woocommerce-MyAccount-content),
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="cta" i]):not(.woocommerce-MyAccount-content),
body.page-id-20 .woocommerce-MyAccount-content *:has(> a[class*="btn" i]):not(.woocommerce-MyAccount-content) {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent) !important;
  padding: 32px 28px !important;
  margin: 0 0 18px !important;
  font-family: "Cormorant Garamond", serif !important;
  font-style: italic !important;
  font-size: 1.35rem !important;
  color: var(--cream) !important;
  line-height: 1.5 !important;
}
/* AZI — repară "ADD PAYMENT METHOD" (și orice buton similar care e
   copil direct al .woocommerce-MyAccount-content, nu în interiorul
   unei cutii de tip notice). Un fix vechi îi seta position:absolute;
   top:100% pe buton și position:relative pe .woocommerce-MyAccount-
   content — cum acel container e înalt (conține tot conținutul
   paginii), top:100% l-a împins la baza lui, lângă footer. Îl aducem
   înapoi în flow normal, centrat imediat sub conținut.
   Lipește la finalul CSS-ului, după celelalte fișiere azi-account-*. */
body.page-id-20 .woocommerce-MyAccount-content {
  position: static !important;
}
body.page-id-20 .woocommerce-MyAccount-content > a[class*="button" i],
body.page-id-20 .woocommerce-MyAccount-content > a[class*="cta" i],
body.page-id-20 .woocommerce-MyAccount-content > a[class*="btn" i] {
  position: static !important;
  transform: none !important;
  display: block !important;
  width: fit-content !important;
  margin: 24px auto 0 !important;
}
/* AZI — Add Payment Method page: centrează butonul de submit +
   stilează butonul "×" adăugat prin azi-payment-close-button.php.
   Lipește la finalul CSS-ului, după celelalte fișiere azi-account-*. */

/* Centrează "ADD PAYMENT METHOD" (era aliniat la dreapta) */
body.page-id-20 #add_payment_method .form-row.place-order,
body.page-id-20 #add_payment_method p.form-row.place-order {
  display: flex !important;
  justify-content: center !important;
  text-align: center !important;
}
body.page-id-20 #add_payment_method button#place_order {
  float: none !important;
  margin: 0 auto !important;
}

/* Buton × — colț dreapta-sus, cerc auriu subtil, apare peste card */
body.page-id-20 {
  position: relative;
}
body.page-id-20 #add_payment_method {
  position: relative !important;
}
body.page-id-20 a.azi-payment-close {
  position: absolute !important;
  top: -14px !important;
  right: -14px !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  border: 1px solid var(--line) !important;
  background: var(--bg-soft) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  z-index: 5 !important;
  transition: background .3s ease, border-color .3s ease, color .3s ease;
}
body.page-id-20 a.azi-payment-close:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--bg) !important;
}
/* AZI — repară link-ul "Delete" din tabelul Payment Methods.
   Cauza: o regulă veche (căuta orice element cu clasă ce conține
   "button"/"cta"/"btn" în interiorul .woocommerce-MyAccount-content
   și îl poziționa position:absolute; top:100%) prindea și link-ul de
   Delete din tabel, nu doar butonul de Add Payment Method — de-aia
   ajungea la baza paginii, în afara tabelului.

   RECOMANDAT: caută în CSS-ul tău live blocul comentat
   "AZI — My Account polish pass #7" (regula cu
   *:has(> a[class*="button"]) și position: absolute !important;
   left: 50%) și șterge-l — e complet înlocuit de fix-urile ulterioare
   care folosesc position:static peste tot. Dacă nu vrei să-l cauți
   acum, regula de mai jos îl anulează oricum, deci e sigur să rămână.

   Lipește la finalul CSS-ului, după celelalte fișiere azi-account-*. */

/* Plasă de siguranță: orice buton din My Account rămâne în flow-ul
   normal, NU mai poate fi poziționat absolut de regula veche —
   excepție face doar butonul × (are propria regulă separată). */
body.page-id-20 .woocommerce-MyAccount-content a.button:not(.azi-payment-close),
body.page-id-20 .woocommerce-MyAccount-content a[class*="btn" i]:not(.azi-payment-close),
body.page-id-20 .woocommerce-MyAccount-content a[class*="cta" i]:not(.azi-payment-close) {
  position: static !important;
  transform: none !important;
}

/* Stilizează link-ul Delete din tabel ca buton ghost auriu, aliniat
   corect în celula lui, nu mai lat/centrat ca butoanele mari */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a.button.delete,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a[class*="delete" i] {
  display: inline-block !important;
  width: auto !important;
  margin: 0 !important;
  background: transparent !important;
  color: var(--gold-light) !important;
  border: 1px solid var(--gold-light) !important;
  padding: 6px 16px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.62rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .3s ease, color .3s ease;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a.button.delete:hover,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a[class*="delete" i]:hover {
  background: var(--gold-light) !important;
  color: var(--bg) !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td:last-child {
  text-align: right !important;
  vertical-align: middle !important;
}

/* Tabelul arăta gol/incomplet — bordură vizibilă pe toate celulele
   + fundal subtil pe header, ca să nu pară o zonă neterminată */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table {
  width: 100% !important;
  border-collapse: collapse !important;
  border: 1px solid var(--line) !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td {
  border: 1px solid var(--line) !important;
  padding: 14px 18px !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th {
  background: rgba(196,168,130,0.06) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  text-align: left !important;
}
/* AZI — centrează butonul "ADD PAYMENT METHOD" (fix-ul anterior nu
   s-a prins pe selectorul exact folosit de acest template). Mai
   multe selectoare de rezervă ca să prindă sigur, indiferent de
   clasa exactă a butonului. Lipește la finalul CSS-ului. */
body.page-id-20 #add_payment_method p.form-row,
body.page-id-20 #add_payment_method .form-row {
  display: flex !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
}
body.page-id-20 #add_payment_method button,
body.page-id-20 #add_payment_method button#place_order,
body.page-id-20 #add_payment_method .woocommerce-Button.button {
  float: none !important;
  margin: 0 auto !important;
}
/* AZI — polish pentru tabelul Payment Methods. Suprascrie stilul de
   grid complet (border pe toate celulele, aspect de Excel) din
   azi-account-payment-delete-fix.css cu un aspect mai boutique:
   doar bordură exterioară + linii orizontale între rânduri, padding
   generos, hover subtil pe rând. Lipește la finalul CSS-ului, DUPĂ
   azi-account-payment-delete-fix.css (ca să câștige la cascadă). */

body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table {
  border: 1px solid var(--line) !important;
  border-collapse: collapse !important;
}

/* fără borduri verticale pe celule — doar linie orizontală jos */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td {
  border: none !important;
  border-bottom: 1px solid var(--line) !important;
  padding: 18px 24px !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tr:last-child td {
  border-bottom: none !important;
}

/* header: fundal subtil, fără linie dublă cu primul rând */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th {
  background: rgba(196,168,130,0.06) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.66rem !important;
  letter-spacing: 0.14em !important;
  font-weight: 700 !important;
  text-align: left !important;
}

/* text din celule în stil corp de text, cream, nu alb dur */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td {
  color: var(--cream) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.9rem !important;
  vertical-align: middle !important;
}

/* hover subtil pe rând, ca să pară interactiv/premium */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr {
  transition: background .25s ease;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr:hover {
  background: rgba(196,168,130,0.04) !important;
}

/* coloana de Delete: buton centrat în casuță, nu lipit de margine */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td:last-child {
  text-align: center !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a.button.delete,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a[class*="delete" i] {
  display: inline-flex !important;
  margin: 0 auto !important;
}
/* AZI — "Payment method added" / "Payment method deleted" (și orice
   alt mesaj tranzitoriu de succes/eroare) devin pop-up flotant, NU
   mai afectează deloc layout-ul paginii. Folosim position:fixed
   (relativ la fereastră, nu la un container din pagină), deci
   indiferent unde le injectează WooCommerce în DOM, nu mai împing
   nimic — tabelul rămâne static. Dispare automat după 3 secunde.

   Aceasta ÎNLOCUIEȘTE orice regulă mai veche de poziționare a
   notificărilor tranzitorii (cea care le punea lângă meniu, cea cu
   fade la 4.5s) — dacă găsești un bloc vechi cu ".woocommerce-message"
   sau comentariul "aziNoticeAutoFade", poți să-l ștergi, altfel
   varianta asta câștigă oricum fiind mai specifică. Nu afectează
   .woocommerce-info (mesajele persistente de tip "no items yet" nu
   trebuie să dispară). Lipește oriunde în CSS. */

body.page-id-20 .woocommerce-message,
body.page-id-20 .woocommerce-error {
  position: fixed !important;
  left: 32px !important;
  bottom: 32px !important;
  top: auto !important;
  right: auto !important;
  inset-inline-start: 32px !important;
  z-index: 9999 !important;
  width: calc(100% - 64px) !important;
  max-width: 340px !important;
  margin: 0 !important;
  border: 1px solid var(--gold) !important;
  background: var(--bg-soft) !important;
  color: var(--cream) !important;
  padding: 16px 20px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.85rem !important;
  line-height: 1.4 !important;
  box-shadow: 0 8px 28px rgba(0,0,0,0.45) !important;
  animation: aziToastPop 3s ease forwards !important;
}
body.page-id-20 .woocommerce-message::before,
body.page-id-20 .woocommerce-error::before {
  content: none !important;
  display: none !important;
}

@keyframes aziToastPop {
  0%   { opacity: 0; transform: translateY(14px); }
  10%  { opacity: 1; transform: translateY(0); }
  85%  { opacity: 1; transform: translateY(0); }
  100% { opacity: 0; transform: translateY(-10px); }
}
/* AZI — rândurile din tabelul Payment Methods aveau înălțimi diferite
   când apărea și butonul "MAKE DEFAULT" (doar pe cardurile care nu
   sunt implicite), făcând tabelul să pară instabil. Coloana de
   acțiuni devine un flex-column centrat, cu min-height fix pe toate
   rândurile, plus "MAKE DEFAULT" stilizat ca buton mic ghost, la fel
   de discret ca "DELETE" (nu mai e butonul solid mare de acum).
   Lipește oriunde în CSS, după fișierele azi-account-payment-*. */

body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td:last-child {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 88px !important;
}

body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a[class*="default" i] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: transparent !important;
  color: var(--gold-light) !important;
  border: 1px solid var(--gold-light) !important;
  padding: 6px 16px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.62rem !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  margin: 0 auto !important;
  cursor: pointer !important;
  transition: background .3s ease, color .3s ease;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a[class*="default" i]:hover {
  background: var(--gold-light) !important;
  color: var(--bg) !important;
}
/* AZI — notificare "Payment method added/deleted" ca pop-up premium,
   SUS, centrat, complet scos din flux. Versiunea anterioară nu se
   fixa (probabil suprascrisă de o regulă mai veche cu position:static
   pe același element) — aici forțăm cu specificitate mai mare ca să
   câștige indiferent de ce mai există în CSS.

   Dacă tot nu pluteste liber după ce lipești asta, înseamnă că un
   element PĂRINTE are `transform` setat undeva (asta schimbă
   comportamentul lui position:fixed, îl "prinde" de acel părinte în
   loc de fereastră) — spune-mi și verificăm împreună. */

body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-error,
body.page-id-20 .woocommerce-message.woocommerce-message,
body.page-id-20 .woocommerce-error.woocommerce-error {
  position: fixed !important;
  top: 110px !important;
  left: 50% !important;
  bottom: auto !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 99999 !important;
  width: max-content !important;
  max-width: min(420px, calc(100vw - 48px)) !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  border: none !important;
  border-top: 3px solid var(--gold) !important;
  background: linear-gradient(180deg, var(--bg-soft), var(--bg)) !important;
  color: var(--cream) !important;
  padding: 18px 26px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.88rem !important;
  letter-spacing: 0.01em !important;
  line-height: 1.4 !important;
  box-shadow: 0 16px 40px rgba(0,0,0,0.55), 0 0 0 1px var(--line) !important;
  animation: aziToastPop 3s ease forwards !important;
  pointer-events: none !important;
}

/* iconiță premium în loc de bulina implicită WooCommerce */
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message::before,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-error::before {
  content: "\2726" !important; /* ✦ */
  display: inline-flex !important;
  color: var(--gold-light) !important;
  font-size: 1rem !important;
  position: static !important;
  margin: 0 !important;
}

@keyframes aziToastPop {
  0%   { opacity: 0; transform: translateX(-50%) translateY(-10px); }
  10%  { opacity: 1; transform: translateX(-50%) translateY(0); }
  85%  { opacity: 1; transform: translateX(-50%) translateY(0); }
  100% { opacity: 0; transform: translateX(-50%) translateY(-6px); }
}
/* AZI — restructurare completă a cutiilor Billing/Shipping de pe
   pagina Addresses, folosind flexbox (nu position:absolute, care e
   sursa recurentă a butoanelor rătăcite din tot acest proiect).
   Markup-ul WooCommerce pune link-ul "Add address" în interiorul
   unui <header> mic, lipit de titlu — de-aia ajungea rătăcit sus în
   pagină. Aici desfacem header-ul cu display:contents (îi păstrăm
   copiii — titlul și link-ul — dar îi lăsăm să intre în ordinea
   flex a cutiei mari), apoi reordonăm: titlu → text/adresă → buton,
   exact structura de la Orders/Favorite Rituals. Totul rămâne în
   flux normal (position:static), deci nu mai poate "zbura" prin
   pagină. Lipește oriunde în CSS, ideal spre finalul fișierului. */

body.page-id-20 .woocommerce-Address {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent) !important;
  padding: 32px 28px !important;
  box-sizing: border-box !important;
}

/* header-ul devine "invizibil" ca box, dar titlul și link-ul din el
   rămân, doar intră direct în ordinea flex a cutiei părinte */
body.page-id-20 .woocommerce-Address > header.woocommerce-Address-title,
body.page-id-20 .woocommerce-Address > .woocommerce-Address-title {
  display: contents !important;
}

body.page-id-20 .woocommerce-Address h3 {
  order: 1 !important;
  width: 100% !important;
  font-family: "Cormorant Garamond", serif !important;
  font-style: italic !important;
  font-size: 1.15rem !important;
  color: var(--gold-light) !important;
  margin: 0 0 14px !important;
}

body.page-id-20 .woocommerce-Address address,
body.page-id-20 .woocommerce-Address > p {
  order: 2 !important;
  width: 100% !important;
  font-family: "Jost", sans-serif !important;
  font-style: normal !important;
  font-size: 0.95rem !important;
  color: var(--cream) !important;
  line-height: 1.6 !important;
  margin: 0 !important;
}

body.page-id-20 .woocommerce-Address a[href*="edit-address"] {
  order: 3 !important;
  position: static !important;
  transform: none !important;
  display: inline-block !important;
  margin: 22px 0 0 !important;
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  padding: 10px 22px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: background .3s ease, border-color .3s ease;
}
body.page-id-20 .woocommerce-Address a[href*="edit-address"]:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
}
/* AZI — pune Billing address și Shipping address pe același rând,
   mai compacte (nu mai ocupă toată lățimea coloanei de conținut).
   Lipește oriunde în CSS, după azi-account-addresses-restructure.css.
   Selector .woocommerce-MyAccount-content adăugat ca back-up, în caz
   că .woocommerce-Addresses singur nu prinde structura din pagină. */
body.page-id-20 .woocommerce-Addresses,
body.page-id-20 .woocommerce-MyAccount-content ul.woocommerce-Addresses {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 20px !important;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
}
body.page-id-20 .woocommerce-Addresses > .woocommerce-Address,
body.page-id-20 .woocommerce-MyAccount-content ul.woocommerce-Addresses > li.woocommerce-Address {
  flex: 0 1 calc(50% - 10px) !important;
  max-width: calc(50% - 10px) !important;
  min-width: 220px !important;
  margin: 0 !important;
  padding: 22px 20px !important;
}
/* AZI — versiune finală, țintită exact pe clasele reale găsite prin
   Inspect: părinte ".u-columns.woocommerce-Addresses.col2-set.addresses",
   cutii ".u-column1.col-1.woocommerce-Address" / ".u-column2.col-2.
   woocommerce-Address". Acestea sunt clasele vechi WooCommerce de
   layout pe float (col-1/col-2), care ar trebui să stea deja una
   lângă alta la lățime de desktop — dar cu float:none forțat aici,
   ca să nu mai depindă deloc de floats, doar de flexbox.
   ÎNLOCUIEȘTE azi-account-addresses-row.css cu acest fișier (nu le
   ține pe amândouă, ca să nu se contrazică). */

body.page-id-20 .u-columns.woocommerce-Addresses,
body.page-id-20 .col2-set.addresses {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 20px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.page-id-20 .u-column1.woocommerce-Address,
body.page-id-20 .u-column2.woocommerce-Address,
body.page-id-20 .col-1.woocommerce-Address,
body.page-id-20 .col-2.woocommerce-Address {
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex: 0 0 calc(50% - 10px) !important;
  width: calc(50% - 10px) !important;
  max-width: calc(50% - 10px) !important;
  min-width: 220px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 22px 20px !important;
}

@media (max-width: 680px) {
  body.page-id-20 .u-column1.woocommerce-Address,
  body.page-id-20 .u-column2.woocommerce-Address {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* plasă de siguranță cu specificitate maximă, în caz că altceva mai
   vechi din CSS încă suprascrie lățimea celor două cutii */
html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 20px !important;
  width: 100% !important;
}
html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set > .u-column1.woocommerce-Address,
html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set > .u-column2.woocommerce-Address {
  float: none !important;
  flex: 0 0 calc(50% - 10px) !important;
  width: calc(50% - 10px) !important;
  max-width: calc(50% - 10px) !important;
}
/* AZI — butoane Add Billing/Shipping Address mai mari + spațiu redus
   între cutia introductivă și cutiile Billing/Shipping, ca să pară
   un singur bloc unitar, nu 3 cutii separate la distanță.
   Lipește oriunde în CSS, spre finalul fișierului. */

/* butoane mai mari */
body.page-id-20 .woocommerce-Address a[href*="edit-address"] {
  padding: 13px 30px !important;
  font-size: 0.74rem !important;
  letter-spacing: 0.13em !important;
}

/* mai puțin spațiu între cutia introductivă și Billing/Shipping —
   suprascrie margin-bottom-ul mare setat mai devreme pentru cutia
   de text (era gândit pt. carduri empty-state, aici era prea mult) */
body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type {
  margin-bottom: 8px !important;
}
/* AZI — pagina Edit Billing/Shipping Address (my-account/edit-address/*):
   1. elimină spațiul vizibil dintre eticheta câmpului și asterisk (*)
   2. centrează butonul "Save address"
   Lipește oriunde în CSS, spre finalul fișierului. */

/* 1. asterisk lipit de text, nu cu spațiu vizibil înainte */
body.page-id-20 abbr.required {
  margin-left: -4px !important;
  text-decoration: none !important;
}

/* 2. buton Save address centrat */
body.page-id-20 .woocommerce-address-fields p:last-of-type,
body.page-id-20 form button[name="save_address"] {
  display: flex !important;
  justify-content: center !important;
}
body.page-id-20 form button[name="save_address"] {
  display: inline-flex !important;
  margin: 8px auto 0 !important;
  float: none !important;
}
/* AZI — renunțăm la varianta "una lângă alta" (n-a mers indiferent
   de câte încercări). Billing și Shipping revin stivuite, dar
   lățime completă și EGALĂ între ele + cu cutia de sus, ca să nu mai
   pară inegale. Suprascrie toate regulile anterioare de tip
   "flex: 0 0 calc(50%...)" pentru aceste cutii.
   Lipește la FINALUL CSS-ului (după toate fișierele azi-account-
   addresses-*), ca să câștige sigur în cascadă. */

html body.page-id-20 .u-columns.woocommerce-Addresses,
html body.page-id-20 .col2-set.addresses,
html body.page-id-20 .woocommerce-Addresses {
  display: block !important;
  width: 100% !important;
}

html body.page-id-20 .u-column1.woocommerce-Address,
html body.page-id-20 .u-column2.woocommerce-Address,
html body.page-id-20 .col-1.woocommerce-Address,
html body.page-id-20 .col-2.woocommerce-Address,
html body.page-id-20 .woocommerce-Address {
  float: none !important;
  flex: none !important;
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  margin: 0 0 20px !important;
}
html body.page-id-20 .woocommerce-Address:last-child {
  margin-bottom: 0 !important;
}
/* AZI — pass 2 pe formularul de Edit Billing/Shipping Address.
   Lipește la finalul CSS-ului, DUPĂ azi-account-edit-address-form.css
   (o parte din regulile de-acolo se corectează aici). */

/* 1. inputuri text în culorile brand-ului, nu alb */
body.page-id-20 .woocommerce-address-fields input[type="text"],
body.page-id-20 .woocommerce-address-fields input[type="email"],
body.page-id-20 .woocommerce-address-fields input[type="tel"],
body.page-id-20 form.woocommerce-address-fields input {
  background: var(--bg-soft) !important;
  color: var(--cream) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
}
body.page-id-20 .woocommerce-address-fields input::placeholder {
  color: var(--biscuit) !important;
  opacity: 0.6 !important;
}

/* dropdown-uri simple (fără JS de căutare) */
body.page-id-20 .woocommerce-address-fields select {
  background: var(--bg-soft) !important;
  color: var(--cream) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
}

/* dropdown-uri cu căutare (select2 — Country/Region, County) */
body.page-id-20 .select2-container--default .select2-selection--single {
  background: var(--bg-soft) !important;
  border: 1px solid var(--line) !important;
  border-radius: 0 !important;
  height: 46px !important;
}
body.page-id-20 .select2-selection__rendered {
  color: var(--cream) !important;
  line-height: 44px !important;
}
body.page-id-20 .select2-selection__arrow {
  height: 44px !important;
}
body.page-id-20 .select2-dropdown {
  background: var(--bg-soft) !important;
  border: 1px solid var(--gold) !important;
}
body.page-id-20 .select2-search__field {
  background: var(--bg) !important;
  color: var(--cream) !important;
  border: 1px solid var(--line) !important;
}
body.page-id-20 .select2-results__option {
  background: var(--bg-soft) !important;
  color: var(--cream) !important;
}
body.page-id-20 .select2-results__option--highlighted[aria-selected] {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* 2. anulează centrarea greșită a rândului de Email (regula veche
   "p:last-of-type" prindea greșit rândul de Email, nu doar butonul) */
body.page-id-20 .woocommerce-address-fields p:last-of-type {
  display: block !important;
  justify-content: normal !important;
}
/* butonul Save address centrat, ca element propriu, nu prin rândul lui */
body.page-id-20 form button[name="save_address"] {
  display: block !important;
  margin: 24px auto 0 !important;
  float: none !important;
}

/* 3. asterisk fără spațiu vizibil înainte (întărit — em, nu px) */
body.page-id-20 abbr.required {
  margin-left: -0.4em !important;
  text-decoration: none !important;
}

/* 4. cutiile Billing/Shipping — text de adresă (populat) cu spațiere
   consistentă, indiferent dacă e empty-state sau adresă reală */
body.page-id-20 .woocommerce-Address address {
  font-style: normal !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.92rem !important;
  color: var(--cream) !important;
  line-height: 1.9 !important;
  letter-spacing: 0.01em !important;
}
/* AZI — încadrează formularul de Edit Address (Billing/Shipping)
   într-un chenar, + stilizează butonul × și checkbox-ul "Same as
   billing address". Lipește oriunde în CSS, spre finalul fișierului. */

/* chenar în jurul formularului */
body.page-id-20 .woocommerce-address-fields {
  position: relative !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.03), transparent) !important;
  padding: 36px 32px !important;
  box-sizing: border-box !important;
}

/* buton × — colț dreapta-sus, aceeași stilizare ca la Payment Methods */
body.page-id-20 form {
  position: relative !important;
}
body.page-id-20 a.azi-edit-address-close {
  position: absolute !important;
  top: -14px !important;
  right: -14px !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  border: 1px solid var(--line) !important;
  background: var(--bg-soft) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  z-index: 5 !important;
  transition: background .3s ease, border-color .3s ease, color .3s ease;
}
body.page-id-20 a.azi-edit-address-close:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--bg) !important;
}

/* checkbox "Same as billing address" */
body.page-id-20 .azi-same-as-billing-row {
  margin: 0 0 24px !important;
}
body.page-id-20 .azi-same-as-billing-row label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: var(--cream) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.85rem !important;
  cursor: pointer !important;
}
body.page-id-20 .azi-same-as-billing-row input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: var(--gold) !important;
  cursor: pointer !important;
}
/* AZI — încadrează formularul de Edit Address (Billing/Shipping)
   într-un chenar, + stilizează butonul × și checkbox-ul "Same as
   billing address". Lipește oriunde în CSS, spre finalul fișierului. */

/* chenar în jurul formularului */
body.page-id-20 .woocommerce-address-fields {
  position: relative !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.03), transparent) !important;
  padding: 36px 32px !important;
  box-sizing: border-box !important;
}

/* buton × — colț dreapta-sus. Hook-ul îl pune ÎNAINTE de <form>,
   deci părintele lui real e .woocommerce-MyAccount-content, nu
   form-ul — de-aia trebuia relative pus aici, nu pe form. */
body.page-id-20 .woocommerce-MyAccount-content {
  position: relative !important;
}
body.page-id-20 a.azi-edit-address-close {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  border: 1px solid var(--line) !important;
  background: var(--bg-soft) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  z-index: 5 !important;
  transition: background .3s ease, border-color .3s ease, color .3s ease;
}
body.page-id-20 a.azi-edit-address-close:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--bg) !important;
}

/* checkbox "Same as billing address" */
body.page-id-20 .azi-same-as-billing-row {
  margin: 0 0 24px !important;
}
body.page-id-20 .azi-same-as-billing-row label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: var(--cream) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.85rem !important;
  cursor: pointer !important;
}
body.page-id-20 .azi-same-as-billing-row input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: var(--gold) !important;
  cursor: pointer !important;
}
/* AZI — încadrează formularul de Edit Address (Billing/Shipping)
   într-un chenar, + stilizează butonul × și checkbox-ul "Same as
   billing address". Lipește oriunde în CSS, spre finalul fișierului. */

/* chenar în jurul formularului */
body.page-id-20 .woocommerce-address-fields {
  position: relative !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.03), transparent) !important;
  padding: 36px 32px !important;
  box-sizing: border-box !important;
}

/* buton × — colț dreapta-sus. Hook-ul îl pune ÎNAINTE de <form>,
   deci părintele lui real e .woocommerce-MyAccount-content, nu
   form-ul — de-aia trebuia relative pus aici, nu pe form. */
body.page-id-20 .woocommerce-MyAccount-content {
  position: relative !important;
}
body.page-id-20 a.azi-edit-address-close {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  width: 32px !important;
  height: 32px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  border: 1px solid var(--line) !important;
  background: var(--bg-soft) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  z-index: 5 !important;
  transition: background .3s ease, border-color .3s ease, color .3s ease;
}
body.page-id-20 a.azi-edit-address-close:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--bg) !important;
}

/* checkbox "Same as billing address" */
body.page-id-20 .azi-same-as-billing-row {
  margin: 0 0 24px !important;
}
body.page-id-20 .azi-same-as-billing-row label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
  color: var(--cream) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.85rem !important;
  cursor: pointer !important;
}
body.page-id-20 .azi-same-as-billing-row input[type="checkbox"] {
  width: 16px !important;
  height: 16px !important;
  accent-color: var(--gold) !important;
  cursor: pointer !important;
}
/* AZI — DOAR butonul ×, fișier minim de sine stătător, ca să nu
   depindă de nimic altceva din CSS. Mută-l în colțul dreapta-sus. */
body.page-id-20 .woocommerce-MyAccount-content {
  position: relative !important;
}
body.page-id-20 a.azi-edit-address-close {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: 0px !important;
  right: 0px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1px solid var(--line) !important;
  background: var(--bg-soft) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  z-index: 999 !important;
}
body.page-id-20 a.azi-edit-address-close:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--bg) !important;
}
/* AZI — fix definitiv pentru butonul × de pe Edit Address.
   CAUZA REALĂ (găsită prin verificarea sursei HTML reale, nu ghicind):
   regula "polish pass #4" — body.page-id-20 .woocommerce-MyAccount-content
   a[href*="edit-address"] { all: unset !important; ... } — a fost gândită
   pentru linkul "Add billing/shipping address", DAR href-ul butonului ×
   (/my-account/edit-address/) conține și el textul "edit-address", deci
   selectorul îl prinde și pe el. "all: unset" șterge tot (display,
   position, width, height...), iar acel selector are specificitate CSS
   mai mare decât "a.azi-edit-address-close" simplu — de-aia câștigă
   indiferent unde e poziționat în fișier.
   FIX: repetăm clasa .azi-edit-address-close ca să urcăm specificitatea
   peste selectorul cu [href*=...], și redeclarăm explicit tot ce ne
   trebuie. Lipește la ABSOLUTUL FINAL al Additional CSS. */
body.page-id-20 .woocommerce-MyAccount-content a.azi-edit-address-close.azi-edit-address-close {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: absolute !important;
  top: 0px !important;
  right: 0px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  border: 1px solid var(--line) !important;
  background: var(--bg-soft) !important;
  color: var(--gold-light) !important;
  font-family: "Jost", sans-serif !important;
  font-size: 1.1rem !important;
  line-height: 1 !important;
  text-decoration: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: 1px solid var(--line) !important;
  z-index: 999 !important;
}
body.page-id-20 .woocommerce-MyAccount-content a.azi-edit-address-close.azi-edit-address-close:hover {
  background: var(--gold) !important;
  border-color: var(--gold) !important;
  color: var(--bg) !important;
}
/* AZI — layout SIDE-BY-SIDE pentru Billing/Shipping address.
   Suprascrie definitiv blocul anterior "renunțăm la varianta una
   lângă alta" (cel care punea totul stivuit, lățime 100%). Selectorul
   de mai jos folosește TOATE clasele reale găsite pe fiecare element
   (verificate direct din sursa paginii /my-account/edit-address/):
   container = .u-columns.woocommerce-Addresses.col2-set.addresses
   cutii     = .u-column1.col-1.woocommerce-Address / .u-column2.col-2...
   Asta îi dă specificitate mai mare decât orice regulă anterioară din
   fișier care viza aceleași elemente, deci câștigă garantat.
   Lipește la ABSOLUTUL FINAL al Additional CSS (după tot restul). */
html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set.addresses {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: stretch !important;
  gap: 20px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set.addresses > .u-column1.col-1.woocommerce-Address,
html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set.addresses > .u-column2.col-2.woocommerce-Address {
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
  flex: 0 0 calc(50% - 10px) !important;
  width: calc(50% - 10px) !important;
  max-width: calc(50% - 10px) !important;
  min-width: 220px !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
@media (max-width: 680px) {
  html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set.addresses > .u-column1.col-1.woocommerce-Address,
  html body.page-id-20 .u-columns.woocommerce-Addresses.col2-set.addresses > .u-column2.col-2.woocommerce-Address {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}
/* AZI — Payment Methods: rânduri uniforme, indiferent de nr. de butoane */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody {
  display: block !important;
  width: 100% !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead tr,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr {
  min-height: 96px !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td {
  display: flex !important;
  align-items: center !important;
  box-sizing: border-box !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th:first-child,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td:first-child {
  flex: 1 1 45% !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th:nth-child(2),
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td:nth-child(2) {
  flex: 1 1 25% !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td:last-child {
  flex: 1 1 30% !important;
  flex-direction: row !important;
  justify-content: center !important;
  gap: 10px !important;
  min-height: 0 !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr {
  align-items: stretch !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td {
  align-items: center !important;
}
/* fără linii despărțitoare — doar highlight la hover, pe tot rândul */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td {
  border: none !important;
  border-bottom: none !important;
  background: transparent !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr {
  background: transparent !important;
  transition: background .25s ease !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr:hover {
  background: rgba(196,168,130,0.08) !important;
}
html body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th,
html body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td,
html body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tr {
  border: none !important;
  box-shadow: none !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td.payment-method-actions {
  border: none !important;
  background: none !important;
  padding: 0 24px !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 12px !important;
  text-align: left !important;
  font-family: "Jost", sans-serif !important;
  font-style: normal !important;
  font-size: inherit !important;
  color: inherit !important;
  line-height: 1 !important;
}
/* Header METHOD/EXPIRES — separat vizual, cu textura brand-ului */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead {
  display: block !important;
  width: 100% !important;
  background-image:
    linear-gradient(180deg, rgba(196,168,130,0.10), rgba(196,168,130,0.02)),
    var(--texture-swirl) !important;
  background-size: cover, 600px 600px !important;
  background-blend-mode: normal, soft-light !important;
  background-position: center, center !important;
  border-bottom: 1px solid var(--line) !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead th {
  background: transparent !important;
  padding: 20px 24px !important;
}

/* Make Default — centrat lângă Delete, fără margin:auto care îl împingea, fără wrap pe 2 rânduri */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table a[class*="default" i] {
  margin: 0 !important;
  align-self: center !important;
  white-space: nowrap !important;
}
/* Coloane fixe (grid) — identice pe header și pe fiecare rând */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead tr,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table tbody tr {
  display: grid !important;
  grid-template-columns: 1fr 140px 300px !important;
  align-items: center !important;
  width: 100% !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table th,
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td {
  display: flex !important;
  align-items: center !important;
  flex: none !important;
  width: auto !important;
  max-width: none !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table td.payment-method-actions {
  justify-content: flex-start !important;
}

/* titlul coloanei de butoane: OPTIONS */
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead th:last-child {
  font-size: 0 !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead th:last-child::before {
  content: "OPTIONS";
  font-size: 0.7rem;
  letter-spacing: 0.16em;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--gold-light);
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead th:last-child {
  display: flex !important;
  justify-content: center !important;
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body.page-id-20 .woocommerce-MyAccount-content table.account-payment-methods-table thead th:last-child {
  display: flex !important;
  justify-content: flex-start !important;
  text-align: left !important;
  padding-left: 110px !important;
  padding-right: 0 !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Addresses,
html body.page-id-20 .woocommerce-MyAccount-content .u-columns.woocommerce-Addresses,
html body.page-id-20 .woocommerce-MyAccount-content .col2-set.addresses {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address,
html body.page-id-20 .woocommerce-MyAccount-content .u-column1.woocommerce-Address,
html body.page-id-20 .woocommerce-MyAccount-content .u-column2.woocommerce-Address,
html body.page-id-20 .woocommerce-MyAccount-content .col-1.woocommerce-Address,
html body.page-id-20 .woocommerce-MyAccount-content .col-2.woocommerce-Address {
  float: none !important;
  flex: none !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}

@media (max-width: 680px) {
  html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Addresses,
  html body.page-id-20 .woocommerce-MyAccount-content .u-columns.woocommerce-Addresses,
  html body.page-id-20 .woocommerce-MyAccount-content .col2-set.addresses {
    grid-template-columns: 1fr !important;
  }
}
/* AZI — Addresses: spațiere egală sus/jos + cutii Billing/Shipping
   de aceleași dimensiuni, indiferent de cât text conțin */
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Addresses {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
html body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type {
  margin-bottom: 24px !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  min-height: 300px !important;
  margin: 0 0 24px 0 !important;
  padding: 28px 26px !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent) !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address:last-child {
  margin-bottom: 0 !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address > header.woocommerce-Address-title,
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address > .woocommerce-Address-title {
  display: contents !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address h2,
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address h3 {
  order: 1 !important;
  margin: 0 0 14px !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address address,
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address > p {
  order: 2 !important;
  flex: 1 !important;
  margin: 0 !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address a[href*="edit-address"] {
  order: 3 !important;
  align-self: flex-start !important;
  margin-top: 20px !important;
}
/* AZI — Addresses: Billing/Shipping unul lângă altul, aceleași
   dimensiuni. Înlocuiește blocul anterior (cel cu display:block). */
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Addresses {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 24px !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
html body.page-id-20 .woocommerce-MyAccount-content > p:first-of-type {
  margin-bottom: 24px !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  min-height: 300px !important;
  margin: 0 !important;
  padding: 28px 26px !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent) !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address > header.woocommerce-Address-title,
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address > .woocommerce-Address-title {
  display: contents !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address h2,
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address h3 {
  order: 1 !important;
  margin: 0 0 14px !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address address,
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address > p {
  order: 2 !important;
  flex: 1 !important;
  margin: 0 !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address a[href*="edit-address"] {
  order: 3 !important;
  align-self: flex-start !important;
  margin-top: 20px !important;
}
@media (max-width: 680px) {
  html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Addresses {
    grid-template-columns: 1fr !important;
  }
  html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address {
    margin-bottom: 24px !important;
  }
}
/* AZI — Addresses: cutii Billing/Shipping centrate pe pagină,
   titlu/text/buton centrate în interior */
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address.woocommerce-Address {
  display: block !important;
  width: 100% !important;
  max-width: 480px !important;
  margin: 0 auto 24px auto !important;
  box-sizing: border-box !important;
  min-height: 0 !important;
  padding: 28px 26px !important;
  border: 1px solid var(--line) !important;
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent) !important;
  text-align: center !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address.woocommerce-Address:last-child {
  margin-bottom: 0 !important;
}
html body.page-id-20 .woocommerce-MyAccount-content .woocommerce-Address.woocommerce-Address
body.page-id-20 .azi-logout-panel p {
  color: var(--biscuit);
  font-size: 1.05rem;
  margin: 0 0 26px;
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
}
body.page-id-20 .azi-logout-confirm-btn {
  display: inline-block;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0.08), transparent),
    var(--texture-swirl);
  background-size: cover, 300px 300px;
  background-blend-mode: normal, soft-light;
  background-color: var(--gold);
  color: var(--bg);
  border: 1px solid var(--gold);
  padding: 14px 40px;
  font-family: "Jost", sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  font-weight: 700;
  cursor: pointer;
  transition: background-color .3s ease, border-color .3s ease;
}
body.page-id-20 .azi-logout-confirm-btn:hover {
  background-color: var(--gold-light);
  border-color: var(--gold-light);
}
/* AZI — logo cu glow și pe Login (548) și Cart (18), la fel ca pe
   restul paginilor (aziFlameGlowLogo era definit, dar lista de
   selectoare nu includea aceste două pagini) */
body.page-id-548 .logo-mark img,
body.page-id-18 .logo-mark img {
  animation: aziFlameGlowLogo 3.2s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  body.page-id-548 .logo-mark img,
  body.page-id-18 .logo-mark img {
    animation: none;
  }
}
/* AZI — elimină orice contur alb implicit de browser (focus ring,
   fieldset/canvas nestilizat) în jurul secțiunii de Login */
body.page-id-548 fieldset,
body.page-id-548 form,
body.page-id-548 .auth-wrap,
body.page-id-548 .auth-card,
body.page-id-548 .auth-layout,
body.page-id-548 .auth-brand-panel,
body.page-id-548 canvas {
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-548 *:focus,
body.page-id-548 *:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}
/* AZI — estompează marginile texturii din panoul stâng de Login,
   ca să nu se mai vadă ca o poză cu margini drepte */
body.page-id-548 .auth-brand-panel {
  position: relative !important;
  overflow: hidden !important;
}
body.page-id-548 .auth-brand-panel::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background: radial-gradient(ellipse at 50% 40%, transparent 45%, var(--bg) 92%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}
body.page-id-548 .auth-brand-panel::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    linear-gradient(to bottom, var(--bg) 0%, transparent 22%),
    radial-gradient(ellipse at 50% 45%, transparent 45%, var(--bg) 92%) !important;
  pointer-events: none !important;
  z-index: 2 !important;
}
/* AZI — Account Details: elimină spațiul înainte de * și centrează
   butonul de Save */
body.page-id-20 form.woocommerce-EditAccountForm label abbr.required,
body.page-id-20 abbr.required {
  margin-left: -14px !important;
  text-decoration: none !important;
}
body.page-id-20 form.woocommerce-EditAccountForm button[name="save_account_details"],
body.page-id-20 form button[name="save_account_details"] {
  display: block !important;
  margin: 24px auto 0 !important;
  float: none !important;
}
/* AZI — ascunde link-ul implicit "View cart" de lângă buton */
a.added_to_cart.wc-forward {
  display: none !important;
}

/* toast propriu pentru "Added to cart" */
.azi-cart-toast {
  position: fixed;
  top: 110px;
  left: 50%;
  transform: translateX(-50%) translateY(-10px);
  z-index: 99999;
  display: flex;
  align-items: center;
  gap: 16px;
  background: linear-gradient(180deg, var(--bg-soft), var(--bg));
  border-top: 3px solid var(--gold);
  box-shadow: 0 16px 40px rgba(0,0,0,0.55), 0 0 0 1px var(--line);
  padding: 16px 26px;
  font-family: "Jost", sans-serif;
  color: var(--cream);
  font-size: 0.85rem;
  letter-spacing: 0.02em;
  opacity: 0;
  transition: opacity .4s ease, transform .4s ease;
  pointer-events: none;
}
.azi-cart-toast--show {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
  pointer-events: auto;
}
.azi-cart-toast-link {
  color: var(--gold-light);
  text-decoration: underline;
  font-weight: 600;
  white-space: nowrap;
}
.azi-cart-toast-link:hover {
  color: var(--gold);
}
/* ══════════════════════════════════════════════════════════
   AZI Rituals — Cart Page (body.page-id-18) — REDESIGN v2
   ------------------------------------------------------------
   &#x26a0;&#xfe0f; REPLACES the previous block titled "AZI Rituals — Cart Page
   (body.page-id-18) — SYMMETRIC REDESIGN". Find that whole block
   in your Additional CSS and DELETE it, then paste this one in
   its place (same spot, at the end of the file). Don't touch
   anything else in the file.

   WHY THE LAST VERSION LOOKED BAD:
   The marble-swirl texture was layered THREE times at once — once
   as the fixed full-page ambient layer, and again as a direct
   background-image on each of the two cards. All three stacked on
   top of each other, and because the cards' background was mostly
   transparent, the swirl showed through at near-full strength
   instead of "subtle" — that's the muddy brown stain you saw.

   THIS VERSION:
   - Texture exists in exactly ONE place: a faint, fixed, whole-page
     layer (same technique as Home/Shop), turned down further since
     the Cart page has much more open black canvas than those pages.
   - No texture-image anywhere on the cards themselves anymore.
   - Layout rebuilt as ONE unified panel (single border, single
     tint) instead of two separate boxed cards — items and totals
     now sit in the same surface, separated by a plain vertical
     hairline, so there's no "double box" or mismatched-height
     issue, and nothing reads as a dead black gap.
   - "In Your Ritual" is now a compact row of small chips under the
     "Cart totals" heading, not a stacked list — quieter, tidier.
   - "You may also like" is pulled onto its own full-width row
     below the whole panel, clearly separated, instead of being
     squeezed into the left column only.
   ══════════════════════════════════════════════════════════ */

/* ── 1. Ambient texture — ONE layer, whole page, much quieter than before ── */
body.page-id-18 {
  --texture-swirl: url("https://azirituals.ro/wp-content/uploads/2026/09/azi-texture-swirl-1200.webp");
}
body.page-id-18::before {
  content: "";
  position: fixed;
  inset: -12%;
  width: 124%; height: 124%;
  background-image: var(--texture-swirl);
  background-size: 1700px 1700px;
  background-repeat: repeat;
  opacity: 0.035;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: -1;
  animation: textureDrift 160s linear infinite;
}
@media (prefers-reduced-motion: reduce) {
  body.page-id-18::before { animation: none; }
}
body.page-id-18 .cart-hero { position: relative; overflow: hidden; }
body.page-id-18 .cart-hero::before {
  content: "";
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 640px; height: 640px; border-radius: 50%;
  background: radial-gradient(circle, rgba(139,105,20,0.13) 0%, rgba(139,105,20,0.02) 45%, transparent 70%);
  pointer-events: none; z-index: 0;
}
body.page-id-18 .cart-hero .eyebrow,
body.page-id-18 .cart-hero h1 { position: relative; z-index: 1; }

/* ── 2. ONE unified panel (replaces the two separate boxed cards) ── */
body.page-id-18 .woocommerce {
  max-width: 1100px; margin: 40px auto 100px !important; padding: 46px !important;
  display: grid;
  grid-template-columns: 1fr 360px;
  grid-template-areas: "cartform totals";
  column-gap: 0;
  row-gap: 0;
  align-items: start;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: linear-gradient(180deg, rgba(196,168,130,0.03), rgba(196,168,130,0.008));
}
body.page-id-18 .woocommerce-notices-wrapper { display: contents; }
body.page-id-18 .woocommerce-cart-form {
  grid-area: cartform;
  padding-right: 48px;
}
body.page-id-18 .cart-collaterals {
  grid-area: totals;
  border-left: 1px solid var(--line);
  padding: 0 0 0 48px;
  background: none;
  border-top: none; border-right: none; border-bottom: none;
  border-radius: 0;
  position: static;
}
body.page-id-18 .cart_totals {
  border: none; background: transparent; padding: 0;
}
@media (max-width: 880px) {
  body.page-id-18 .woocommerce {
    grid-template-columns: 1fr;
    grid-template-areas: "cartform" "totals";
    padding: 30px 24px !important;
  }
  body.page-id-18 .woocommerce-cart-form { padding-right: 0; padding-bottom: 30px; }
  body.page-id-18 .cart-collaterals {
    border-left: none; border-top: 1px solid var(--line);
    padding: 30px 0 0;
  }
}
@media (max-width: 480px) {
  body.page-id-18 .woocommerce { padding: 22px 18px !important; }
}

/* ── 3. Item rows — cleaner spacing, no card border of their own ── */
body.page-id-18 table.shop_table.cart,
body.page-id-18 .woocommerce-cart-form table.cart {
  border-top: none !important;
}
body.page-id-18 table.cart tbody tr.cart_item {
  padding: 24px 0;
}
body.page-id-18 table.cart tbody tr.cart_item:first-child {
  padding-top: 4px;
}
body.page-id-18 table.cart td.product-thumbnail img {
  width: 72px; height: 72px;
}

/* ── 4. "In Your Ritual" — compact chip row (built by JS), under the heading ── */
body.page-id-18 .cart_totals h2 {
  margin-bottom: 14px;
  padding-bottom: 0;
  border-bottom: none;
}
body.page-id-18 .azi-cart-breakdown {
  margin: 0 0 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
body.page-id-18 .azi-cart-breakdown__chip {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 5px 12px;
  font-family: "Jost", sans-serif;
  font-size: 0.76rem;
  color: var(--cream);
  background: rgba(196,168,130,0.04);
}
body.page-id-18 .azi-cart-breakdown__chip .azi-qty {
  color: var(--gold-light);
  font-weight: 700;
}

/* ── 5. Fill the space under "Proceed to Checkout" with a quiet brand line ── */
body.page-id-18 .wc-proceed-to-checkout::after {
  content: "A small ritual, a moment reclaimed.";
  display: block;
  text-align: center;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 0.9rem;
  color: var(--biscuit);
  opacity: 0.8;
}

/* ── 6. "You may also like" — its own full-width row below the panel ──
   Covers both the native WooCommerce cross-sells block and the
   custom azi-cart-upsell snippet, wherever either one lands in the
   markup (both selectors are safe no-ops if that element isn't
   present or isn't a direct grid child). */
body.page-id-18 .woocommerce > .cross-sells,
body.page-id-18 .woocommerce > .azi-cart-upsell {
  grid-column: 1 / -1;
}
body.page-id-18 .cross-sells,
body.page-id-18 .azi-cart-upsell {
  margin: 40px 0 0;
  padding-top: 30px;
  border-top: 1px solid var(--line);
}
body.page-id-18 .cross-sells > h2,
body.page-id-18 .azi-cart-upsell__title {
  font-size: 0.7rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-family: "Jost", sans-serif;
  font-weight: 700;
  color: var(--biscuit);
  margin: 0 0 20px;
}
body.page-id-18 .cross-sells ul.products,
body.page-id-18 .azi-cart-upsell__grid {
  display: flex !important;
  flex-wrap: wrap;
  gap: 20px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
body.page-id-18 .cross-sells ul.products li.product {
  width: 190px !important;
  max-width: 190px;
  margin: 0 !important;
  border: 1px solid var(--line);
  background: rgba(196,168,130,0.03);
  padding: 0 0 18px !important;
  text-align: center;
  transition: border-color .3s, transform .3s;
  float: none !important;
}
body.page-id-18 .cross-sells ul.products li.product:hover {
  border-color: var(--gold);
  transform: translateY(-3px);
}
body.page-id-18 .cross-sells ul.products li.product img {
  width: 100%; height: 170px; object-fit: contain;
  background: rgba(5,4,5,0.4);
  padding: 16px; box-sizing: border-box;
  border-bottom: 1px solid var(--line);
  margin: 0 0 14px !important;
  border-radius: 0 !important;
}
body.page-id-18 .cross-sells ul.products li.product .woocommerce-loop-product__title {
  font-size: 1rem; font-weight: 400; color: var(--cream);
  margin: 0 14px 8px !important; padding: 0 !important;
}
body.page-id-18 .cross-sells ul.products li.product .price {
  font-family: "Jost", sans-serif; font-size: 0.8rem; color: var(--gold-light);
  margin-bottom: 12px; display: block;
}
body.page-id-18 .cross-sells ul.products li.product a.button,
body.page-id-18 .cross-sells ul.products li.product a.add_to_cart_button {
  display: inline-block;
  background: transparent; color: var(--cream);
  border: 1px solid var(--gold);
  padding: 9px 18px;
  font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 700;
  font-family: "Jost", sans-serif;
  transition: background .3s, color .3s;
}
body.page-id-18 .cross-sells ul.products li.product a.button:hover,
body.page-id-18 .cross-sells ul.products li.product a.add_to_cart_button:hover {
  background: var(--gold); color: var(--bg);
}
@media (max-width: 480px) {
  body.page-id-18 .cross-sells ul.products li.product,
  body.page-id-18 .azi-cart-upsell__card { width: 100% !important; max-width: 260px; }
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header pentru vizitatori nelogați;
   apare doar după ce te loghezi. WordPress adaugă automat clasa
   "logged-in" pe <body> când ești autentificată — folosim doar asta,
   fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"] {
  display: none !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}

/* AZI — UPDATE 29 iulie 2026, runda 2 (Home) — de aici în jos sunt
   patch-uri noi, adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din
   ce există deja. */

/* Stil pentru noua linie scurtă ("Let go gently." / "Lasă totul să
   plece ușor.") adăugată în fiecare candle-card, între numele
   lumânării și descrierea lungă. Element complet nou — nu exista
   până acum, deci nu suprascrie nimic. */
body.page-id-42 .candle-card .candle-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 10px;
}

/* Eticheta "Made with" / "Preparat cu" de deasupra bandei de
   ingrediente — moștenește stilul de la .eyebrow (deja definit),
   doar o centrăm și îi dăm puțin spațiu dedesubt. */
body.page-id-42 .made-with-label {
  display: block;
  text-align: center;
  margin: 0 0 14px;
}

/* Repară spațiul dintre secțiunea de ingrediente și "Alege-ți
   ritualul" (Ritual Deck) — patch-ul anterior (#deck padding-top:0)
   le lipise complet. Refacem doar padding-top-ul lui #deck — nu
   atingem .section-alt, ca să nu afectăm din nou Journal (are
   aceeași clasă și arată bine acum, nu-l schimbăm). */
body.page-id-42 #deck {
  padding-top: 96px !important;
}

/* Ticker-ul de ingrediente trebuie să ruleze continuu, fără gol la
   final. Lista din HTML e deja dublată (16 span-uri = 8 ingrediente
   x2) exact ca să poată bucla perfect — aici doar garantăm animația:
   track-ul se mută -50% la nesfârșit, iar la -50% a doua jumătate
   (identică cu prima) ajunge exact unde a pornit prima, deci nu se
   vede nicio tăietură. Dacă exista deja o animație pe .marquee-track
   mai sus în Additional CSS, aceasta câștigă fiindcă e mai jos. */
body.page-id-42 .marquee-wrap {
  overflow: hidden !important;
  width: 100% !important;
}
body.page-id-42 .marquee-track {
  display: flex !important;
  width: max-content !important;
  animation: aziMarqueeScroll 26s linear infinite !important;
}
@keyframes aziMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}

/* AZI — UPDATE 29 iulie 2026, runda 2 (Home) — de aici în jos sunt
   patch-uri noi, adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din
   ce există deja. */

/* Stil pentru noua linie scurtă ("Let go gently." / "Lasă totul să
   plece ușor.") adăugată în fiecare candle-card, între numele
   lumânării și descrierea lungă. Element complet nou — nu exista
   până acum, deci nu suprascrie nimic. */
body.page-id-42 .candle-card .candle-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 10px;
}

/* Eticheta "Made with" / "Preparat cu" de deasupra bandei de
   ingrediente — moștenește stilul de la .eyebrow (deja definit),
   doar o centrăm și îi dăm puțin spațiu dedesubt. */
body.page-id-42 .made-with-label {
  display: block;
  text-align: center;
  margin: 0 0 14px;
}

/* Repară spațiul dintre secțiunea de ingrediente și "Alege-ți
   ritualul" (Ritual Deck) — patch-ul anterior (#deck padding-top:0)
   le lipise complet. Refacem doar padding-top-ul lui #deck — nu
   atingem .section-alt, ca să nu afectăm din nou Journal (are
   aceeași clasă și arată bine acum, nu-l schimbăm). */
body.page-id-42 #deck {
  padding-top: 96px !important;
}

/* Ticker-ul de ingrediente trebuie să ruleze continuu, fără gol la
   final. Lista din HTML e deja dublată (16 span-uri = 8 ingrediente
   x2) exact ca să poată bucla perfect — aici doar garantăm animația:
   track-ul se mută -50% la nesfârșit, iar la -50% a doua jumătate
   (identică cu prima) ajunge exact unde a pornit prima, deci nu se
   vede nicio tăietură. Dacă exista deja o animație pe .marquee-track
   mai sus în Additional CSS, aceasta câștigă fiindcă e mai jos. */
body.page-id-42 .marquee-wrap {
  overflow: hidden !important;
  width: 100% !important;
}
body.page-id-42 .marquee-track {
  display: flex !important;
  width: max-content !important;
  animation: aziMarqueeScroll 26s linear infinite !important;
}
@keyframes aziMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* AZI — UPDATE 29 iulie 2026, runda 3 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Centrează cele 3 texte din fiecare candle-card (nume, linia scurtă,
   descrierea) — erau aliniate la stânga și arătau disproporționat.
   Butonul "Try the Ritual" e deja centrat separat, mai sus. */
body.page-id-42 .candle-card h3,
body.page-id-42 .candle-card .candle-tagline,
body.page-id-42 .candle-card > p {
  text-align: center;
}

/* Numele lumânărilor (Zen Aura / Reconnect / Inner Calm) — bold, pe
   lângă italicul deja aplicat mai sus. */
body.page-id-42 .candle-card h3 {
  font-weight: 700 !important;
}

/* Stil pentru noua linie scurtă din secțiunea de Ingrediente
   ("A ritual that begins with a flame." / "Un ritual care începe cu o
   flacără."), aceeași familie vizuală ca .candle-tagline. */
body.page-id-42 .section-head .section-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 4px;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }
body.page-id-42 #deck { padding-top: 0 !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}

/* AZI — UPDATE 29 iulie 2026, runda 2 (Home) — de aici în jos sunt
   patch-uri noi, adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din
   ce există deja. */

/* Stil pentru noua linie scurtă ("Let go gently." / "Lasă totul să
   plece ușor.") adăugată în fiecare candle-card, între numele
   lumânării și descrierea lungă. Element complet nou — nu exista
   până acum, deci nu suprascrie nimic. */
body.page-id-42 .candle-card .candle-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 10px;
}

/* Eticheta "Made with" / "Preparat cu" de deasupra bandei de
   ingrediente — moștenește stilul de la .eyebrow (deja definit),
   doar o centrăm și îi dăm puțin spațiu dedesubt. */
body.page-id-42 .made-with-label {
  display: block;
  text-align: center;
  margin: 0 0 14px;
}

/* Repară spațiul dintre secțiunea de ingrediente și "Alege-ți
   ritualul" (Ritual Deck) — patch-ul anterior (#deck padding-top:0)
   le lipise complet. Refacem doar padding-top-ul lui #deck — nu
   atingem .section-alt, ca să nu afectăm din nou Journal (are
   aceeași clasă și arată bine acum, nu-l schimbăm). */
body.page-id-42 #deck {
  padding-top: 96px !important;
}

/* Ticker-ul de ingrediente trebuie să ruleze continuu, fără gol la
   final. Lista din HTML e deja dublată (16 span-uri = 8 ingrediente
   x2) exact ca să poată bucla perfect — aici doar garantăm animația:
   track-ul se mută -50% la nesfârșit, iar la -50% a doua jumătate
   (identică cu prima) ajunge exact unde a pornit prima, deci nu se
   vede nicio tăietură. Dacă exista deja o animație pe .marquee-track
   mai sus în Additional CSS, aceasta câștigă fiindcă e mai jos. */
body.page-id-42 .marquee-wrap {
  overflow: hidden !important;
  width: 100% !important;
}
body.page-id-42 .marquee-track {
  display: flex !important;
  width: max-content !important;
  animation: aziMarqueeScroll 26s linear infinite !important;
}
@keyframes aziMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* AZI — UPDATE 29 iulie 2026, runda 3 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Centrează cele 3 texte din fiecare candle-card (nume, linia scurtă,
   descrierea) — erau aliniate la stânga și arătau disproporționat.
   Butonul "Try the Ritual" e deja centrat separat, mai sus. */
body.page-id-42 .candle-card h3,
body.page-id-42 .candle-card .candle-tagline,
body.page-id-42 .candle-card > p {
  text-align: center;
}

/* Numele lumânărilor (Zen Aura / Reconnect / Inner Calm) — bold, pe
   lângă italicul deja aplicat mai sus. */
body.page-id-42 .candle-card h3 {
  font-weight: 700 !important;
}

/* Stil pentru noua linie scurtă din secțiunea de Ingrediente
   ("A ritual that begins with a flame." / "Un ritual care începe cu o
   flacără."), aceeași familie vizuală ca .candle-tagline. */
body.page-id-42 .section-head .section-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 4px;
}
/* Notă: clasa .section-tagline de mai sus nu mai e folosită acum
   (textul respectiv a devenit titlul h2 de mai jos), dar o las aici
   ca să nu șterg regulă fără să fi fost rugată explicit — nu strică
   nimic fiind neutilizată. */

/* AZI — UPDATE 29 iulie 2026, runda 4 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Noul titlu al secțiunii de Ingrediente ("A ritual that begins with
   a flame." / "Un ritual care începe cu o flacără.") — scris cu alb,
   nu cu culoarea crem folosită de celelalte titluri h2. */
body.page-id-42 .section-title-white {
  color: #ffffff !important;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva.
   ȘTERSĂ 29 iulie 2026 (runda 5) — vezi nota de la finalul fișierului:
   body.page-id-42 #deck { padding-top: 0 !important; } */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}

/* AZI — UPDATE 29 iulie 2026, runda 2 (Home) — de aici în jos sunt
   patch-uri noi, adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din
   ce există deja. */

/* Stil pentru noua linie scurtă ("Let go gently." / "Lasă totul să
   plece ușor.") adăugată în fiecare candle-card, între numele
   lumânării și descrierea lungă. Element complet nou — nu exista
   până acum, deci nu suprascrie nimic. */
body.page-id-42 .candle-card .candle-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 10px;
}

/* Eticheta "Made with" / "Preparat cu" de deasupra bandei de
   ingrediente — moștenește stilul de la .eyebrow (deja definit),
   doar o centrăm și îi dăm puțin spațiu dedesubt. */
body.page-id-42 .made-with-label {
  display: block;
  text-align: center;
  margin: 0 0 14px;
}

/* Repară spațiul dintre secțiunea de ingrediente și "Alege-ți
   ritualul" (Ritual Deck) — patch-ul anterior (#deck padding-top:0)
   le lipise complet.
   ȘTERSĂ 29 iulie 2026 (runda 5) — 96px nu se potrivea cu spațiul
   din Journal și arăta disproporționat (sus/jos inegal). Vezi nota
   de la finalul fișierului pentru fix-ul corect.
body.page-id-42 #deck {
  padding-top: 96px !important;
} */

/* Ticker-ul de ingrediente trebuie să ruleze continuu, fără gol la
   final. Lista din HTML e deja dublată (16 span-uri = 8 ingrediente
   x2) exact ca să poată bucla perfect — aici doar garantăm animația:
   track-ul se mută -50% la nesfârșit, iar la -50% a doua jumătate
   (identică cu prima) ajunge exact unde a pornit prima, deci nu se
   vede nicio tăietură. Dacă exista deja o animație pe .marquee-track
   mai sus în Additional CSS, aceasta câștigă fiindcă e mai jos. */
body.page-id-42 .marquee-wrap {
  overflow: hidden !important;
  width: 100% !important;
}
body.page-id-42 .marquee-track {
  display: flex !important;
  width: max-content !important;
  animation: aziMarqueeScroll 26s linear infinite !important;
}
@keyframes aziMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* AZI — UPDATE 29 iulie 2026, runda 3 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Centrează cele 3 texte din fiecare candle-card (nume, linia scurtă,
   descrierea) — erau aliniate la stânga și arătau disproporționat.
   Butonul "Try the Ritual" e deja centrat separat, mai sus. */
body.page-id-42 .candle-card h3,
body.page-id-42 .candle-card .candle-tagline,
body.page-id-42 .candle-card > p {
  text-align: center;
}

/* Numele lumânărilor (Zen Aura / Reconnect / Inner Calm) — bold, pe
   lângă italicul deja aplicat mai sus. */
body.page-id-42 .candle-card h3 {
  font-weight: 700 !important;
}

/* Stil pentru noua linie scurtă din secțiunea de Ingrediente
   ("A ritual that begins with a flame." / "Un ritual care începe cu o
   flacără."), aceeași familie vizuală ca .candle-tagline. */
body.page-id-42 .section-head .section-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 4px;
}
/* Notă: clasa .section-tagline de mai sus nu mai e folosită acum
   (textul respectiv a devenit titlul h2 de mai jos), dar o las aici
   ca să nu șterg regulă fără să fi fost rugată explicit — nu strică
   nimic fiind neutilizată. */

/* AZI — UPDATE 29 iulie 2026, runda 4 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Noul titlu al secțiunii de Ingrediente ("A ritual that begins with
   a flame." / "Un ritual care începe cu o flacără.") — scris cu alb,
   nu cu culoarea crem folosită de celelalte titluri h2. */
body.page-id-42 .section-title-white {
  color: #ffffff !important;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva.
   ȘTERSĂ 29 iulie 2026 (runda 5) — vezi nota de la finalul fișierului:
   body.page-id-42 #deck { padding-top: 0 !important; } */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}

/* AZI — UPDATE 29 iulie 2026, runda 2 (Home) — de aici în jos sunt
   patch-uri noi, adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din
   ce există deja. */

/* Stil pentru noua linie scurtă ("Let go gently." / "Lasă totul să
   plece ușor.") adăugată în fiecare candle-card, între numele
   lumânării și descrierea lungă. Element complet nou — nu exista
   până acum, deci nu suprascrie nimic. */
body.page-id-42 .candle-card .candle-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 10px;
}

/* Eticheta "Made with" / "Preparat cu" de deasupra bandei de
   ingrediente — moștenește stilul de la .eyebrow (deja definit),
   doar o centrăm și îi dăm puțin spațiu dedesubt. */
body.page-id-42 .made-with-label {
  display: block;
  text-align: center;
  margin: 0 0 14px;
}

/* Repară spațiul dintre secțiunea de ingrediente și "Alege-ți
   ritualul" (Ritual Deck) — patch-ul anterior (#deck padding-top:0)
   le lipise complet.
   ȘTERSĂ 29 iulie 2026 (runda 5) — 96px nu se potrivea cu spațiul
   din Journal și arăta disproporționat (sus/jos inegal). Vezi nota
   de la finalul fișierului pentru fix-ul corect.
body.page-id-42 #deck {
  padding-top: 96px !important;
} */

/* Ticker-ul de ingrediente trebuie să ruleze continuu, fără gol la
   final. Lista din HTML e deja dublată (16 span-uri = 8 ingrediente
   x2) exact ca să poată bucla perfect — aici doar garantăm animația:
   track-ul se mută -50% la nesfârșit, iar la -50% a doua jumătate
   (identică cu prima) ajunge exact unde a pornit prima, deci nu se
   vede nicio tăietură. Dacă exista deja o animație pe .marquee-track
   mai sus în Additional CSS, aceasta câștigă fiindcă e mai jos. */
body.page-id-42 .marquee-wrap {
  overflow: hidden !important;
  width: 100% !important;
}
body.page-id-42 .marquee-track {
  display: flex !important;
  width: max-content !important;
  animation: aziMarqueeScroll 26s linear infinite !important;
}
@keyframes aziMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* AZI — UPDATE 29 iulie 2026, runda 3 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Centrează cele 3 texte din fiecare candle-card (nume, linia scurtă,
   descrierea) — erau aliniate la stânga și arătau disproporționat.
   Butonul "Try the Ritual" e deja centrat separat, mai sus. */
body.page-id-42 .candle-card h3,
body.page-id-42 .candle-card .candle-tagline,
body.page-id-42 .candle-card > p {
  text-align: center;
}

/* Numele lumânărilor (Zen Aura / Reconnect / Inner Calm) — bold, pe
   lângă italicul deja aplicat mai sus. */
body.page-id-42 .candle-card h3 {
  font-weight: 700 !important;
}

/* Stil pentru noua linie scurtă din secțiunea de Ingrediente
   ("A ritual that begins with a flame." / "Un ritual care începe cu o
   flacără."), aceeași familie vizuală ca .candle-tagline. */
body.page-id-42 .section-head .section-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 4px;
}
/* Notă: clasa .section-tagline de mai sus nu mai e folosită acum
   (textul respectiv a devenit titlul h2 de mai jos), dar o las aici
   ca să nu șterg regulă fără să fi fost rugată explicit — nu strică
   nimic fiind neutilizată. */

/* AZI — UPDATE 29 iulie 2026, runda 4 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Noul titlu al secțiunii de Ingrediente ("A ritual that begins with
   a flame." / "Un ritual care începe cu o flacără.") — scris cu alb,
   nu cu culoarea crem folosită de celelalte titluri h2. */
body.page-id-42 .section-title-white {
  color: #ffffff !important;
}

/* AZI — UPDATE 29 iulie 2026, runda 5 (Home) — IMPORTANT, necesită
   acțiune manuală din partea ta (nu doar paste):

   Zona "Alege-ți ritualul" (cardul cu "Trage un ritual") arăta cu
   spațiu inegal sus/jos față de Jurnalul AZI. Cauza: am adăugat eu
   două reguli pentru #deck în rundele anterioare (padding-top: 0,
   apoi padding-top: 96px) ca să reduc/reface un gol. Niciuna nu se
   potrivea cu spațiul natural pe care Journal îl are (Journal nu are
   nicio regulă specială — folosește doar spațiul implicit din tema
   ta, de-asta arată corect).

   Ca #deck să aibă exact același ritm ca Journal, cel mai simplu și
   sigur e să ȘTERGI manual din Additional CSS (Customizer) cele două
   linii vechi legate de #deck padding-top (le-am marcat mai sus, tăiate
   cu comentariu — caută "#deck" ca să le găsești rapid). Odată șterse,
   #deck rămâne fără nicio regulă proprie de padding și moștenește
   automat același spațiu implicit ca Journal — deci devine centrat,
   fără să mai ghicesc o valoare în pixeli. */

/* AZI — UPDATE 29 iulie 2026, runda 6 — fum vizibil doar pe primul
   ecran (screenshot confirmă: pata de fum se oprește exact unde se
   termină prima "pagină" vizibilă, restul defilării nu mai are fum).

   Cauza aproape sigură: canvas-ul #page-smoke-canvas e dimensionat
   la window.innerHeight (un singur ecran), iar poziționarea lui
   actuală (necunoscută mie — nu era în regula CSS pe care am cerut-o)
   e probabil "absolute" sau "static", deci rămâne "lipit" de începutul
   paginii și nu te urmărește când derulezi mai jos.

   Fix: îl facem "fixed" pe tot ecranul (100vw x 100vh), ca un fundal
   care rămâne mereu vizibil, indiferent unde ești derulat pe pagină —
   e tehnica standard pentru fundaluri ambientale de genul ăsta.

   ATENȚIE — nu știu z-index-ul corect din contextul tău actual (ce
   regulă exista deja pentru #page-smoke-canvas), deci -1 e o
   presupunere rezonabilă (îl pune în spatele conținutului, ca
   fundal). Te rog încearcă și spune-mi ce vezi:
   - dacă fumul dispare complet (nu se mai vede deloc) → z-index e
     prea mic, trebuie urcat puțin (ex: 1, dar sub restul textului)
   - dacă fumul acoperă textul/butoanele → z-index e prea mare,
     trebuie coborât
   pointer-events:none e sigur oricum — canvas-ul ăsta nu are nevoie
   de interacțiune cu mouse-ul (spre deosebire de liquid-ether-canvas
   din hero, care rămâne neatins). */
#page-smoke-canvas {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: -1 !important;
  pointer-events: none !important;
}
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva.
   ȘTERSĂ 29 iulie 2026 (runda 5) — vezi nota de la finalul fișierului:
   body.page-id-42 #deck { padding-top: 0 !important; } */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}

/* AZI — UPDATE 29 iulie 2026, runda 2 (Home) — de aici în jos sunt
   patch-uri noi, adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din
   ce există deja. */

/* Stil pentru noua linie scurtă ("Let go gently." / "Lasă totul să
   plece ușor.") adăugată în fiecare candle-card, între numele
   lumânării și descrierea lungă. Element complet nou — nu exista
   până acum, deci nu suprascrie nimic. */
body.page-id-42 .candle-card .candle-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 10px;
}

/* Eticheta "Made with" / "Preparat cu" de deasupra bandei de
   ingrediente — moștenește stilul de la .eyebrow (deja definit),
   doar o centrăm și îi dăm puțin spațiu dedesubt. */
body.page-id-42 .made-with-label {
  display: block;
  text-align: center;
  margin: 0 0 14px;
}

/* Repară spațiul dintre secțiunea de ingrediente și "Alege-ți
   ritualul" (Ritual Deck) — patch-ul anterior (#deck padding-top:0)
   le lipise complet.
   ȘTERSĂ 29 iulie 2026 (runda 5) — 96px nu se potrivea cu spațiul
   din Journal și arăta disproporționat (sus/jos inegal). Vezi nota
   de la finalul fișierului pentru fix-ul corect.
body.page-id-42 #deck {
  padding-top: 96px !important;
} */

/* Ticker-ul de ingrediente trebuie să ruleze continuu, fără gol la
   final. Lista din HTML e deja dublată (16 span-uri = 8 ingrediente
   x2) exact ca să poată bucla perfect — aici doar garantăm animația:
   track-ul se mută -50% la nesfârșit, iar la -50% a doua jumătate
   (identică cu prima) ajunge exact unde a pornit prima, deci nu se
   vede nicio tăietură. Dacă exista deja o animație pe .marquee-track
   mai sus în Additional CSS, aceasta câștigă fiindcă e mai jos. */
body.page-id-42 .marquee-wrap {
  overflow: hidden !important;
  width: 100% !important;
}
body.page-id-42 .marquee-track {
  display: flex !important;
  width: max-content !important;
  animation: aziMarqueeScroll 26s linear infinite !important;
}
@keyframes aziMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* AZI — UPDATE 29 iulie 2026, runda 3 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Centrează cele 3 texte din fiecare candle-card (nume, linia scurtă,
   descrierea) — erau aliniate la stânga și arătau disproporționat.
   Butonul "Try the Ritual" e deja centrat separat, mai sus. */
body.page-id-42 .candle-card h3,
body.page-id-42 .candle-card .candle-tagline,
body.page-id-42 .candle-card > p {
  text-align: center;
}

/* Numele lumânărilor (Zen Aura / Reconnect / Inner Calm) — bold, pe
   lângă italicul deja aplicat mai sus. */
body.page-id-42 .candle-card h3 {
  font-weight: 700 !important;
}

/* Stil pentru noua linie scurtă din secțiunea de Ingrediente
   ("A ritual that begins with a flame." / "Un ritual care începe cu o
   flacără."), aceeași familie vizuală ca .candle-tagline. */
body.page-id-42 .section-head .section-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 4px;
}
/* Notă: clasa .section-tagline de mai sus nu mai e folosită acum
   (textul respectiv a devenit titlul h2 de mai jos), dar o las aici
   ca să nu șterg regulă fără să fi fost rugată explicit — nu strică
   nimic fiind neutilizată. */

/* AZI — UPDATE 29 iulie 2026, runda 4 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Noul titlu al secțiunii de Ingrediente ("A ritual that begins with
   a flame." / "Un ritual care începe cu o flacără.") — scris cu alb,
   nu cu culoarea crem folosită de celelalte titluri h2. */
body.page-id-42 .section-title-white {
  color: #ffffff !important;
}

/* AZI — UPDATE 29 iulie 2026, runda 5 (Home) — IMPORTANT, necesită
   acțiune manuală din partea ta (nu doar paste):

   Zona "Alege-ți ritualul" (cardul cu "Trage un ritual") arăta cu
   spațiu inegal sus/jos față de Jurnalul AZI. Cauza: am adăugat eu
   două reguli pentru #deck în rundele anterioare (padding-top: 0,
   apoi padding-top: 96px) ca să reduc/reface un gol. Niciuna nu se
   potrivea cu spațiul natural pe care Journal îl are (Journal nu are
   nicio regulă specială — folosește doar spațiul implicit din tema
   ta, de-asta arată corect).

   Ca #deck să aibă exact același ritm ca Journal, cel mai simplu și
   sigur e să ȘTERGI manual din Additional CSS (Customizer) cele două
   linii vechi legate de #deck padding-top (le-am marcat mai sus, tăiate
   cu comentariu — caută "#deck" ca să le găsești rapid). Odată șterse,
   #deck rămâne fără nicio regulă proprie de padding și moștenește
   automat același spațiu implicit ca Journal — deci devine centrat,
   fără să mai ghicesc o valoare în pixeli. */

/* AZI — UPDATE 29 iulie 2026, runda 6 — fum vizibil doar pe primul
   ecran (screenshot confirmă: pata de fum se oprește exact unde se
   termină prima "pagină" vizibilă, restul defilării nu mai are fum).

   Cauza aproape sigură: canvas-ul #page-smoke-canvas e dimensionat
   la window.innerHeight (un singur ecran), iar poziționarea lui
   actuală (necunoscută mie — nu era în regula CSS pe care am cerut-o)
   e probabil "absolute" sau "static", deci rămâne "lipit" de începutul
   paginii și nu te urmărește când derulezi mai jos.

   Fix: îl facem "fixed" pe tot ecranul (100vw x 100vh), ca un fundal
   care rămâne mereu vizibil, indiferent unde ești derulat pe pagină —
   e tehnica standard pentru fundaluri ambientale de genul ăsta.

   ATENȚIE — nu știu z-index-ul corect din contextul tău actual (ce
   regulă exista deja pentru #page-smoke-canvas), deci -1 e o
   presupunere rezonabilă (îl pune în spatele conținutului, ca
   fundal). Te rog încearcă și spune-mi ce vezi:
   - dacă fumul dispare complet (nu se mai vede deloc) → z-index e
     prea mic, trebuie urcat puțin (ex: 1, dar sub restul textului)
   - dacă fumul acoperă textul/butoanele → z-index e prea mare,
     trebuie coborât
   pointer-events:none e sigur oricum — canvas-ul ăsta nu are nevoie
   de interacțiune cu mouse-ul (spre deosebire de liquid-ether-canvas
   din hero, care rămâne neatins).

   UPDATE — dacă ai testat regula de mai jos și tot nu s-a schimbat
   nimic: aproape sigur regula ta veche pentru #page-smoke-canvas e
   scrisă cu un selector mai "specific" (ex: body.page-id-42
   #page-smoke-canvas), la fel ca toate celelalte reguli din acest
   fișier — iar în CSS, un selector mai specific câștigă mereu în
   fața unuia mai simplu, indiferent de !important sau de ordine.
   Regula simplă #page-smoke-canvas de mai jos pierde în fața ei.
   Am întărit selectorul mai jos ca să câștige garantat, indiferent
   ce scrie regula veche. */
#page-smoke-canvas#page-smoke-canvas {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* AZI — UPDATE 29 iulie 2026, runda 7 — cauza reală a fumului care
   "se oprește".

   Am verificat CSS-ul tău live: regula #page-smoke-canvas era deja
   fixed, pe tot ecranul, cu z-index:-1 — exact ce am cerut eu mai sus,
   deci fix-ul din runda 6 n-a schimbat nimic (era deja corect, de-asta
   "still the same"). Nu e o problemă de poziționare.

   Cauza reală: secțiunile cu fundal propriu (.section-alt — folosită
   la Ingrediente, Discover Tea, Jurnal) pictează un fundal SOLID
   deasupra oricărui element cu z-index negativ — așa funcționează
   normal stivuirea în CSS. Canvas-ul de fum e corect și acoperă toată
   pagina, dar rămâne "ascuns" sub orice bandă cu fundal propriu.

   Fix ales: păstrăm z-index-ul fumului neatins (rămâne mereu în spate,
   nu ajunge niciodată peste text/butoane), dar facem fundalul benzii
   puțin transparent — 88%, aproape imperceptibil — cât să se vadă o
   urmă de fum prin spate, la fel ca-n restul paginii.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt {
  background: color-mix(in srgb, var(--bg-soft) 88%, transparent) !important;
}

/* AZI — UPDATE 29 iulie 2026, runda 8 — cauza reală a spațiului
   inegal de la #deck (Alege-ți ritualul), găsită în CSS-ul de bază
   al temei (nu în patch-urile mele):

   body.page-id-42 section { padding: 30px 0; }
   body.page-id-42 #deck { padding-top: 14px; }

   #deck are deja o regulă proprie ÎN CSS-UL ORIGINAL care îi reduce
   padding-top-ul la 14px, în timp ce Jurnalul AZI (fără nicio regulă
   specială) rămâne la cei 30px impliciți din regula generică de mai
   sus. Asta explică de ce ștergerea patch-urilor mele (runda 5) nu
   ar fi fost suficientă — tot ar fi rămas 14px sus vs. 30px la Jurnal.

   Fix: suprascriem #deck înapoi la 30px, ca să fie identic cu Jurnalul.
   Aceasta câștigă automat în fața oricăror duplicate vechi ale
   patch-urilor mele din Additional CSS (indiferent câte copii mai
   există), pentru că e ultima regulă cu aceeași specificitate din
   fișier — nu mai e nevoie să vânezi și să ștergi manual duplicatele
   ca să vezi efectul. Paste la finalul Additional CSS existent. */
body.page-id-42 #deck {
  padding-top: 30px !important;
}
/* ══════════════════════════════════════════════════════════ */
/* ── AZI Rituals — Single Product Page (body.single-product) ── */
/* NOU — 29 iulie 2026. Paste la finalul Additional CSS existent,   */
/* nu șterge nimic altceva. Funcționează împreună cu snippet-ul PHP */
/* "azi-single-product-header-footer.php" (injectează header/footer). */
/* ══════════════════════════════════════════════════════════ */

/* ── Ascunde header/footer/breadcrumb default Hello Elementor ── */
body.single-product .site-header,
body.single-product header.site-header,
body.single-product .elementor-location-header,
body.single-product #masthead,
body.single-product #site-header,
body.single-product .site-footer,
body.single-product footer.site-footer,
body.single-product .elementor-location-footer,
body.single-product #colophon,
body.single-product .woocommerce-breadcrumb {
  display: none !important;
}

/* ── Tokens + reset ──
   CORECTAT 30 iulie 2026: valorile de mai jos nu erau chiar paleta
   oficială a brandului (verificat față de homepage-fixes-preview.html
   și shop-design-preview.html, care folosesc paleta finală din
   brief). --gold și --cream sunt acum exact valorile oficiale.
   --biscuit era de fapt un auriu-nisipiu (#C4A882) folosit peste tot
   pentru text normal (paragrafe, footer, liste) — de-acolo senzația
   de "prea auriu". L-am schimbat într-un gri-cald neutru, ca textul
   curent să nu mai pară auriu, iar auriul rămâne doar acolo unde
   chiar accentuează ceva (titluri de secțiune, preț, buton, tab activ). */
body.single-product {
  --gold: #C9A95C;
  --gold-light: #C9A95C;
  --biscuit: #A69C8D;
  --cream: #E8DCC8;
  --bg: #09080A;
  --bg-soft: #14110c;
  --line: rgba(232, 220, 200, 0.14);
  --texture-swirl: url("https://azirituals.ro/wp-content/uploads/2026/09/azi-texture-swirl-1200.webp");
  margin: 0 !important;
  padding: 0 !important;
  background: var(--bg) !important;
  color: var(--cream);
  font-family: "Jost", sans-serif;
  font-weight: 300;
  line-height: 1.6;
  overflow-x: hidden;
  position: relative;
}
body.single-product .site-main,
body.single-product .content-area,
body.single-product article,
body.single-product .entry-content,
body.single-product .elementor-widget-html,
body.single-product .elementor-widget-container,
body.single-product .elementor-section,
body.single-product .elementor-container,
body.single-product .e-con,
body.single-product .e-con-inner {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
  background: transparent !important;
}
body.single-product h1,
body.single-product h2,
body.single-product h3,
body.single-product h4 {
  font-family: "Cormorant Garamond", serif;
  font-weight: 400;
  letter-spacing: 0.02em;
  margin: 0;
}
body.single-product a { color: inherit; text-decoration: none; }
body.single-product .wrap { max-width: 1180px; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
@media (max-width: 480px) { body.single-product .wrap { padding: 0 20px; } }
body.single-product .eyebrow {
  font-family: "Jost", sans-serif;
  font-size: 0.72rem;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--gold-light);
  display: inline-block;
}
body.single-product #page-smoke-canvas {
  position: fixed; inset: 0; width: 100%; height: 100%;
  z-index: -1; opacity: 0.4; mix-blend-mode: screen; pointer-events: none;
}
body.single-product::before {
  content: "";
  position: fixed;
  inset: -12%;
  width: 124%; height: 124%;
  background-image: var(--texture-swirl);
  background-size: 1500px 1500px;
  background-repeat: repeat;
  opacity: 0.05;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: -1;
  animation: textureDrift 160s linear infinite;
}
@media (prefers-reduced-motion: reduce) { body.single-product::before { animation: none; } }

/* ── Header / Nav / Mobile nav (identice cu restul site-ului) ── */
body.single-product header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.single-product header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.single-product .header-left { display: flex; align-items: center; gap: 40px; }
body.single-product .logo-mark { display: flex; align-items: center; gap: 10px; }
body.single-product .logo-mark img { height: 36px; width: auto; display: block; }
body.single-product nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.single-product nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.single-product nav a:hover { opacity: 1; color: var(--gold-light); }
body.single-product .header-icons { display: flex; align-items: center; gap: 22px; font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; opacity: 0.85; }
body.single-product .header-icons .icon-item {
  display: flex; align-items: center; gap: 7px; position: relative;
  color: var(--cream); opacity: 0.85; transition: color .3s, opacity .3s;
}
body.single-product .header-icons .icon-item:hover { color: var(--gold-light); opacity: 1; }
body.single-product .header-icons .icon-item svg {
  width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; flex-shrink: 0;
}
body.single-product .header-icons .icon-label { font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; }
body.single-product .header-icons .wishlist-icon.azi-has-items svg { fill: var(--gold-light); stroke: var(--gold-light); }
body.single-product .header-icons .icon-badge {
  position: absolute; top: -7px; right: -9px;
  background: var(--gold); color: var(--bg); font-size: 0.6rem; font-weight: 700;
  width: 15px; height: 15px; border-radius: 50%; align-items: center; justify-content: center;
  display: flex; line-height: 1;
}
body.single-product .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.single-product .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
  outline: none; box-shadow: none;
}
body.single-product .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.single-product .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.single-product .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.single-product .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.single-product .hamburger.open span:nth-child(2) { opacity: 0; }
body.single-product .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.single-product .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.single-product .mobile-nav.open { transform: translateX(0); }
body.single-product .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.single-product .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.single-product .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.single-product .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.single-product .header-left { gap: 18px; }
  body.single-product nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.single-product header { padding: 18px 22px; }
  body.single-product nav { display: none; }
  body.single-product .header-icons { gap: 14px; font-size: 0.7rem; }
  body.single-product .header-icons a.icon-item { display: none; }
  body.single-product .lang-toggle { font-size: 0.66rem; }
  body.single-product .hamburger { display: flex; }
  body.single-product .mobile-nav, body.single-product .nav-scrim { display: flex; }
}

/* ── Footer (identic cu restul site-ului) ── */
body.single-product footer { padding: 56px 0 26px; border-top: 1px solid var(--line); }
body.single-product .footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
body.single-product .footer-brand { display: none; }
body.single-product .footer-col h5 { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 18px; }
body.single-product .footer-col a { display: block; font-size: 0.85rem; color: var(--biscuit); margin-bottom: 12px; transition: color .3s; }
body.single-product .footer-col a:hover { color: var(--cream); }
body.single-product .newsletter-form { display: flex; border: 1px solid var(--line); margin-top: 6px; }
body.single-product .newsletter-form input { flex: 1; background: transparent; border: none; outline: none; color: var(--cream); padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; }
body.single-product .newsletter-form button { background: var(--gold); color: var(--bg); border: none; padding: 0 18px; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-weight: 700; font-family: "Jost", sans-serif; }
body.single-product .newsletter-msg { font-size: 0.75rem; color: var(--gold-light); margin-top: 8px; min-height: 1em; }
body.single-product .footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 0.75rem; color: var(--biscuit); }
body.single-product .socials { display: flex; gap: 16px; }
body.single-product .socials a { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; transition: border-color .3s, color .3s; }
body.single-product .socials a:hover { border-color: var(--gold); color: var(--gold-light); }
@media (max-width: 880px) { body.single-product .footer-top { grid-template-columns: 1fr; gap: 36px; } }

/* ── Conținutul de produs (partea WooCommerce nativă) ── */
/* Am verificat în DevTools: div.product primea deja row-gap:30px și
   padding diferit de ce am cerut eu — WooCommerce/tema au propria
   regulă pentru div.product.type-product, mai specifică decât a mea,
   care câștiga parțial. Repet clasa .type-product (vine direct din
   markup-ul real) ca să urc specificitatea peste ea, cu !important
   pe fiecare proprietate — așa câștigă garantat regula noastră. */
body.single-product div.product.type-product {
  max-width: 1180px !important;
  margin: 0 auto !important;
  padding: 150px 32px 20px !important;
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap: 60px !important;
  row-gap: 0 !important;
  align-items: start !important;
  box-sizing: border-box !important;
}
@media (max-width: 880px) {
  body.single-product div.product { grid-template-columns: 1fr; padding: 130px 24px 20px !important; gap: 30px; }
}
body.single-product div.product div.images,
body.single-product .woocommerce-product-gallery {
  border: 1px solid var(--line);
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5));
  width: 100% !important;
  max-width: none !important;
  float: none !important;
  box-sizing: border-box;
  padding: 30px;
  /* Textul e mai lung decât imaginea, iar într-un grid rândul de sus
     ține cont de coloana cea mai înaltă — asta lăsa un gol mare, negru,
     sub imagine, înainte să înceapă tab-urile Descriere/Recenzii.
     Sticky ține imaginea "agățată" în ecran cât timp derulezi prin
     text (aceeași tehnică ca la totalurile din Cart), deci golul nu se
     mai vede — rămâne umplut cu imaginea, nu cu negru gol. */
  position: sticky;
  top: 110px;
  align-self: start;
}
body.single-product .woocommerce-product-gallery__wrapper,
body.single-product .flex-viewport,
body.single-product .woocommerce-product-gallery__image {
  width: 100% !important;
  max-width: none !important;
}
body.single-product div.product div.images,
body.single-product .woocommerce-product-gallery {
  overflow: hidden;
}
body.single-product div.product div.images img,
body.single-product .woocommerce-product-gallery img {
  display: block;
  width: 100% !important;
  height: auto !important;
  max-width: 100% !important;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  transition: transform .6s ease;
}
body.single-product div.product div.images:hover img,
body.single-product .woocommerce-product-gallery:hover img {
  transform: scale(1.035);
}
@media (prefers-reduced-motion: reduce) {
  body.single-product div.product div.images img,
  body.single-product .woocommerce-product-gallery img { transition: none; }
}
body.single-product .woocommerce-product-gallery__trigger {
  background: rgba(5,4,5,0.7);
  border: 1px solid var(--line);
  border-radius: 50%;
  color: var(--cream);
}

/* Coloana de text (summary) — WooCommerce îi pune implicit o lățime
   proprie în procente (moștenită din layout-ul clasic pe float), care
   intra în conflict cu grid-ul nostru și lăsa textul îngust ca un
   "cârnat" în mijlocul coloanei lui, cu spațiu mort în dreapta.
   Îi spunem explicit să ocupe 100% din celula de grid alocată. */
body.single-product .summary.entry-summary {
  width: 100% !important;
  max-width: none !important;
  float: none !important;
}

/* Título + preț */
body.single-product .product_title {
  font-size: clamp(2rem, 3.6vw, 2.8rem);
  font-style: italic;
  color: var(--cream);
  margin-bottom: 14px !important;
}
body.single-product p.price,
body.single-product .woocommerce-Price-amount {
  font-family: "Jost", sans-serif !important;
  font-size: 1.1rem !important;
  color: var(--gold-light) !important;
  font-weight: 600;
}
body.single-product p.price del .woocommerce-Price-amount { color: var(--biscuit) !important; opacity: 0.55; font-weight: 400; }

/* Subtitlul scurt ("Let Go Gently") — short description, direct sub preț */
body.single-product .woocommerce-product-details__short-description {
  margin: 18px 0 22px;
}
body.single-product .woocommerce-product-details__short-description > p:first-child {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 1.3rem;
  color: var(--gold-light);
  margin-bottom: 10px;
}
body.single-product .woocommerce-product-details__short-description p {
  font-size: 0.92rem;
  color: var(--biscuit);
  line-height: 1.75;
  margin-bottom: 14px;
}

/* Cantitate + Add to cart */
body.single-product form.cart { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 24px 0 20px; }
body.single-product .quantity { display: flex; align-items: center; border: 1px solid var(--line); width: fit-content; }
body.single-product .quantity input.qty {
  width: 46px; text-align: center; background: transparent; border: none;
  color: var(--cream); font-family: "Jost", sans-serif; font-size: 0.95rem; height: 46px;
  -webkit-appearance: none; appearance: none; -moz-appearance: textfield;
}
body.single-product .quantity input.qty::-webkit-inner-spin-button,
body.single-product .quantity input.qty::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
/* Butoanele +/- de lângă cantitate (injectate de azi-cart-qty-stepper.js,
   site-wide) — fără stilul nostru, moșteneau accentul roz/violet implicit
   al temei la focus/click. Le stilizăm explicit, la fel ca restul site-ului,
   și eliminăm orice contur/umbră implicită de browser. */
body.single-product .quantity .azi-qty-btn,
body.single-product .quantity .qty-btn,
body.single-product .quantity .plus,
body.single-product .quantity .minus,
body.single-product .quantity button {
  width: 44px; height: 46px; background: transparent !important; border: none !important;
  color: var(--cream) !important; font-family: "Jost", sans-serif; font-size: 1.1rem;
  cursor: pointer; transition: background .2s, color .2s;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.single-product .quantity .azi-qty-btn:hover,
body.single-product .quantity .qty-btn:hover,
body.single-product .quantity .plus:hover,
body.single-product .quantity .minus:hover,
body.single-product .quantity button:hover {
  background: rgba(139,105,20,0.15) !important; color: var(--gold-light) !important;
}
body.single-product .quantity .azi-qty-btn:focus,
body.single-product .quantity .azi-qty-btn:focus-visible,
body.single-product .quantity .qty-btn:focus,
body.single-product .quantity .plus:focus,
body.single-product .quantity .minus:focus,
body.single-product .quantity button:focus,
body.single-product .quantity input.qty:focus,
body.single-product .quantity input.qty:focus-visible {
  outline: none !important;
  box-shadow: inset 0 0 0 1px var(--gold-light) !important;
}
body.single-product button.single_add_to_cart_button {
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  border-radius: 0 !important;
  padding: 14px 34px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer;
  transition: background-color .25s ease, transform .25s ease, box-shadow .25s ease;
}
body.single-product button.single_add_to_cart_button:hover {
  background: var(--gold-light) !important; border-color: var(--gold-light) !important;
  transform: translateY(-2px); box-shadow: 0 10px 24px rgba(139,105,20,0.28);
}

/* Apple Pay / Google Pay — aceeași lățime cu form.cart, sub buton */
body.single-product [class*="express-checkout"],
body.single-product [class*="payment-request"],
body.single-product [id*="express-checkout"] {
  max-width: 460px;
  margin: 4px 0 24px !important;
}

/* Categorie / meta — ascunsă (era rândul "Categorie: ..." plus un gol
   mare dedesubt, nu adăuga nimic util aici). */
body.single-product .product_meta {
  display: none !important;
}

/* ── Tabs (Ritual Description / Scent Notes / Botanical Formula /
   The Ritual / Reviews) ──
   Revenim la linia fină simplă, fără chenar/textură (arătau ca niște
   puncte albe ciudate — era grania texturii swirl la opacitate mică,
   plus un chenar dublu care nu ținea de restul brandului). Doar o
   linie subțire dedesubt, ca-n restul site-ului.
   Golul de deasupra: eliminat complet margin/padding/border-top de pe
   .woocommerce-tabs — bara vine imediat după butoanele de plată. */
body.single-product .woocommerce-tabs {
  grid-column: 1 / -1;
  margin-top: 44px !important;
  padding-top: 0 !important;
  border-top: none !important;
}
/* Bara de tab-uri, redesenată: un rând de navigare cu adevărat, nu
   text aruncat pe pagină — padding vertical uniform, aliniere
   verticală centrată, spațiere consistentă. */
body.single-product div.product.type-product ul.tabs.wc-tabs,
body.single-product ul.tabs.wc-tabs {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 30px;
  list-style: none !important;
  list-style-type: none !important;
  list-style-image: none !important;
  margin: 0 0 34px !important;
  padding: 0 0 14px !important;
  border: none !important;
  border-bottom: 1px solid rgba(201, 169, 92, 0.35) !important;
}
/* Linia tot ieșea crem/albă — semn că regula temei pentru border-bottom
   câștiga în continuare. Repetăm cu specificitate maximă (lanțul complet
   .woocommerce-tabs > ul.tabs.wc-tabs, ca în markup-ul real) și
   blocăm și un eventual separator desenat prin :before/:after, nu doar
   prin border. */
body.single-product .woocommerce-tabs ul.tabs.wc-tabs,
body.single-product div.product.type-product .woocommerce-tabs ul.tabs.wc-tabs {
  border: none !important;
  border-bottom: 1px solid rgba(201, 169, 92, 0.35) !important;
}
body.single-product .woocommerce-tabs ul.tabs.wc-tabs::before,
body.single-product .woocommerce-tabs ul.tabs.wc-tabs::after {
  display: none !important;
  content: none !important;
  border: none !important;
}
body.single-product div.product.type-product ul.tabs.wc-tabs li,
body.single-product ul.tabs.wc-tabs li {
  margin: 0 !important; padding: 0 !important;
  background: none !important; border: none !important;
  list-style: none !important;
  position: relative;
}
/* Punctele/liniile albe care tot reveneau: WooCommerce inserează
   implicit un separator "•" între tab-uri prin li::after (nu doar
   ::before). Blocăm toate pseudo-elementele posibile, pe toate
   selectoarele, cu specificitate mai mare decât regula temei. */
body.single-product div.product.type-product ul.tabs.wc-tabs li::before,
body.single-product div.product.type-product ul.tabs.wc-tabs li::after,
body.single-product div.product.type-product ul.tabs.wc-tabs li::marker,
body.single-product ul.tabs.wc-tabs li::before,
body.single-product ul.tabs.wc-tabs li::after,
body.single-product ul.tabs.wc-tabs li::marker {
  content: none !important;
  display: none !important;
}
/* Renunțat și la fundalul solid — orice cutie în jurul textului (chiar
   și dreptunghiulară) tot arăta străin de restul paginii. Rămâne doar
   text: categoria activă e pur și simplu aurie și bold, fără fundal,
   fără cutie — cea mai simplă variantă, cea mai aproape de restul
   site-ului (unde accentul e mereu doar culoare/italic, niciodată o
   formă nouă). */
body.single-product ul.tabs.wc-tabs li a {
  display: inline-flex;
  align-items: center;
  padding: 10px 2px;
  font-family: "Jost", sans-serif;
  font-size: 0.76rem; letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500;
  color: var(--biscuit);
  position: relative;
  transition: color .25s ease;
}
body.single-product ul.tabs.wc-tabs li a::before,
body.single-product ul.tabs.wc-tabs li a::after {
  content: none !important;
  display: none !important;
}
body.single-product ul.tabs.wc-tabs li a:hover { color: var(--cream); }
/* Contur albastru de focus (implicit de browser, apărea la click pe
   tab) + orice alt marcaj/iconiță moștenită de la temă — eliminate. */
body.single-product ul.tabs.wc-tabs li a,
body.single-product ul.tabs.wc-tabs li a:focus,
body.single-product ul.tabs.wc-tabs li a:focus-visible,
body.single-product ul.tabs.wc-tabs li a:active {
  outline: none !important;
  box-shadow: none !important;
  -webkit-tap-highlight-color: transparent !important;
  text-decoration: none !important;
}
body.single-product ul.tabs.wc-tabs li.active a {
  color: var(--gold-light) !important;
  font-weight: 700;
  outline: none !important;
  box-shadow: none !important;
}

/* "Why You'll Love It" — acum e o sub-secțiune în interiorul tab-ului
   Ritual Description, nu tab separat. */
body.single-product .azi-why-love-inline {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid var(--line);
}
body.single-product .azi-why-love-inline h4 {
  font-size: 1.05rem; font-style: italic; color: var(--gold-light); margin: 0 0 16px;
}
body.single-product .woocommerce-Tabs-panel {
  max-width: 760px;
  animation: aziTabFadeIn .45s ease;
}
@keyframes aziTabFadeIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  body.single-product .woocommerce-Tabs-panel { animation: none; }
}

/* ── Tab-uri noi: Scent Profile / Botanical Formula ──
   H3 = titlul secțiunii (o singură dată pe tab) — rămâne accentul auriu.
   H4 = fiecare ingredient în parte (Bergamot, Ylang-Ylang, Soy Wax...) —
   repetat de multe ori pe pagină, așa că NU mai e tot auriu (era motivul
   principal pentru care pagina părea "prea aurie"). Acum e crem simplu,
   cu o liniuță aurie, subțire, deasupra — accentul rămâne, fără să
   domine textul. */
body.single-product .woocommerce-Tabs-panel--azi_scent_profile h3,
body.single-product .woocommerce-Tabs-panel--azi_botanical_formula h3 {
  font-size: 1.4rem; font-style: italic; color: var(--gold-light); margin: 0 0 12px;
}
body.single-product .woocommerce-Tabs-panel--azi_scent_profile h4,
body.single-product .woocommerce-Tabs-panel--azi_botanical_formula h4 {
  font-size: 1.05rem; font-style: italic; color: var(--cream);
  margin: 26px 0 8px; padding-top: 20px; border-top: 1px solid rgba(201, 169, 92, 0.3);
}
body.single-product .woocommerce-Tabs-panel--azi_scent_profile p,
body.single-product .woocommerce-Tabs-panel--azi_botanical_formula p {
  font-size: 0.92rem; color: var(--biscuit); line-height: 1.8; margin-bottom: 4px;
}

/* ── Why You'll Love It — cea mai citită secțiune, checklist clar ── */
body.single-product .azi-love-list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: 1fr 1fr; gap: 18px 30px;
}
body.single-product .azi-love-list li {
  position: relative; padding-left: 30px;
  font-family: "Cormorant Garamond", serif; font-size: 1.15rem; color: var(--cream);
}
body.single-product .azi-love-list li::before {
  content: "✓"; position: absolute; left: 0; top: 0;
  color: var(--gold-light); font-weight: 700; font-family: "Jost", sans-serif;
}
@media (max-width: 600px) {
  body.single-product .azi-love-list { grid-template-columns: 1fr; }
}

/* ── How to Use It — pași numerotați, cerc auriu ── */
body.single-product .azi-howto-list {
  margin: 0; padding: 0; list-style: none; counter-reset: azi-step;
}
body.single-product .azi-howto-list li {
  position: relative; padding-left: 42px; margin-bottom: 18px;
  font-size: 0.92rem; color: var(--biscuit); line-height: 1.7;
}
body.single-product .azi-howto-list li:last-child { margin-bottom: 0; }
body.single-product .azi-howto-list li::before {
  counter-increment: azi-step; content: counter(azi-step);
  position: absolute; left: 0; top: -2px;
  width: 24px; height: 24px; border: 1px solid var(--gold);
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-family: "Jost", sans-serif; font-size: 0.75rem; color: var(--gold-light);
}

/* Descriere — restructurăm vizual textul lung (H2 + paragraf pentru
   fiecare ingredient) fără să schimbăm conținutul: fiecare H2 devine
   un mic reper vizual (linie subțire deasupra + culoare aurie),
   paragraful capătă spațiere generoasă. */
body.single-product .woocommerce-Tabs-panel--description h2 {
  font-size: 1.15rem;
  font-style: italic;
  color: var(--gold-light);
  margin: 32px 0 10px;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}
body.single-product .woocommerce-Tabs-panel--description h2:first-child {
  margin-top: 0; padding-top: 0; border-top: none;
  font-size: 1.4rem;
}
body.single-product .woocommerce-Tabs-panel--description p {
  font-size: 0.92rem;
  color: var(--biscuit);
  line-height: 1.8;
  margin-bottom: 4px;
}
body.single-product .woocommerce-Tabs-panel--description hr {
  border: none;
  border-top: 1px solid var(--line);
  margin: 34px 0;
}

/* ── Tab Recenzii — era 100% formularul default WordPress (fundal alb,
   text negru, stele de browser) și nu avea nicio treabă cu brandul.
   Recolorat integral: fundal întunecat, tipografie de site, stele
   aurii, buton identic cu restul site-ului. ── */
body.single-product #reviews,
body.single-product .woocommerce-Reviews {
  color: var(--biscuit);
}
body.single-product #reviews #comments > h2,
body.single-product #reviews .woocommerce-Reviews-title {
  font-family: "Cormorant Garamond", serif;
  font-style: italic; font-weight: 400;
  font-size: 1.4rem; color: var(--gold-light);
  margin: 0 0 18px;
}
body.single-product #reviews .woocommerce-noreviews {
  font-family: "Jost", sans-serif;
  font-size: 0.92rem; color: var(--biscuit);
  margin-bottom: 22px;
}
body.single-product #reviews ol.commentlist {
  list-style: none; margin: 0 0 30px; padding: 0;
}
/* Chenarul tot apărea — încercarea anterioară (border pe li/
   comment_container/.review) n-a fost destul de specifică sau nu era
   elementul potrivit. De data asta resetăm ORICE element din interiorul
   unei recenzii (*), nu doar containerul principal, plus toate
   variantele de nume de clasă posibile din markup-ul WooCommerce. */
body.single-product #reviews .commentlist li,
body.single-product #reviews .commentlist li *,
body.single-product #reviews .commentlist li .comment_container,
body.single-product #reviews .commentlist li .comment-text,
body.single-product #reviews .commentlist li .description,
body.single-product #reviews .commentlist .review {
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: none !important;
}
body.single-product #reviews .commentlist > li {
  border-bottom: 1px solid var(--line) !important;
  background: transparent !important;
  padding: 22px 0 !important;
  margin: 0 !important;
}
/* Nu încărcăm poze de profil — iconița implicită (Gravatar "mystery
   person") cu chenar alb nu ține de brand și nu adaugă nimic. O scoatem
   complet, nu doar chenarul, și recuperăm spațiul din stânga textului. */
body.single-product #reviews .commentlist li img.avatar {
  display: none !important;
}
body.single-product #reviews .commentlist .comment-text {
  color: var(--biscuit);
  margin-left: 0 !important;
  padding-left: 0 !important;
}
body.single-product #reviews .commentlist .woocommerce-review__author {
  color: var(--cream); font-weight: 600; font-style: normal;
}
body.single-product #reviews .commentlist .woocommerce-review__dash,
body.single-product #reviews .commentlist .woocommerce-review__published-date {
  color: var(--biscuit); opacity: 0.7;
}
body.single-product #reviews .commentlist .description p { color: var(--biscuit); line-height: 1.75; }
body.single-product #reviews .star-rating { color: var(--gold-light); }
body.single-product #reviews .star-rating::before { color: rgba(232, 220, 200, 0.25); }
body.single-product #reviews .star-rating span::before { color: var(--gold-light); }

/* Formularul "Adaugă o recenzie" */
body.single-product #review_form_wrapper #respond {
  background: transparent; margin: 0; padding: 0;
}
body.single-product #reply-title {
  font-family: "Cormorant Garamond", serif; font-style: italic; font-weight: 400;
  font-size: 1.25rem; color: var(--gold-light); margin: 0 0 6px;
}
body.single-product #reply-title small a { color: var(--biscuit); }
body.single-product .comment-notes,
body.single-product .comment-form-rating label,
body.single-product .comment-form-comment label {
  font-family: "Jost", sans-serif; font-size: 0.78rem;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--biscuit); display: block; margin-bottom: 10px;
}
body.single-product .comment-form-rating { margin-bottom: 20px; }
/* Stelele de rating din formular — WooCommerce le desenează cu o
   iconiță-font peste linkuri <a>; le colorăm auriu în loc de negrul
   implicit de browser. */
body.single-product .comment-form-rating p.stars a {
  color: rgba(232, 220, 200, 0.35);
  transition: color .2s ease;
  outline: none !important;
  box-shadow: none !important;
}
body.single-product .comment-form-rating p.stars a:before {
  color: inherit;
}
/* WooCommerce marchează activ DOAR steaua pe care ai dat click (nu și
   pe cele dinainte), deci stelele 1-4 rămâneau gri când alegeai 5.
   .azi-star-filled e adăugată de un mic script (azi-product-tabs.php)
   pe steaua aleasă ȘI pe toate cele dinaintea ei, ca un rating normal. */
body.single-product .comment-form-rating p.stars a:hover,
body.single-product .comment-form-rating p.stars a.active,
body.single-product .comment-form-rating p.stars a.azi-star-filled,
body.single-product .comment-form-rating p.stars.selected a.active,
body.single-product .comment-form-rating p.stars a:hover ~ a {
  color: var(--gold-light);
}
body.single-product #comment,
body.single-product .comment-form-comment textarea {
  width: 100%; box-sizing: border-box;
  background: var(--bg-soft) !important;
  border: 1px solid var(--line) !important;
  color: var(--cream) !important;
  font-family: "Jost", sans-serif; font-size: 0.92rem; line-height: 1.7;
  padding: 14px 16px; min-height: 130px; border-radius: 0;
  outline: none; box-shadow: none;
}
body.single-product #comment:focus,
body.single-product .comment-form-comment textarea:focus {
  border-color: var(--gold) !important;
}
body.single-product .comment-form input[type="text"],
body.single-product .comment-form input[type="email"] {
  width: 100%; box-sizing: border-box;
  background: var(--bg-soft) !important;
  border: 1px solid var(--line) !important;
  color: var(--cream) !important;
  font-family: "Jost", sans-serif; font-size: 0.9rem;
  padding: 12px 14px; border-radius: 0; outline: none;
}
body.single-product .comment-form input[type="text"]:focus,
body.single-product .comment-form input[type="email"]:focus {
  border-color: var(--gold) !important;
}
body.single-product .comment-form-author,
body.single-product .comment-form-email {
  display: inline-block; width: calc(50% - 10px); vertical-align: top;
}
body.single-product .comment-form-author { margin-right: 20px; }
@media (max-width: 480px) {
  body.single-product .comment-form-author,
  body.single-product .comment-form-email { width: 100%; margin-right: 0; }
}
body.single-product .form-submit { margin-top: 18px; }
body.single-product .form-submit input#submit {
  background: var(--gold) !important;
  color: var(--bg) !important;
  border: 1px solid var(--gold) !important;
  border-radius: 0 !important;
  padding: 14px 34px !important;
  font-family: "Jost", sans-serif !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  font-weight: 700 !important;
  cursor: pointer;
  transition: background-color .25s ease, transform .25s ease;
}
body.single-product .form-submit input#submit:hover {
  background: var(--gold-light) !important; border-color: var(--gold-light) !important;
  transform: translateY(-2px);
}

/* ── Produse similare (identic cu grid-ul de pe Shop) ── */
body.single-product .related.products {
  grid-column: 1 / -1;
  margin-top: 50px;
  padding-top: 40px;
  border-top: 1px solid var(--line);
}
body.single-product .related.products > h2 {
  font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase;
  font-family: "Jost", sans-serif; font-weight: 700; color: var(--biscuit);
  margin: 0 0 24px; font-style: normal;
}
body.single-product .related.products ul.products {
  display: flex !important; flex-wrap: wrap; gap: 28px;
  list-style: none !important; margin: 0 !important; padding: 0 !important;
}
body.single-product .related.products ul.products li.product {
  width: 260px !important; max-width: 260px;
  margin: 0 !important;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, rgba(196,168,130,0.04), transparent);
  padding: 0 0 26px !important;
  text-align: center;
  transition: border-color .3s, transform .3s;
  position: relative;
  float: none !important;
  overflow: hidden;
}
body.single-product .related.products ul.products li.product:hover { border-color: var(--gold); transform: translateY(-4px); }
body.single-product .related.products ul.products li.product img {
  width: 100%; height: 240px; object-fit: contain;
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5));
  padding: 20px; box-sizing: border-box;
  border-bottom: 1px solid var(--line);
  margin: 0 0 20px !important; border-radius: 0 !important;
}
body.single-product .related.products ul.products li.product .woocommerce-loop-product__title {
  font-size: 1.25rem; font-weight: 400; color: var(--cream); margin: 0 18px 8px !important; padding: 0 !important;
}
body.single-product .related.products ul.products li.product .price {
  font-family: "Jost", sans-serif; font-size: 0.85rem; margin-bottom: 16px; display: block;
}
/* Stelele de rating (apar automat când un produs are recenzii) vin
   implicit cu float:left din WooCommerce, deci ies din centrarea
   cardului — le centrăm ca pe restul textului. */
body.single-product .related.products ul.products li.product .star-rating {
  float: none !important;
  display: block !important;
  margin: 4px auto 10px !important;
}
body.single-product .related.products ul.products li.product a.button,
body.single-product .related.products ul.products li.product a.add_to_cart_button {
  display: inline-block; background: transparent; color: var(--cream);
  border: 1px solid var(--gold); padding: 11px 24px;
  font-size: 0.68rem; letter-spacing: 0.14em; text-transform: uppercase; font-weight: 700;
  font-family: "Jost", sans-serif; transition: background .3s, color .3s;
}
body.single-product .related.products ul.products li.product a.button:hover,
body.single-product .related.products ul.products li.product a.add_to_cart_button:hover {
  background: var(--gold); color: var(--bg);
}
body.single-product .related.products .onsale { display: none; }

/* Fix iconița de wishlist de pe "Produse similare" — arăta neterminată
   pentru că stilul ei era definit doar pentru pagina Shop
   (body.woocommerce-shop), nu și pentru single-product. Aceeași regulă,
   doar retargetată. */
body.single-product .azi-wishlist-btn {
  position: absolute !important; top: 14px; right: 14px; z-index: 5;
  width: 36px; height: 36px; border-radius: 50%;
  background: rgba(5,4,5,0.7) !important; border: 1px solid rgba(232,220,200,0.3) !important;
  display: flex !important; align-items: center; justify-content: center; cursor: pointer;
  transition: border-color .3s, background .3s; padding: 0; margin: 0;
  -webkit-appearance: none; appearance: none; -webkit-tap-highlight-color: transparent;
}
body.single-product .azi-wishlist-btn svg {
  width: 18px; height: 18px; fill: none !important;
  stroke: var(--cream) !important; stroke-width: 2 !important;
  stroke-linecap: round; stroke-linejoin: round;
  display: block !important;
}
body.single-product .azi-wishlist-btn:hover { border-color: var(--gold) !important; background: rgba(5,4,5,0.85) !important; }
body.single-product .azi-wishlist-btn.azi-active { border-color: var(--gold) !important; }
body.single-product .azi-wishlist-btn.azi-active svg { fill: var(--gold-light) !important; stroke: var(--gold-light) !important; }

/* Logo cu glow, la fel ca pe restul site-ului */
body.single-product .logo-mark img { animation: aziFlameGlowLogo 3.6s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { body.single-product .logo-mark img { animation: none; } }
/* AZI — reduce spațiul dintre ticker-ul de ingrediente și Ritual Deck.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva.
   ȘTERSĂ 29 iulie 2026 (runda 5) — vezi nota de la finalul fișierului:
   body.page-id-42 #deck { padding-top: 0 !important; } */
body.page-id-42 .section-alt { padding-bottom: 6px !important; }

/* AZI — poza produsului pe Home (candle-visual) umple tot cadrul, la fel
   ca pe Shop, fără textura swirl din spate. Doar background-ul se
   schimbă — restul (border, dimensiune, centrare) rămâne neatins.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-visual {
  background: radial-gradient(ellipse at 50% 35%, rgba(196,168,130,0.10), rgba(5,4,5,0.5)) !important;
}

/* AZI — numele lumânărilor (Zen Aura / Reconnect / Inner Calm) în
   italic, mai cald/feminin — ține de aceeași familie de fonturi
   (Cormorant Garamond) deja folosită, doar stilul devine italic.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card h3 {
  font-style: italic !important;
}

/* AZI — ascunde linkul "ACCOUNT" din header (desktop + meniu mobil)
   pentru vizitatori nelogați; apare doar după ce te loghezi. WordPress
   adaugă automat clasa "logged-in" pe <body> când ești autentificată —
   folosim doar asta, fără PHP, deci zero risc de buclă/crash.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body:not(.logged-in) .header-icons a[href*="my-account"],
body:not(.logged-in) .mobile-nav a[href*="my-account"] {
  display: none !important;
}

/* AZI — simetric: ascunde linkul "LOGIN" din header (desktop + meniu
   mobil) când ești deja logată — rămâne doar ACCOUNT. Aceeași tehnică,
   doar condiția inversată.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.logged-in .header-icons a[href*="/login/"],
body.logged-in .mobile-nav a[href*="/login/"] {
  display: none !important;
}

/* AZI — butoanele EN/RO din header arătau asimetric (unul plin auriu,
   celălalt cu un contur — era focus ring-ul implicit al browser-ului
   după click, nu stilul tău). Le facem identice indiferent de focus.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .lang-toggle button {
  outline: none !important;
  box-shadow: none !important;
}
body.page-id-42 .lang-toggle button.active {
  background: var(--gold) !important;
  color: var(--bg) !important;
}

/* AZI — centrează butonul "Try the Ritual" sub fiecare lumânare.
   Titlul și textul de descriere rămân neatinse (tot aliniate la
   stânga ca înainte) — se centrează doar linkul.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .candle-card .try-link {
  display: block;
  width: fit-content;
  margin: 0 auto;
}

/* AZI — UPDATE 29 iulie 2026, runda 2 (Home) — de aici în jos sunt
   patch-uri noi, adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din
   ce există deja. */

/* Stil pentru noua linie scurtă ("Let go gently." / "Lasă totul să
   plece ușor.") adăugată în fiecare candle-card, între numele
   lumânării și descrierea lungă. Element complet nou — nu exista
   până acum, deci nu suprascrie nimic. */
body.page-id-42 .candle-card .candle-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 10px;
}

/* Eticheta "Made with" / "Preparat cu" de deasupra bandei de
   ingrediente — moștenește stilul de la .eyebrow (deja definit),
   doar o centrăm și îi dăm puțin spațiu dedesubt. */
body.page-id-42 .made-with-label {
  display: block;
  text-align: center;
  margin: 0 0 14px;
}

/* Repară spațiul dintre secțiunea de ingrediente și "Alege-ți
   ritualul" (Ritual Deck) — patch-ul anterior (#deck padding-top:0)
   le lipise complet.
   ȘTERSĂ 29 iulie 2026 (runda 5) — 96px nu se potrivea cu spațiul
   din Journal și arăta disproporționat (sus/jos inegal). Vezi nota
   de la finalul fișierului pentru fix-ul corect.
body.page-id-42 #deck {
  padding-top: 96px !important;
} */

/* Ticker-ul de ingrediente trebuie să ruleze continuu, fără gol la
   final. Lista din HTML e deja dublată (16 span-uri = 8 ingrediente
   x2) exact ca să poată bucla perfect — aici doar garantăm animația:
   track-ul se mută -50% la nesfârșit, iar la -50% a doua jumătate
   (identică cu prima) ajunge exact unde a pornit prima, deci nu se
   vede nicio tăietură. Dacă exista deja o animație pe .marquee-track
   mai sus în Additional CSS, aceasta câștigă fiindcă e mai jos. */
body.page-id-42 .marquee-wrap {
  overflow: hidden !important;
  width: 100% !important;
}
body.page-id-42 .marquee-track {
  display: flex !important;
  width: max-content !important;
  animation: aziMarqueeScroll 26s linear infinite !important;
}
@keyframes aziMarqueeScroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

/* AZI — UPDATE 29 iulie 2026, runda 3 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Centrează cele 3 texte din fiecare candle-card (nume, linia scurtă,
   descrierea) — erau aliniate la stânga și arătau disproporționat.
   Butonul "Try the Ritual" e deja centrat separat, mai sus. */
body.page-id-42 .candle-card h3,
body.page-id-42 .candle-card .candle-tagline,
body.page-id-42 .candle-card > p {
  text-align: center;
}

/* Numele lumânărilor (Zen Aura / Reconnect / Inner Calm) — bold, pe
   lângă italicul deja aplicat mai sus. */
body.page-id-42 .candle-card h3 {
  font-weight: 700 !important;
}

/* Stil pentru noua linie scurtă din secțiunea de Ingrediente
   ("A ritual that begins with a flame." / "Un ritual care începe cu o
   flacără."), aceeași familie vizuală ca .candle-tagline. */
body.page-id-42 .section-head .section-tagline {
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-style: italic;
  font-size: 1.05rem;
  color: var(--gold-light);
  margin: 6px 0 4px;
}
/* Notă: clasa .section-tagline de mai sus nu mai e folosită acum
   (textul respectiv a devenit titlul h2 de mai jos), dar o las aici
   ca să nu șterg regulă fără să fi fost rugată explicit — nu strică
   nimic fiind neutilizată. */

/* AZI — UPDATE 29 iulie 2026, runda 4 (Home) — de aici în jos, patch-uri
   noi adăugate DUPĂ tot ce e mai sus. Nu șterge nimic din ce există. */

/* Noul titlu al secțiunii de Ingrediente ("A ritual that begins with
   a flame." / "Un ritual care începe cu o flacără.") — scris cu alb,
   nu cu culoarea crem folosită de celelalte titluri h2. */
body.page-id-42 .section-title-white {
  color: #ffffff !important;
}

/* AZI — UPDATE 29 iulie 2026, runda 5 (Home) — IMPORTANT, necesită
   acțiune manuală din partea ta (nu doar paste):

   Zona "Alege-ți ritualul" (cardul cu "Trage un ritual") arăta cu
   spațiu inegal sus/jos față de Jurnalul AZI. Cauza: am adăugat eu
   două reguli pentru #deck în rundele anterioare (padding-top: 0,
   apoi padding-top: 96px) ca să reduc/reface un gol. Niciuna nu se
   potrivea cu spațiul natural pe care Journal îl are (Journal nu are
   nicio regulă specială — folosește doar spațiul implicit din tema
   ta, de-asta arată corect).

   Ca #deck să aibă exact același ritm ca Journal, cel mai simplu și
   sigur e să ȘTERGI manual din Additional CSS (Customizer) cele două
   linii vechi legate de #deck padding-top (le-am marcat mai sus, tăiate
   cu comentariu — caută "#deck" ca să le găsești rapid). Odată șterse,
   #deck rămâne fără nicio regulă proprie de padding și moștenește
   automat același spațiu implicit ca Journal — deci devine centrat,
   fără să mai ghicesc o valoare în pixeli. */

/* AZI — UPDATE 29 iulie 2026, runda 6 — fum vizibil doar pe primul
   ecran (screenshot confirmă: pata de fum se oprește exact unde se
   termină prima "pagină" vizibilă, restul defilării nu mai are fum).

   Cauza aproape sigură: canvas-ul #page-smoke-canvas e dimensionat
   la window.innerHeight (un singur ecran), iar poziționarea lui
   actuală (necunoscută mie — nu era în regula CSS pe care am cerut-o)
   e probabil "absolute" sau "static", deci rămâne "lipit" de începutul
   paginii și nu te urmărește când derulezi mai jos.

   Fix: îl facem "fixed" pe tot ecranul (100vw x 100vh), ca un fundal
   care rămâne mereu vizibil, indiferent unde ești derulat pe pagină —
   e tehnica standard pentru fundaluri ambientale de genul ăsta.

   ATENȚIE — nu știu z-index-ul corect din contextul tău actual (ce
   regulă exista deja pentru #page-smoke-canvas), deci -1 e o
   presupunere rezonabilă (îl pune în spatele conținutului, ca
   fundal). Te rog încearcă și spune-mi ce vezi:
   - dacă fumul dispare complet (nu se mai vede deloc) → z-index e
     prea mic, trebuie urcat puțin (ex: 1, dar sub restul textului)
   - dacă fumul acoperă textul/butoanele → z-index e prea mare,
     trebuie coborât
   pointer-events:none e sigur oricum — canvas-ul ăsta nu are nevoie
   de interacțiune cu mouse-ul (spre deosebire de liquid-ether-canvas
   din hero, care rămâne neatins).

   UPDATE — dacă ai testat regula de mai jos și tot nu s-a schimbat
   nimic: aproape sigur regula ta veche pentru #page-smoke-canvas e
   scrisă cu un selector mai "specific" (ex: body.page-id-42
   #page-smoke-canvas), la fel ca toate celelalte reguli din acest
   fișier — iar în CSS, un selector mai specific câștigă mereu în
   fața unuia mai simplu, indiferent de !important sau de ordine.
   Regula simplă #page-smoke-canvas de mai jos pierde în fața ei.
   Am întărit selectorul mai jos ca să câștige garantat, indiferent
   ce scrie regula veche. */
#page-smoke-canvas#page-smoke-canvas {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: -1 !important;
  pointer-events: none !important;
}

/* AZI — UPDATE 29 iulie 2026, runda 7 — cauza reală a fumului care
   "se oprește".

   Am verificat CSS-ul tău live: regula #page-smoke-canvas era deja
   fixed, pe tot ecranul, cu z-index:-1 — exact ce am cerut eu mai sus,
   deci fix-ul din runda 6 n-a schimbat nimic (era deja corect, de-asta
   "still the same"). Nu e o problemă de poziționare.

   Cauza reală: secțiunile cu fundal propriu (.section-alt — folosită
   la Ingrediente, Discover Tea, Jurnal) pictează un fundal SOLID
   deasupra oricărui element cu z-index negativ — așa funcționează
   normal stivuirea în CSS. Canvas-ul de fum e corect și acoperă toată
   pagina, dar rămâne "ascuns" sub orice bandă cu fundal propriu.

   Fix ales: păstrăm z-index-ul fumului neatins (rămâne mereu în spate,
   nu ajunge niciodată peste text/butoane), dar facem fundalul benzii
   puțin transparent — 88%, aproape imperceptibil — cât să se vadă o
   urmă de fum prin spate, la fel ca-n restul paginii.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
body.page-id-42 .section-alt {
  background: color-mix(in srgb, var(--bg-soft) 88%, transparent) !important;
}

/* AZI — UPDATE 29 iulie 2026, runda 8 — cauza reală a spațiului
   inegal de la #deck (Alege-ți ritualul), găsită în CSS-ul de bază
   al temei (nu în patch-urile mele):

   body.page-id-42 section { padding: 30px 0; }
   body.page-id-42 #deck { padding-top: 14px; }

   #deck are deja o regulă proprie ÎN CSS-UL ORIGINAL care îi reduce
   padding-top-ul la 14px, în timp ce Jurnalul AZI (fără nicio regulă
   specială) rămâne la cei 30px impliciți din regula generică de mai
   sus. Asta explică de ce ștergerea patch-urilor mele (runda 5) nu
   ar fi fost suficientă — tot ar fi rămas 14px sus vs. 30px la Jurnal.

   Fix: suprascriem #deck înapoi la 30px, ca să fie identic cu Jurnalul.
   Aceasta câștigă automat în fața oricăror duplicate vechi ale
   patch-urilor mele din Additional CSS (indiferent câte copii mai
   există), pentru că e ultima regulă cu aceeași specificitate din
   fișier — nu mai e nevoie să vânezi și să ștergi manual duplicatele
   ca să vezi efectul. Paste la finalul Additional CSS existent. */
body.page-id-42 #deck {
  padding-top: 30px !important;
}

/* AZI — UPDATE 30 iulie 2026, runda 9 (Shop) — de când un produs are
   prima recenzie, WooCommerce afișează automat stelele sub titlu, în
   grila de produse. Stelele vin implicit cu float:left din CSS-ul de
   bază WooCommerce, deci ies din centrarea textului (titlu/preț/buton
   sunt centrate, dar stelele rămân lipite de stânga). Le centrăm și pe
   ele, la fel ca restul cardului. Paste la finalul Additional CSS. */
body.woocommerce-shop ul.products li.product .star-rating {
  float: none !important;
  display: block !important;
  margin: 6px auto 8px !important;
}
/* ==========================================================================
   AZI — 30 iulie: Shop se mută sub Discover, Legal sub Your Ritual (o
   singură coloană fiecare pereche, text stivuit vertical), ca Newsletter
   să primească mai mult spațiu în dreapta. Merge cu noul
   footer-sitewide-widget.html (Discover+Shop și Your Ritual+Legal sunt
   acum grupate în câte un <div class="footer-col-group">).

   Paste la FINALUL Additional CSS (după tot ce ai pus deja pentru footer,
   inclusiv footer-fix-page-overrides.css) — nu șterge nimic altceva.
   Rescrie DOAR grid-ul footerului (4 coloane acum, nu 6) + adaugă stivuirea
   pe verticală în interiorul fiecărui .footer-col-group.
   ========================================================================== */

/* varianta nescopată — paginile fără regulă veche pe pagină (ex: Rituals,
   Login) folosesc direct asta */
footer .footer-top {
  display: grid;
  grid-template-columns: 1fr 0.75fr 0.8fr 1.65fr;
  gap: 32px;
  padding: 70px 0 50px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 30px;
}

footer .footer-col-group {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* aceleași reguli, dar repetate pentru paginile care au încă regula veche
   scopată pe pagină (specificitate mai mare) — Home, Shop, Journal,
   Account, Cart, Wishlist, single-product */
body.page-id-18 .footer-top,
body.page-id-20 .footer-top,
body.page-id-42 .footer-top,
body.page-id-122 .footer-top,
body.woocommerce-shop .footer-top,
body.page-id-552 .footer-top,
body.single-product .footer-top {
  display: grid;
  grid-template-columns: 1fr 0.75fr 0.8fr 1.65fr;
  gap: 32px;
  padding: 70px 0 50px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 30px;
}

body.page-id-18 .footer-col-group,
body.page-id-20 .footer-col-group,
body.page-id-42 .footer-col-group,
body.page-id-122 .footer-col-group,
body.woocommerce-shop .footer-col-group,
body.page-id-552 .footer-col-group,
body.single-product .footer-col-group {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

@media (max-width: 980px) {
  footer .footer-top,
  body.page-id-18 .footer-top,
  body.page-id-20 .footer-top,
  body.page-id-42 .footer-top,
  body.page-id-122 .footer-top,
  body.woocommerce-shop .footer-top,
  body.page-id-552 .footer-top,
  body.single-product .footer-top {
    grid-template-columns: 1fr 1fr;
    row-gap: 40px;
  }
  footer .footer-brand,
  body.page-id-18 .footer-brand,
  body.page-id-20 .footer-brand,
  body.page-id-42 .footer-brand,
  body.page-id-122 .footer-brand,
  body.woocommerce-shop .footer-brand,
  body.page-id-552 .footer-brand,
  body.single-product .footer-brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  footer .footer-top,
  body.page-id-18 .footer-top,
  body.page-id-20 .footer-top,
  body.page-id-42 .footer-top,
  body.page-id-122 .footer-top,
  body.woocommerce-shop .footer-top,
  body.page-id-552 .footer-top,
  body.single-product .footer-top {
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 50px 0 36px;
  }
}
/* ==========================================================================
   AZI — 30 iulie, versiune consolidată. Textul din stânga (brand) a
   dispărut din nou pentru că regula veche "body.page-id-XX .footer-brand
   { display:none }" a rămas activă — asta a împins Newsletter într-o
   coloană greșită (mai îngustă), de-aici dezechilibrul.

   Acest fișier conține TOT ce trebuie pentru footer (grid + brand vizibil +
   stivuire Discover/Shop și Your Ritual/Legal), într-un singur loc, ca să
   nu mai conteze ce s-a lipit sau nu înainte. Paste-l la FINALUL Additional
   CSS — nu șterge nimic altceva. Coloanele Discover/Shop și Your Ritual/
   Legal sunt acum egale ca lățime, iar Newsletter e mai lată, ca bara de
   email + buton să încapă pe un singur rând.
   ========================================================================== */

footer .footer-top,
body.page-id-18 .footer-top,
body.page-id-20 .footer-top,
body.page-id-42 .footer-top,
body.page-id-122 .footer-top,
body.woocommerce-shop .footer-top,
body.page-id-552 .footer-top,
body.single-product .footer-top {
  display: grid;
  grid-template-columns: 0.85fr 0.72fr 0.72fr 1.75fr;
  gap: 32px;
  padding: 70px 0 50px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 30px;
}

footer .footer-brand,
body.page-id-18 .footer-brand,
body.page-id-20 .footer-brand,
body.page-id-42 .footer-brand,
body.page-id-122 .footer-brand,
body.woocommerce-shop .footer-brand,
body.page-id-552 .footer-brand,
body.single-product .footer-brand {
  display: block;
}

footer .footer-col-group,
body.page-id-18 .footer-col-group,
body.page-id-20 .footer-col-group,
body.page-id-42 .footer-col-group,
body.page-id-122 .footer-col-group,
body.woocommerce-shop .footer-col-group,
body.page-id-552 .footer-col-group,
body.single-product .footer-col-group {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

/* bara de newsletter — email + buton pe un singur rând, fără trunchiere */
footer .newsletter-form input[type="email"] {
  min-width: 200px;
}

@media (max-width: 980px) {
  footer .footer-top,
  body.page-id-18 .footer-top,
  body.page-id-20 .footer-top,
  body.page-id-42 .footer-top,
  body.page-id-122 .footer-top,
  body.woocommerce-shop .footer-top,
  body.page-id-552 .footer-top,
  body.single-product .footer-top {
    grid-template-columns: 1fr 1fr;
    row-gap: 40px;
  }
  footer .footer-brand,
  body.page-id-18 .footer-brand,
  body.page-id-20 .footer-brand,
  body.page-id-42 .footer-brand,
  body.page-id-122 .footer-brand,
  body.woocommerce-shop .footer-brand,
  body.page-id-552 .footer-brand,
  body.single-product .footer-brand {
    grid-column: 1 / -1;
  }
}

@media (max-width: 700px) {
  footer .footer-top,
  body.page-id-18 .footer-top,
  body.page-id-20 .footer-top,
  body.page-id-42 .footer-top,
  body.page-id-122 .footer-top,
  body.woocommerce-shop .footer-top,
  body.page-id-552 .footer-top,
  body.single-product .footer-top {
    grid-template-columns: 1fr;
    gap: 36px;
    padding: 50px 0 36px;
  }
}
/* ==========================================================================
   AZI — 30 iulie: centrează textul de brand din stânga + aliniază Shop
   cu Legal pe același rând (Discover are doar 2 linkuri, Your Ritual are
   4, deci Shop apărea mai sus decât Legal — îl împing în jos exact cât
   diferența de 2 linkuri).
   Paste la finalul Additional CSS. Merge cu clasa nouă "footer-col-shop"
   adăugată pe div-ul Shop din footer-sitewide-widget.html.
   ========================================================================== */

footer .footer-brand p {
  text-align: center;
}

footer .footer-col-shop {
  margin-top: 62px;
}
/* ==========================================================================
   AZI — 30 iulie: centrează textul de brand din stânga + aliniază Shop
   cu Legal pe același rând (Discover are doar 2 linkuri, Your Ritual are
   4, deci Shop apărea mai sus decât Legal — îl împing în jos exact cât
   diferența de 2 linkuri).
   Paste la finalul Additional CSS. Merge cu clasa nouă "footer-col-shop"
   adăugată pe div-ul Shop din footer-sitewide-widget.html.
   ========================================================================== */

footer .footer-brand {
  align-self: center;
}

footer .footer-brand p {
  text-align: center;
}

footer .footer-col-shop {
  margin-top: 62px;
}
/* ==========================================================================
   AZI — 31 iulie: aliniere robustă Discover/Shop/Your Ritual/Legal, care
   nu se mai strică indiferent de limbă (RO/EN au lungimi de text diferite,
   deci un offset fix în pixeli — cum am folosit înainte pentru Shop — se
   dezaliniază quando textul se rupe altfel pe alt rând).

   În loc de asta, footer-top devine un grid ADEVĂRAT cu 2 rânduri:
   rândul 1 = Discover + Your Ritual (aceeași înălțime, deci pornesc
   mereu exact de la același nivel), rândul 2 = Shop + Legal (la fel).
   Brand (stânga) și Newsletter (dreapta) ocupă ambele rânduri, centrate.

   Acest fișier conține TOT ce trebuie — paste-l la finalul Additional CSS,
   nu șterge nimic altceva. Suprascrie/completează fișierele de footer de
   dinainte (e normal, e ultimul din listă și câștigă).
   ========================================================================== */

footer .footer-top,
body.page-id-18 .footer-top,
body.page-id-20 .footer-top,
body.page-id-42 .footer-top,
body.page-id-122 .footer-top,
body.woocommerce-shop .footer-top,
body.page-id-552 .footer-top,
body.single-product .footer-top {
  display: grid;
  grid-template-columns: 0.85fr 0.72fr 0.72fr 1.75fr;
  grid-template-rows: auto auto;
  column-gap: 32px;
  row-gap: 28px;
  padding: 70px 0 50px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 30px;
}

footer .footer-col-group,
body.page-id-18 .footer-col-group,
body.page-id-20 .footer-col-group,
body.page-id-42 .footer-col-group,
body.page-id-122 .footer-col-group,
body.woocommerce-shop .footer-col-group,
body.page-id-552 .footer-col-group,
body.single-product .footer-col-group {
  display: contents;
}

footer .footer-brand,
body.page-id-18 .footer-brand,
body.page-id-20 .footer-brand,
body.page-id-42 .footer-brand,
body.page-id-122 .footer-brand,
body.woocommerce-shop .footer-brand,
body.page-id-552 .footer-brand,
body.single-product .footer-brand {
  display: block;
  grid-column: 1;
  grid-row: 1 / 3;
  align-self: center;
}

/* Discover = primul .footer-col din primul grup */
footer .footer-col-group:first-of-type > .footer-col:first-child {
  grid-column: 2;
  grid-row: 1;
}

/* Shop = al doilea .footer-col din primul grup */
footer .footer-col-shop {
  grid-column: 2;
  grid-row: 2;
  margin-top: 0;
}

/* Your Ritual = primul .footer-col din al doilea grup */
footer .footer-col-group:last-of-type > .footer-col:first-child {
  grid-column: 3;
  grid-row: 1;
}

/* Legal = al doilea .footer-col din al doilea grup */
footer .footer-col-group:last-of-type > .footer-col:last-child {
  grid-column: 3;
  grid-row: 2;
}

footer .footer-newsletter {
  grid-column: 4;
  grid-row: 1 / 3;
}

@media (max-width: 980px) {
  footer .footer-top,
  body.page-id-18 .footer-top,
  body.page-id-20 .footer-top,
  body.page-id-42 .footer-top,
  body.page-id-122 .footer-top,
  body.woocommerce-shop .footer-top,
  body.page-id-552 .footer-top,
  body.single-product .footer-top {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto auto auto;
    row-gap: 36px;
  }
  footer .footer-brand,
  body.page-id-18 .footer-brand,
  body.page-id-20 .footer-brand,
  body.page-id-42 .footer-brand,
  body.page-id-122 .footer-brand,
  body.woocommerce-shop .footer-brand,
  body.page-id-552 .footer-brand,
  body.single-product .footer-brand {
    grid-column: 1 / -1;
    grid-row: 1;
  }
  footer .footer-col-group:first-of-type > .footer-col:first-child {
    grid-column: 1;
    grid-row: 2;
  }
  footer .footer-col-shop {
    grid-column: 1;
    grid-row: 3;
  }
  footer .footer-col-group:last-of-type > .footer-col:first-child {
    grid-column: 2;
    grid-row: 2;
  }
  footer .footer-col-group:last-of-type > .footer-col:last-child {
    grid-column: 2;
    grid-row: 3;
  }
  footer .footer-newsletter {
    grid-column: 1 / -1;
    grid-row: 4;
  }
}

@media (max-width: 700px) {
  footer .footer-top,
  body.page-id-18 .footer-top,
  body.page-id-20 .footer-top,
  body.page-id-42 .footer-top,
  body.page-id-122 .footer-top,
  body.woocommerce-shop .footer-top,
  body.page-id-552 .footer-top,
  body.single-product .footer-top {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    row-gap: 36px;
    padding: 50px 0 36px;
  }
  footer .footer-brand,
  footer .footer-col-group:first-of-type > .footer-col:first-child,
  footer .footer-col-shop,
  footer .footer-col-group:last-of-type > .footer-col:first-child,
  footer .footer-col-group:last-of-type > .footer-col:last-child,
  footer .footer-newsletter {
    grid-column: 1;
    grid-row: auto;
  }
}
/* ==========================================================================
   AZI — 31 iulie, fix real. Regulile din footer-grid-align-final.css
   foloseau ":first-of-type" / ":last-of-type", care se calculează după
   eticheta HTML (div), nu după clasă — cum .footer-brand e primul div
   din footer, ".footer-col-group:first-of-type" nu se potrivea NICIODATĂ
   cu nimic. De-asta alinierea nu se schimba, indiferent de ce lipeai.

   Fix: selectoare bazate pe "vecinul imediat" (+), care nu depind de
   eticheta HTML, doar de ordinea reală a elementelor:
   - primul .footer-col-group = cel care vine imediat după .footer-brand
   - al doilea .footer-col-group = cel care vine imediat după alt
     .footer-col-group

   Paste la FINALUL Additional CSS — nu șterge nimic altceva (înlocuiește
   funcțional regulile din footer-grid-align-final.css, care rămân acolo
   dar nu se mai activau oricum).
   ========================================================================== */

footer .footer-brand + .footer-col-group > .footer-col:first-child {
  grid-column: 2;
  grid-row: 1;
}

footer .footer-col-shop {
  grid-column: 2;
  grid-row: 2;
  margin-top: 0;
}

footer .footer-col-group + .footer-col-group > .footer-col:first-child {
  grid-column: 3;
  grid-row: 1;
}

footer .footer-col-group + .footer-col-group > .footer-col:last-child {
  grid-column: 3;
  grid-row: 2;
}

@media (max-width: 980px) {
  footer .footer-brand + .footer-col-group > .footer-col:first-child {
    grid-column: 1;
    grid-row: 2;
  }
  footer .footer-col-shop {
    grid-column: 1;
    grid-row: 3;
  }
  footer .footer-col-group + .footer-col-group > .footer-col:first-child {
    grid-column: 2;
    grid-row: 2;
  }
  footer .footer-col-group + .footer-col-group > .footer-col:last-child {
    grid-column: 2;
    grid-row: 3;
  }
}

@media (max-width: 700px) {
  footer .footer-brand + .footer-col-group > .footer-col:first-child,
  footer .footer-col-shop,
  footer .footer-col-group + .footer-col-group > .footer-col:first-child,
  footer .footer-col-group + .footer-col-group > .footer-col:last-child {
    grid-column: 1;
    grid-row: auto;
  }
}
/* ==========================================================================
   AZI — DESIGN SYSTEM FOUNDATION (31 iulie 2026)

   Ce e acest fișier: un strat de TOKENS (variabile CSS) + câteva CLASE NOI,
   opționale, construite din valorile care deja există live pe site.

   Ce NU e acest fișier: nu redesenează nimic, nu suprascrie nicio clasă
   existentă, nu schimbă nimic vizual dacă doar îl adaugi la finalul
   Additional CSS. Fiecare token de mai jos e un alias pentru o valoare deja
   folosită undeva pe site (verificat prin extragere automată din Additional
   CSS + toate widget-urile paginilor statice). Zero pixeli se mută.

   De unde vin numerele: din analiza a 2.479 de reguli CSS reale, adunate din
   azi-additional-css-CURRENT.css (fișierul din Customizer, ~13.200 linii,
   fostul tău paste) + candle-care-widget.html + contact/faqs/privacy/
   shipping/terms/ritual-guide WIDGET + homepage-v7.3-updated.html +
   footer-sitewide-widget.html + rituals/journal-page-updated.html +
   widget-urile mici de shop/cart/login/account/wishlist.

   Cum se folosește:
   1. Paste ACEST fișier la finalul Additional CSS existent (Customizer) —
      nu șterge nimic altceva. E sigur: nu conține niciun selector care
      suprascrie ceva ce există deja (fără !important, fără clase reciclate).
   2. De acum încolo, orice patch NOU (element nou, pagină nouă) ar trebui
      să folosească aceste variabile / clase în loc să inventeze o valoare
      nouă de zero. Codul existent NU trebuie umblat retroactiv.
   3. Vezi AZI-Design-System-Audit.md pentru inconsistențele găsite și o
      listă separată, opțională, de fix-uri mici care AR schimba ceva
      vizual (de aceea nu sunt incluse aici).
   ========================================================================== */


/* ==========================================================================
   1. CULORI
   Site-ul are, de fapt, DOUĂ seturi de token-uri de culoare deja în
   producție, cu nume diferite pentru valori apropiate dar nu identice:
   - familia "shop-flow" (Home/Shop/Cart/Account/Rituals/Journal/Login/
     Wishlist) — definită în :root-ul din Additional CSS.
   - familia "editorial" (Candle Care/Contact/FAQ/Privacy/Terms/Shipping/
     Ritual Guide) — definită local, în fiecare widget Custom HTML.
   Mai jos le păstrez pe amândouă (nimic nu se schimbă), doar le pun unele
   lângă altele ca să se vadă clar unde se suprapun și unde nu.
   Detalii + recomandare în raportul de audit, secțiunea "Culori".
   ========================================================================== */
:root {
  /* --- familia shop-flow (așa cum e azi în Additional CSS :root) --- */
  --azi-black: #09080a;
  --azi-gold: #C9A95C;
  --azi-cream: #E8DCC8;
  --azi-muted: rgba(232, 220, 200, 0.62);
  --azi-line: rgba(201, 169, 92, 0.18);

  /* --- familia editorial (așa cum e azi în cele 7 pagini statice) --- */
  --azi-editorial-gold: #C9A95C;          /* "gold" principal pe pag. editoriale */
  --azi-editorial-gold-light: #C9A95C;    /* == --azi-gold de mai sus */
  --azi-editorial-biscuit: #a69c8d;
  --azi-editorial-cream: #E8DCC8;         /* == --azi-cream de mai sus */
  --azi-editorial-bg: #09080a;            /* == --azi-black de mai sus */
  --azi-editorial-line: rgba(232, 220, 200, 0.14);

  /* --- variantă de negru mai adânc, folosită pe splash-ul "coming soon" --- */
  --azi-bg-deep: #050405;

  /* --- glow-uri / accente per colecție (din candle-visual, flame etc.) --- */
  --azi-glow-gold: rgba(201, 169, 92, 0.5);
  --azi-glow-terracotta: rgba(184, 91, 32, 0.22);
}


/* ==========================================================================
   2. TIPOGRAFIE
   Fonturile de bază sunt deja perfect consistente pe tot site-ul: Cormorant
   Garamond (serif, titluri) + Jost (sans, body/label-uri). Singura mică
   deriva e stack-ul de fallback (Georgia vs fără Georgia, Arial vs fără
   Arial) — unificat aici, fără efect vizibil (fallback-ul contează doar
   dacă fontul din @import nu se încarcă).
   ========================================================================== */
:root {
  --azi-font-serif: "Cormorant Garamond", Georgia, serif;
  --azi-font-sans: "Jost", Arial, sans-serif;

  /* --- greutăți (deja o scală curată, 5 valori, folosită peste tot) --- */
  --azi-weight-light: 300;
  --azi-weight-regular: 400;
  --azi-weight-medium: 500;
  --azi-weight-semibold: 600;
  --azi-weight-bold: 700;

  /* --- corp de text — cele mai folosite dimensiuni, de la caption la lead --- */
  --azi-text-2xs: 0.6rem;    /* ex: ingredient-pill::after */
  --azi-text-xs: 0.7rem;     /* ex: nav, candle-num */
  --azi-text-sm: 0.75rem;    /* ex: newsletter-form button, candle-num */
  --azi-text-sm-plus: 0.8rem;
  --azi-text-base-sm: 0.85rem;  /* ex: ingredient-pill, newsletter input */
  --azi-text-base: 0.9rem;      /* ex: woocommerce inputs */
  --azi-text-md: 1rem;          /* ex: mobile-nav a */
  --azi-text-lg: 1.1rem;
  --azi-text-xl: 1.2rem;
  --azi-text-2xl: 1.35rem;   /* ex: journal-card h4 */
  --azi-text-3xl: 1.5rem;    /* ex: candle-card h3 */

  /* --- titluri mari, responsive — valorile reale deja folosite --- */
  --azi-h1-display: clamp(2.2rem, 5vw, 3.6rem);       /* Home — .hero h1 */
  --azi-h1-shop: clamp(2.375rem, 5vw, 3.8125rem);      /* Shop — .shop-hero h1 (cel mai mare din site) */
  --azi-h1-editorial: clamp(38px, 4.6vw, 54px);        /* Contact/FAQ/Candle Care/Ritual Guide */
  --azi-h2-section: clamp(1.8rem, 3.4vw, 2.6rem);      /* Home — .section-head h2 */

  /* --- letter-spacing — scală reală, de la titluri compacte la eyebrow-uri --- */
  --azi-tracking-tight: 0.02em;
  --azi-tracking-snug: 0.06em;
  --azi-tracking-base: 0.08em;   /* nav */
  --azi-tracking-wide: 0.1em;
  --azi-tracking-wider: 0.14em;
  --azi-tracking-widest: 0.18em; /* .btn */
  --azi-tracking-eyebrow: 0.32em;

  /* --- line-height — cele mai folosite valori --- */
  --azi-leading-tight: 1.1;
  --azi-leading-snug: 1.4;
  --azi-leading-normal: 1.6;
  --azi-leading-relaxed: 1.7;
  --azi-leading-loose: 1.75;
}


/* ==========================================================================
   3. SPAȚIERE
   Scala de mai jos conține DOAR valori care apar deja de minimum 10 ori în
   Additional CSS / widget-uri (deci nu invit valori noi, doar le numesc pe
   cele reale). Pentru muncă nouă, preferă pasul cel mai apropiat din listă
   în loc de o valoare inventată.
   ========================================================================== */
:root {
  --azi-space-1: 4px;
  --azi-space-2: 6px;
  --azi-space-3: 8px;
  --azi-space-4: 10px;
  --azi-space-5: 12px;
  --azi-space-6: 14px;
  --azi-space-7: 16px;
  --azi-space-8: 18px;
  --azi-space-9: 20px;
  --azi-space-10: 22px;
  --azi-space-11: 24px;
  --azi-space-12: 26px;
  --azi-space-13: 28px;
  --azi-space-14: 30px;
  --azi-space-15: 32px;
  --azi-space-16: 36px;
  --azi-space-17: 40px;
  --azi-space-18: 50px;
  --azi-space-19: 56px;
  --azi-space-20: 70px;
  --azi-space-21: 90px;
}


/* ==========================================================================
   4. CONTAINERE / LĂȚIMI DE CONȚINUT
   --azi-container e lățimea dominantă a site-ului (.wrap, folosit de 15x
   mai des decât orice altă valoare). --azi-container-footer există separat
   pentru că footer-ul chiar folosește azi o valoare ușor diferită — vezi
   raportul de audit pentru recomandarea de aliniere (opțională).
   ========================================================================== */
:root {
  --azi-container: 1180px;          /* .wrap — Home/Shop/Cart/Account/etc. */
  --azi-container-footer: 1200px;   /* footer .wrap — vezi audit */
  --azi-content-narrow: 480px;      /* ex: hero p.sub */
  --azi-content-medium: 620px;      /* ex: .section-head */
  --azi-content-wide: 780px;        /* ex: .shop-hero h1 */
  --azi-content-editorial: 720px;   /* ex: .guide-wrap pe paginile statice */
}


/* ==========================================================================
   5. BREAKPOINTS (referință)
   CSS custom properties nu pot fi folosite direct în interiorul unui
   @media (...) fără preprocesor, așa că le documentăm aici ca referință,
   nu ca variabile funcționale. Sunt cele 4 praguri dominante găsite — restul
   (700/760/767/768/600/640px etc.) sunt variații apropiate ale acelorași
   praguri, acumulate din patch-uri succesive. Nu le unificăm automat (ar
   însemna să reașezi breakpoint-uri pe zeci de reguli existente — risc de
   layout shift) — vezi audit pentru cum se face asta treptat, doar la
   nevoie viitoare.

   --azi-bp-xs:  480px   (praguri mici / telefon îngust)
   --azi-bp-sm:  680px   (pragul mobil dominant — 124 apariții)
   --azi-bp-md:  880px   (pragul tabletă dominant — 49 apariții)
   --azi-bp-lg:  980px   (pragul desktop-nav dominant — 61 apariții)
   ========================================================================== */


/* ==========================================================================
   6. RAZĂ COLȚURI (border-radius)
   Deja o scală curată — doar 10 valori distincte pe tot site-ul, dintre
   care 2 sunt cazuri speciale (candle-visual, flame) și nu intră în scală.
   ========================================================================== */
:root {
  --azi-radius-none: 0;
  --azi-radius-sm: 2px;    /* checkout / contact-form / faq-form inputs */
  --azi-radius-md: 4px;    /* blockUI overlay */
  --azi-radius-lg: 14px;   /* lang-toggle button */
  --azi-radius-xl: 20px;   /* lang-toggle wrapper */
  --azi-radius-full: 50%;  /* cercuri — hero-glow, badge-uri */
}


/* ==========================================================================
   7. UMBRE
   Umbrele reale de pe site sunt legate de culoarea accentului fiecărei
   colecții (auriu, teracotă etc.), deci nu le forțăm într-o singură umbră
   generică — păstrăm structura (offset/blur), culoarea rămâne per context.
   ========================================================================== */
:root {
  --azi-shadow-none: none;
  --azi-shadow-hover: 0 10px 24px rgba(139, 105, 20, 0.28);            /* .btn:hover — cel mai folosit hover glow */
  --azi-shadow-panel: 0 16px 40px rgba(0, 0, 0, 0.55), 0 0 0 1px var(--azi-line);  /* dropdown-uri / My Account */
  --azi-shadow-toast: 0 14px 34px rgba(0, 0, 0, 0.45);                  /* mesaje woocommerce */
}


/* ==========================================================================
   8. TRANZIȚII
   "background .3s, color .3s" și "background .3s ease, color .3s ease"
   sunt identice (ease e implicit) — doar formatate diferit de-a lungul
   timpului. Token-urile de mai jos numesc cele 3 durate reale folosite.
   ========================================================================== */
:root {
  --azi-transition-fast: 0.25s ease;
  --azi-transition-base: 0.3s ease;
  --azi-transition-slow: 0.4s ease;
}


/* ==========================================================================
   9. Z-INDEX
   Scală reală, din header/nav/drawer/toast — numită, nu schimbată.
   ========================================================================== */
:root {
  --azi-z-base: 1;
  --azi-z-hero-logo: 2;
  --azi-z-badge: 5;
  --azi-z-header: 100;
  --azi-z-scrim: 150;
  --azi-z-nav: 200;
  --azi-z-toast: 500;
  --azi-z-modal: 999;
  --azi-z-drawer: 9998;
  --azi-z-drawer-top: 9999;
  --azi-z-critical: 99999;
}


/* ==========================================================================
   10. CLASE NOI, OPȚIONALE — TIPOGRAFIE
   Nu ating niciun h1-h4 existent (sunt refolosite pe multe pagini pentru
   lucruri foarte diferite ca mărime — vezi audit). În loc să for țez o
   singură mărime pe toate tag-urile h1-h4 (risc mare de layout shift), ofer
   clase separate, de aplicat manual pe elemente NOI.
   Verificat: niciuna din clasele .azi-h1/.azi-h2/.azi-h3/.azi-h4/.azi-body/
   .azi-small/.azi-caption nu există deja pe site — zero coliziune.
   ========================================================================== */
.azi-h1 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-h1-display);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-tight);
  letter-spacing: var(--azi-tracking-tight);
}

.azi-h2 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-h2-section);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-tight);
}

.azi-h3 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-text-3xl);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-snug);
}

.azi-h4 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-text-2xl);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-snug);
}

.azi-body-lg {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-lg);
  font-weight: var(--azi-weight-light);
  line-height: var(--azi-leading-relaxed);
}

.azi-body {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base);
  font-weight: var(--azi-weight-light);
  line-height: var(--azi-leading-normal);
}

.azi-small {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base-sm);
  font-weight: var(--azi-weight-light);
  line-height: var(--azi-leading-normal);
}

.azi-caption {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-xs);
  font-weight: var(--azi-weight-medium);
  letter-spacing: var(--azi-tracking-base);
  text-transform: uppercase;
}


/* ==========================================================================
   11. CLASE NOI, OPȚIONALE — BUTOANE
   Modelate 1:1 pe reț eta reală a .btn de pe Home (deja live, deja
   aprobată) — nu inventez un stil nou, doar îl fac reutilizabil sub un nume
   care nu se ciocnește cu nimic ("azi-btn" nu există încă pe site).
   Pentru butoane WooCommerce native (cart, checkout, my account) NU
   înlocui clasele lor — acelea au deja propriul stil, ușor diferit per
   pagină (vezi audit). Folosește .azi-btn doar pe elemente noi, în afara
   fluxului WooCommerce.
   ========================================================================== */
.azi-btn {
  display: inline-block;
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-sm-plus);
  font-weight: var(--azi-weight-bold);
  letter-spacing: var(--azi-tracking-widest);
  text-transform: uppercase;
  padding: var(--azi-space-9) var(--azi-space-16);
  border: 1px solid var(--azi-gold);
  background: transparent;
  color: var(--azi-cream);
  border-radius: var(--azi-radius-none);
  transition: transform var(--azi-transition-base), box-shadow var(--azi-transition-base), color var(--azi-transition-base);
  cursor: pointer;
}

.azi-btn:hover {
  box-shadow: var(--azi-shadow-hover);
}

.azi-btn--solid {
  background: var(--azi-gold);
  color: var(--azi-black);
}

.azi-btn--solid:hover {
  background: var(--azi-editorial-gold-light);
}

.azi-btn--ghost:hover {
  background: rgba(139, 105, 20, 0.12);
}

.azi-btn--link {
  display: inline-block;
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base-sm);
  font-weight: var(--azi-weight-medium);
  letter-spacing: var(--azi-tracking-wide);
  color: var(--azi-cream);
  border: none;
  background: none;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--azi-transition-base);
}

.azi-btn--link:hover {
  color: var(--azi-gold);
}


/* ==========================================================================
   12. CLASE NOI, OPȚIONALE — FORMULARE
   Modelate pe rețeta dominantă (fundal transparent, bordură var(--line),
   padding 12px 14px, colț drept). Radius rămâne 0 — e recipe-ul folosit pe
   marea majoritate a formularelor site-ului (WooCommerce, newsletter).
   ========================================================================== */
.azi-field {
  display: flex;
  flex-direction: column;
  gap: var(--azi-space-2);
  margin-bottom: var(--azi-space-8);
}

.azi-label {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-xs);
  letter-spacing: var(--azi-tracking-wider);
  text-transform: uppercase;
  color: var(--azi-muted);
}

.azi-input,
.azi-textarea,
.azi-select {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base-sm);
  padding: var(--azi-space-5) var(--azi-space-6);
  background: transparent;
  border: 1px solid var(--azi-line);
  border-radius: var(--azi-radius-none);
  color: var(--azi-cream);
  transition: border-color var(--azi-transition-base);
}

.azi-input:hover,
.azi-textarea:hover,
.azi-select:hover {
  border-color: var(--azi-gold);
}

.azi-input:focus,
.azi-textarea:focus,
.azi-select:focus {
  outline: none;
  border-color: var(--azi-gold);
}

.azi-textarea {
  min-height: 140px;
  resize: vertical;
}


/* ==========================================================================
   13. CLASE NOI, OPȚIONALE — CARDURI
   Modelate pe rețeta comună la .candle-card / .tea-card / .azi-wishlist-card
   / .azi-wishlist-page-card, care sunt deja aproape identice între ele:
   bordură var(--line) + gradient subtil + tranziție pe hover.
   ========================================================================== */
.azi-card {
  border: 1px solid var(--azi-line);
  background: linear-gradient(180deg, rgba(196, 168, 130, 0.04), transparent);
  padding: var(--azi-space-15) var(--azi-space-13);
  transition: border-color var(--azi-transition-base), transform var(--azi-transition-base);
}

.azi-card:hover {
  border-color: var(--azi-gold);
}

.azi-card--tight {
  padding: var(--azi-space-9);
}

.azi-card--pad-lg {
  padding: var(--azi-space-13) var(--azi-space-15) var(--azi-space-12);
}


/* ==========================================================================
   14. CLASĂ NOUĂ, OPȚIONALĂ — CONTAINER
   Alias pentru .wrap, de folosit doar pe markup nou (nu înlocuiește .wrap
   existent, ca să nu riscăm nimic pe layout-urile deja live).
   ========================================================================== */
.azi-container {
  width: 100%;
  max-width: var(--azi-container);
  margin: 0 auto;
  padding: 0 var(--azi-space-9);
}
/* ==========================================================================
   AZI — DESIGN SYSTEM FOUNDATION (31 iulie 2026)

   Ce e acest fișier: un strat de TOKENS (variabile CSS) + câteva CLASE NOI,
   opționale, construite din valorile care deja există live pe site.

   Ce NU e acest fișier: nu redesenează nimic, nu suprascrie nicio clasă
   existentă, nu schimbă nimic vizual dacă doar îl adaugi la finalul
   Additional CSS. Fiecare token de mai jos e un alias pentru o valoare deja
   folosită undeva pe site (verificat prin extragere automată din Additional
   CSS + toate widget-urile paginilor statice). Zero pixeli se mută.

   De unde vin numerele: din analiza a 2.479 de reguli CSS reale, adunate din
   azi-additional-css-CURRENT.css (fișierul din Customizer, ~13.200 linii,
   fostul tău paste) + candle-care-widget.html + contact/faqs/privacy/
   shipping/terms/ritual-guide WIDGET + homepage-v7.3-updated.html +
   footer-sitewide-widget.html + rituals/journal-page-updated.html +
   widget-urile mici de shop/cart/login/account/wishlist.

   Cum se folosește:
   1. Paste ACEST fișier la finalul Additional CSS existent (Customizer) —
      nu șterge nimic altceva. E sigur: nu conține niciun selector care
      suprascrie ceva ce există deja (fără !important, fără clase reciclate).
   2. De acum încolo, orice patch NOU (element nou, pagină nouă) ar trebui
      să folosească aceste variabile / clase în loc să inventeze o valoare
      nouă de zero. Codul existent NU trebuie umblat retroactiv.
   3. Vezi AZI-Design-System-Audit.md pentru inconsistențele găsite și o
      listă separată, opțională, de fix-uri mici care AR schimba ceva
      vizual (de aceea nu sunt incluse aici).
   ========================================================================== */


/* ==========================================================================
   1. CULORI
   Site-ul are, de fapt, DOUĂ seturi de token-uri de culoare deja în
   producție, cu nume diferite pentru valori apropiate dar nu identice:
   - familia "shop-flow" (Home/Shop/Cart/Account/Rituals/Journal/Login/
     Wishlist) — definită în :root-ul din Additional CSS.
   - familia "editorial" (Candle Care/Contact/FAQ/Privacy/Terms/Shipping/
     Ritual Guide) — definită local, în fiecare widget Custom HTML.
   Mai jos le păstrez pe amândouă (nimic nu se schimbă), doar le pun unele
   lângă altele ca să se vadă clar unde se suprapun și unde nu.
   Detalii + recomandare în raportul de audit, secțiunea "Culori".
   ========================================================================== */
:root {
  /* --- familia shop-flow (așa cum e azi în Additional CSS :root) --- */
  --azi-black: #09080a;
  --azi-gold: #C9A95C;
  --azi-cream: #E8DCC8;
  --azi-muted: rgba(232, 220, 200, 0.62);
  --azi-line: rgba(201, 169, 92, 0.18);

  /* --- familia editorial (așa cum e azi în cele 7 pagini statice) --- */
  --azi-editorial-gold: #C9A95C;          /* "gold" principal pe pag. editoriale */
  --azi-editorial-gold-light: #C9A95C;    /* == --azi-gold de mai sus */
  --azi-editorial-biscuit: #a69c8d;
  --azi-editorial-cream: #E8DCC8;         /* == --azi-cream de mai sus */
  --azi-editorial-bg: #09080a;            /* == --azi-black de mai sus */
  --azi-editorial-line: rgba(232, 220, 200, 0.14);

  /* --- variantă de negru mai adânc, folosită pe splash-ul "coming soon" --- */
  --azi-bg-deep: #050405;

  /* --- glow-uri / accente per colecție (din candle-visual, flame etc.) --- */
  --azi-glow-gold: rgba(201, 169, 92, 0.5);
  --azi-glow-terracotta: rgba(184, 91, 32, 0.22);
}


/* ==========================================================================
   2. TIPOGRAFIE
   Fonturile de bază sunt deja perfect consistente pe tot site-ul: Cormorant
   Garamond (serif, titluri) + Jost (sans, body/label-uri). Singura mică
   deriva e stack-ul de fallback (Georgia vs fără Georgia, Arial vs fără
   Arial) — unificat aici, fără efect vizibil (fallback-ul contează doar
   dacă fontul din @import nu se încarcă).
   ========================================================================== */
:root {
  --azi-font-serif: "Cormorant Garamond", Georgia, serif;
  --azi-font-sans: "Jost", Arial, sans-serif;

  /* --- greutăți (deja o scală curată, 5 valori, folosită peste tot) --- */
  --azi-weight-light: 300;
  --azi-weight-regular: 400;
  --azi-weight-medium: 500;
  --azi-weight-semibold: 600;
  --azi-weight-bold: 700;

  /* --- corp de text — cele mai folosite dimensiuni, de la caption la lead --- */
  --azi-text-2xs: 0.6rem;    /* ex: ingredient-pill::after */
  --azi-text-xs: 0.7rem;     /* ex: nav, candle-num */
  --azi-text-sm: 0.75rem;    /* ex: newsletter-form button, candle-num */
  --azi-text-sm-plus: 0.8rem;
  --azi-text-base-sm: 0.85rem;  /* ex: ingredient-pill, newsletter input */
  --azi-text-base: 0.9rem;      /* ex: woocommerce inputs */
  --azi-text-md: 1rem;          /* ex: mobile-nav a */
  --azi-text-lg: 1.1rem;
  --azi-text-xl: 1.2rem;
  --azi-text-2xl: 1.35rem;   /* ex: journal-card h4 */
  --azi-text-3xl: 1.5rem;    /* ex: candle-card h3 */

  /* --- titluri mari, responsive — valorile reale deja folosite --- */
  --azi-h1-display: clamp(2.2rem, 5vw, 3.6rem);       /* Home — .hero h1 */
  --azi-h1-shop: clamp(2.375rem, 5vw, 3.8125rem);      /* Shop — .shop-hero h1 (cel mai mare din site) */
  --azi-h1-editorial: clamp(38px, 4.6vw, 54px);        /* Contact/FAQ/Candle Care/Ritual Guide */
  --azi-h2-section: clamp(1.8rem, 3.4vw, 2.6rem);      /* Home — .section-head h2 */

  /* --- letter-spacing — scală reală, de la titluri compacte la eyebrow-uri --- */
  --azi-tracking-tight: 0.02em;
  --azi-tracking-snug: 0.06em;
  --azi-tracking-base: 0.08em;   /* nav */
  --azi-tracking-wide: 0.1em;
  --azi-tracking-wider: 0.14em;
  --azi-tracking-widest: 0.18em; /* .btn */
  --azi-tracking-eyebrow: 0.32em;

  /* --- line-height — cele mai folosite valori --- */
  --azi-leading-tight: 1.1;
  --azi-leading-snug: 1.4;
  --azi-leading-normal: 1.6;
  --azi-leading-relaxed: 1.7;
  --azi-leading-loose: 1.75;
}


/* ==========================================================================
   3. SPAȚIERE
   Scala de mai jos conține DOAR valori care apar deja de minimum 10 ori în
   Additional CSS / widget-uri (deci nu invit valori noi, doar le numesc pe
   cele reale). Pentru muncă nouă, preferă pasul cel mai apropiat din listă
   în loc de o valoare inventată.
   ========================================================================== */
:root {
  --azi-space-1: 4px;
  --azi-space-2: 6px;
  --azi-space-3: 8px;
  --azi-space-4: 10px;
  --azi-space-5: 12px;
  --azi-space-6: 14px;
  --azi-space-7: 16px;
  --azi-space-8: 18px;
  --azi-space-9: 20px;
  --azi-space-10: 22px;
  --azi-space-11: 24px;
  --azi-space-12: 26px;
  --azi-space-13: 28px;
  --azi-space-14: 30px;
  --azi-space-15: 32px;
  --azi-space-16: 36px;
  --azi-space-17: 40px;
  --azi-space-18: 50px;
  --azi-space-19: 56px;
  --azi-space-20: 70px;
  --azi-space-21: 90px;
}


/* ==========================================================================
   4. CONTAINERE / LĂȚIMI DE CONȚINUT
   --azi-container e lățimea dominantă a site-ului (.wrap, folosit de 15x
   mai des decât orice altă valoare). --azi-container-footer există separat
   pentru că footer-ul chiar folosește azi o valoare ușor diferită — vezi
   raportul de audit pentru recomandarea de aliniere (opțională).
   ========================================================================== */
:root {
  --azi-container: 1180px;          /* .wrap — Home/Shop/Cart/Account/etc. */
  --azi-container-footer: 1200px;   /* footer .wrap — vezi audit */
  --azi-content-narrow: 480px;      /* ex: hero p.sub */
  --azi-content-medium: 620px;      /* ex: .section-head */
  --azi-content-wide: 780px;        /* ex: .shop-hero h1 */
  --azi-content-editorial: 720px;   /* ex: .guide-wrap pe paginile statice */
}


/* ==========================================================================
   5. BREAKPOINTS (referință)
   CSS custom properties nu pot fi folosite direct în interiorul unui
   @media (...) fără preprocesor, așa că le documentăm aici ca referință,
   nu ca variabile funcționale. Sunt cele 4 praguri dominante găsite — restul
   (700/760/767/768/600/640px etc.) sunt variații apropiate ale acelorași
   praguri, acumulate din patch-uri succesive. Nu le unificăm automat (ar
   însemna să reașezi breakpoint-uri pe zeci de reguli existente — risc de
   layout shift) — vezi audit pentru cum se face asta treptat, doar la
   nevoie viitoare.

   --azi-bp-xs:  480px   (praguri mici / telefon îngust)
   --azi-bp-sm:  680px   (pragul mobil dominant — 124 apariții)
   --azi-bp-md:  880px   (pragul tabletă dominant — 49 apariții)
   --azi-bp-lg:  980px   (pragul desktop-nav dominant — 61 apariții)
   ========================================================================== */


/* ==========================================================================
   6. RAZĂ COLȚURI (border-radius)
   Deja o scală curată — doar 10 valori distincte pe tot site-ul, dintre
   care 2 sunt cazuri speciale (candle-visual, flame) și nu intră în scală.
   ========================================================================== */
:root {
  --azi-radius-none: 0;
  --azi-radius-sm: 2px;    /* checkout / contact-form / faq-form inputs */
  --azi-radius-md: 4px;    /* blockUI overlay */
  --azi-radius-lg: 14px;   /* lang-toggle button */
  --azi-radius-xl: 20px;   /* lang-toggle wrapper */
  --azi-radius-full: 50%;  /* cercuri — hero-glow, badge-uri */
}


/* ==========================================================================
   7. UMBRE
   Umbrele reale de pe site sunt legate de culoarea accentului fiecărei
   colecții (auriu, teracotă etc.), deci nu le forțăm într-o singură umbră
   generică — păstrăm structura (offset/blur), culoarea rămâne per context.
   ========================================================================== */
:root {
  --azi-shadow-none: none;
  --azi-shadow-hover: 0 10px 24px rgba(139, 105, 20, 0.28);            /* .btn:hover — cel mai folosit hover glow */
  --azi-shadow-panel: 0 16px 40px rgba(0, 0, 0, 0.55), 0 0 0 1px var(--azi-line);  /* dropdown-uri / My Account */
  --azi-shadow-toast: 0 14px 34px rgba(0, 0, 0, 0.45);                  /* mesaje woocommerce */
}


/* ==========================================================================
   8. TRANZIȚII
   "background .3s, color .3s" și "background .3s ease, color .3s ease"
   sunt identice (ease e implicit) — doar formatate diferit de-a lungul
   timpului. Token-urile de mai jos numesc cele 3 durate reale folosite.
   ========================================================================== */
:root {
  --azi-transition-fast: 0.25s ease;
  --azi-transition-base: 0.3s ease;
  --azi-transition-slow: 0.4s ease;
}


/* ==========================================================================
   9. Z-INDEX
   Scală reală, din header/nav/drawer/toast — numită, nu schimbată.
   ========================================================================== */
:root {
  --azi-z-base: 1;
  --azi-z-hero-logo: 2;
  --azi-z-badge: 5;
  --azi-z-header: 100;
  --azi-z-scrim: 150;
  --azi-z-nav: 200;
  --azi-z-toast: 500;
  --azi-z-modal: 999;
  --azi-z-drawer: 9998;
  --azi-z-drawer-top: 9999;
  --azi-z-critical: 99999;
}


/* ==========================================================================
   10. CLASE NOI, OPȚIONALE — TIPOGRAFIE
   Nu ating niciun h1-h4 existent (sunt refolosite pe multe pagini pentru
   lucruri foarte diferite ca mărime — vezi audit). În loc să for țez o
   singură mărime pe toate tag-urile h1-h4 (risc mare de layout shift), ofer
   clase separate, de aplicat manual pe elemente NOI.
   Verificat: niciuna din clasele .azi-h1/.azi-h2/.azi-h3/.azi-h4/.azi-body/
   .azi-small/.azi-caption nu există deja pe site — zero coliziune.
   ========================================================================== */
.azi-h1 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-h1-display);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-tight);
  letter-spacing: var(--azi-tracking-tight);
}

.azi-h2 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-h2-section);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-tight);
}

.azi-h3 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-text-3xl);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-snug);
}

.azi-h4 {
  font-family: var(--azi-font-serif);
  font-size: var(--azi-text-2xl);
  font-weight: var(--azi-weight-regular);
  line-height: var(--azi-leading-snug);
}

.azi-body-lg {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-lg);
  font-weight: var(--azi-weight-light);
  line-height: var(--azi-leading-relaxed);
}

.azi-body {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base);
  font-weight: var(--azi-weight-light);
  line-height: var(--azi-leading-normal);
}

.azi-small {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base-sm);
  font-weight: var(--azi-weight-light);
  line-height: var(--azi-leading-normal);
}

.azi-caption {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-xs);
  font-weight: var(--azi-weight-medium);
  letter-spacing: var(--azi-tracking-base);
  text-transform: uppercase;
}


/* ==========================================================================
   11. CLASE NOI, OPȚIONALE — BUTOANE
   Modelate 1:1 pe reț eta reală a .btn de pe Home (deja live, deja
   aprobată) — nu inventez un stil nou, doar îl fac reutilizabil sub un nume
   care nu se ciocnește cu nimic ("azi-btn" nu există încă pe site).
   Pentru butoane WooCommerce native (cart, checkout, my account) NU
   înlocui clasele lor — acelea au deja propriul stil, ușor diferit per
   pagină (vezi audit). Folosește .azi-btn doar pe elemente noi, în afara
   fluxului WooCommerce.
   ========================================================================== */
.azi-btn {
  display: inline-block;
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-sm-plus);
  font-weight: var(--azi-weight-bold);
  letter-spacing: var(--azi-tracking-widest);
  text-transform: uppercase;
  padding: var(--azi-space-9) var(--azi-space-16);
  border: 1px solid var(--azi-gold);
  background: transparent;
  color: var(--azi-cream);
  border-radius: var(--azi-radius-none);
  transition: transform var(--azi-transition-base), box-shadow var(--azi-transition-base), color var(--azi-transition-base);
  cursor: pointer;
}

.azi-btn:hover {
  box-shadow: var(--azi-shadow-hover);
}

.azi-btn--solid {
  background: var(--azi-gold);
  color: var(--azi-black);
}

.azi-btn--solid:hover {
  background: var(--azi-editorial-gold-light);
}

.azi-btn--ghost:hover {
  background: rgba(139, 105, 20, 0.12);
}

.azi-btn--link {
  display: inline-block;
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base-sm);
  font-weight: var(--azi-weight-medium);
  letter-spacing: var(--azi-tracking-wide);
  color: var(--azi-cream);
  border: none;
  background: none;
  padding: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color var(--azi-transition-base);
}

.azi-btn--link:hover {
  color: var(--azi-gold);
}


/* ==========================================================================
   12. CLASE NOI, OPȚIONALE — FORMULARE
   Modelate pe rețeta dominantă (fundal transparent, bordură var(--line),
   padding 12px 14px, colț drept). Radius rămâne 0 — e recipe-ul folosit pe
   marea majoritate a formularelor site-ului (WooCommerce, newsletter).
   ========================================================================== */
.azi-field {
  display: flex;
  flex-direction: column;
  gap: var(--azi-space-2);
  margin-bottom: var(--azi-space-8);
}

.azi-label {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-xs);
  letter-spacing: var(--azi-tracking-wider);
  text-transform: uppercase;
  color: var(--azi-muted);
}

.azi-input,
.azi-textarea,
.azi-select {
  font-family: var(--azi-font-sans);
  font-size: var(--azi-text-base-sm);
  padding: var(--azi-space-5) var(--azi-space-6);
  background: transparent;
  border: 1px solid var(--azi-line);
  border-radius: var(--azi-radius-none);
  color: var(--azi-cream);
  transition: border-color var(--azi-transition-base);
}

.azi-input:hover,
.azi-textarea:hover,
.azi-select:hover {
  border-color: var(--azi-gold);
}

.azi-input:focus,
.azi-textarea:focus,
.azi-select:focus {
  outline: none;
  border-color: var(--azi-gold);
}

.azi-textarea {
  min-height: 140px;
  resize: vertical;
}


/* ==========================================================================
   13. CLASE NOI, OPȚIONALE — CARDURI
   Modelate pe rețeta comună la .candle-card / .tea-card / .azi-wishlist-card
   / .azi-wishlist-page-card, care sunt deja aproape identice între ele:
   bordură var(--line) + gradient subtil + tranziție pe hover.
   ========================================================================== */
.azi-card {
  border: 1px solid var(--azi-line);
  background: linear-gradient(180deg, rgba(196, 168, 130, 0.04), transparent);
  padding: var(--azi-space-15) var(--azi-space-13);
  transition: border-color var(--azi-transition-base), transform var(--azi-transition-base);
}

.azi-card:hover {
  border-color: var(--azi-gold);
}

.azi-card--tight {
  padding: var(--azi-space-9);
}

.azi-card--pad-lg {
  padding: var(--azi-space-13) var(--azi-space-15) var(--azi-space-12);
}


/* ==========================================================================
   14. CLASĂ NOUĂ, OPȚIONALĂ — CONTAINER
   Alias pentru .wrap, de folosit doar pe markup nou (nu înlocuiește .wrap
   existent, ca să nu riscăm nimic pe layout-urile deja live).
   ========================================================================== */
.azi-container {
  width: 100%;
  max-width: var(--azi-container);
  margin: 0 auto;
  padding: 0 var(--azi-space-15); /* 0 32px — padding-ul real, desktop, al .wrap pe Home/Shop/etc. */
}

@media (max-width: 680px) {
  .azi-container {
    padding: 0 var(--azi-space-9); /* 0 20px — pasul real de la 480px pe .wrap; îl aducem un pic mai devreme, la 680px, ca să acopere și tabletele mici */
  }
}


/* ==========================================================================
   15. RESPONSIV — ce se schimbă pe mobil și ce NU

   Titlurile (.azi-h1/.azi-h2, plus --azi-h1-display/--azi-h1-shop/
   --azi-h1-editorial/--azi-h2-section) sunt deja responsive din construcție
   — sunt clamp(), deci curg fluid cu lățimea ecranului, fără să ai nevoie de
   @media separat. Asta e deja "varianta de mobil".

   Pentru ecrane foarte înguste (sub ~760px), site-ul are un al doilea prag,
   real, folosit azi doar pe Journal/Rituals (h1 trece de la
   clamp(38px, 5vw, 61px) la clamp(34px, 12vw, 48px) sub 760px, ca titlul să
   nu se lățească prea mult pe telefon). Dacă adaugi un titlu nou foarte
   lung pe mobil și clamp-ul de bază nu arată bine sub ~380px lățime,
   folosește aceeași tehnică — un al doilea clamp, mai agresiv, în
   @media (max-width: 760px), nu o valoare fixă în px.

   .azi-container e singura clasă nouă cu regulă de mobil explicită mai sus,
   pentru că e singurul tipar confirmat real pe site (.wrap își strânge
   padding-ul lateral pe ecrane mici — vezi audit). .azi-btn, .azi-card și
   .azi-input NU au regulă de mobil separată — verificat automat: niciun
   buton, card sau input de pe site nu are un padding diferit pe mobil față
   de desktop (dimensiunile lor sunt deja în rem, deci se adaptează fluid,
   fără @media). Nu am inventat una nouă ca să nu introducem un
   comportament care nu există nicăieri altundeva pe site.

   Praguri reale (aceleași ca în secțiunea 5):
   680px — pragul mobil dominant (header își strânge padding-ul aici, de la
           22px 40px la 18px 22px, identic pe toate cele 16 pagini verificate)
   480px — prag suplimentar, doar pentru .wrap (padding lateral 32px -> 20px)
   760px — prag folosit punctual pentru al doilea clamp pe titluri foarte mari
   ========================================================================== */
/* AZI — fix: prețul și subtotalul din Cart ies în afara ecranului pe mobil
   (confirmat cu Amada, 31 iulie 2026, captură de pe telefon real).
   Cauza: la ≤768px, .product-price și .product-subtotal au
   "flex: 0 0 100%" ȘI "margin-left: 76px" în aceeași regulă — asta le
   face automat cu 76px mai late decât rândul lor, deci coada prețului
   iese din ecran, în dreapta. Rândul de nume de produs, chiar deasupra,
   face corect: "flex: 1 1 calc(100% - 96px)". Aici doar aliniem prețul
   și subtotalul la același model corect, deja folosit alături.
   Paste la finalul Additional CSS existent — nu șterge nimic altceva. */
@media (max-width: 768px) {
  body.page-id-18 table.cart td.product-price {
    flex: 0 0 calc(100% - 76px) !important;
  }
  body.page-id-18 table.cart td.product-subtotal {
    flex: 0 0 calc(100% - 76px) !important;
  }
}
/* ══════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — RITUAL REDESIGN   */
/* 1 August 2026. Paste at the END of the existing Additional    */
/* CSS — don't remove anything else. Safe alongside the 9 older  */
/* Cart blocks already in the file: this one is last, so it wins */
/* on any selector clash without needing to touch the old rules. */
/*                                                                */
/* Covers: the new hero title (fade-ready), the new empty-cart    */
/* state, and a full rewrite of the mobile cart-row layout — the  */
/* old mobile fix only patched the price column; on a real phone  */
/* the whole row was overflowing (product name run off-screen,    */
/* price overlapping). This replaces the row layout outright      */
/* instead of patching it again.                                  */
/* ══════════════════════════════════════════════════════════ */

/* ---- Hero title -------------------------------------------------- */
body.page-id-18 .azi-cart-hero { text-align: center; padding: 56px 24px 40px; }
body.page-id-18 .azi-cart-eyebrow {
  display: block;
  font-family: 'Jost', sans-serif;
  font-size: 12px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #C9A95C;
  margin-bottom: 14px;
  opacity: .9;
}
body.page-id-18 #azi-cart-hero-title {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(32px, 5vw, 52px);
  color: #E8DCC8;
  margin: 0;
  transition: opacity .3s ease, transform .3s ease;
}
body.page-id-18 .azi-cart-hero.azi-fade #azi-cart-hero-title {
  opacity: 0;
  transform: translateY(4px);
}

/* ---- Empty cart state --------------------------------------------- */
body.page-id-18 .return-to-shop { display: none !important; }
body.page-id-18 .cart-empty { display: none !important; }
body.page-id-18 .azi-empty-cart {
  max-width: 480px;
  margin: 40px auto 80px;
  text-align: center;
  padding: 0 24px;
}
body.page-id-18 .azi-empty-cart h2 {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(28px, 4vw, 40px);
  color: #E8DCC8;
  margin: 0 0 16px;
}
body.page-id-18 .azi-empty-cart p {
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  font-size: 15px;
  line-height: 1.7;
  color: #C4A882;
  margin: 0 0 32px;
}
body.page-id-18 .azi-empty-cart-cta {
  display: inline-block;
  font-family: 'Jost', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #050405;
  background: #C9A95C;
  padding: 16px 40px;
  border-radius: 2px;
  text-decoration: none;
  transition: opacity .2s ease;
}
body.page-id-18 .azi-empty-cart-cta:hover { opacity: .85; }
body.page-id-18 .azi-empty-cart-product { margin-top: 56px; }
body.page-id-18 .azi-empty-cart-product a { text-decoration: none; display: block; }
body.page-id-18 .azi-empty-cart-product img {
  width: 140px;
  height: auto;
  margin: 0 auto 16px;
  display: block;
  border-radius: 2px;
}
body.page-id-18 .azi-ecp-name {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: 19px;
  color: #E8DCC8;
  margin-bottom: 4px;
}
body.page-id-18 .azi-ecp-price {
  display: block;
  font-family: 'Jost', sans-serif;
  font-size: 14px;
  color: #C9A95C;
}

/* ---- Mobile cart rows — full rewrite, not another patch --------- */
@media (max-width: 768px) {
  body.page-id-18 table.cart,
  body.page-id-18 table.cart tbody,
  body.page-id-18 table.cart tr.cart_item {
    display: block !important;
    width: 100% !important;
  }
  body.page-id-18 table.cart thead { display: none !important; }
  body.page-id-18 table.cart tr.cart_item {
    display: grid !important;
    grid-template-columns: 64px 1fr 28px;
    grid-template-areas:
      "thumb name remove"
      "thumb qty qty"
      "thumb subtotal subtotal";
    column-gap: 14px;
    row-gap: 8px;
    padding: 20px 0 !important;
    border-bottom: 1px solid rgba(232, 220, 200, .14) !important;
  }
  body.page-id-18 table.cart td {
    padding: 0 !important;
    border: 0 !important;
    flex: none !important;
    width: auto !important;
    max-width: none !important;
  }
  body.page-id-18 table.cart td.product-remove { grid-area: remove; text-align: right !important; }
  body.page-id-18 table.cart td.product-thumbnail { grid-area: thumb; }
  body.page-id-18 table.cart td.product-thumbnail img {
    width: 64px !important;
    height: auto !important;
    border-radius: 2px;
  }
  body.page-id-18 table.cart td.product-name { grid-area: name; font-size: 15px !important; }
  /* unit price hidden on mobile — subtotal below already shows the total,
     keeping it removes the exact overflow bug instead of patching it again */
  body.page-id-18 table.cart td.product-price { display: none !important; }
  body.page-id-18 table.cart td.product-quantity { grid-area: qty; }
  body.page-id-18 table.cart td.product-subtotal {
    grid-area: subtotal;
    text-align: left !important;
    font-weight: 700 !important;
    color: #C9A95C !important;
  }
}

/* AZI — fix: Cormorant Garamond renders a corrupted oversized ghost
   glyph for comma/p/g combinations at ~46-52px in the Cart hero title
   (confirmed: font-rendering bug, reproduced with both variable and
   static font files, independent of content/language — Arial never
   shows it, 40px never shows it, 46px+ does). Capping the size below
   the trigger avoids it without changing the font. Paste at the end
   of Additional CSS existing — nu sterge nimic altceva. */
body.page-id-18 #azi-cart-hero-title {
  font-size: clamp(28px, 4.5vw, 40px) !important;
}


/* ══════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — RITUAL REDESIGN v2 */
/* 1 August 2026. REPLACES the "RITUAL REDESIGN" block pasted      */
/* earlier today (starts with "AZI Rituals — Cart page             */
/* (body.page-id-18) — RITUAL REDESIGN" comment) — find that block  */
/* in Additional CSS and delete it, then paste this ENTIRE file at  */
/* the end instead. Don't touch the 9 older Cart blocks from before */
/* today — this still wins by being last in the file.               */
/*                                                                    */
/* Matches the reference mockup Amada sent: banner hero with a       */
/* product photo, visible table column headers, a bordered order-    */
/* summary card, a trust-badge row, a "thoughtfully prepared"        */
/* banner. Real brand fonts/colors used throughout, not the          */
/* mockup's generic ones (Cormorant Garamond + Jost, gold/cream/     */
/* black — same tokens as the rest of the site).                     */
/* ══════════════════════════════════════════════════════════ */

/* ---- Hero banner ---------------------------------------------------- */
body.page-id-18 .azi-cart-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 48px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 56px 24px;
}
body.page-id-18 .azi-cart-hero-text { flex: 1 1 420px; }
body.page-id-18 .azi-cart-eyebrow {
  display: block;
  font-family: 'Jost', sans-serif;
  font-size: 12px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #C9A95C;
  margin-bottom: 14px;
  opacity: .9;
}
body.page-id-18 #azi-cart-hero-title {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(28px, 4.5vw, 40px);
  color: #E8DCC8;
  margin: 0;
  transition: opacity .3s ease, transform .3s ease;
}
body.page-id-18 .azi-cart-hero.azi-fade #azi-cart-hero-title {
  opacity: 0;
  transform: translateY(4px);
}
body.page-id-18 .azi-cart-hero-image {
  flex: 0 0 260px;
  max-width: 260px;
}
body.page-id-18 .azi-cart-hero-image img {
  width: 100%;
  height: auto;
  border-radius: 2px;
  display: block;
}
@media (max-width: 780px) {
  body.page-id-18 .azi-cart-hero { flex-direction: column-reverse; text-align: center; padding: 32px 24px; gap: 24px; }
  body.page-id-18 .azi-cart-hero-image { flex-basis: 160px; max-width: 160px; }
}

/* ---- Product table: show the real WooCommerce column headers ------- */
body.page-id-18 table.cart thead {
  display: table-header-group !important;
}
body.page-id-18 table.cart thead th {
  font-family: 'Jost', sans-serif;
  font-size: 11px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #C4A882;
  font-weight: 400;
  border-bottom: 1px solid rgba(232, 220, 200, .14);
  padding-bottom: 12px;
  text-align: left;
}

body.page-id-18 table.cart input.qty,
body.page-id-18 .quantity input[type="number"] {
  padding: 0 !important;
  text-align: center !important;
  line-height: 32px !important;
  height: 32px !important;
  color: #E8DCC8 !important;
}

/* ---- Order summary sidebar — bordered card -------------------------- */
body.page-id-18 .cart_totals {
  border: 1px solid rgba(232, 220, 200, .14);
  padding: 32px;
  border-radius: 2px;
}
body.page-id-18 .cart_totals h2 {
  font-family: 'Jost', sans-serif;
  font-size: 12px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #C9A95C;
  font-weight: 400;
  margin-bottom: 20px;
}

/* ---- Trust badges ([azi_cart_trust] shortcode) ----------------------- */
body.page-id-18 .azi-trust-badges {
  list-style: none;
  margin: 24px 0 0;
  padding: 24px 0 0;
  border-top: 1px solid rgba(232, 220, 200, .14);
  display: grid;
  gap: 14px;
}
body.page-id-18 .azi-trust-badges li { display: flex; flex-direction: column; gap: 2px; }
body.page-id-18 .azi-trust-badges strong {
  font-family: 'Jost', sans-serif;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: #E8DCC8;
  font-weight: 700;
}
body.page-id-18 .azi-trust-badges span {
  font-family: 'Jost', sans-serif;
  font-size: 12.5px;
  color: #C4A882;
  font-weight: 300;
}

/* ---- "Thoughtfully prepared" banner ([azi_cart_prepared_banner]) ---- */
body.page-id-18 .azi-prepared-banner {
  max-width: 1200px;
  margin: 32px auto 0;
  padding: 32px;
  border: 1px solid rgba(232, 220, 200, .14);
  background: rgba(201, 169, 92, .04);
}
body.page-id-18 .azi-prepared-banner strong {
  display: block;
  font-family: 'Jost', sans-serif;
  font-size: 13px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #C9A95C;
  margin-bottom: 10px;
}
body.page-id-18 .azi-prepared-banner p {
  font-family: 'Jost', sans-serif;
  font-size: 14px;
  font-weight: 300;
  color: #C4A882;
  line-height: 1.7;
  margin: 0;
  max-width: 520px;
}

/* ---- You may also like — restyle to match the new card language ---- */
body.page-id-18 .related.products ul.products li.product,
body.page-id-18 .up-sells ul.products li.product {
  border: 1px solid rgba(232, 220, 200, .14);
  padding: 20px;
  border-radius: 2px;
}
body.page-id-18 .related.products h2,
body.page-id-18 .up-sells h2 {
  font-family: 'Jost', sans-serif;
  font-size: 12px;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: #C9A95C;
  font-weight: 400;
}

/* ---- Empty cart state (unchanged from v1) ---------------------------- */
body.page-id-18 .return-to-shop { display: none !important; }
body.page-id-18 .cart-empty { display: none !important; }
body.page-id-18 .azi-empty-cart {
  max-width: 480px;
  margin: 40px auto 80px;
  text-align: center;
  padding: 0 24px;
}
body.page-id-18 .azi-empty-cart h2 {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(28px, 4vw, 40px);
  color: #E8DCC8;
  margin: 0 0 16px;
}
body.page-id-18 .azi-empty-cart p {
  font-family: 'Jost', sans-serif;
  font-weight: 300;
  font-size: 15px;
  line-height: 1.7;
  color: #C4A882;
  margin: 0 0 32px;
}
body.page-id-18 .azi-empty-cart-cta {
  display: inline-block;
  font-family: 'Jost', sans-serif;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #050405;
  background: #C9A95C;
  padding: 16px 40px;
  border-radius: 2px;
  text-decoration: none;
  transition: opacity .2s ease;
}
body.page-id-18 .azi-empty-cart-cta:hover { opacity: .85; }
body.page-id-18 .azi-empty-cart-product { margin-top: 56px; }
body.page-id-18 .azi-empty-cart-product a { text-decoration: none; display: block; }
body.page-id-18 .azi-empty-cart-product img {
  width: 140px;
  height: auto;
  margin: 0 auto 16px;
  display: block;
  border-radius: 2px;
}
body.page-id-18 .azi-ecp-name {
  display: block;
  font-family: 'Cormorant Garamond', serif;
  font-size: 19px;
  color: #E8DCC8;
  margin-bottom: 4px;
}
body.page-id-18 .azi-ecp-price {
  display: block;
  font-family: 'Jost', sans-serif;
  font-size: 14px;
  color: #C9A95C;
}

/* ---- Mobile cart rows — full rewrite, not another patch --------- */
@media (max-width: 768px) {
  body.page-id-18 table.cart,
  body.page-id-18 table.cart tbody,
  body.page-id-18 table.cart tr.cart_item {
    display: block !important;
    width: 100% !important;
  }
  body.page-id-18 table.cart thead { display: none !important; }
  body.page-id-18 table.cart tr.cart_item {
    display: grid !important;
    grid-template-columns: 64px 1fr 28px;
    grid-template-areas:
      "thumb name remove"
      "thumb qty qty"
      "thumb subtotal subtotal";
    column-gap: 14px;
    row-gap: 8px;
    padding: 20px 0 !important;
    border-bottom: 1px solid rgba(232, 220, 200, .14) !important;
  }
  body.page-id-18 table.cart td {
    padding: 0 !important;
    border: 0 !important;
    flex: none !important;
    width: auto !important;
    max-width: none !important;
  }
  body.page-id-18 table.cart td.product-remove { grid-area: remove; text-align: right !important; }
  body.page-id-18 table.cart td.product-thumbnail { grid-area: thumb; }
  body.page-id-18 table.cart td.product-thumbnail img {
    width: 64px !important;
    height: auto !important;
    border-radius: 2px;
  }
  body.page-id-18 table.cart td.product-name { grid-area: name; font-size: 15px !important; }
  body.page-id-18 table.cart td.product-price { display: none !important; }
  body.page-id-18 table.cart td.product-quantity { grid-area: qty; }
  body.page-id-18 table.cart td.product-subtotal {
    grid-area: subtotal;
    text-align: left !important;
    font-weight: 700 !important;
    color: #C9A95C !important;
  }
}

/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v4: unify card + fix    */
/* cramped sidebar + remove hero photo                                 */
/* 1 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → derulează până la capătul */
/* absolut al fișierului → lipește tot acest bloc acolo → Publish.       */
/* NU șterge nimic din ce e deja acolo — acest bloc câștigă pentru că e  */
/* ultimul (și are !important pe regulile care trebuiau să bată reguli   */
/* vechi din blocurile anterioare de azi).                               */
/*                                                                       */
/* CE FACE:                                                              */
/* 1) Ascunde poza lumânării din hero (rămâne doar eyebrow + titlu)      */
/* 2) Unește vizual hero-ul cu cardul de sub el (tabel + total) într-un  */
/*    singur "card" continuu, cu margini aliniate                        */
/* 3) Repară sidebar-ul de total, care era înghesuit la ~149px lățime    */
/*    (o regulă veche de "width: 48%" moștenită din stilul clasic       */
/*    WooCommerce) — acum ocupă toată coloana lui, cu padding generos    */
/* 4) Mărește puțin titlurile/textele pentru un aspect mai "mare"        */
/* Nu am umblat la niciunul din cele 9 blocuri vechi — doar adaug reguli */
/* noi, mai specifice, la final.                                        */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Ascunde poza din hero ---------------------------------------- */
body.page-id-18 .azi-cart-hero-image {
  display: none !important;
}
body.page-id-18 .azi-cart-hero-text {
  flex: none !important;
  width: 100% !important;
}

/* ---- 2) Hero devine partea de sus a aceluiași card ------------------- */
body.page-id-18 .azi-cart-hero {
  display: block !important;
  max-width: 1100px !important;
  margin: 48px auto 0 !important;
  padding: 48px 48px 32px !important;
  border: 1px solid rgba(232, 220, 200, .14) !important;
  border-bottom: none !important;
  border-radius: 2px 2px 0 0 !important;
  text-align: left !important;
}
body.page-id-18 .azi-cart-eyebrow,
body.page-id-18 #azi-cart-hero-title {
  text-align: left !important;
}
body.page-id-18 #azi-cart-hero-title {
  font-size: clamp(30px, 5vw, 44px) !important; /* puțin mai mare, cere #4 */
}

/* Cardul de tabel+total continuă direct sub hero, fără gol între ele */
body.page-id-18 .woocommerce {
  margin: 0 auto 60px !important;
  border-top: none !important;
  border-radius: 0 0 2px 2px !important;
}

/* ---- 3) Sidebar-ul de total — repară îngustimea de 149px -------------- */
body.page-id-18 .cart_totals {
  width: 100% !important;
  float: none !important;
  box-sizing: border-box !important;
  padding: 40px !important;
}
body.page-id-18 .cart-collaterals {
  padding-left: 0 !important;
}
body.page-id-18 .woocommerce {
  grid-template-columns: 1fr 400px !important;
  gap: 64px !important;
}
body.page-id-18 .cart_totals p,
body.page-id-18 .woocommerce-shipping-calculator {
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 16px !important;
}

/* ---- 4) Puțin mai mare, uniform ---------------------------------------- */
body.page-id-18 table.cart td.product-name a {
  font-size: 18px !important;
}
body.page-id-18 .cart_totals .amount {
  font-size: 16px !important;
}
body.page-id-18 .cart_totals h2 {
  font-size: 13px !important;
  margin-bottom: 24px !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v5: repară overflow-ul   */
/* care făcea totul disproporționat după v4                             */
/* 1 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: la fel ca v4 — Customizer → Additional CSS → capătul   */
/* absolut al fișierului → lipești tot blocul → Publish.                 */
/*                                                                       */
/* CE S-A ÎNTÂMPLAT DE FAPT: v4 a fost lipit corect (am verificat — e    */
/* live). Dar coloana cu tabelul de produse are un "minim" ascuns:       */
/* browserul nu lasă acea coloană să se micșoreze sub lățimea naturală   */
/* a conținutului tabelului, deci grid-ul "1fr 400px" pe care l-am pus   */
/* nu s-a putut respecta — coloana din stânga a rămas la ~975px în loc   */
/* de ~545px, iar sidebar-ul de total a fost împins în afara cardului,   */
/* de-asta era tăiat la margine. E un bug clasic de CSS Grid, nu ceva    */
/* stricat de tine.                                                      */
/*                                                                       */
/* Acest bloc: (1) elimină acel minim ascuns, (2) face tabelul să respecte */
/* lățimea coloanei lui în loc să-și impună propria lățime.               */
/* ══════════════════════════════════════════════════════════════════ */

body.page-id-18 .woocommerce form.woocommerce-cart-form,
body.page-id-18 .woocommerce .cart-collaterals {
  min-width: 0 !important;
}

body.page-id-18 table.cart {
  table-layout: fixed !important;
  width: 100% !important;
}
body.page-id-18 table.cart td.product-remove,
body.page-id-18 table.cart th.product-remove {
  width: 32px !important;
}
body.page-id-18 table.cart td.product-thumbnail,
body.page-id-18 table.cart th.product-thumbnail {
  width: 80px !important;
}
body.page-id-18 table.cart td.product-name,
body.page-id-18 table.cart th.product-name {
  width: auto !important; /* ia tot ce rămâne din lățime */
}
body.page-id-18 table.cart td.product-name a {
  overflow-wrap: break-word !important;
}
body.page-id-18 table.cart td.product-price,
body.page-id-18 table.cart th.product-price {
  width: 100px !important;
}
body.page-id-18 table.cart td.product-quantity,
body.page-id-18 table.cart th.product-quantity {
  width: 110px !important;
}
body.page-id-18 table.cart td.product-subtotal,
body.page-id-18 table.cart th.product-subtotal {
  width: 110px !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v6: aliniere curată a    */
/* tabelului, titlu centrat, eyebrow ascuns, spațiu coupon/update,      */
/* calculator de livrare reparat                                        */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v5) → lipește tot blocul → Publish. Nu șterge       */
/* nimic din ce e deja acolo.                                           */
/*                                                                       */
/* CE REPARĂ (pe rând, cerut de Amada pe 3 aug 2026):                   */
/* 1) Ascunde eticheta "YOUR CART (3)" de deasupra titlului — nu e de   */
/*    fapt un hyperlink (doar un <span> stilizat auriu), dar o ascundem */
/*    complet, cum a cerut.                                             */
/* 2) Titlul hero e centrat din nou — v4 (azi-cart-redesign-v4) îl      */
/*    pusese la stânga cu !important când a unit hero-ul cu cardul.     */
/* 3) Rândul de produs (tbody tr.cart_item) avea display:flex venit     */
/*    dintr-un bloc și mai vechi (dinainte de 1 aug), necondiționat de  */
/*    vreun @media — de-asta nu se alinia deloc cu coloanele din header */
/*    (care rămân table-cell). Pe desktop (peste 768px) îl aducem       */
/*    înapoi la table-row, ca să respecte lățimile de coloană deja      */
/*    corect definite în v5. Sub 768px rămâne neatins layout-ul grid    */
/*    mobil din v1 (azi-cart-redesign-append.css) — acela era fix-ul    */
/*    real de overflow și nu-l ating.                                   */
/* 4) Centrează textul + stepper-ul pe coloanele Preț/Cantitate/        */
/*    Sub-total (doar pe desktop, ca să nu bată peste stilul mobil      */
/*    intenționat al sub-totalului din v1).                             */
/* 5) Spațiu clar între "Aplică cuponul" și "Actualizează coșul" — erau */
/*    la ~4px unul de altul, aproape lipite/suprapuse vizual.           */
/* 6) Calculatorul de livrare: un bloc mai vechi îl ascundea permanent  */
/*    cu display:none !important (ca să repare o problemă de fundal     */
/*    transparent) — asta a stricat definitiv butonul "Calculează       */
/*    livrarea", nu se mai deschidea niciodată (verificat: JS-ul de     */
/*    toggle rulează corect, dar CSS-ul îl bloca). Acum se deschide pe  */
/*    bază de o clasă nouă (.azi-shipping-open), adăugată de un JS mic  */
/*    separat — vezi azi-shipping-calculator-fix.js, de adăugat ca      */
/*    snippet WPCode nou (Site Wide sau doar pe pagina de Cart).        */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Ascunde eticheta "Your Cart (N)" ------------------------------ */
body.page-id-18 .azi-cart-eyebrow {
  display: none !important;
}

/* ---- 2) Titlul hero centrat din nou ----------------------------------- */
body.page-id-18 .azi-cart-hero,
body.page-id-18 .azi-cart-hero-text,
body.page-id-18 #azi-cart-hero-title {
  text-align: center !important;
}

/* ---- 3+4) Desktop: rândul de produs redevine table-row + centrare ----- */
@media (min-width: 769px) {
  body.page-id-18 table.cart tbody tr.cart_item {
    display: table-row !important;
  }
  body.page-id-18 table.cart tbody tr.cart_item > td {
    display: table-cell !important;
    vertical-align: middle !important;
  }
  body.page-id-18 table.cart th.product-price,
  body.page-id-18 table.cart th.product-quantity,
  body.page-id-18 table.cart th.product-subtotal,
  body.page-id-18 table.cart td.product-price,
  body.page-id-18 table.cart td.product-quantity,
  body.page-id-18 table.cart td.product-subtotal {
    text-align: center !important;
  }
}

/* Stepper-ul de cantitate centrat în coloana lui, indiferent de ecran */
body.page-id-18 table.cart .quantity {
  display: inline-flex !important;
  margin: 0 auto !important;
}

/* ---- 5) Spațiu între "Aplică cuponul" și "Actualizează coșul" --------- */
body.page-id-18 table.cart td.actions {
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 20px !important;
}
body.page-id-18 table.cart td.actions button[name="update_cart"] {
  margin: 0 !important;
  align-self: flex-end !important;
}

/* ---- 6) Calculator de livrare — se deschide pe bază de clasă ---------- */
body.page-id-18 .cart_totals .shipping-calculator-form.azi-shipping-open {
  display: block !important;
  padding-top: 16px !important;
}
body.page-id-18 .shipping-calculator-form select,
body.page-id-18 .shipping-calculator-form input[type="text"] {
  width: 100% !important;
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid rgba(232, 220, 200, .2) !important;
  color: #E8DCC8 !important;
  padding: 10px 12px !important;
  margin-bottom: 12px !important;
  border-radius: 2px !important;
  box-sizing: border-box !important;
}
body.page-id-18 .shipping-calculator-form button[name="calc_shipping"] {
  background: #C9A95C !important;
  color: #050405 !important;
  border: none !important;
  padding: 10px 24px !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  font-size: 12px !important;
  border-radius: 2px !important;
  cursor: pointer !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v7: corectează regresia  */
/* din v6 + scoate coloana de preț unitar                               */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v6) → lipește tot blocul → Publish. Nu șterge       */
/* nimic din ce e deja acolo, inclusiv v6 — rămâne, doar îl corectăm.   */
/*                                                                       */
/* CE REPARĂ:                                                           */
/* 1) v6 punea td.actions (celula cu "Aplică cuponul" + "Actualizează   */
/*    coșul") pe display:flex — dar table-layout:fixed (din v5) nu mai  */
/*    știa atunci cât de lată trebuie să fie celula cu colspan, așa că  */
/*    s-a strâns la lățimea primei coloane (32px) și butonul a sărit    */
/*    complet în afara cardului. O readuc la table-cell normal;         */
/*    spațiul dintre cupon și buton vine doar dintr-un margin-top pe    */
/*    buton — atât era nevoie de fapt.                                  */
/* 2) Scoate coloana de Preț unitar din tabel (cerut) — Sub-totalul e   */
/*    suficient. Numele produsului (deja width:auto din v5) primește    */
/*    automat spațiul eliberat — testat live: fără preț, coloana de     */
/*    Produs are ~160px în loc de ~60px, deci "Reconnect Massage        */
/*    Candle" încape fără să se mai suprapună peste stepper.            */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Repară celula de acțiuni (cupon + actualizează) --------------- */
body.page-id-18 table.cart td.actions {
  display: table-cell !important;
}
body.page-id-18 table.cart td.actions button[name="update_cart"] {
  margin-top: 20px !important;
}

/* ---- 2) Scoate coloana de preț unitar ---------------------------------- */
body.page-id-18 table.cart th.product-price,
body.page-id-18 table.cart td.product-price {
  display: none !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v8: titlu ascuns de      */
/* header, preț-fantomă, linii din tabel, spațiere                     */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v7) → lipește tot blocul → Publish. Nu șterge       */
/* nimic din ce e deja acolo.                                           */
/*                                                                       */
/* CE REPARĂ (testat live, cu Chrome conectat, înainte să ți-l dau):    */
/*                                                                       */
/* 1) Titlul "nu se vedea deloc" — cauza reală: header-ul site-ului e   */
/*    position:fixed și înalt de 169px, deci stă DEASUPRA titlului, nu  */
/*    lângă el. Nu era o problemă de culoare/opacitate (am verificat —  */
/*    titlul era perfect vizibil în cod, doar acoperit fizic de header).*/
/*    Măresc padding-top-ul hero-ului ca titlul să înceapă clar sub     */
/*    header, cu spațiu de siguranță.                                   */
/*                                                                       */
/* 2) "Prețul fantomă" din numele lumânării — v7 ascundea coloana de    */
/*    preț, dar regula avea specificitate mai mică decât regula din v6  */
/*    care forța toate celulele rândului pe table-cell, deci td.product-*/
/*    price rămânea vizibil (doar header-ul "Preț" chiar dispăruse).    */
/*    Rescriu regula cu exact același nivel de specificitate ca cea din */
/*    v6, ca să câștige garantat.                                       */
/*                                                                       */
/* 3) Liniile/boxurile din tabel — scot bordurile verticale și de sus   */
/*    de pe toate celulele, păstrez doar o linie fină orizontală sub    */
/*    header și sub fiecare rând (același stil "hairline" ca restul     */
/*    site-ului), ca tabelul să arate ca un singur bloc, nu ca niște    */
/*    cutii separate.                                                   */
/*                                                                       */
/* 4) "Product" centrat + coloana de produs disproporționată — coloana  */
/*    de nume avea lățime "auto" care, din cauza unui bug de randare la */
/*    coloana ascunsă de preț, ajungea la doar ~81px în loc de ~160px — */
/*    de-asta "Reconnect Massage Candle" se scurgea peste stepper-ul de */
/*    cantitate. Îi dau o lățime fixă (160px) + las numele să treacă pe */
/*    2 rânduri dacă e nevoie, în loc să se reverse peste coloana de    */
/*    lângă. Centrez și eticheta "Product" din header.                  */
/*                                                                       */
/* 5) Spațiu sub "Update cart" — era prea lipit de linia de despărțire  */
/*    de dinaintea secțiunii "You may also like". Adaug puțin padding.  */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Titlul, clar sub header-ul fix (169px) ------------------------ */
body.page-id-18 .azi-cart-hero {
  padding-top: 190px !important;
}

/* ---- 2) Ascunde definitiv prețul unitar (câștigă față de v6) ---------- */
body.page-id-18 table.cart tbody tr.cart_item > td.product-price {
  display: none !important;
}

/* ---- 3) Scoate liniile/boxurile, păstrează doar hairline orizontal ---- */
body.page-id-18 table.cart th,
body.page-id-18 table.cart td {
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
}

/* ---- 4) Coloana de produs — lățime fixă + wrap, header centrat -------- */
body.page-id-18 table.cart th.product-name,
body.page-id-18 table.cart td.product-name {
  width: 160px !important;
}
body.page-id-18 table.cart thead th.product-name {
  text-align: center !important;
}
body.page-id-18 table.cart td.product-name a {
  white-space: normal !important;
  line-height: 1.3 !important;
}

/* ---- 5) Spațiu sub "Update cart" înainte de linia despărțitoare ------- */
body.page-id-18 table.cart td.actions {
  padding-bottom: 40px !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v9: spațiu titlu, buton  */
/* "Product" centrat, cupon+actualizează pe același rând, scoate       */
/* rezumatul redundant de produse                                       */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v8) → lipește tot blocul → Publish.                 */
/*                                                                       */
/* CE REPARĂ (testat live înainte să ți-l dau):                         */
/*                                                                       */
/* 1) Spațiul gol de deasupra titlului — era 190px din v8 (ca să scape  */
/*    de header-ul fix), dar arăta ca un gol fără sens. Îl reduc la     */
/*    130px și adaug o linie subțire verticală + o linie orizontală la  */
/*    baza secțiunii hero, ca zona să arate ca un bloc intenționat,     */
/*    "închis", nu ca spațiu gol.                                       */
/*                                                                       */
/* 2) "Product" centrat cu adevărat peste poză + nume (nu doar peste    */
/*    propria lui coloană, îngustă) — mut eticheta cu 40px spre stânga  */
/*    (poziționare relativă, nu schimbă lățimea coloanelor).            */
/*                                                                       */
/* 3) "Aplică cuponul" și "Actualizează coșul" pe același rând — chiar  */
/*    și în română, unde textul e mai lung. Testat live: la lățimea cea */
/*    mai strânsă (~493px), toate 3 elementele (câmp cupon + 2 butoane) */
/*    încap pe un rând. Le-am strâns puțin (padding, fără letter-       */
/*    spacing) ca să aibă loc — dacă vrei literele mai rărite înapoi,   */
/*    spune-mi și găsim alt echilibru.                                  */
/*                                                                       */
/* 4) Scoate rezumatul "3× Reconnect / 2× Inner Calm" din sidebar-ul de */
/*    total — era redundant cu tabelul din stânga, cum ai zis.          */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Hero — spațiu redus + linie decorativă + secțiune închisă ---- */
body.page-id-18 .azi-cart-hero {
  padding-top: 130px !important;
  border-bottom: 1px solid rgba(232, 220, 200, .14) !important;
}
body.page-id-18 .azi-cart-hero::before {
  content: "";
  display: block;
  width: 1px;
  height: 40px;
  background: rgba(201, 169, 92, .4);
  margin: 0 auto 24px;
}

/* ---- 2) "Product" centrat peste poză + nume ---------------------------- */
body.page-id-18 table.cart thead th.product-name {
  position: relative !important;
  left: -40px !important;
  text-align: center !important;
}

/* ---- 3) Cupon + Actualizează coșul pe același rând, în ambele limbi --- */
body.page-id-18 table.cart td.actions {
  display: table-cell !important; /* rămâne table-cell — display:flex aici strică lățimea colspan-ului, vezi v7 */
  vertical-align: middle !important;
}
body.page-id-18 table.cart .coupon {
  display: inline-flex !important;
  float: none !important;
  vertical-align: middle !important;
  margin: 0 10px 12px 0 !important;
}
body.page-id-18 table.cart #coupon_code {
  width: 120px !important;
  flex: 0 0 120px !important;
}
body.page-id-18 table.cart button[name="apply_coupon"] {
  padding: 10px 14px !important;
  letter-spacing: 0 !important;
  font-size: 11px !important;
}
body.page-id-18 table.cart td.actions button[name="update_cart"] {
  display: inline-flex !important;
  vertical-align: middle !important;
  margin: 0 0 12px 0 !important;
  white-space: nowrap !important;
  padding: 10px 14px !important;
  letter-spacing: 0 !important;
  font-size: 11px !important;
}

/* ---- 4) Scoate rezumatul redundant de produse din sidebar ------------- */
body.page-id-18 .azi-cart-breakdown {
  display: none !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v10                     */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v9) → lipește tot blocul → Publish.                 */
/*                                                                       */
/* CE REPARĂ (marcat de tine cu x și cerc în captura de ecran):         */
/*                                                                       */
/* 1) Spațiul de sus, redus — și liniuța verticală + linia de jos pe    */
/*    care le adăugasem în v9 (cele marcate cu x) sunt scoase. În loc   */
/*    de ele, linia cerută ("linia aia") e acum sub header-ul tabelului */
/*    (Produs / Cantitate / Sub-total) — o linie clară, care închide    */
/*    acea secțiune, exact unde ai încercuit-o.                         */
/*                                                                       */
/* 2) "Cod cupon" / "Coupon code" — cutia de input era mai înaltă       */
/*    (42px) decât butoanele de lângă ea (33px), din cauza padding-ului */
/*    implicit al browserului — de-asta părea nealiniat. Acum are       */
/*    exact aceeași înălțime ca butoanele, în ambele limbi (am          */
/*    verificat separat RO și EN — erau deja identice ca lățime, doar   */
/*    înălțimea input-ului era problema).                               */
/*                                                                       */
/* Dacă spațiul de sus tot nu e cum trebuie pe ecranul tău — spune-mi   */
/* dacă vrei mai mult sau mai puțin, și ajustez direct (nu mai ghicesc; */
/* pe ecranul meu de test arată bine, dar rezoluția ta poate fi         */
/* diferită și de-asta tot ratez din prima).                            */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Spațiu redus + scoate decorul din v9 + linie sub header ------- */
body.page-id-18 .azi-cart-hero {
  padding-top: 100px !important;
  border-bottom: none !important;
}
body.page-id-18 .azi-cart-hero::before {
  display: none !important;
}
body.page-id-18 table.cart thead th {
  border-bottom: 1px solid rgba(232, 220, 200, .25) !important;
}

/* ---- 2) Input-ul de cupon la aceeași înălțime ca butoanele ------------ */
body.page-id-18 table.cart #coupon_code {
  padding: 8px 12px !important;
  height: 33px !important;
  box-sizing: border-box !important;
  vertical-align: middle !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v11                     */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v10) → lipește tot blocul → Publish.                */
/*                                                                       */
/* CE REPARĂ:                                                           */
/*                                                                       */
/* 1) "Cod cupon" / "Coupon code" nu erau simetrice între RO și EN —    */
/*    cauza reală: celula td.actions avea text-align:right moștenit;    */
/*    cu textul EN (mai scurt), asta lăsa gol vizibil în stânga, cu RO  */
/*    (mai lung, aproape umplea rândul) nu se vedea. Acum e text-align: */
/*    left explicit — pornesc din același loc, în ambele limbi.         */
/*                                                                       */
/* 2) "Product" — centrare corectă de data asta peste TOATE cele 3      */
/*    coloane fără etichetă proprie (×, poză, nume), nu doar peste      */
/*    poză+nume ca în v9.                                               */
/*                                                                       */
/* 3) Linia de sus a tabelului — exista deja în cod (din 1 august), dar */
/*    border-collapse + eliminarea bordurilor din v8 o anulau vizual.   */
/*    O redeclar direct pe elementul <table>, ca să fie sigur vizibilă. */
/*                                                                       */
/* 4) Spațiu în plus lângă Sub-total și lângă "Actualizează coșul" —    */
/*    să nu mai fie lipite de marginea cardului.                        */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Cupon aliniat la stânga, la fel în ambele limbi --------------- */
body.page-id-18 table.cart td.actions {
  text-align: left !important;
}

/* ---- 2) "Product" centrat peste ×, poză și nume, toate 3 --------------- */
body.page-id-18 table.cart thead th.product-name {
  left: -56px !important;
}

/* ---- 3) Linia de sus a tabelului, vizibilă din nou --------------------- */
body.page-id-18 table.cart {
  border-top: 1px solid rgba(232, 220, 200, .25) !important;
}

/* ---- 4) Spațiu lângă Sub-total și butonul de actualizare --------------- */
body.page-id-18 table.cart td.product-subtotal,
body.page-id-18 table.cart th.product-subtotal {
  padding-right: 24px !important;
}
body.page-id-18 table.cart td.actions {
  padding-right: 24px !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v12                     */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v11) → lipește tot blocul → Publish.                */
/*                                                                       */
/* CE REPARĂ:                                                           */
/*                                                                       */
/* 1) Linia de sus a tabelului, de data asta garantat — am verificat    */
/*    live: table.cart are border-collapse:collapse, iar acolo regula   */
/*    de border-top pe <table> pierde mereu în fața lui border-top:none */
/*    de pe celulele din primul rând (din v8), indiferent de !important */
/*    sau ordine — e vorba de algoritmul de "collapsed borders" al      */
/*    browserului, nu de cascada CSS normală. Nu mai lupt cu el — pun   */
/*    linia pe .woocommerce-cart-form (formularul care conține tabelul, */
/*    nu participă la collapse), garantat vizibilă.                     */
/*                                                                       */
/* 2) Semnele − și + din stepper-ul de cantitate erau lipite de partea  */
/*    de jos a căsuței lor — line-height-ul (24px) era mai mare decât   */
/*    spațiul rămas din înălțimea butonului după padding, așa că textul */
/*    se scurgea în jos. Centrare reală cu flexbox, nu cu line-height.  */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- 1) Linia de sus, pe formular, nu pe tabel (evită border-collapse) */
body.page-id-18 .woocommerce-cart-form {
  border-top: 1px solid rgba(232, 220, 200, .25) !important;
}

/* ---- 2) − și + centrate real în căsuța lor ----------------------------- */
body.page-id-18 .azi-qty-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  padding: 0 !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v13                     */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v12) → lipește tot blocul → Publish.                */
/*                                                                       */
/* CE REPARĂ: linia de sus adăugată în v12 mergea pe toată lățimea      */
/* formularului (.woocommerce-cart-form), dar formularul are 48px       */
/* padding-right dincolo de tabelul propriu-zis — de-asta linia ieșea   */
/* vizibil în afara chenarului tabelului, spre cardul de total. Acum e  */
/* un ::before poziționat exact cât tabelul (exclude cei 48px), nu mai  */
/* depășește nimic — testat live.                                       */
/* ══════════════════════════════════════════════════════════════════ */

body.page-id-18 .woocommerce-cart-form {
  border-top: none !important;
  position: relative !important;
}
body.page-id-18 .woocommerce-cart-form::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 48px;
  height: 1px;
  background: rgba(232, 220, 200, .25);
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v14                     */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v13) → lipește tot blocul → Publish.                */
/*                                                                       */
/* CE REPARĂ: butonul "Vezi coșul" / "View cart" din popup-ul de        */
/* notificare ("...a fost adăugat în coș") avea un fundal alb-lavandă   */
/* (rgb(233,230,237)) — venea din stilul implicit WooCommerce, nefolosit */
/* nicăieri altundeva pe site, de-asta bătea la ochi pe fundal negru.   */
/*                                                                       */
/* Amada a cerut să arate ca linkul "Revii?" din notificarea de la      */
/* ștergerea unui produs (clasa .restore-item) — text simplu, auriu,    */
/* fără chenar/fundal de buton. Am luat stilul exact de acolo (verificat */
/* live: color rgb(201,169,92), fără border, fără background, fără     */
/* padding, font-weight 300) și l-am aplicat identic aici.              */
/* ══════════════════════════════════════════════════════════════════ */

body.page-id-18 .woocommerce-message a.button.wc-forward {
  background: transparent !important;
  border: none !important;
  color: #C9A95C !important;
  padding: 0 !important;
  border-radius: 0 !important;
  text-transform: none !important;
  font-size: 13.6px !important;
  font-weight: 300 !important;
  letter-spacing: normal !important;
  box-shadow: none !important;
  text-decoration: none !important;
}
body.page-id-18 .woocommerce-message a.button.wc-forward:hover {
  text-decoration: underline !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v15                     */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v14) → lipește tot blocul → Publish.                */
/*                                                                       */
/* CE REPARĂ: după ce am scos padding-ul de buton de la "Vezi coșul"    */
/* (v14), linkul a rămas lipit direct de "×"-ul de închidere al         */
/* notificării (poziționat absolut, lângă marginea din dreapta). Adaug  */
/* un spațiu clar de ambele părți ale linkului, ca să nu se mai atingă  */
/* nici de propoziția dinainte, nici de ×.                              */
/* ══════════════════════════════════════════════════════════════════ */

body.page-id-18 .woocommerce-message a.button.wc-forward {
  margin: 0 20px 0 6px !important;
  vertical-align: baseline !important;
  display: inline !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Cart page (body.page-id-18) — v16: ecranul de coș gol  */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după v15) → lipește tot blocul → Publish.                */
/*                                                                       */
/* CE REPARĂ: titlul "Your next ritual is waiting." de pe ecranul de    */
/* coș gol avea aceleași două probleme ca titlul din hero-ul normal,    */
/* dar nu le-am reparat pe alea aici pentru că e alt bloc HTML          */
/* (azi_custom_empty_cart_state, nu azi_cart_hero):                     */
/* 1) era acoperit parțial de header-ul fix (169px) — la fel ca         */
/*    titlul din hero, dar nimeni nu-i pusese padding-top.              */
/* 2) nu era centrat pe pagină — era într-un div cu margin: 40px 0 80px */
/* (fără auto pe stânga/dreapta), înghesuit în prima coloană a grid-ului*/
/* de 2 coloane moștenit din restul paginii (1fr 400px), de-asta stătea */
/* lipit de stânga în loc să fie centrat.                                */
/* ══════════════════════════════════════════════════════════════════ */

body.page-id-18 .azi-empty-cart {
  grid-column: 1 / -1 !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-top: 100px !important;
}
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Checkout page (body.page-id-19) — header/footer chrome */
/* 3 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului → lipește tot blocul → Publish.                           */
/*                                                                       */
/* CE FACE: am adăugat header-ul și footer-ul (widget-urile Custom      */
/* HTML) pe pagina Checkout direct în Elementor, la fel ca pe Cart —     */
/* dar CSS-ul care le stilizează pe restul site-ului e scris per pagină */
/* (body.page-id-18, page-id-42, etc.), nu global. Fără acest bloc,     */
/* header-ul apărea nestilizat: logo-ul mic bine, dar iconițele din     */
/* header (wishlist/login/cont/coș) apăreau URIAȘE (SVG-ul inimii de la */
/* wishlist umplea tot ecranul) pentru că regula care le micșorează la  */
/* 18px exista doar pentru celelalte pagini, nu și pentru page-id-19.   */
/*                                                                       */
/* Acest bloc e o copie exactă a CSS-ului de header/footer folosit pe   */
/* Cart (page-id-18), doar retrasat pe page-id-19 — identic ca aspect.  */
/* ══════════════════════════════════════════════════════════════════ */

/* ---- Header / Nav ---- */
body.page-id-19 header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 22px 40px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.6) 70%, rgba(5,4,5,0.3) 100%);
  backdrop-filter: blur(2px);
}
body.page-id-19 header::after {
  content: "";
  position: absolute; left: 0; right: 0; top: 100%; height: 60px;
  background: linear-gradient(to bottom, rgba(5,4,5,0.28), transparent);
  backdrop-filter: blur(1px);
  -webkit-mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, transparent 100%);
  pointer-events: none;
}
body.page-id-19 .header-left { display: flex; align-items: center; gap: 40px; }
body.page-id-19 .logo-mark { display: flex; align-items: center; gap: 10px; }
body.page-id-19 .logo-mark img { height: 36px; width: auto; display: block; }
body.page-id-19 nav { display: flex; gap: 30px; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; }
body.page-id-19 nav a { opacity: 0.85; transition: opacity .3s, color .3s; position: relative; color: var(--cream); }
body.page-id-19 nav a:hover { opacity: 1; color: var(--gold-light); }
body.page-id-19 .header-icons { display: flex; align-items: center; gap: 22px; }
body.page-id-19 .header-icons .icon-item {
  display: flex; align-items: center; gap: 7px; position: relative;
  color: var(--cream); opacity: 0.85; transition: color .3s, opacity .3s;
}
body.page-id-19 .header-icons .icon-item:hover { color: var(--gold-light); opacity: 1; }
body.page-id-19 .header-icons .icon-item svg {
  width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.5; flex-shrink: 0;
}
body.page-id-19 .header-icons .icon-label { font-size: 0.82rem; letter-spacing: 0.06em; text-transform: uppercase; }
body.page-id-19 .header-icons .wishlist-icon.azi-has-items svg { fill: var(--gold-light); stroke: var(--gold-light); }
body.page-id-19 .header-icons .icon-badge {
  position: absolute; top: -7px; right: -9px;
  background: var(--gold); color: var(--bg); font-size: 0.6rem; font-weight: 700;
  width: 15px; height: 15px; border-radius: 50%; align-items: center; justify-content: center;
  display: flex; line-height: 1;
}
/* Defensive fallback: if the cart-count number is markup we haven't
   explicitly styled (a different badge/count class than .icon-badge),
   force it visible instead of default black-on-transparent text. */
body.page-id-19 .header-icons .cart-icon .icon-badge,
body.page-id-19 .header-icons .cart-icon .cart-contents-count,
body.page-id-19 .header-icons .cart-icon [class*="count"],
body.page-id-19 .header-icons .cart-icon .icon-label {
  color: var(--cream) !important;
}
body.page-id-19 .header-icons .cart-icon .icon-badge,
body.page-id-19 .header-icons .cart-icon [class*="badge"] {
  color: var(--bg) !important;
  background: var(--gold) !important;
}
body.page-id-19 .lang-toggle {
  display: flex; align-items: center; gap: 6px; font-size: 0.72rem; letter-spacing: 0.08em;
  border: 1px solid var(--line); padding: 5px 6px; border-radius: 20px;
}
body.page-id-19 .lang-toggle button {
  background: transparent; border: none; color: var(--biscuit); cursor: pointer;
  font-family: "Jost", sans-serif; font-size: 0.72rem; letter-spacing: 0.08em; text-transform: uppercase;
  padding: 4px 9px; border-radius: 14px; transition: background .3s, color .3s;
}
body.page-id-19 .lang-toggle button.active { background: var(--gold); color: var(--bg); font-weight: 600; }
body.page-id-19 .hamburger { display: none; flex-direction: column; gap: 5px; background: none; border: none; cursor: pointer; padding: 4px; }
body.page-id-19 .hamburger span { width: 22px; height: 1.5px; background: var(--cream); transition: transform .3s, opacity .3s; }
body.page-id-19 .hamburger.open span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
body.page-id-19 .hamburger.open span:nth-child(2) { opacity: 0; }
body.page-id-19 .hamburger.open span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
body.page-id-19 .mobile-nav {
  display: none;
  position: fixed; top: 0; right: 0; bottom: 0; width: min(78vw, 320px);
  background: var(--bg-soft); border-left: 1px solid var(--line);
  z-index: 200; padding: 90px 32px 40px;
  transform: translateX(100%); transition: transform .4s ease;
  flex-direction: column; gap: 26px;
}
body.page-id-19 .mobile-nav.open { transform: translateX(0); }
body.page-id-19 .mobile-nav a { font-size: 1rem; letter-spacing: 0.08em; text-transform: uppercase; font-weight: 500; color: var(--cream); }
body.page-id-19 .mobile-nav .mobile-divider { height: 1px; background: var(--line); margin: 6px 0; }
body.page-id-19 .nav-scrim {
  display: none; position: fixed; inset: 0; background: rgba(5,4,5,0.6); z-index: 150;
  opacity: 0; transition: opacity .35s ease; pointer-events: none;
}
body.page-id-19 .nav-scrim.open { opacity: 1; pointer-events: auto; }
@media (max-width: 880px) {
  body.page-id-19 .header-left { gap: 18px; }
  body.page-id-19 nav { gap: 14px; font-size: 0.66rem; }
}
@media (max-width: 680px) {
  body.page-id-19 header { padding: 18px 22px; }
  body.page-id-19 nav { display: none; }
  body.page-id-19 .header-icons { gap: 14px; }
  body.page-id-19 .header-icons .icon-label { display: none; }
  body.page-id-19 .header-icons a.icon-item { display: none; }
  body.page-id-19 .lang-toggle { font-size: 0.66rem; }
  body.page-id-19 .hamburger { display: flex; }
  body.page-id-19 .mobile-nav, body.page-id-19 .nav-scrim { display: flex; }
}

/* ---- Footer ---- */
body.page-id-19 footer { padding: 56px 0 26px; border-top: 1px solid var(--line); }
body.page-id-19 .footer-top { display: grid; grid-template-columns: 1fr 1fr; gap: 50px; padding-bottom: 50px; border-bottom: 1px solid var(--line); margin-bottom: 30px; }
body.page-id-19 .footer-brand { display: none; }
body.page-id-19 .footer-col h5 { font-size: 0.72rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold-light); margin-bottom: 18px; }
body.page-id-19 .footer-col a { display: block; font-size: 0.85rem; color: var(--biscuit); margin-bottom: 12px; transition: color .3s; }
body.page-id-19 .footer-col a:hover { color: var(--cream); }
body.page-id-19 .newsletter-form { display: flex; border: 1px solid var(--line); margin-top: 6px; }
body.page-id-19 .newsletter-form input { flex: 1; background: transparent; border: none; outline: none; color: var(--cream); padding: 12px 14px; font-family: "Jost", sans-serif; font-size: 0.85rem; }
body.page-id-19 .newsletter-form button { background: var(--gold); color: var(--bg); border: none; padding: 0 18px; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; font-weight: 700; font-family: "Jost", sans-serif; }
body.page-id-19 .newsletter-msg { font-size: 0.75rem; color: var(--gold-light); margin-top: 8px; min-height: 1em; }
body.page-id-19 .footer-bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 16px; font-size: 0.75rem; color: var(--biscuit); }
body.page-id-19 .socials { display: flex; gap: 16px; }
body.page-id-19 .socials a { width: 32px; height: 32px; border: 1px solid var(--line); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 0.75rem; transition: border-color .3s, color .3s; }
body.page-id-19 .socials a:hover { border-color: var(--gold); color: var(--gold-light); }
@media (max-width: 880px) { body.page-id-19 .footer-top { grid-template-columns: 1fr; gap: 36px; } }
/* ══════════════════════════════════════════════════════════════════ */
/* AZI Rituals — Checkout (body.page-id-19) — fix layout footer         */
/* 4 August 2026                                                        */
/*                                                                       */
/* UNDE SE PUNE: Customizer → Additional CSS → capătul absolut al       */
/* fișierului (după azi-checkout-header-footer-chrome.css) → lipește    */
/* tot blocul → Publish.                                                 */
/*                                                                       */
/* CE REPARĂ: footerul din primul fișier (azi-checkout-header-footer-   */
/* chrome.css) folosea un grid vechi de 2 coloane, copiat de pe Cart     */
/* dintr-o versiune mai veche a footer-ului. Între timp, pe 30 iulie,    */
/* footer-ul a fost actualizat site-wide la un grid de 4 coloane + o     */
/* regulă nouă (.footer-col-group) care pune Discover+Shop unul sub     */
/* altul într-o coloană, și Your Ritual+Legal unul sub altul în altă     */
/* coloană. Fișierul meu anterior nu avea nici gridul corect, nici       */
/* regula .footer-col-group — de-asta coloanele au apărut împrăștiate,   */
/* cu spații mari între ele. Acest bloc suprascrie cu valorile corecte,  */
/* identice cu ce rulează deja pe Cart/Shop/Home/Journal/Wishlist.       */
/* ══════════════════════════════════════════════════════════════════ */

body.page-id-19 .footer-top {
  display: grid;
  grid-template-columns: 1fr 0.75fr 0.8fr 1.65fr;
  gap: 32px;
  padding: 70px 0 50px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 30px;
}
body.page-id-19 .footer-col-group {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
@media (max-width: 980px) {
  body.page-id-19 .footer-top { grid-template-columns: 1fr 1fr; }
}
/* ============================================================
   AZI — fix Cart mobil: coloana formularului colapsează la 0px
   Adaugă la FINALUL Additional CSS (Customizer) — nu șterge nimic altceva.
   ============================================================

   CAUZA (confirmată live, nu presupusă):
   .woocommerce de pe pagina Cart e un CSS grid cu 2 coloane
   (formular + total). Există deja un fix corect pentru mobil
   (grid-template-columns: 1fr sub 880px), dar o regulă mai nouă,
   adăugată ulterior, suprascrie asta cu !important și FĂRĂ media
   query:

       body.page-id-18 .woocommerce {
         grid-template-columns: 1fr 400px !important;
         gap: 64px !important;
       }

   Fiindcă are !important și nicio limită de ecran, câștigă pe orice
   lățime. Pe telefon (ex. 390px), grid-ul încearcă să încapă 1fr +
   400px într-un spațiu de ~330px — coloana "1fr" colapsează la 0,
   iar tot ce e în ea (formularul de coș, cardul "S-ar putea să-ți
   placă și", butonul Add to cart) se strânge la lățime aproape zero,
   de-aia titlul și textul butonului se rup literă cu literă / cuvânt
   cu cuvânt. Sidebar-ul de total rămâne forțat la 400px fix, mai lat
   decât ecranul — de-aia "Calculează livrarea" arăta înghesuit.

   FIX: adaugă o regulă cu aceeași specificitate + !important, dar
   ÎN media query, care câștigă doar sub 880px (paste-uită la finalul
   fișierului, ca de obicei — ordinea contează).

   Verificat live (Claude in Chrome, viewport 390px real, nu doar
   presupus): cardul "Zen Aura Massage Candle" și butonul Add to cart
   revin la lățime normală, sidebar-ul de total devine lizibil.
   ============================================================ */

@media (max-width: 880px) {
  body.page-id-18 .woocommerce {
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
}
/* AZI Rituals — stil pentru formularul "Calculează livrarea" din Cart
   Unde se pune: Customizer (Personalizează) → Additional CSS.
   Adaugă tot codul de mai jos LA SFÂRȘITUL Additional CSS existent — nu
   înlocui restul, doar adaugă. Scopat pe body.page-id-18 (Cart), la fel
   ca restul regulilor de pe pagina asta.

   CE REZOLVĂ (5 august 2026): Amada a semnalat că formularul de livrare
   din Cart ("Țară/regiune", "Județ") nu respectă brand-ul — cutii albe,
   text negru, în loc de stilul închis/auriu de pe restul paginii.

   CAUZA: câmpurile "Municipiu/localitate" și "Cod poștal" sunt inputuri
   simple de text — deja erau stilizate corect (moștenesc regulile
   existente pentru inputuri). Dar "Țară/regiune" și "Județ" sunt
   dropdown-uri (select) transformate de librăria "select2" (parte din
   WooCommerce) într-un widget separat, cu propriul lui HTML — regulile
   CSS existente pentru <select> nu ating deloc widget-ul select2, care
   rămâne cu stilul lui implicit (alb, gri) neatins de brand.

   Verificat live (Claude in Chrome, click real pe fiecare câmp, cu
   dropdown-ul deschis): fix-ul de mai jos ajunge cutia închisă ȘI lista
   de opțiuni deschisă (fundal, text, bordură, câmp de căutare din
   interior, opțiunea selectată la hover). */

body.page-id-18 .select2-container .select2-selection--single {
  height: 45px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  border-radius: 2px !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
  font-size: 16px !important;
  line-height: 43px !important;
  padding-left: 12px !important;
  padding-right: 30px !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__arrow {
  height: 43px !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--gold-light, #C9A95C) transparent transparent transparent !important;
}

body.page-id-18 .select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--gold-light, #C9A95C) transparent !important;
}

/* Dropdown-ul deschis (lista de opțiuni) — select2 îl adaugă separat, în
   afara formularului, de-aia nu poate fi scopat strict pe .cart_totals */
body.page-id-18 .select2-dropdown {
  background: var(--bg, #0c0b0a) !important;
  border: 1px solid var(--gold, #8B6914) !important;
  border-radius: 2px !important;
}

body.page-id-18 .select2-search--dropdown .select2-search__field {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-18 .select2-results__option {
  background: var(--bg, #0c0b0a) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-18 .select2-results__option--highlighted[aria-selected] {
  background: var(--gold, #8B6914) !important;
  color: var(--bg, #0c0b0a) !important;
}

body.page-id-18 .select2-results__option[aria-selected="true"] {
  background: rgba(201, 169, 92, 0.2) !important;
}
/* AZI Rituals — stil pentru formularul "Calculează livrarea" din Cart
   Unde se pune: Customizer (Personalizează) → Additional CSS.
   Adaugă tot codul de mai jos LA SFÂRȘITUL Additional CSS existent — nu
   înlocui restul, doar adaugă. Scopat pe body.page-id-18 (Cart), la fel
   ca restul regulilor de pe pagina asta.

   CE REZOLVĂ (5 august 2026): Amada a semnalat că formularul de livrare
   din Cart ("Țară/regiune", "Județ") nu respectă brand-ul — cutii albe,
   text negru, în loc de stilul închis/auriu de pe restul paginii.

   CAUZA: câmpurile "Municipiu/localitate" și "Cod poștal" sunt inputuri
   simple de text — deja erau stilizate corect (moștenesc regulile
   existente pentru inputuri). Dar "Țară/regiune" și "Județ" sunt
   dropdown-uri (select) transformate de librăria "select2" (parte din
   WooCommerce) într-un widget separat, cu propriul lui HTML — regulile
   CSS existente pentru <select> nu ating deloc widget-ul select2, care
   rămâne cu stilul lui implicit (alb, gri) neatins de brand.

   Verificat live (Claude in Chrome, click real pe fiecare câmp, cu
   dropdown-ul deschis): fix-ul de mai jos ajunge cutia închisă ȘI lista
   de opțiuni deschisă (fundal, text, bordură, câmp de căutare din
   interior, opțiunea selectată la hover). */

body.page-id-18 .select2-container .select2-selection--single {
  height: 45px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  border-radius: 2px !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
  font-size: 16px !important;
  line-height: 43px !important;
  padding-left: 12px !important;
  padding-right: 30px !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__arrow {
  height: 43px !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--gold-light, #C9A95C) transparent transparent transparent !important;
}

body.page-id-18 .select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--gold-light, #C9A95C) transparent !important;
}

/* Dropdown-ul deschis (lista de opțiuni) — select2 îl adaugă separat, în
   afara formularului, de-aia nu poate fi scopat strict pe .cart_totals */
body.page-id-18 .select2-dropdown {
  background: var(--bg, #0c0b0a) !important;
  border: 1px solid var(--gold, #8B6914) !important;
  border-radius: 2px !important;
}

body.page-id-18 .select2-search--dropdown .select2-search__field {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-18 .select2-results__option {
  background: var(--bg, #0c0b0a) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-18 .select2-results__option--highlighted {
  background: var(--gold, #8B6914) !important;
  color: var(--bg, #0c0b0a) !important;
}

body.page-id-18 .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) {
  background: rgba(201, 169, 92, 0.35) !important;
  color: var(--cream, #E8DCC8) !important;
}

/* FIX 5 august (2) — Amada a semnalat 3 lucruri noi, cu screenshot-uri:

   1. Stelutele (*) de la câmpurile obligatorii erau roșii — stock
      WooCommerce — nu respectau brand-ul. Schimbate în auriu.

   2. Opțiunea selectată/highlighted din listă era ilizibilă ("nuanța
      prea închisă"). Cauza reală: aveam DOUĂ reguli cu aceeași
      specificitate CSS care se suprapuneau pe același element (un
      rezultat poate fi și "selectat" ȘI "highlighted" în același timp,
      ex. valoarea curentă), iar cea care câștiga cursa punea fundal
      aproape transparent SUB un text închis la culoare — text închis pe
      fundal aproape la fel de închis, deci ilizibil. Separate clar cu
      :not(), ca să nu se mai suprapună.

   3. "Scrisul din fiecare căsuță să fie centrat pe mijloc, aliniat la
      stânga" — la select2 (Țară/regiune, Județ), înălțimea reală a
      textului (59px) depășea cutia (45px) din cauza padding-ului
      implicit al select2, care nu fusese resetat — textul ieșea din
      centru. Rezolvat cu flexbox (align-items:center), mult mai robust
      decât potrivit line-height cu înălțimea cutiei.

   4. Butonul "Actualizează" era aliniat la stânga, diferit de restul
      butoanelor de pe pagină (ex. "Continuă cu finalizarea comenzii",
      care e centrat/lat). Centrat + adăugat un stil vizibil la apăsare
      (:active), ca să simtă că a apăsat ceva. */

body.page-id-18 .woocommerce-shipping-calculator .required {
  color: var(--gold-light, #C9A95C) !important;
}

body.page-id-18 .select2-container .select2-selection--single {
  display: flex !important;
  align-items: center !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__rendered {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: normal !important;
  height: auto !important;
}

body.page-id-18 .select2-container .select2-selection--single .select2-selection__arrow {
  display: flex !important;
  align-items: center !important;
}

body.page-id-18 .woocommerce-shipping-calculator input.input-text {
  line-height: 24px !important;
}

body.page-id-18 .woocommerce-shipping-calculator .button {
  display: block !important;
  margin: 20px auto 0 !important;
}

body.page-id-18 .woocommerce-shipping-calculator .button:active {
  background: #C9A95C !important;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.35) !important;
  transform: translateY(1px);
}
/* AZI Rituals — stil pentru pagina de Checkout ("Finalizare Comandă")
   Unde se pune: Customizer (Personalizează) → Additional CSS.
   Adaugă tot codul de mai jos LA SFÂRȘITUL Additional CSS existent — nu
   înlocui restul, doar adaugă. Scopat pe body.page-id-19 (Checkout).

   CE REZOLVĂ (5 august 2026): Amada a semnalat, cu screenshot-uri:
   1. Titlul paginii ("Finalizare Comandă") nu se vedea — era acoperit
      aproape complet de header-ul fix de sus (header-ul are 169px
      înălțime, dar secțiunea cu titlul nu avea niciun spațiu rezervat
      pentru el, deci titlul pornea la doar 50px de sus, ascuns sub
      header). Pe Cart, aceeași secțiune are un padding-top care o
      împinge sub header — pe Checkout lipsea complet. Adăugat.
   2. Aceleași câmpuri "Țară/regiune" și "Județ" (select2) ca pe Cart,
      cu aceeași problemă — cutii albe, neatinse de brand. Aceeași
      cauză, același fix (vezi azi-cart-shipping-calculator-style.css
      pentru explicația completă) — aici doar scopat pe Checkout.
   3. Caseta metodei de plată salvate ("Card" → cardurile Visa salvate) —
      fundal gri-mov deschis, text greu de citit. E stilul implicit al
      WooCommerce Payments/Stripe pentru acea casetă, nu ceva ce
      trebuia scris de la zero — doar suprascris cu paleta AZI.

   Verificat live (Claude in Chrome): titlul e vizibil sub header, toate
   câmpurile arată la fel ca pe Cart, caseta de plată e închisă la
   culoare cu text lizibil. */

/* 1) titlul paginii — spațiu sub header-ul fix (169px), ca pe Cart */
body.page-id-19 .azi-checkout-hero {
  padding-top: 140px !important;
}

/* 2) select2 (Țară/regiune, Județ) — identic cu Cart, doar scopat aici */
body.page-id-19 .woocommerce-shipping-calculator .required,
body.page-id-19 .required {
  color: var(--gold-light, #C9A95C) !important;
}

body.page-id-19 .select2-container .select2-selection--single {
  height: 45px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  border-radius: 2px !important;
  display: flex !important;
  align-items: center !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
  font-size: 16px !important;
  padding-left: 12px !important;
  padding-right: 30px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: normal !important;
  height: auto !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__arrow {
  height: 43px !important;
  display: flex !important;
  align-items: center !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--gold-light, #C9A95C) transparent transparent transparent !important;
}

body.page-id-19 .select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--gold-light, #C9A95C) transparent !important;
}

body.page-id-19 .select2-dropdown {
  background: var(--bg, #0c0b0a) !important;
  border: 1px solid var(--gold, #8B6914) !important;
  border-radius: 2px !important;
}

body.page-id-19 .select2-search--dropdown .select2-search__field {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-19 .select2-results__option {
  background: var(--bg, #0c0b0a) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-19 .select2-results__option--highlighted {
  background: var(--gold, #8B6914) !important;
  color: var(--bg, #0c0b0a) !important;
}

body.page-id-19 .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) {
  background: rgba(201, 169, 92, 0.35) !important;
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 input.input-text {
  line-height: 24px !important;
}

/* 3) caseta metodei de plată salvate (WooCommerce Payments/Stripe) —
   fundal implicit gri-mov deschis, suprascris cu paleta AZI */
body.page-id-19 .woocommerce-checkout-payment,
body.page-id-19 .payment_box {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 .payment_box * {
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 .payment_box a {
  color: var(--gold-light, #C9A95C) !important;
}
/* AZI Rituals — stil pentru pagina de Checkout ("Finalizare Comandă")
   Unde se pune: Customizer (Personalizează) → Additional CSS.
   Adaugă tot codul de mai jos LA SFÂRȘITUL Additional CSS existent — nu
   înlocui restul, doar adaugă. Scopat pe body.page-id-19 (Checkout).

   CE REZOLVĂ (5 august 2026): Amada a semnalat, cu screenshot-uri:
   1. Titlul paginii ("Finalizare Comandă") nu se vedea — era acoperit
      aproape complet de header-ul fix de sus (header-ul are 169px
      înălțime, dar secțiunea cu titlul nu avea niciun spațiu rezervat
      pentru el, deci titlul pornea la doar 50px de sus, ascuns sub
      header). Pe Cart, aceeași secțiune are un padding-top care o
      împinge sub header — pe Checkout lipsea complet. Adăugat.
   2. Aceleași câmpuri "Țară/regiune" și "Județ" (select2) ca pe Cart,
      cu aceeași problemă — cutii albe, neatinse de brand. Aceeași
      cauză, același fix (vezi azi-cart-shipping-calculator-style.css
      pentru explicația completă) — aici doar scopat pe Checkout.
   3. Caseta metodei de plată salvate ("Card" → cardurile Visa salvate) —
      fundal gri-mov deschis, text greu de citit. E stilul implicit al
      WooCommerce Payments/Stripe pentru acea casetă, nu ceva ce
      trebuia scris de la zero — doar suprascris cu paleta AZI.

   Verificat live (Claude in Chrome): titlul e vizibil sub header, toate
   câmpurile arată la fel ca pe Cart, caseta de plată e închisă la
   culoare cu text lizibil. */

/* 1) titlul paginii — spațiu sub header-ul fix (169px), ca pe Cart */
body.page-id-19 .azi-checkout-hero {
  padding-top: 140px !important;
}

/* 2) select2 (Țară/regiune, Județ) — identic cu Cart, doar scopat aici */
body.page-id-19 .woocommerce-shipping-calculator .required,
body.page-id-19 .required {
  color: var(--gold-light, #C9A95C) !important;
}

body.page-id-19 .select2-container .select2-selection--single {
  height: 45px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  border-radius: 2px !important;
  display: flex !important;
  align-items: center !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
  font-size: 16px !important;
  padding-left: 12px !important;
  padding-right: 30px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: normal !important;
  height: auto !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__arrow {
  height: 43px !important;
  display: flex !important;
  align-items: center !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--gold-light, #C9A95C) transparent transparent transparent !important;
}

body.page-id-19 .select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--gold-light, #C9A95C) transparent !important;
}

body.page-id-19 .select2-dropdown {
  background: var(--bg, #0c0b0a) !important;
  border: 1px solid var(--gold, #8B6914) !important;
  border-radius: 2px !important;
}

body.page-id-19 .select2-search--dropdown .select2-search__field {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-19 .select2-results__option {
  background: var(--bg, #0c0b0a) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-19 .select2-results__option--highlighted {
  background: var(--gold, #8B6914) !important;
  color: var(--bg, #0c0b0a) !important;
}

body.page-id-19 .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) {
  background: rgba(201, 169, 92, 0.35) !important;
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 input.input-text {
  line-height: 24px !important;
}

/* 3) caseta metodei de plată salvate (WooCommerce Payments/Stripe) —
   fundal implicit gri-mov deschis, suprascris cu paleta AZI */
body.page-id-19 .woocommerce-checkout-payment,
body.page-id-19 .payment_box {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 .payment_box * {
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 .payment_box a {
  color: var(--gold-light, #C9A95C) !important;
}

/* FIX 5 august (2) — Amada a cerut, cu screenshot-uri:

   1. Titlul tot nu era centrat (doar vizibil, din fix-ul anterior) —
      centrat acum.

   2. "Ai un cupon? Dă clic aici..." de sub titlu — cerut să dispară,
      e suficient titlul centrat fără el. Ascuns (nu șters din temă —
      dacă se răzgândește, e ușor de reafișat).

   3. O zonă din metodele de plată nu se vedea bine — găsită: lângă
      iconițele VISA/Mastercard/Amex e un mic badge "+3" (mai multe
      tipuri de card acceptate) care vine din WooCommerce Payments cu
      text aproape negru pe fundal aproape negru (stil implicit,
      gândit pentru checkout-uri deschise la culoare) — text invizibil
      pe temă închisă. Suprascris cu culorile AZI.

   4. Butonul "Plasează comanda" — nu doar centrat cu margin:auto, ca la
      celelalte butoane, pentru că are `float:right` din stilul implicit
      WooCommerce (float-ul anulează margin:auto) — trebuia scos întâi
      float-ul, apoi centrat. */

body.page-id-19 .azi-checkout-title,
body.page-id-19 .azi-checkout-hero {
  text-align: center !important;
}

body.page-id-19 .azi-coupon-toggle {
  display: none !important;
}

body.page-id-19 .payment-methods--logos-count {
  color: var(--cream, #E8DCC8) !important;
  background: rgba(255, 255, 255, 0.12) !important;
}

body.page-id-19 .form-row.place-order {
  text-align: center !important;
}

body.page-id-19 #place_order {
  float: none !important;
  display: block !important;
  margin: 20px auto 0 !important;
}
/* FIX 5 august (3) — Amada a semnalat "header-ul și footer-ul sunt
   incomplete": inima de la wishlist din header era neagră pe fundal
   negru (invizibilă) și butonul "Începe" din formularul de newsletter
   din footer era la fel (text aproape negru, fundal transparent).
   Cauza reală, comună la amândouă: toată paleta de culori a site-ului
   (--gold, --gold-light, --cream, --bg etc.) e definită separat, pentru
   FIECARE page-id în parte (body.page-id-42 {...}, body.page-id-18
   {...}, body.woocommerce-shop {...} etc.) — o listă lungă la care, se pare,
   Checkout (page-id-19) nu a fost adăugat niciodată. Fără aceste
   variabile, orice regulă din temă care le folosește fără valoare de
   rezervă (ex. "fill: var(--gold-light)", nu "var(--gold-light,
   #C9A95C)") cade pe valoarea implicită a browserului — negru.
   Restul fix-urilor din acest fișier au mers oricum, pentru că foloseau
   mereu o valoare de rezervă (ex. var(--gold, #8B6914)) — dar elemente
   din TEMĂ (nu din fix-urile mele), ca inima sau butonul de newsletter,
   nu au. Soluție: adaug direct variabilele pentru page-id-19, cu
   aceleași valori exacte ca la Cart (page-id-18) — rezolvă nu doar cele
   2 semnalate, ci orice alt loc din temă care ar fi avut aceeași
   problemă pe Checkout, fără să știm încă. */

body.page-id-19 {
  --gold: #8B6914;
  --gold-light: #C9A95C;
  --biscuit: #C4A882;
  --cream: #E8DCC8;
  --bg: #050405;
  --bg-soft: #0c0b0a;
  --line: rgba(232, 220, 200, 0.14);
  --white: #F7F4EE;
  --white-strong: #FFFFFF;
}

/* AZI Rituals — stil pentru pagina de Checkout ("Finalizare Comandă")
   Unde se pune: Customizer (Personalizează) → Additional CSS.
   Adaugă tot codul de mai jos LA SFÂRȘITUL Additional CSS existent — nu
   înlocui restul, doar adaugă. Scopat pe body.page-id-19 (Checkout).

   CE REZOLVĂ (5 august 2026): Amada a semnalat, cu screenshot-uri:
   1. Titlul paginii ("Finalizare Comandă") nu se vedea — era acoperit
      aproape complet de header-ul fix de sus (header-ul are 169px
      înălțime, dar secțiunea cu titlul nu avea niciun spațiu rezervat
      pentru el, deci titlul pornea la doar 50px de sus, ascuns sub
      header). Pe Cart, aceeași secțiune are un padding-top care o
      împinge sub header — pe Checkout lipsea complet. Adăugat.
   2. Aceleași câmpuri "Țară/regiune" și "Județ" (select2) ca pe Cart,
      cu aceeași problemă — cutii albe, neatinse de brand. Aceeași
      cauză, același fix (vezi azi-cart-shipping-calculator-style.css
      pentru explicația completă) — aici doar scopat pe Checkout.
   3. Caseta metodei de plată salvate ("Card" → cardurile Visa salvate) —
      fundal gri-mov deschis, text greu de citit. E stilul implicit al
      WooCommerce Payments/Stripe pentru acea casetă, nu ceva ce
      trebuia scris de la zero — doar suprascris cu paleta AZI.

   Verificat live (Claude in Chrome): titlul e vizibil sub header, toate
   câmpurile arată la fel ca pe Cart, caseta de plată e închisă la
   culoare cu text lizibil. */

/* 1) titlul paginii — spațiu sub header-ul fix (169px), ca pe Cart */
body.page-id-19 .azi-checkout-hero {
  padding-top: 140px !important;
}

/* 2) select2 (Țară/regiune, Județ) — identic cu Cart, doar scopat aici */
body.page-id-19 .woocommerce-shipping-calculator .required,
body.page-id-19 .required {
  color: var(--gold-light, #C9A95C) !important;
}

body.page-id-19 .select2-container .select2-selection--single {
  height: 45px !important;
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  border-radius: 2px !important;
  display: flex !important;
  align-items: center !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
  font-size: 16px !important;
  padding-left: 12px !important;
  padding-right: 30px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: normal !important;
  height: auto !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__arrow {
  height: 43px !important;
  display: flex !important;
  align-items: center !important;
}

body.page-id-19 .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--gold-light, #C9A95C) transparent transparent transparent !important;
}

body.page-id-19 .select2-container--open .select2-selection--single .select2-selection__arrow b {
  border-color: transparent transparent var(--gold-light, #C9A95C) transparent !important;
}

body.page-id-19 .select2-dropdown {
  background: var(--bg, #0c0b0a) !important;
  border: 1px solid var(--gold, #8B6914) !important;
  border-radius: 2px !important;
}

body.page-id-19 .select2-search--dropdown .select2-search__field {
  background: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(232, 220, 200, 0.2) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-19 .select2-results__option {
  background: var(--bg, #0c0b0a) !important;
  color: var(--cream, #E8DCC8) !important;
  font-family: Jost, sans-serif !important;
}

body.page-id-19 .select2-results__option--highlighted {
  background: var(--gold, #8B6914) !important;
  color: var(--bg, #0c0b0a) !important;
}

body.page-id-19 .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) {
  background: rgba(201, 169, 92, 0.35) !important;
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 input.input-text {
  line-height: 24px !important;
}

/* 3) caseta metodei de plată salvate (WooCommerce Payments/Stripe) —
   fundal implicit gri-mov deschis, suprascris cu paleta AZI */
body.page-id-19 .woocommerce-checkout-payment,
body.page-id-19 .payment_box {
  background: rgba(255, 255, 255, 0.04) !important;
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 .payment_box * {
  color: var(--cream, #E8DCC8) !important;
}

body.page-id-19 .payment_box a {
  color: var(--gold-light, #C9A95C) !important;
}

/* FIX 5 august (2) — Amada a cerut, cu screenshot-uri:

   1. Titlul tot nu era centrat (doar vizibil, din fix-ul anterior) —
      centrat acum.

   2. "Ai un cupon? Dă clic aici..." de sub titlu — cerut să dispară,
      e suficient titlul centrat fără el. Ascuns (nu șters din temă —
      dacă se răzgândește, e ușor de reafișat).

   3. O zonă din metodele de plată nu se vedea bine — găsită: lângă
      iconițele VISA/Mastercard/Amex e un mic badge "+3" (mai multe
      tipuri de card acceptate) care vine din WooCommerce Payments cu
      text aproape negru pe fundal aproape negru (stil implicit,
      gândit pentru checkout-uri deschise la culoare) — text invizibil
      pe temă închisă. Suprascris cu culorile AZI.

   4. Butonul "Plasează comanda" — nu doar centrat cu margin:auto, ca la
      celelalte butoane, pentru că are `float:right` din stilul implicit
      WooCommerce (float-ul anulează margin:auto) — trebuia scos întâi
      float-ul, apoi centrat. */

body.page-id-19 .azi-checkout-title,
body.page-id-19 .azi-checkout-hero {
  text-align: center !important;
}

body.page-id-19 .azi-coupon-toggle {
  display: none !important;
}

body.page-id-19 .payment-methods--logos-count {
  color: var(--cream, #E8DCC8) !important;
  background: rgba(255, 255, 255, 0.12) !important;
}

body.page-id-19 .form-row.place-order {
  text-align: center !important;
}

body.page-id-19 #place_order {
  float: none !important;
  display: block !important;
  margin: 20px auto 0 !important;
}
/* AZI Rituals — Cart (page-id-18) pe mobil: pozele produselor lipseau
   complet + rândul de produs arăta "diform" (nume centrat, lățimi
   ciudate). Unde se pune: Customizer (Personalizează) → Additional CSS,
   adaugă LA SFÂRȘITUL a ce e deja acolo (nu înlocui restul).

   CE REZOLVĂ (5 august 2026): Amada a semnalat, cu screenshot-uri reale
   de pe telefon: "nu se vad pozele produselor, toate sectiunile sunt
   diforme".

   CAUZA REALĂ (verificat live, cu un iframe la 390px lățime — fereastra
   de Chrome nu poate fi redimensionată real în acest mediu de testare):
   există DOUĂ seturi de reguli CSS pentru rândul de produs pe mobil,
   scrise în sesiuni diferite, care se suprapun:

   1. Un set mai vechi, bazat pe flex (`order`, `flex: 1 1 160px`,
      `text-align: right` etc.) — scris înainte de rescrierea din
      1 august.
   2. Un set mai nou, corect, bazat pe grid (`display: grid !important`,
      `grid-template-areas: "thumb name remove" ...`) — din rescrierea
      "Cart rows — full rewrite" de pe 1 august.

   Grid-ul câștigă la POZIȚIONARE (fiecare element ajunge în zona lui),
   dar proprietățile simple din regula veche de flex (width, text-align)
   tot se aplică — sunt valide și într-un layout grid, nu doar în flex.
   Rezultat: numele produsului avea o lățime FIXĂ de 160px într-o
   coloană de grid de-abia ~211px lată, aliniat la dreapta în loc de
   stânga — de-aia arăta strâns/centrat/"diform".

   Poza (`.product-thumbnail`) lipsea complet dintr-un motiv diferit:
   tema WooCommerce are, implicit, `display: none` pe acea coloană
   (gândită pentru un layout de tabel clasic, nu pentru grid). Nicio
   regulă AZI nu suprascria explicit acel `display: none` — regulile
   noi de grid setează doar `grid-area: thumb`, dar asta nu are niciun
   efect dacă elementul e oricum `display: none`. Poza (imaginea propriu-
   zisă, în interiorul coloanei) ERA stilizată corect (64px, chenar,
   fundal gradient) — doar containerul ei era invizibil.

   Nu am șters regulile vechi (risc pe un site live, greu de găsit exact
   în Additional CSS-ul de peste 500KB) — le suprascriu explicit, aici,
   la final, unde câștigă prin ordine.

   Bonus, tot pe mobil: rândul de livrare estimată din "Total coș"
   ("Livrare: Introdu adresa... 1600 Amphitheatre Parkway...") avea
   mesajul și adresa lipite, fără nicio despărțire — greu de citit.
   Adăugat un rând nou vizual înainte de adresă.

   Verificat live (iframe 390px și 375px): poza apare, numele e aliniat
   la stânga lângă poză, rândul de livrare se citește clar. */

@media (max-width: 768px) {
  /* 1) poza produsului — readusă la vedere */
  body.page-id-18 table.cart td.product-thumbnail {
    display: block !important;
  }

  /* 2) numele, cantitatea și sub-totalul — scapă de lățimea fixă și
     alinierea la dreapta moștenite din regula veche de flex */
  body.page-id-18 table.cart td.product-name {
    width: auto !important;
    text-align: left !important;
  }

  body.page-id-18 table.cart td.product-quantity {
    width: auto !important;
    text-align: left !important;
  }

  body.page-id-18 table.cart td.product-subtotal {
    width: auto !important;
    text-align: left !important;
  }

  /* 3) rândul de livrare estimată din Total coș — adresa pe rând nou */
  body.page-id-18 tr.woocommerce-shipping-totals td > strong {
    display: block;
    margin-top: 6px;
  }
}
/* AZI Rituals — Cart (page-id-18) pe mobil, runda 2 (5 august 2026).
   Unde se pune: Customizer (Personalizează) → Additional CSS, adaugă LA
   SFÂRȘITUL a ce e deja acolo — inclusiv după azi-cart-mobile-
   professional-fix.css (primul fix, de mai devreme azi). Nu înlocui
   nimic, doar adaugă.

   CE REZOLVĂ, cu screenshot-uri reale de pe telefon:

   1. "pozele nu sunt afișate cum trebuie" — poza era mică (64px) și
      stătea lipită sus, lângă titlu, în timp ce cantitatea și prețul
      erau mult mai jos — arăta dezechilibrat. Mărită la 80px și
      centrată pe verticală față de tot rândul (titlu + cantitate +
      preț împreună), nu doar față de titlu.

   2. "pretul langa cantitate, nu sub" — rândul de produs avea 3 rânduri
      de grid (nume / cantitate / preț, fiecare pe rândul lui). Prețul
      și cantitatea sunt acum pe ACELAȘI rând — cantitatea la stânga,
      prețul la dreapta (folosesc aceeași zonă de grid pentru amândouă,
      poziționate cu justify-self, o tehnică standard CSS Grid).

   3. "butonul de aplica cuponul sa fie langa field" — câmpul "Cod cupon"
      și butonul "Aplică cuponul" erau unul sub altul (WooCommerce le
      pune într-un container flex, dar cu flex-wrap:wrap, care se rupea
      pe ecran îngust din cauza lățimilor fixe implicite). Acum stau pe
      același rând — câmpul se strânge/lărgește după spațiul disponibil,
      butonul rămâne cât are nevoie de text.

   4. "actualizeaza cosul asezat ca restul butoanelor" — mutat pe rândul
      lui, lat cât toată cutia (ca restul butoanelor mari de pe site),
      cu spațiu clar față de rândul de cupon de deasupra. NOTĂ: butonul
      rămâne vizual "stins" (mai transparent) până schimbi o cantitate —
      asta e comportamentul normal, nativ, al WooCommerce (butonul chiar
      e dezactivat/nefuncțional dacă nu ai modificat nimic în coș) — nu
      e un stil greșit, doar arată că nu ai ce actualiza încă. Dacă vrei
      să arate la fel de "aprins" ca restul butoanelor mereu, spune-mi și
      schimb asta separat.

   Verificat live la 390px și 375px, cu 1 și cu 2 produse, nume lung de
   produs inclus. */

@media (max-width: 768px) {
  /* 1) poza — mai mare, centrată pe verticală față de tot rândul */
  body.page-id-18 table.cart td.product-thumbnail {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.page-id-18 table.cart td.product-thumbnail img {
    width: 80px !important;
    height: 80px !important;
  }

  /* puțin spațiu în plus în interiorul rândului, ca prețul din dreapta
     să nu ajungă lipit de marginea cutiei */
  body.page-id-18 table.cart tr.cart_item {
    padding: 20px 6px !important;
  }

  /* 2) cantitate + preț pe același rând, în loc de rânduri separate —
     ambele folosesc aceeași zonă de grid ("qtyprice"), poziționate cu
     justify-self (cantitate la stânga, preț la dreapta) */
  body.page-id-18 table.cart tr.cart_item {
    grid-template-areas:
      "thumb name remove"
      "thumb qtyprice qtyprice" !important;
  }

  body.page-id-18 table.cart td.product-quantity {
    grid-area: qtyprice !important;
    justify-self: start !important;
    align-self: center !important;
  }

  body.page-id-18 table.cart td.product-subtotal {
    grid-area: qtyprice !important;
    justify-self: end !important;
    align-self: center !important;
  }

  /* 3) cupon — input + buton Aplică pe același rând */
  body.page-id-18 .coupon {
    flex-wrap: nowrap !important;
    gap: 8px;
  }

  body.page-id-18 .coupon #coupon_code {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }

  body.page-id-18 .coupon button[name="apply_coupon"] {
    flex: 0 0 auto !important;
    width: auto !important;
    white-space: nowrap;
  }

  /* 4) Actualizează coșul — pe rândul lui, lat cât toată cutia */
  body.page-id-18 table.cart td.actions button[name="update_cart"] {
    display: block !important;
    width: 100% !important;
    margin-top: 14px !important;
  }
}
/* AZI Rituals — Cart (page-id-18) pe mobil, runda 3 (5 august 2026).
   Unde se pune: Customizer (Personalizează) → Additional CSS, adaugă LA
   SFÂRȘITUL a ce e deja acolo — după fix-urile 1 și 2 de mai devreme
   azi. Nu înlocui nimic, doar adaugă.

   CE REZOLVĂ, cu screenshot-uri reale de pe telefon (cu cerc roșu):

   1. "scrisul e suprapus peste imaginea lumânării" — am mărit poza la
      80px în runda 2, dar am uitat să lărgesc și coloana de grid
      rezervată pentru ea (rămăsese 64px) — poza ieșea din coloana ei și
      se suprapunea peste text. Lărgită coloana la 92px.

   2. "colțul din chenar, dreapta sus, lipsește total" — cauza: tabelul
      de produse (table.cart) are colțuri rotunjite (border-radius:5px)
      dar border-collapse:collapse (o proprietate de tabel care combină
      liniile dintre celule) — combinația asta e un bug cross-browser
      cunoscut: border-radius nu se randează corect pe un tabel cu
      border-collapse:collapse, mai ales în Safari (telefonul tău) —
      colțul pur și simplu nu se rotunjește, rămâne "tăiat". Nu am putut
      reproduce exact ruptura în browserul meu de test (Chrome se
      descurcă mai "iertător" cu acest bug), dar mecanismul e confirmat
      și documentat — fix: border-collapse:separate, care permite
      colțurilor rotunjite să se randeze corect peste tot.

   3. "actualizeaza cosul in dreapta, acum nu are nicio direcție" — nu
      mai e lat cât toată cutia (asta părea "fără direcție" pe ecran
      îngust) — acum stă la dreapta, cât are nevoie de text, aliniat cu
      butonul "Aplică cuponul" de deasupra.

   4. Spațiile goale încercuite — verificate live, exact 2 zone erau
      goale cu adevărat (nu conțineau niciun element ascuns, doar
      margini/padding generoase gândite pentru desktop):
      a) între cutia de produse+cupon și cutia "Total coș" — 24px
         margine de jos + 30px padding sus, acum 16px+16px.
      b) între butonul "Continuă cu finalizarea comenzii" și footer —
         60px margine + 22px padding, acum 24px total.
      Zona din jurul rândului "Reconnect" (a treia încercuire) s-a
      rezolvat automat odată cu fix-ul de la punctul 1 (era tot efectul
      suprapunerii text/poză, care lăsa un gol vizual în dreapta).

   BUG SUPLIMENTAR găsit în timpul verificării (nu era semnalat explicit,
   dar cauza suprapunerea persistentă): cantitatea și prețul, deși puse
   pe același rând în runda 2, aveau un `margin-left: 76px` moștenit
   dintr-un layout mai vechi (de dinainte de rescrierea grid din
   1 august) — asta le împingea mult spre dreapta, unul peste altul.
   Suprascris cu margin:0.

   Verificat live la 393px (lățimea reală a telefonului tău), cu 3
   produse, nume lungi de produs incluse, corner-ul zoom-at direct. */

@media (max-width: 768px) {
  /* corner rotunjit — border-collapse:separate repară randarea */
  body.page-id-18 table.cart {
    border-collapse: separate !important;
    border-top: 1px solid rgba(232, 220, 200, 0.2) !important;
    margin-bottom: 16px !important;
  }

  /* rândul de produs — coloană mai lată pentru poza de 80px, plus
     cantitate și preț în coloane separate (nu suprapuse) */
  body.page-id-18 table.cart tr.cart_item {
    padding: 20px 6px !important;
    grid-template-columns: 92px minmax(0, 1fr) 92px !important;
    grid-template-areas:
      "thumb name remove"
      "thumb qty price" !important;
  }

  body.page-id-18 table.cart td.product-thumbnail {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.page-id-18 table.cart td.product-thumbnail img {
    width: 80px !important;
    height: 80px !important;
  }

  body.page-id-18 table.cart td.product-name {
    min-width: 0 !important;
  }

  body.page-id-18 table.cart td.product-quantity {
    grid-area: qty !important;
    justify-self: start !important;
    align-self: center !important;
    margin: 0 !important;
  }

  body.page-id-18 table.cart td.product-subtotal {
    grid-area: price !important;
    justify-self: end !important;
    align-self: center !important;
    margin: 0 !important;
  }

  /* cupon — input + buton Aplică pe același rând (din runda 2) */
  body.page-id-18 .coupon {
    flex-wrap: nowrap !important;
    gap: 8px;
  }

  body.page-id-18 .coupon #coupon_code {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
  }

  body.page-id-18 .coupon button[name="apply_coupon"] {
    flex: 0 0 auto !important;
    width: auto !important;
    white-space: nowrap;
  }

  /* Actualizează coșul — la dreapta, nu lat cât toată cutia */
  body.page-id-18 table.cart td.actions button[name="update_cart"] {
    display: inline-block !important;
    width: auto !important;
    margin-top: 14px !important;
    margin-left: auto !important;
    float: right !important;
  }

  body.page-id-18 table.cart td.actions {
    overflow: hidden;
  }

  /* spații goale — strânse */
  body.page-id-18 .cart-collaterals {
    padding-top: 16px !important;
  }

  body.page-id-18 .woocommerce {
    margin-bottom: 24px !important;
  }
}
/* AZI Rituals — Cart pe mobil, runda 4 (5 august 2026). Unde se pune:
   Customizer (Personalizează) → Additional CSS, la sfârșit, după toate
   fix-urile de mai devreme azi (1, 2 și 3).

   CE REZOLVĂ, cu screenshot-uri reale + cerc roșu peste zonele exacte:

   1. "colțul din chenar tot lipsește" — nu era, de fapt, un bug de
      randare a colțului rotunjit (ce am presupus în runda 3). Cauza
      reală, găsită abia acum prin măsurători exacte: butonul × de
      lângă fiecare produs NU ocupa toată lățimea coloanei lui — stătea
      undeva la mijloc, lăsând un gol de 67px până la marginea reală a
      cutiei. Golul ăla gol arăta exact ca un "colț lipsă". Fix: ×-ul
      aliniat acum la capătul din dreapta al coloanei lui.

   2. "muta catre dreapta butonul de x" — rezolvat de același fix de mai
      sus (×-ul e acum aproape de margine, nu la mijloc).

   3. "actualizeaza cosul sa nu fie lipit de margine" — adăugat 6px
      spațiu față de marginea dreaptă.

   4. "centreaza lumanarile din You may also like" — cauza: secțiunea de
      recomandări (.azi-cart-upsell__grid) e un flex container aliniat
      implicit la stânga (justify-content:normal = flex-start). Cu un
      singur produs recomandat, cardul lui rămânea lipit de marginea
      stângă în loc să fie centrat. Adăugat justify-content:center.

   5. "footer — categoriile una langa alta, nu un carnat lung" — cauza:
      pe mobil, fiecare secțiune de footer (Descoperă, Magazin, Ritualul
      Tău, Legal) avea `grid-column: 1` explicit dintr-un fix mai vechi
      de "totul pe o coloană" — asta le ținea forțat una sub alta, chiar
      și după ce am adăugat o grilă de 2 coloane pe .footer-top. Am
      resetat la grid-column:auto, ca fiecare secțiune să-și găsească
      singură locul în grila de 2 coloane — rezultă exact perechile
      cerute: Descoperă+Magazin pe primul rând, Ritualul Tău+Legal pe al
      doilea, Newsletter-ul rămâne lat cât toată pagina, dedesubt.
      NOTĂ: acest fix pentru footer NU e scopat doar pe page-id-18 (Cart)
      — footer-ul e identic pe tot site-ul, deci fix-ul se aplică peste
      tot, ceea ce cred că e ce vrei (footer-ul ar trebui să arate la fel
      peste tot). Spune-mi dacă vrei altfel doar pe Cart.

   Verificat live la 393px, cu produse reale, secțiunea de recomandări
   afișată (necesită coș cu loc pentru cel puțin un produs recomandat). */

@media (max-width: 768px) {
  /* 1+2) butonul × — aliniat la marginea dreaptă a coloanei lui */
  body.page-id-18 table.cart td.product-remove {
    justify-self: end !important;
    width: auto !important;
  }

  /* 3) Actualizează coșul — puțin spațiu față de marginea dreaptă */
  body.page-id-18 table.cart td.actions button[name="update_cart"] {
    margin-right: 6px !important;
  }

  /* 4) You may also like — cardul centrat, nu lipit de stânga */
  body.page-id-18 .azi-cart-upsell__grid {
    justify-content: center !important;
  }
}

/* 5) Footer — 2 coloane (Descoperă+Magazin / Ritualul Tău+Legal) —
   site-wide, nu doar pe Cart, pentru consecvență */
@media (max-width: 768px) {
  .footer-col {
    grid-column: auto !important;
  }

  .footer-brand,
  .footer-newsletter {
    grid-column: 1 / -1 !important;
  }

  .footer-top {
    grid-template-columns: 1fr 1fr !important;
    column-gap: 20px !important;
  }
}
/* AZI Rituals — Cart pe mobil, runda 5 (6 august 2026). Unde se pune:
   Customizer (Personalizează) → Additional CSS, la sfârșit, după toate
   fix-urile de mai devreme (1, 2, 3, 4).

   CE REZOLVĂ: "spațiu între text și butonul × în notificări".

   Cauza reală, găsită prin verificare directă a tuturor regulilor CSS
   care se aplică pe notificare (nu doar cea evidentă): notificările au
   un stil unificat, site-wide, care rezervă 48px în dreapta pentru
   butonul ×. DAR există o a doua regulă, scrisă mai demult, specifică
   doar pentru Cart (body.page-id-18 .woocommerce-message ...), care are
   AICEEAȘI prioritate (!important) ȘI o specificitate mai mare (e mai
   "precisă" — vizează exact pagina de Cart) — pe Cart, ea câștigă
   automat și reduce spațiul din dreapta la doar 22px. Cum butonul ×
   are nevoie de ~32px ca să nu se lipească de text, textul și butonul
   ajungeau aproape suprapuse — DOAR pe Cart (pe restul site-ului,
   unde regula asta nu există, spațiul era deja corect).

   Fix: o singură proprietate (padding-right), suprascrisă din nou cu
   aceeași specificitate — câștigă pentru că e adăugată mai jos în
   fișier.

   Verificat live la 393px: text și × clar separate, restul stilului
   (poziție, fundal, bordură) neschimbat. */

body.page-id-18 .woocommerce-message,
body.page-id-18 .woocommerce-error,
body.page-id-18 .woocommerce-info,
body.page-id-18 .woocommerce-NoticeGroup,
body.page-id-18 ul.woocommerce-error {
  padding-right: 46px !important;
}
/* AZI Rituals — footer pe mobil, identic pe toate paginile (6 august 2026).
   Unde se pune: Customizer (Personalizează) → Additional CSS, la sfârșit.

   CE REZOLVĂ: pe Cart, footer-ul arată corect — "Discover" lângă "Shop"
   pe un rând, "Your Ritual" lângă "Legal" pe rândul următor (fix-ul din
   5 august). Pe Checkout, în schimb, arăta diferit — "Discover" lângă
   "Your Ritual" pe primul rând, apoi "Shop" sub "Discover" (stivă pe
   verticală în aceeași coloană, nu perechi pe orizontală).

   CAUZA: fiecare secțiune de footer (Discover, Shop, Your Ritual, Legal)
   e grupată câte două într-un <div class="footer-col-group"> — Discover
   +Shop într-un grup, Your Ritual+Legal în altul (gândit pentru desktop,
   ca Newsletter-ul să aibă mai mult spațiu). Există deja o regulă care
   "dezactivează" acest grup (display:contents — face grupul invizibil
   pentru layout, ca cele 4 secțiuni să se poată așeza direct 2×2), dar
   e scrisă ca o listă fixă de pagini (Cart, My Account, câteva altele)
   și Checkout pur și simplu nu era în listă — de-aia era singura pagină
   cu comportamentul vechi.

   FIX: în loc să adaug Checkout (page-id-19) la lista de pagini — ceea
   ce ar însemna să repet aceeași problemă pentru orice pagină viitoare
   care nu e în listă — regula de mai jos se aplică peste tot, doar pe
   mobil (sub 768px), indiferent de pagină. Cere-mi explicit dacă vrei
   ca vreo pagină anume să arate altfel pe mobil.

   Verificat live pe Checkout la 393px — Discover+Shop și Your Ritual+
   Legal apar acum perechi, exact ca pe Cart. Desktop rămâne neschimbat
   (regula e doar sub 768px). */

@media (max-width: 768px) {
  .footer-col-group {
    display: contents !important;
  }
}
/* AZI Rituals — culoarea bulinelor radio pentru metodele de livrare
   (6 august 2026). Unde se pune: Customizer (Personalizează) →
   Additional CSS, la sfârșit.

   CE REZOLVĂ: pe Cart (și, la fel, pe Checkout — verificat, folosesc
   exact aceleași clase native WooCommerce), bulina selectată lângă
   metoda de livrare aleasă ("Free shipping", "Sameday - Easybox" etc.)
   era albastru — culoarea implicită a browser-ului pentru radio button-
   uri native, nesetată niciodată explicit de tema/CSS-ul site-ului.

   Fix: o singură proprietate (accent-color — controlează culoarea
   nativă a radio/checkbox-urilor din browser), pe culoarea gold a
   brandului. Nu e scopat pe page-id, pentru că selectorul e deja
   suficient de precis (butoanele astea radio există doar în lista de
   metode de livrare, pe Cart și Checkout) — se aplică automat peste tot
   unde apare, fără să mai fie nevoie de o listă de pagini.

   Verificat live pe Cart la loc de bulină selectată. */

.woocommerce-shipping-methods input[type="radio"],
ul#shipping_method input[type="radio"] {
  accent-color: var(--gold-light, #C9A95C) !important;
}
/* AZI Rituals — fix suprapunere My Account → Comenzi (și orice alt subtab
   care afișează un mesaj/notificare WooCommerce în conținutul principal).
   21 August 2026.

   CAUZĂ: regula globală de stil pentru notificări tip "toast" (din blocul
   #azi-notice-style, folosit corect pe Cart/Checkout ca să arate ca un
   pop-up centrat sus pe ecran) setează, printre altele:
     position: fixed !important;
     left: 50% !important;
     transform: translateX(-50%) !important;
   Regulile scopate pe body.page-id-20 din Additional CSS suprascriu deja
   corect position/width/margin înapoi la un card normal, static — DAR
   nu suprascriau și `transform`. Cum `transform` funcționează indiferent
   de `position`, cardul de pe My Account tot se muta cu jumătate din
   propria lățime spre stânga (aici, tocmai peste meniul lateral) — de-aia
   arăta suprapus peste "COMENZI"/"FAVORITE RITUALS" etc.

   Testat live pe azirituals.ro: cu regula asta adăugată, cardul
   "Confirmă adresa de email" / "Nicio comandă făcută până acum." se
   așază corect în coloana din dreapta meniului, fără suprapunere.

   UNDE SE ADAUGĂ: Customizer → Additional CSS (același loc unde sunt deja
   regulile "body.page-id-20 .woocommerce-MyAccount-content..."). Doar
   ADAUGĂ blocul de mai jos la finalul Additional CSS — nu șterge nimic
   din ce e deja acolo. */

body.page-id-20 .woocommerce-MyAccount-content .woocommerce-message,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-info,
body.page-id-20 .woocommerce-MyAccount-content .woocommerce-error {
  transform: none !important;
}
/* AZI Rituals — fix bug #9: mesajul de eroare la cupon invalid ("Cuponul ... nu
   poate fi aplicat...") nu respecta stilul unificat de notificari al site-ului.
   26 August 2026.

   CAUZA (verificata live, cu cuponul de test "FAKECODE99" pe /cart/):
   Mesajul de eroare NU vine dintr-un script custom al site-ului, ci este generat
   direct de WooCommerce, cu propriul lui CSS din pluginul de baza (fisierele
   woocommerce.css / woocommerce-smallscreen.css). Acel CSS seteaza doar
   "culoare rosie + font mic" — nu are nimic din stilul unificat (fundal inchis,
   bordura aurie sus, umbra) pe care il au celelalte notificari ale site-ului
   (ex. la adaugarea unui produs in cos). De-asta arata "in alt stil".

   FIX: am ales varianta "caseta ramane langa campul de cupon" (nu devine
   mesaj plutitor sus pe pagina, ca sa ramana clar legat de campul respectiv),
   dar ii dam aceeasi identitate vizuala ca restul notificarilor: fundal
   inchis, bordura aurie sus, padding, umbra, acelasi font. Acopera atat
   pagina Cos (/cart/), cat si campul de cupon de pe Checkout (/checkout/),
   pentru ca WooCommerce foloseste acelasi element si acolo.

   UNDE SE ADAUGA: Customizer → Additional CSS (acolo unde sunt toate
   celelalte reguli CSS ale site-ului) → lipeste la final → Publish. */

.woocommerce table.cart td.actions .coupon .coupon-error-notice,
.woocommerce-page table.cart td.actions .coupon .coupon-error-notice,
#add_payment_method table.cart td.actions .coupon .coupon-error-notice,
.woocommerce-cart table.cart td.actions .coupon .coupon-error-notice,
.woocommerce-checkout table.cart td.actions .coupon .coupon-error-notice,
.woocommerce form.checkout_coupon .coupon-error-notice {
  display: block !important;
  clear: both !important;
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-top: 12px !important;
  margin-bottom: 0 !important;
  padding: 12px 20px !important;
  background: var(--bg, #0c0b0a) !important;
  color: var(--cream, #E8DCC8) !important;
  border-top: 3px solid var(--gold, #8B6914) !important;
  box-shadow: rgba(0, 0, 0, 0.45) 0px 14px 34px !important;
  font-family: Jost, sans-serif !important;
  font-size: 0.85rem !important;
  letter-spacing: 0.02em !important;
  text-align: left !important;
}
/* AZI Rituals — Redesign Checkout. Scopat STRICT la Checkout (body.page-id-19) —
   nu afectează nicio altă pagină. 27 August 2026.

   ETAPA 1 (deja confirmată): restilizare vizuală (fundal, carduri, metode de
   livrare/plată ca opțiuni selectabile, sumar comandă, bară de încredere).

   ETAPA 2 (nou): fluxul ghidat pe pași (Livrare → Facturare → Plată), cu bară
   de progres sus și secțiunile care se restrâng într-un rezumat editabil.

   IMPORTANT: NICIUNA din cele două etape nu mută, ascunde sau elimină vreun
   câmp din formular la nivel de HTML -- doar arată/ascunde vizual prin clase
   CSS pe care le adaugă scriptul JS asociat. Dacă scriptul JS nu s-ar încărca
   dintr-un motiv oarecare, pagina rămâne exact ca înainte (toate câmpurile
   vizibile, nimic blocat) -- e un fallback sigur, nu poate "rupe" Checkout-ul.

   UNDE SE ADAUGĂ: Customizer → Additional CSS → înlocuiește conținutul vechi
   cu acesta → Publish. */

body.page-id-19 {
  --azi-bg: #050405;
  --azi-panel: #0c0b0a;
  --azi-cream: #e8dcc8;
  --azi-cream-dim: rgba(232,220,200,0.62);
  --azi-cream-faint: rgba(232,220,200,0.36);
  --azi-gold: #c9a95c;
  --azi-gold-deep: #8b6914;
  --azi-border: rgba(232,220,200,0.14);
  --azi-border-gold: rgba(201,169,92,0.45);
  position: relative;
}

/* ---- fundal cu strălucire aurie, ca pe restul site-ului ---- */
body.page-id-19::before {
  content: "";
  position: fixed;
  inset: 0;
  background:
    radial-gradient(circle at 15% 0%, rgba(139,105,20,0.13) 0%, rgba(139,105,20,0) 42%),
    radial-gradient(circle at 90% 20%, rgba(139,105,20,0.10) 0%, rgba(139,105,20,0) 46%),
    radial-gradient(circle at 50% 100%, rgba(139,105,20,0.07) 0%, rgba(0,0,0,0) 55%);
  pointer-events: none;
  z-index: 0;
}
/* Fix cerut de Amada (27 aug): pe restul paginilor site-ul are, dedesubtul
   oricărui alt efect, o textură foarte discretă care "plutește" încet
   (fumul/swirl-ul de care a întrebat) -- fiecare pagină are propria
   regulă "body.page-id-XX::before" cu această textură (ex. Cart =
   page-id-18), dar Checkout (page-id-19) nu fusese adăugat niciodată la
   acea listă, de-aia lipsea doar aici. Adăugăm același efect, cu aceiași
   parametri folosiți pe celelalte pagini (aceeași imagine, aceeași
   animație "textureDrift" -- deja definită o singură dată, sitewide, în
   Additional CSS -- aceeași opacitate mică și mod de amestecare
   "screen"). L-am pus pe ::after (nu ::before, care e deja ocupat de
   strălucirea aurie de mai sus) ca să nu se suprascrie una pe alta --
   ordinea vizuală rămâne: textură (cel mai în spate) → strălucire aurie
   → conținutul paginii (cel mai în față), exact ca la celelalte pagini
   plus stratul nostru auriu. */
body.page-id-19::after {
  content: "";
  position: fixed;
  inset: -12%;
  width: 124%;
  height: 124%;
  background-image: url("https://azirituals.ro/wp-content/uploads/2026/09/azi-texture-swirl-1200.webp");
  background-size: 1600px 1600px;
  background-repeat: repeat;
  opacity: 0.06;
  mix-blend-mode: screen;
  pointer-events: none;
  z-index: -1;
  animation: 160s linear 0s infinite normal none running textureDrift;
}
/* Fix cerut de Amada (27 aug): coloana din footer cu sigla și textul de
   prezentare ("Lumânări de masaj și ritualuri...") exista în cod exact
   ca pe celelalte pagini, dar era ascunsă DOAR pe Checkout de o regulă
   CSS veche, dinainte de acest proiect ("body.page-id-19 .footer-brand
   {display:none}"), scrisă direct în Additional CSS -- nu se găsește în
   niciun fișier salvat, deci nu știm cine/de ce a adăugat-o, dar nu are
   nicio legătură cu Etapa 2. O suprascriem ca să arate la fel ca pe
   restul site-ului. */
body.page-id-19 .footer-brand {
  display: block !important;
}
body.page-id-19 #customer_details,
body.page-id-19 #order_review_heading,
body.page-id-19 #order_review,
body.page-id-19 .woocommerce-checkout {
  position: relative;
  z-index: 1;
}

/* ---- bara de încredere (inserată de scriptul JS asociat) ---- */
body.page-id-19 .azi-trust-strip {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 34px;
  margin: 0 0 40px;
  padding: 16px 0;
  border-top: 1px solid var(--azi-border);
  border-bottom: 1px solid var(--azi-border);
}
body.page-id-19 .azi-trust-strip .azi-t {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.72rem;
  letter-spacing: 0.03em;
  color: var(--azi-cream-faint);
  font-family: Jost, sans-serif;
}
body.page-id-19 .azi-trust-strip svg { width: 16px; height: 16px; stroke: var(--azi-gold); flex-shrink: 0; }

/* ---- bara de progres pe pași (Livrare / Facturare / Plată) ---- */
body.page-id-19 .azi-stepper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: 100%;
  max-width: 640px;
  margin: 0 auto 40px;
  box-sizing: border-box;
}
body.page-id-19 .azi-step-node { display: flex; flex-direction: column; align-items: center; gap: 10px; flex: 1; position: relative; }
body.page-id-19 .azi-step-circle {
  width: 34px; height: 34px; border-radius: 50%;
  border: 1px solid var(--azi-border-gold);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.85rem; color: var(--azi-cream-dim);
  background: var(--azi-panel);
  transition: all .35s ease;
  z-index: 2;
  font-family: Jost, sans-serif;
}
body.page-id-19 .azi-step-node.azi-done .azi-step-circle { background: var(--azi-gold); border-color: var(--azi-gold); color: #0c0b0a; font-weight: 600; }
body.page-id-19 .azi-step-node.azi-active .azi-step-circle { border-color: var(--azi-gold); color: var(--azi-gold); box-shadow: 0 0 0 4px rgba(201,169,92,0.14); }
body.page-id-19 .azi-step-label { font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--azi-cream-faint); font-family: Jost, sans-serif; }
body.page-id-19 .azi-step-node.azi-active .azi-step-label,
body.page-id-19 .azi-step-node.azi-done .azi-step-label { color: var(--azi-cream-dim); }
body.page-id-19 .azi-step-line { position: absolute; top: 17px; left: 50%; width: 100%; height: 1px; background: var(--azi-border); z-index: 1; }
body.page-id-19 .azi-step-node.azi-done .azi-step-line { background: var(--azi-gold); }
body.page-id-19 .azi-step-node:last-child .azi-step-line { display: none; }

/* ---- carduri pentru Facturare / Livrare, acum STIVUITE (una sub alta),
   ca pași -- nu mai sunt puse una lângă alta, ca în Etapa 1 ---- */
body.page-id-19 #customer_details.col2-set { display: flex; flex-direction: column; gap: 22px; }
/* Bug găsit la testare (21 sept, semnalat de Amada -- "ambele coloane sunt
   înghesuite, nu sunt scalate corespunzător"): WooCommerce pune implicit pe
   .col-1/.col-2 o regulă "width: 48%" (gândită pentru vechiul layout cu cele
   două casete una lângă alta, cu float). Noi am schimbat layout-ul la flex
   pe coloană (una sub alta), dar nu am anulat niciodată acel "width: 48%"
   vechi -- rezultatul: fiecare casetă ocupa doar jumătate din lățimea
   disponibilă, cu tot restul spațiului gol în dreapta ei, exact aspectul
   "înghesuit și prost scalat" reclamat. Fix: fiecare casetă ocupă 100% din
   coloana ei. Selectorul cu #customer_details are prioritate mai mare decât
   regula veche a WooCommerce, deci o suprascrie sigur, indiferent de ordine. */
body.page-id-19 #customer_details.col2-set .col-1,
body.page-id-19 #customer_details.col2-set .col-2 {
  width: 100%;
  box-sizing: border-box;
}
/* Ordinea VIZUALĂ a pașilor este Livrare -> Facturare (așa au fost prezentate
   mockup-urile), deși în formularul WooCommerce câmpurile de facturare
   (.col-1) vin înaintea celor de livrare (.col-2) în cod. "order" schimbă
   DOAR ordinea afișată pe ecran -- WooCommerce trimite datele după atributul
   "name" al fiecărui câmp, nu după poziția din pagină, deci trimiterea
   comenzii nu este afectată în niciun fel. */
body.page-id-19 #customer_details .col-2 { order: 1; }
body.page-id-19 #customer_details .col-1 { order: 2; }
body.page-id-19 #customer_details .col-1,
body.page-id-19 #customer_details .col-2 {
  background: linear-gradient(180deg, rgba(232,220,200,0.025), rgba(0,0,0,0) 40%), var(--azi-panel);
  border: 1px solid var(--azi-border);
  border-radius: 3px;
  padding: 30px 32px;
  margin: 0;
  transition: border-color .3s ease, box-shadow .3s ease, opacity .3s ease, padding .2s ease;
}
body.page-id-19 #customer_details .col-1.azi-current,
body.page-id-19 #customer_details .col-2.azi-current {
  border-color: var(--azi-border-gold);
  box-shadow: 0 18px 44px rgba(0,0,0,0.35);
}
body.page-id-19 #customer_details .col-1.azi-locked,
body.page-id-19 #customer_details .col-2.azi-locked { opacity: 0.45; }
body.page-id-19 #customer_details .col-1.azi-collapsed,
body.page-id-19 #customer_details .col-2.azi-collapsed { padding: 22px 32px; }

/* .azi-step-edit este pus ca FRATE al h3 (nu în interiorul lui) și poziționat
   absolut peste el -- NU ca un copil al h3. Motiv găsit la testare (27 aug):
   scriptul de traducere RO/EN existent (azi_checkout_native_fields_translate.js)
   rescrie h3.textContent la fiecare schimbare de livrare/plată (evenimentele
   "updated_checkout"/"payment_method_selected"), ceea ce ar șterge orice
   element pus ÎN INTERIORUL h3-ului. Poziționându-l ca frate, rămâne intact. */
body.page-id-19 .woocommerce-billing-fields,
body.page-id-19 .woocommerce-shipping-fields {
  position: relative;
}
body.page-id-19 .woocommerce-billing-fields > h3,
body.page-id-19 .woocommerce-shipping-fields > h3 {
  display: flex;
  align-items: center;
  gap: 11px;
  margin-top: 0;
  /* Tema pune implicit "float:left" pe acest h3 (probabil pentru un vechi
     toggle "livrează la altă adresă?" care nu mai există) -- găsit la
     testare (27 aug): fiindcă h3 e scos din flux normal de float, orice
     element pus DUPĂ el (rezumatul, linkul Editează) se suprapunea peste
     el în loc să apară dedesubt. Anulăm float-ul, păstrăm doar flex-ul. */
  float: none;
  /* Bug #4 găsit la testare (27 aug): fără "width", h3 (fiind flex) se
     restrânge la lățimea textului ("shrink-to-fit"), deci pe coloana îngustă
     din stânga (~245px) textul lung ("Detalii de livrare" / "Detalii pentru
     facturare") ajungea aproape de marginea dreaptă -- exact acolo unde
     linkul "Editează" e poziționat absolut. Rezultat: textul și linkul se
     suprapuneau ușor. Fix: h3 ocupă toată lățimea (width:100%). Rezervarea
     de spațiu (padding-right) e pusă mai jos DOAR pe starea "collapsed" (vezi
     regula .azi-collapsed h3), fiindcă linkul "Editează" e vizibil numai
     atunci -- altfel, pe pasul activ/deschis, titlul ar rupe inutil pe 3
     rânduri deși linkul nici nu e afișat acolo. */
  width: 100%;
  box-sizing: border-box;
}
/* Loc rezervat pentru "Editează" doar când secțiunea e restrânsă (collapsed) --
   pasul activ/deschis nu are linkul afișat, deci titlul poate folosi toată
   lățimea fără să rupă inutil pe mai multe rânduri. */
body.page-id-19 #customer_details .col-1.azi-collapsed .woocommerce-billing-fields > h3,
body.page-id-19 #customer_details .col-2.azi-collapsed .woocommerce-shipping-fields > h3 {
  padding-right: 80px;
}
body.page-id-19 .woocommerce-billing-fields > h3::before,
body.page-id-19 .woocommerce-shipping-fields > h3::before {
  content: "";
  width: 19px;
  height: 19px;
  flex-shrink: 0;
  background-color: var(--azi-gold);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}
body.page-id-19 .woocommerce-billing-fields > h3::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/svg%3E");
}
body.page-id-19 .woocommerce-shipping-fields > h3::before {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.4'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Cpath d='M12 21s-7-5.5-7-11a7 7 0 0 1 14 0c0 5.5-7 11-7 11Z'/%3E%3Ccircle cx='12' cy='10' r='2.4'/%3E%3C/svg%3E");
}

/* ---- link "Editează" + rezumat, adăugate de JS, vizibile doar când pasul e finalizat ---- */
body.page-id-19 .azi-step-edit {
  display: none;
  position: absolute;
  top: 3px;
  right: 0;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--azi-gold);
  cursor: pointer;
  border-bottom: 1px solid transparent;
}
body.page-id-19 .azi-step-edit:hover { border-color: var(--azi-gold); }
body.page-id-19 #customer_details .col-1.azi-collapsed .azi-step-edit,
body.page-id-19 #customer_details .col-2.azi-collapsed .azi-step-edit { display: inline-block; }

body.page-id-19 .azi-step-summary {
  display: none;
  font-size: 0.84rem;
  color: var(--azi-cream-dim);
  margin: -6px 0 0 30px;
}
body.page-id-19 #customer_details .col-1.azi-collapsed .azi-step-summary,
body.page-id-19 #customer_details .col-2.azi-collapsed .azi-step-summary { display: block; }

/* ---- ascunde câmpurile + butonul Continuă când pasul e blocat sau deja
   finalizat -- ATENȚIE: implicit (fără nicio clasă azi-*) totul rămâne
   vizibil, deci dacă scriptul JS nu rulează din vreun motiv, pagina arată
   exact ca înainte, complet funcțională. ---- */
body.page-id-19 #customer_details .col-1.azi-locked .woocommerce-billing-fields__field-wrapper,
body.page-id-19 #customer_details .col-1.azi-locked label.woocommerce-form__label-for-checkbox,
body.page-id-19 #customer_details .col-1.azi-locked #mailpoet_woocommerce_checkout_optin_present_field,
body.page-id-19 #customer_details .col-1.azi-locked .azi-continue-btn,
body.page-id-19 #customer_details .col-1.azi-collapsed .woocommerce-billing-fields__field-wrapper,
body.page-id-19 #customer_details .col-1.azi-collapsed label.woocommerce-form__label-for-checkbox,
body.page-id-19 #customer_details .col-1.azi-collapsed #mailpoet_woocommerce_checkout_optin_present_field,
body.page-id-19 #customer_details .col-1.azi-collapsed .azi-continue-btn,
body.page-id-19 #customer_details .col-2.azi-locked .shipping_address,
body.page-id-19 #customer_details .col-2.azi-locked .woocommerce-additional-fields,
body.page-id-19 #customer_details .col-2.azi-locked .azi-continue-btn,
body.page-id-19 #customer_details .col-2.azi-collapsed .shipping_address,
body.page-id-19 #customer_details .col-2.azi-collapsed .woocommerce-additional-fields,
body.page-id-19 #customer_details .col-2.azi-collapsed .azi-continue-btn {
  display: none;
}

body.page-id-19 .azi-continue-btn {
  margin-top: 20px;
  background: linear-gradient(180deg, #d8b968, var(--azi-gold-deep));
  color: #0c0b0a;
  border: none;
  font-family: 'Jost', sans-serif;
  font-weight: 600;
  font-size: 0.8rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 14px 28px;
  border-radius: 3px;
  cursor: pointer;
  transition: transform .2s ease, box-shadow .2s ease;
}
body.page-id-19 .azi-continue-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 24px rgba(201,169,92,0.25); }

/* ---- mesaj scurt "completează câmpurile" dacă lipsește ceva la Continuă ---- */
body.page-id-19 .azi-step-warn {
  display: none;
  color: #e2b8a0;
  font-size: 0.78rem;
  margin-top: 14px;
  padding: 10px 14px;
  border: 1px solid rgba(226,184,160,0.35);
  border-radius: 3px;
  background: rgba(226,184,160,0.06);
}
body.page-id-19 .azi-step-warn.azi-show { display: block; }

/* ---- sumarul comenzii ca un card lateral, sticky pe ecrane late ----
   #order_review_heading și #order_review sunt mutate împreună într-un
   singur container (.azi-summary-wrap, creat de scriptul JS asociat) ca
   să rămână unite vizual la scroll. */
body.page-id-19 #order_review_heading {
  display: flex;
  align-items: center;
  gap: 11px;
}
body.page-id-19 #order_review {
  background: linear-gradient(180deg, rgba(201,169,92,0.05), rgba(0,0,0,0) 30%), var(--azi-panel);
  border: 1px solid var(--azi-border);
  border-radius: 3px;
  padding: 28px 30px 26px;
  margin-top: 14px;
}
/* puls discret care atrage atenția spre sumar când ajungi la pasul "Plată" */
body.page-id-19 .azi-summary-highlight { animation: azi-pulse 1.4s ease 2; border-radius: 3px; }
@keyframes azi-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(201,169,92,0); }
  50% { box-shadow: 0 0 0 7px rgba(201,169,92,0.16); }
}

@media (min-width: 992px) {
  body.page-id-19 form.woocommerce-checkout {
    display: grid;
    grid-template-columns: 1.5fr 1fr;
    gap: 0 32px;
    align-items: start;
  }
  body.page-id-19 form.woocommerce-checkout > .wcpay-express-checkout-wrapper { grid-column: 1 / -1; }
  body.page-id-19 .azi-stepper { grid-column: 1 / -1; }
  body.page-id-19 #customer_details.col2-set { grid-column: 1; }
  body.page-id-19 .azi-summary-wrap {
    grid-column: 2;
    position: sticky;
    top: 24px;
    align-self: start;
  }
}

/* ---- rândurile din tabelul "Comanda ta" ---- */
body.page-id-19 table.woocommerce-checkout-review-order-table { border: none; }
body.page-id-19 table.woocommerce-checkout-review-order-table thead th {
  border-bottom: 1px solid var(--azi-border);
  color: var(--azi-cream-faint);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding-bottom: 10px;
}
body.page-id-19 table.woocommerce-checkout-review-order-table td,
body.page-id-19 table.woocommerce-checkout-review-order-table tfoot th {
  border-color: var(--azi-border);
  padding-top: 14px;
  padding-bottom: 14px;
}
body.page-id-19 table.woocommerce-checkout-review-order-table tr.cart_item td.product-name {
  display: flex;
  align-items: center;
  gap: 13px;
}
body.page-id-19 .azi-item-swatch {
  width: 42px;
  height: 42px;
  border-radius: 5px;
  flex-shrink: 0;
  background: radial-gradient(circle at 35% 30%, rgba(232,220,200,0.16), rgba(139,105,20,0.18) 60%, #0a0908 100%);
  border: 1px solid var(--azi-border);
  display: flex;
  align-items: center;
  justify-content: center;
}
body.page-id-19 .azi-item-swatch svg { width: 18px; height: 18px; stroke: var(--azi-gold); fill: none; }
body.page-id-19 tr.order-total th,
body.page-id-19 tr.order-total td { font-size: 1.02rem; color: #fff; }
body.page-id-19 tr.order-total .woocommerce-Price-amount {
  font-family: "Cormorant Garamond", serif;
  font-style: italic;
  font-size: 1.28rem;
  color: var(--azi-gold);
}
/* Bug găsit la testare (21 sept, semnalat de Amada -- "lei" de la Total arăta
   rău, ca un font diferit, îngroșat, lipit de restul cifrei): WooCommerce
   pune cuvântul monedei ("lei") într-un span separat, .woocommerce-Price-
   currencySymbol, care undeva în tema site-ului are propriul font (Jost),
   diferit de fontul italic Cormorant Garamond pe care îl punem mai sus pe
   toată suma -- de-aia cifra și cuvântul "lei" arătau ca two fonturi diferite
   lipite unul de altul. Fix: forțăm același font și pe acel span. */
body.page-id-19 tr.order-total .woocommerce-Price-amount .woocommerce-Price-currencySymbol {
  font-family: "Cormorant Garamond", serif;
}

/* Fix cerut de Amada (21 sept): pe 5 august, tot ea ceruse ca acest link
   ("Ai un cupon?...") să fie ascuns pe Checkout (regulă separată, dintr-un
   alt fișier CSS -- "body.page-id-19 .azi-coupon-toggle { display: none
   !important; }"). Acum și-a schimbat părerea și vrea cutia de cupon din
   nou vizibilă și funcțională. O reafișăm aici -- dacă vechea regulă de
   ascundere mai există undeva în Additional CSS, cea de mai jos vine DUPĂ
   ea în acest fișier, deci câștigă. */
body.page-id-19 .azi-coupon-toggle {
  display: block !important;
}

/* ---- cupon, restilizat ca o casetă ---- */
body.page-id-19 .azi-coupon-toggle,
body.page-id-19 form.checkout_coupon {
  border: 1px solid var(--azi-border-gold);
  border-radius: 3px;
  background: rgba(201,169,92,0.04);
  padding: 12px 16px;
  margin-bottom: 18px;
}
body.page-id-19 .azi-coupon-toggle a.showcoupon {
  font-size: 0.8rem;
  letter-spacing: 0.02em;
}
body.page-id-19 form.checkout_coupon { display: flex; gap: 8px; align-items: center; }
body.page-id-19 form.checkout_coupon input#coupon_code { flex: 1; margin: 0 !important; }
body.page-id-19 form.checkout_coupon button {
  background: transparent !important;
  border: 1px solid var(--azi-border-gold) !important;
  color: var(--azi-gold) !important;
  font-size: 0.72rem !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
}

/* ---- metodă de livrare / plată — stil "opt-card" selectabil ---- */
body.page-id-19 ul#shipping_method li,
body.page-id-19 ul.wc_payment_methods.payment_methods > li.wc_payment_method {
  display: flex;
  align-items: center;
  /* Bug găsit la testare (21 sept, semnalat de Amada -- caseta cardului de
     plată "nu arată ok" când e selectată): fără "flex-wrap: wrap", rândul
     radio+etichetă+iconițe carduri era pus pe UN SINGUR rând care nu se
     putea rupe pe mai multe linii. Când metoda de plată (Card) își arată
     conținutul suplimentar (nota de test + cardurile salvate -- acesta
     este .payment_box, cu "flex-basis: 100%" mai jos, gândit să treacă pe
     rândul următor), acel conținut nu avea unde să "cadă" pe rândul de jos
     -- rezultatul era caseta plutind ciudat în dreapta, ca un bec de tooltip,
     în loc să apară curat SUB rândul cu "Card". Fix: permitem ruperea pe
     mai multe rânduri, exact cum era gândit inițial .payment_box să se
     comporte. */
  flex-wrap: wrap;
  gap: 12px;
  /* Bug găsit la testare (21 sept, semnalat de Amada -- "secțiunea cu
     opțiunile de livrare arată inegal"): fiecare opțiune (Free shipping,
     Sameday Easybox, Sameday domiciliu) are un text de altă lungime, deci
     se rupe pe alt număr de rânduri -- 1, 2 sau 3 -- iar fără o înălțime
     minimă comună, casetele ieșeau de mărimi diferite, una lângă alta.
     Fix: o înălțime minimă comună, ca toate casetele să arate la fel,
     indiferent cât de lung e textul din interior. */
  min-height: 52px;
  border: 1px solid var(--azi-border);
  border-radius: 3px;
  padding: 14px 16px;
  margin-bottom: 10px;
  transition: border-color .2s ease, background .2s ease;
  list-style: none;
}
body.page-id-19 ul#shipping_method li:hover,
body.page-id-19 ul.wc_payment_methods.payment_methods > li.wc_payment_method:hover {
  border-color: var(--azi-border-gold);
}
body.page-id-19 ul#shipping_method li.azi-selected,
body.page-id-19 ul.wc_payment_methods.payment_methods > li.wc_payment_method.azi-selected {
  border-color: var(--azi-gold);
  background: rgba(201,169,92,0.06);
}
body.page-id-19 ul#shipping_method li input[type="radio"],
body.page-id-19 ul.wc_payment_methods.payment_methods input[type="radio"] {
  accent-color: var(--azi-gold);
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
}
body.page-id-19 ul#shipping_method li label,
body.page-id-19 ul.wc_payment_methods.payment_methods > li.wc_payment_method > label {
  margin: 0;
  flex: 1;
  font-size: 0.88rem;
}
/* detaliile metodei de plată (descriere, formularul cardului Stripe) */
body.page-id-19 ul.wc_payment_methods.payment_methods > li.wc_payment_method .payment_box {
  flex-basis: 100%;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px dashed var(--azi-border);
  background: transparent;
}

/* ---- butonul Plasează comanda ---- */
body.page-id-19 #place_order {
  width: 100%;
  background: linear-gradient(180deg, #d8b968, var(--azi-gold-deep)) !important;
  border-radius: 3px !important;
  font-weight: 600;
  letter-spacing: 0.1em;
  transition: transform .2s ease, box-shadow .2s ease;
}
body.page-id-19 #place_order:hover {
  transform: translateY(-1px);
  box-shadow: 0 12px 28px rgba(201,169,92,0.25);
}

/* ---- bifa "Aceleași date ca la livrare" (pasul de Facturare) --------
   Adăugată 21 sept. Stilizată la fel ca celelalte bife din checkout
   (accent auriu, text discret) ca să se potrivească vizual cu restul
   paginii -- vezi azi_checkout_billing_same_as_shipping.js pentru JS. */
body.page-id-19 .azi-same-as-shipping {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  cursor: pointer;
  font-size: 0.88rem;
  color: var(--azi-cream-dim);
}
body.page-id-19 .azi-same-as-shipping input[type="checkbox"] {
  accent-color: var(--azi-gold);
  width: 16px;
  height: 16px;
  margin: 0;
  flex-shrink: 0;
  cursor: pointer;
}
body.page-id-19 .azi-same-as-shipping:hover {
  color: var(--azi-cream);
}
/* Fix: Checkout (page-id-19) nu avea propriul fundal setat,
   mostenea negrul global al site-ului in loc de negrul standard
   folosit pe Cos/Cont/Wishlist/Home. Nu se sterge nimic altceva. */
body.page-id-19 {
  background: var(--bg) !important;
}

/* Fix: titlul "Finalizare Comanda" nu avea nicio culoare de brand,
   ramanea alb implicit din tema. */
body.page-id-19 .azi-checkout-title {
  color: var(--cream) !important;
}
/* Aliniere butoane de actiune (Add to Cart, Proceed to Checkout,
   Place Order, Remove from Favourites, Update Cart, Apply Coupon)
   la stilul brand deja folosit pe butonul din Home. Nu se schimba
   culorile (raman cele deja setate per pagina), doar forma. */
.add_to_cart_button,
.checkout-button,
#place_order,
.azi-wishlist-btn.azi-wishlist-remove,
.woocommerce-cart-form button[name="update_cart"],
.woocommerce-form-coupon button[name="apply_coupon"] {
  padding: 15px 34px !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.18em !important;
  border-radius: 0 !important;
}
/* Checkout (page-id-19) foloseste latimea implicita Elementor (1140px)
   in loc de 1180px ca restul site-ului. */
body.page-id-19 .e-con-inner {
  max-width: 1180px !important;
}

/* Aliniere reziduala culori pe Rituals (page-id-120) si Journal (page-id-122)
   la paleta canonica deja folosita pe restul site-ului. Nu ating alte
   culori (hamburger/butoane cu #C09A45 raman neschimbate, sunt deja
   consistente cu Cart/Shop). */
body.page-id-120 .logo-mark,
body.page-id-122 .logo-mark {
  color: var(--cream) !important;
  border-color: var(--cream) !important;
}
body.page-id-120 .rj-deck-shadow,
body.page-id-120 .rj-card-face.front,
body.page-id-120 .rj-carousel-card {
  border-color: var(--gold) !important;
}


/* Fix rest: #place_order avea deja o regula veche 'body.page-id-19 #place_order' cu
   border-radius:3px !important si specificitate mai mare decat regula generala de
   butoane, asa ca butonul de Checkout ramanea cu colturi rotunjite. Suprascriu
   punctual, cu aceeasi specificitate, ca sa fie 0 ca restul butoanelor din site. */
body.page-id-19 #place_order {
  border-radius: 0 !important;
}


/* ============================================================
   Optimizare UI/UX Rituals (page-id-120) -- 22 sep 2026
   Scop: ritm vizual mai stras intre sectiuni, text mai lizibil,
   footer integrat in atmosfera paginii (fumul/jarul de fundal
   se vede si acolo, nu doar in restul paginii), caseta 'Ritualul
   de azi' mai citibila. CSS aditiv, scopat pe body.page-id-120,
   nu ating markup/JS/canvas si nu sterg nimic altceva. */

/* --- mai putin spatiu gol in interiorul sectiunilor --- */
body.page-id-120 .rj-hero {
  min-height: 580px !important;
  padding-top: 96px !important;
  padding-bottom: 44px !important;
}
body.page-id-120 .rj-deck-section {
  padding-bottom: 60px !important;
}
body.page-id-120 .rj-journey-intro {
  padding-top: 56px !important;
}
body.page-id-120 .rj-carousel-section {
  padding-bottom: 60px !important;
}
body.page-id-120 .rj-ending {
  min-height: 380px !important;
  padding-top: 56px !important;
  padding-bottom: 56px !important;
}

/* --- linii subtiri aurii intre sectiuni, ca pagina sa se simta
   o singura compozitie continua, nu blocuri separate --- */
body.page-id-120 .rj-deck-section,
body.page-id-120 .rj-journey-intro,
body.page-id-120 .rj-carousel-section,
body.page-id-120 .rj-ending,
body.page-id-120 footer {
  border-top: 1px solid transparent !important;
  border-image: linear-gradient(90deg, transparent, rgba(201,169,92,0.32), transparent) 1 !important;
}

/* --- footerul avea fundal complet opac dupa 160px, ceea ce bloca
   fumul/jarul de fundal vizibil peste tot altundeva pe pagina --
   de-acolo senzatia ca footerul 'nu face parte din aceeasi pagina'.
   Il fac semi-transparent, pe tonul corect (--bg), ca atmosfera sa
   se vada si acolo. --- */
body.page-id-120 footer {
  background: linear-gradient(180deg, rgba(5,4,5,0) 0px, rgba(5,4,5,0.86) 180px, rgba(5,4,5,0.92) 100%) !important;
}

/* --- text usor marit pe paragrafele/etichetele mici --- */
body.page-id-120 .rj-journey-intro p {
  font-size: 1.05rem !important;
  line-height: 1.7 !important;
}
body.page-id-120 .rj-carousel-card p {
  font-size: 0.95rem !important;
  line-height: 1.6 !important;
}
body.page-id-120 .rj-ending p {
  font-size: 1.05rem !important;
  line-height: 1.6 !important;
}
body.page-id-120 footer a {
  font-size: 0.95rem !important;
}
body.page-id-120 .footer-col h5 {
  font-size: 0.8rem !important;
}
body.page-id-120 .footer-bottom,
body.page-id-120 .footer-bottom a,
body.page-id-120 .footer-bottom p {
  font-size: 0.85rem !important;
}

/* --- caseta 'Ritualul de azi' (draw card) -- text usor marit --- */
body.page-id-120 .rj-card-front-label {
  font-size: 0.85rem !important;
}
body.page-id-120 .rj-card-front-hint {
  font-size: 1.05rem !important;
}


/* ============================================================
   Fix Rituals (page-id-120) -- 'caseta' vizibila din hero -- 22 sep 2026
   .rj-hero-scrim avea un gradient care ramanea aproape opac chiar
   la marginile lui (sus/jos/stanga/dreapta), plus o latime fixa de
   1140px -- de-acolo dreptunghiul cu margini dure, vizibil peste
   fumul din jur. Il estompez cu o masca eliptica, ca sa se piarda
   treptat in fum pe toate laturile, nu doar in centru. Nu ating
   nimic altceva din hero (ring/glow/flame raman neschimbate). */
body.page-id-120 .rj-hero-scrim {
  background: linear-gradient(180deg, rgba(5,4,5,0.9) 0%, rgba(5,4,5,0.28) 22%, rgba(5,4,5,0.28) 55%, rgba(5,4,5,0.9) 100%) !important;
  mask-image: radial-gradient(ellipse 62% 72% at 50% 50%, #000 0%, #000 30%, transparent 88%) !important;
  -webkit-mask-image: radial-gradient(ellipse 62% 72% at 50% 50%, #000 0%, #000 30%, transparent 88%) !important;
}


/* --- continuare fix hero: inelul/glow-ul din hero era taiat brusc de
   marginea containerului (overflow:hidden), asta crea linia dreapta
   vizibila in poza trimisa de Amada. Aplic o masca eliptica pe toata
   sectiunea hero, ca marginile (sus/jos/stanga/dreapta) sa se piarda
   treptat in fum, nu sa fie taiate brusc. Textul din centru nu e
   afectat (masca ramane opaca pana la 55% din centru catre colt). --- */
body.page-id-120 .rj-hero {
  mask-image: radial-gradient(ellipse farthest-corner at 50% 50%, #000 0%, #000 55%, transparent 100%) !important;
  -webkit-mask-image: radial-gradient(ellipse farthest-corner at 50% 50%, #000 0%, #000 55%, transparent 100%) !important;
}


/* --- corectie masca hero: 'farthest-corner' lasa marginile drepte
   (sus/jos/stanga/dreapta, nu doar colturile) partial opace, de-acolo
   linia inca vizibila. Folosesc procente explicite pe fiecare axa, ca
   sa ajunga garantat transparent chiar la marginea casetei, pe toate
   cele 4 laturi, nu doar in colturi. Aceasta regula o inlocuieste pe
   cea de mai sus pentru .rj-hero (aceeasi selectie, ultima regula
   castiga). --- */
body.page-id-120 .rj-hero {
  mask-image: radial-gradient(ellipse 55% 55% at 50% 50%, #000 0%, #000 35%, transparent 100%) !important;
  -webkit-mask-image: radial-gradient(ellipse 55% 55% at 50% 50%, #000 0%, #000 35%, transparent 100%) !important;
  -webkit-mask-size: 100% 100% !important;
  mask-size: 100% 100% !important;
  -webkit-mask-repeat: no-repeat !important;
  mask-repeat: no-repeat !important;
}


/* Fix Rituals (page-id-120) -- spatiu gol excesiv in jurul casetei
   "Ritualul de azi" -- 22 sep 2026
   Cauza reala gasita: sub caseta exista un bloc ascuns (recomandarea de
   lumanare) care sta cu opacity:0 pana cand utilizatorul trage cartea --
   dar spatiul lui (inaltime + margine) ramane rezervat tot timpul, chiar
   ascuns, si asta crea o gaura vizibila goala intre caseta si titlul
   "Calatoria ritualului". Il fac sa colapseze complet cat timp e ascuns,
   si sa se deschida abia cand devine vizibil (is-visible, adaugat de JS
   la tragerea cartii -- nu ating JS-ul). Reduc si padding-urile adaugate
   de mine in patch-ul anterior langa aceasta zona (erau prea generoase
   langa un spatiu deja gol), si micsorez usor caseta cartii ca sa nu mai
   para atat de goala in interior. CSS aditiv, nu ating JS/markup. */
body.page-id-120 .rj-deck-recommend {
  margin-top: 0 !important;
  max-height: 0 !important;
  overflow: hidden !important;
  transition: max-height 500ms ease, opacity 900ms ease 250ms, transform 900ms ease 250ms !important;
}
body.page-id-120 .rj-deck-recommend.is-visible {
  margin-top: 46px !important;
  max-height: 260px !important;
}
body.page-id-120 .rj-deck-section { padding-bottom: 28px !important; }
body.page-id-120 .rj-journey-intro { padding-top: 30px !important; }
body.page-id-120 .rj-stage { width: min(340px, 80vw) !important; }

/* Fix Rituals (page-id-120) -- footer "incadrat" (boxed) in mijlocul paginii,
   in loc sa acopere toata latimea ca pe Journal si restul site-ului -- 23 sep 2026.
   Cauza reala gasita: containerul Elementor care tine footer-ul
   (.elementor-element-5f94eef) are un div interior .e-con-inner setat pe
   "Boxed" (max-width: min(100%, 1140px), mostenit din Content Width-ul
   global Elementor), spre deosebire de containerul footer-ului de pe
   Journal, care e "Full Width". Rezultatul: fundalul cu fum se vede pe
   margini, iar footer-ul arata ca un chenar/panou plutind in mijloc.
   Fortez acelasi comportament "full width" doar pentru footer-ul de pe
   Rituals, fara sa umblu la setarea Elementor in sine sau la alte containere
   boxed de pe pagina. */
body.page-id-120 .elementor-element-5f94eef > .e-con-inner {
  max-width: none !important;
}


/* Fix Our Story (page-id-1435) -- continut invizibil -- 22 sep 2026
   Cauza reala gasita: aproape tot continutul paginii (capitolele povestii,
   sectiunea de ingrediente, galeria, filosofia) e in clase .story-reveal /
   .story-meaning-reveal, care pornesc de la opacity:0 si ar trebui sa devina
   vizibile cand JS-ul de animatie la scroll adauga .in-view -- dar JS-ul nu
   se declanseaza fiabil, asa ca cea mai mare parte a paginii ramane invizibila
   permanent (casete negre goale). Site-ul are deja un fallback pentru exact
   acest caz (prefers-reduced-motion), il refolosesc ca sa arat continutul
   direct, fara sa ating JS-ul. */
body.page-id-1435 .story-reveal,
body.page-id-1435 .story-meaning-reveal {
  opacity: 1 !important;
  transform: none !important;
}

/* Fix Shipping&Returns / Termeni / Confidentialitate -- fundal plat negru,
   fara nicio atmosfera -- 22 sep 2026
   Cauza reala gasita: aceste 3 pagini nu au deloc canvas-ul WebGL de fum
   ("story-molten-bg") pe care il au FAQ/Ghidul Ritualului/Contact/Candle
   Care -- scriptul e inline, ~16KB, per pagina, prea riscant de copiat orbeste
   de 3 ori prin automatizare. In loc sa umblu la JS, adaug o atmosfera
   echivalenta doar din CSS (aceleasi culori de brand, straturi mari de
   radial-gradient, fixe, foarte transparente) ca sa nu mai arate plat/rece
   fata de restul site-ului. */
body.page-id-1130,
body.page-id-21,
body.page-id-3,
body.page-id-1602,
body.page-id-1604 {
  background:
    radial-gradient(ellipse 60% 45% at 15% 10%, rgba(201, 169, 92,0.10), transparent 60%),
    radial-gradient(ellipse 55% 50% at 88% 30%, rgba(201, 169, 92,0.09), transparent 65%),
    radial-gradient(ellipse 70% 55% at 50% 95%, rgba(201, 169, 92,0.07), transparent 60%),
    var(--azi-black) !important;
  background-attachment: fixed, fixed, fixed, scroll !important;
}
/* AZI — fix pagina produs mobil: imaginea pe coloană întreagă. Nu șterge nimic altceva */
@media (max-width: 880px) {
  body.single-product div.product.type-product { grid-template-columns: 1fr !important; }
  body.single-product div.product div.images.woocommerce-product-gallery { position: static !important; top: auto !important; }
}

/* AZI — D1: footer identic cu cel de pe Rituals pe Journal, Our Story, Candle Care, Ritual Guide, FAQ, Contact (24 sep). Nu șterge nimic altceva */
html body.page-id-122 footer,
html body.page-id-1435 footer,
html body.page-id-1185 footer,
html body.page-id-1140 footer,
html body.page-id-1145 footer,
html body.page-id-1135 footer {
  background-image: linear-gradient(rgba(5, 4, 5, 0) 0px, rgba(5, 4, 5, 0.86) 180px, rgba(5, 4, 5, 0.92) 100%) !important;
  background-color: rgba(0, 0, 0, 0) !important;
  border-top-color: rgba(0, 0, 0, 0) !important;
  z-index: 1 !important;
}
html body.page-id-122 footer .footer-col h5,
html body.page-id-1435 footer .footer-col h5,
html body.page-id-1185 footer .footer-col h5,
html body.page-id-1140 footer .footer-col h5,
html body.page-id-1145 footer .footer-col h5,
html body.page-id-1135 footer .footer-col h5 {
  font-size: 12.8px !important;
  letter-spacing: 2.304px !important;
  line-height: 15.36px !important;
  margin-top: 8px !important;
}
html body.page-id-122 footer .footer-col a,
html body.page-id-1435 footer .footer-col a,
html body.page-id-1185 footer .footer-col a,
html body.page-id-1140 footer .footer-col a,
html body.page-id-1145 footer .footer-col a,
html body.page-id-1135 footer .footer-col a {
  font-size: 15.2px !important;
  line-height: 22.8px !important;
}
html body.page-id-122 footer .newsletter-form input,
html body.page-id-1435 footer .newsletter-form input,
html body.page-id-1185 footer .newsletter-form input,
html body.page-id-1140 footer .newsletter-form input,
html body.page-id-1145 footer .newsletter-form input,
html body.page-id-1135 footer .newsletter-form input {
  font-size: 16px !important;
  line-height: 24px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}
html body.page-id-122 footer .newsletter-form input.azi-hp-field,
html body.page-id-1435 footer .newsletter-form input.azi-hp-field,
html body.page-id-1185 footer .newsletter-form input.azi-hp-field,
html body.page-id-1140 footer .newsletter-form input.azi-hp-field,
html body.page-id-1145 footer .newsletter-form input.azi-hp-field,
html body.page-id-1135 footer .newsletter-form input.azi-hp-field {
  font-size: 16px !important;
  line-height: 24px !important;
  padding-top: 8px !important;
  padding-bottom: 8px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}
html body.page-id-122 footer .wrap div.footer-bottom,
html body.page-id-1435 footer .wrap div.footer-bottom,
html body.page-id-1185 footer .wrap div.footer-bottom,
html body.page-id-1140 footer .wrap div.footer-bottom,
html body.page-id-1145 footer .wrap div.footer-bottom,
html body.page-id-1135 footer .wrap div.footer-bottom {
  font-size: 13.6px !important;
  line-height: 20.4px !important;
  padding-bottom: 0px !important;
}
html body.page-id-122 footer .footer-bottom span,
html body.page-id-1435 footer .footer-bottom span,
html body.page-id-1185 footer .footer-bottom span,
html body.page-id-1140 footer .footer-bottom span,
html body.page-id-1145 footer .footer-bottom span,
html body.page-id-1135 footer .footer-bottom span {
  font-size: 13.6px !important;
  line-height: 20.4px !important;
}
html body.page-id-122 footer .footer-bottom div.socials,
html body.page-id-1435 footer .footer-bottom div.socials,
html body.page-id-1185 footer .footer-bottom div.socials,
html body.page-id-1140 footer .footer-bottom div.socials,
html body.page-id-1145 footer .footer-bottom div.socials,
html body.page-id-1135 footer .footer-bottom div.socials {
  font-size: 13.6px !important;
  line-height: 20.4px !important;
}
html body.page-id-122 footer .socials a,
html body.page-id-1435 footer .socials a,
html body.page-id-1185 footer .socials a,
html body.page-id-1140 footer .socials a,
html body.page-id-1145 footer .socials a,
html body.page-id-1135 footer .socials a {
  font-size: 13.6px !important;
  line-height: 20.4px !important;
}
html body.page-id-122 footer .wrap div.footer-top,
html body.page-id-1435 footer .wrap div.footer-top,
html body.page-id-1185 footer .wrap div.footer-top,
html body.page-id-1140 footer .wrap div.footer-top,
html body.page-id-1145 footer .wrap div.footer-top,
html body.page-id-1135 footer .wrap div.footer-top {
  border-bottom-color: rgba(232, 220, 200, 0.14) !important;
}
html body.page-id-122 footer .footer-brand p,
html body.page-id-1435 footer .footer-brand p,
html body.page-id-1185 footer .footer-brand p,
html body.page-id-1140 footer .footer-brand p,
html body.page-id-1145 footer .footer-brand p,
html body.page-id-1135 footer .footer-brand p {
  font-size: 16px !important;
  font-style: normal !important;
  color: rgb(139, 132, 120) !important;
  line-height: 24px !important;
  margin-bottom: 14.4px !important;
  border-top-color: rgb(139, 132, 120) !important;
  border-bottom-color: rgb(139, 132, 120) !important;
  max-width: none !important;
}
html body.page-id-122 footer .footer-col p.newsletter-copy,
html body.page-id-1435 footer .footer-col p.newsletter-copy,
html body.page-id-1185 footer .footer-col p.newsletter-copy,
html body.page-id-1140 footer .footer-col p.newsletter-copy,
html body.page-id-1145 footer .footer-col p.newsletter-copy,
html body.page-id-1135 footer .footer-col p.newsletter-copy {
  font-size: 16px !important;
  color: rgb(139, 132, 120) !important;
  line-height: 24px !important;
  margin-bottom: 14.4px !important;
  border-top-color: rgb(139, 132, 120) !important;
  border-bottom-color: rgb(139, 132, 120) !important;
}
html body.page-id-122 footer .newsletter-form button,
html body.page-id-1435 footer .newsletter-form button,
html body.page-id-1185 footer .newsletter-form button,
html body.page-id-1140 footer .newsletter-form button,
html body.page-id-1145 footer .newsletter-form button,
html body.page-id-1135 footer .newsletter-form button {
  color: rgb(5, 4, 5) !important;
  background-color: rgb(139, 105, 20) !important;
  border-top-color: rgb(5, 4, 5) !important;
  border-bottom-color: rgb(5, 4, 5) !important;
}

/* conținutul footer-ului centrat */
html body.page-id-122 footer div.wrap,
html body.page-id-1435 footer div.wrap,
html body.page-id-1185 footer div.wrap,
html body.page-id-1140 footer div.wrap,
html body.page-id-1145 footer div.wrap,
html body.page-id-1135 footer div.wrap {
  margin-left: auto !important;
  margin-right: auto !important;
}
/* footer pe toată lățimea, ca pe Rituals (containerul Elementor al footer-ului nu mai e limitat la 1140px) */
html body.page-id-122 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-1435 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-1185 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-1140 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-1145 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-1135 .e-con-inner:has(> .elementor-widget > footer) {
  max-width: none !important;
}
/* rândul de jos (copyright + social) pe un singur rând și pe mobil, ca pe Rituals */
html body.page-id-122 footer .wrap div.footer-bottom,
html body.page-id-1435 footer .wrap div.footer-bottom,
html body.page-id-1185 footer .wrap div.footer-bottom,
html body.page-id-1140 footer .wrap div.footer-bottom,
html body.page-id-1145 footer .wrap div.footer-bottom,
html body.page-id-1135 footer .wrap div.footer-bottom {
  flex-direction: row !important;
}

/* AZI — D2: breadcrumb-ul („Home / Pagina”) scos de pe toate paginile; spațiul de sub header rămâne (24 sep). Nu șterge nimic altceva */
nav.guide-breadcrumb > * { display: none !important; }
nav.guide-breadcrumb { font-size: 0 !important; line-height: 0 !important; }

/* AZI — footer fără linie de separare, pe toate paginile (24 sep, cerut de Amada). Bordura de sus (1px) scoasă — gradientul de fundal se repeta sub ea și desena o dungă închisă; containerul footer-ului fără padding lateral, ca să nu apară muchii verticale. Nu șterge nimic altceva */
html body[class] footer { border-top: 0 !important; }
.e-con:has(> .e-con-inner > .elementor-widget > footer),
.e-con-inner:has(> .elementor-widget > footer) { padding-left: 0 !important; padding-right: 0 !important; }

/* AZI — pagina de produs, feedback mobil Amada (25 sep). Nu șterge nimic altceva */
/* 1) Butoanele „Adaugă în coș” (principal + bara fixă de jos): auriul brandului, text negru bold, reacție la apăsare */
html body.single-product .single_add_to_cart_button,
html body.single-product .azi-sticky-atc .azi-sticky-atc__btn{background:#C9A95C!important;border:1px solid #C9A95C!important;color:#050405!important;font-weight:700!important;letter-spacing:.24em!important;text-transform:uppercase!important;border-radius:0!important;box-shadow:none!important;transition:background .25s,transform .15s,box-shadow .25s!important;-webkit-tap-highlight-color:transparent}
html body.single-product .single_add_to_cart_button:hover,
html body.single-product .azi-sticky-atc .azi-sticky-atc__btn:hover{background:#D8B968!important;border-color:#D8B968!important;color:#050405!important}
html body.single-product .single_add_to_cart_button:active,
html body.single-product .azi-sticky-atc .azi-sticky-atc__btn:active{transform:scale(.97)!important;background:#B8964A!important;box-shadow:inset 0 2px 8px rgba(0,0,0,.35)!important}
html body.single-product .single_add_to_cart_button.loading,
html body.single-product .azi-sticky-atc .azi-sticky-atc__btn.loading{opacity:.7!important}
/* 2) Notificarea după adăugare în coș: fără alb/albastru — în stilul site-ului */
html body .woocommerce-message,html body .woocommerce-info{background:rgba(5,4,5,.94)!important;color:#E8DCC8!important;border:1px solid rgba(201,169,92,.55)!important;border-top-width:1px!important;border-radius:0!important;box-shadow:0 18px 50px rgba(0,0,0,.45)!important;font-family:'Jost',sans-serif!important;font-weight:300!important}
html body .woocommerce-message::before,html body .woocommerce-info::before{color:#C9A95C!important}
html body .woocommerce-message a,html body .woocommerce-message .button,html body .woocommerce-info a{color:#C9A95C!important;background:transparent!important;border:0!important;font-weight:600!important;text-decoration:none!important}
@media (max-width:880px){
/* 3) Fără spațiul mare de sub butoanele de plată rapidă */
 html body.single-product .wcpay-express-checkout-wrapper{margin-bottom:0!important}
 html body.single-product div.product .summary{margin-bottom:8px!important}
 html body.single-product .woocommerce-tabs{margin-top:20px!important}
/* 4) Recomandările: una sub alta, centrate */
 html body.single-product .related ul.products,html body.single-product .upsells ul.products{display:flex!important;flex-direction:column!important;align-items:center!important;gap:24px!important;padding:0!important;margin-left:0!important;margin-right:0!important}
 html body.single-product .related ul.products li.product,html body.single-product .upsells ul.products li.product{margin:0 auto!important;float:none!important;width:min(100%,300px)!important;text-align:center!important}
 html body.single-product .related > h2,html body.single-product .upsells > h2{text-align:center!important}
}

/* AZI — coș redesenat (totaluri, livrare, butoane), feedback Amada 25 sep. Nu șterge nimic altceva */
html body.woocommerce-cart .cart_totals table.shop_table{width:100%!important;border:0!important;border-collapse:collapse!important;background:transparent!important;margin:0 0 22px!important;table-layout:auto!important}
html body.woocommerce-cart .cart_totals table.shop_table tr{border:0!important;border-bottom:1px solid rgba(232,220,200,.12)!important;background:transparent!important}
html body.woocommerce-cart .cart_totals table.shop_table th,
html body.woocommerce-cart .cart_totals table.shop_table td{border:0!important;background:transparent!important;padding:16px 0!important;font-family:'Jost',sans-serif!important;font-weight:300!important;color:#E8DCC8!important;vertical-align:top!important}
html body.woocommerce-cart .cart_totals table.shop_table th{font-size:11px!important;letter-spacing:.26em!important;text-transform:uppercase!important;color:rgba(232,220,200,.6)!important;text-align:left!important;width:38%}
html body.woocommerce-cart .cart_totals table.shop_table td{text-align:right!important;font-size:15px!important}
html body.woocommerce-cart .cart_totals .cart-subtotal td .amount{font-weight:400!important}
/* livrarea: listă pe toată lățimea, nume stânga — preț dreapta */
html body.woocommerce-cart .cart_totals #shipping_method{margin:0!important;padding:0!important;list-style:none!important;text-align:left!important}
html body.woocommerce-cart .cart_totals #shipping_method li{display:flex!important;align-items:center!important;gap:10px!important;margin:0 0 10px!important;padding:12px 14px!important;border:1px solid rgba(232,220,200,.14)!important;text-align:left!important;line-height:1.35!important}
html body.woocommerce-cart .cart_totals #shipping_method li:has(input:checked){border-color:rgba(201,169,92,.7)!important;background:rgba(201,169,92,.07)!important}
html body.woocommerce-cart .cart_totals #shipping_method li input{margin:0!important;flex:0 0 auto;accent-color:#C9A95C}
html body.woocommerce-cart .cart_totals #shipping_method li label{flex:1!important;display:flex!important;justify-content:space-between!important;gap:10px!important;margin:0!important;font-size:14px!important;font-weight:300!important;color:#E8DCC8!important}
html body.woocommerce-cart .cart_totals #shipping_method li label .amount,html body.woocommerce-cart .cart_totals #shipping_method li label bdi{font-weight:500!important;white-space:nowrap}
html body.woocommerce-cart .cart_totals .woocommerce-shipping-destination,
html body.woocommerce-cart .cart_totals .woocommerce-shipping-calculator{text-align:left!important;font-size:12.5px!important;color:rgba(232,220,200,.6)!important;margin:6px 0 0!important}
html body.woocommerce-cart .cart_totals .woocommerce-shipping-destination strong{font-weight:400!important;color:rgba(232,220,200,.8)!important}
html body.woocommerce-cart .cart_totals .shipping-calculator-button{color:#C9A95C!important;font-size:12px!important;letter-spacing:.16em!important;text-transform:uppercase!important}
html body.woocommerce-cart .cart_totals .order-total th,html body.woocommerce-cart .cart_totals .order-total td{padding-top:20px!important;border-bottom:0!important}
html body.woocommerce-cart .cart_totals .order-total td,html body.woocommerce-cart .cart_totals .order-total td strong,html body.woocommerce-cart .cart_totals .order-total .amount{font-family:'Cormorant Garamond',Georgia,serif!important;font-size:30px!important;font-weight:400!important;color:#C9A95C!important;line-height:1!important}
/* rândul de livrare stivuit și pe desktop */
html body.woocommerce-cart .cart_totals table.shop_table{display:block!important}
html body.woocommerce-cart .cart_totals table.shop_table tbody{display:block!important;width:100%!important}
html body.woocommerce-cart .cart_totals table.shop_table tr{display:flex!important;justify-content:space-between!important;align-items:baseline!important;width:100%!important}
html body.woocommerce-cart .cart_totals table.shop_table tr.shipping,html body.woocommerce-cart .cart_totals table.shop_table tr.woocommerce-shipping-totals{display:flex!important;flex-direction:column!important;align-items:stretch!important}
html body.woocommerce-cart .cart_totals table.shop_table tr.shipping th,html body.woocommerce-cart .cart_totals table.shop_table tr.shipping td{display:block!important;width:100%!important;text-align:left!important}
html body.woocommerce-cart .cart_totals table.shop_table tr.shipping th{padding-bottom:0!important}
html body.woocommerce-cart .cart_totals table.shop_table tr.shipping td{padding-top:12px!important}
html body.woocommerce-cart .add_to_cart_button{padding-left:6px!important;padding-right:6px!important;letter-spacing:.08em!important}
/* butonul de finalizare: auriul brandului, text negru bold, pe un rând */
html body.woocommerce-cart .wc-proceed-to-checkout .checkout-button{display:flex!important;align-items:center!important;justify-content:center!important;width:100%!important;min-height:56px!important;padding:16px 18px!important;background:#C9A95C!important;border:1px solid #C9A95C!important;color:#050405!important;font-weight:700!important;font-size:12px!important;letter-spacing:.1em!important;line-height:1.3!important;text-transform:uppercase!important;border-radius:0!important;box-shadow:none!important;transition:background .25s,transform .15s!important}
html body.woocommerce-cart .wc-proceed-to-checkout .checkout-button:hover{background:#D8B968!important;border-color:#D8B968!important;color:#050405!important}
html body.woocommerce-cart .wc-proceed-to-checkout .checkout-button:active{transform:scale(.98)!important;background:#B8964A!important}
/* „Adaugă în coș” la recomandări: pe un singur rând */
html body.woocommerce-cart .add_to_cart_button{white-space:nowrap!important;letter-spacing:.12em!important;font-size:11px!important;padding:12px 10px!important;width:100%!important;max-width:100%!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;line-height:1.2!important}
@media (max-width:699px){
 html body.woocommerce-cart .cart_totals{padding:24px 18px!important}
 html body.woocommerce-cart .cart_totals table.shop_table tr th,html body.woocommerce-cart .cart_totals table.shop_table tr.shipping th{display:none!important}
 html body.woocommerce-cart .cart_totals table.shop_table tr{display:block!important}
 html body.woocommerce-cart .cart_totals table.shop_table tr.cart-subtotal,html body.woocommerce-cart .cart_totals table.shop_table tr.order-total{display:flex!important;justify-content:space-between!important;align-items:baseline!important}
 html body.woocommerce-cart .cart_totals table.shop_table td{display:block!important;width:auto!important}
 html body.woocommerce-cart .cart_totals table.shop_table tr.shipping td{text-align:left!important;padding-top:6px!important}
 html body.woocommerce-cart .cart_totals table.shop_table td::before{font-size:11px!important;letter-spacing:.26em!important;text-transform:uppercase!important;color:rgba(232,220,200,.6)!important;font-weight:300!important;float:none!important}
 html body.woocommerce-cart .cart_totals table.shop_table tr.shipping td::before{display:block!important;margin-bottom:12px!important}
 html body.woocommerce-cart .cart_totals table.shop_table tr.cart-subtotal td,html body.woocommerce-cart .cart_totals table.shop_table tr.order-total td{display:flex!important;width:100%!important;justify-content:space-between!important;align-items:baseline!important}
}

/* AZI — 25 sep: header/footer-ul temei (Hello Elementor) ascunse oriunde există header-ul AZI — pe telefon apăreau dublate pe Shop, iar butonul de meniu al temei nu făcea nimic. Nu șterge nimic altceva */
body:has(#hamburgerBtn) #site-header,body:has(#hamburgerBtn) header.site-header,body:has(#hamburgerBtn) .site-navigation-toggle-holder,body:has(#hamburgerBtn) #site-footer,body:has(#hamburgerBtn) footer.site-footer{display:none!important}
/* AZI — 25 sep: mai puțin spațiu gol înainte de footer pe telefon (Journal, Rituals, toate paginile) */
@media (max-width:699px){
 html body[class] footer{padding-top:24px!important}
 html body[class] footer .footer-top{padding-top:20px!important}
 html body[class] footer{background-image:linear-gradient(rgba(5,4,5,0) 0,rgba(5,4,5,.9) 80px,rgba(5,4,5,.95) 100%)!important}
 body.page-id-122 .azi-journal-page{padding-bottom:36px!important}
}

/* AZI — 27 sep: contrast & culori (Me2, Me4, Me6, Me8, Me9). Home neatinsă. Nu șterge nimic altceva */
html body.woocommerce-shop li.product .price,html body.woocommerce-shop li.product .price *{color:#C9A95C!important}
html body.woocommerce-checkout .showcoupon{color:#C9A95C!important;text-decoration:underline!important;text-underline-offset:3px}
html body.single-product .wc-tabs li a{color:rgba(232,220,200,.62)!important}
html body.single-product .wc-tabs li.active a,html body.single-product .wc-tabs li a:hover{color:#C9A95C!important}
html body footer .newsletter-form button{background:#C9A95C!important;border-color:#C9A95C!important;color:#050405!important;font-weight:700!important}
html body.woocommerce-checkout .order-total td,html body.woocommerce-checkout .order-total strong,html body.woocommerce-checkout .order-total .amount{font-family:'Cormorant Garamond',Georgia,serif!important;font-style:normal!important;font-size:30px!important;font-weight:400!important;color:#C9A95C!important}
/* AZI — 27 sep: iconițele social fără link real ascunse până există conturile (Mi6) */
html body footer .socials a[href="#"]{display:none!important}
/* AZI — 27 sep: coșul pe mobil — totalul și butonul de finalizare imediat sub produse, recomandările după (Me16) */
@media (max-width:880px){html body.woocommerce-cart .elementor-shortcode > .woocommerce{display:flex!important;flex-direction:column!important} html body.woocommerce-cart form.woocommerce-cart-form{display:contents!important} html body.woocommerce-cart .woocommerce-cart-form > table.cart{order:1} html body.woocommerce-cart .cart-collaterals{order:2;width:100%!important} html body.woocommerce-cart .azi-cart-upsell{order:3;margin-top:36px!important}}
/* AZI — 27 sep: meniul mobil — X vizibil când e deschis + zone de atingere mai mari (Mi1, Mi2); fără Home */
@media (max-width:980px){html.azi-nav-open body header{z-index:300!important;background-image:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important} html body header .hamburger{min-width:44px;min-height:44px;display:inline-flex;align-items:center;justify-content:center} html body #langToggle button{min-height:34px;min-width:40px}}

/* AZI — 27 sep: checkout pe mobil — tabelul comenzii pe o coloană, opțiunile de livrare pe toată lățimea (Me15). Nu șterge nimic altceva */
@media (max-width:699px){
 html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals{display:flex!important;flex-direction:column!important;width:100%!important}
 html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals th,html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals td{display:block!important;width:100%!important;text-align:left!important;border:0!important}
 html body.woocommerce-checkout .woocommerce-checkout-review-order-table tr.woocommerce-shipping-totals th{padding-bottom:4px!important}
 html body.woocommerce-checkout #shipping_method{display:grid!important;gap:8px!important;margin:0!important;padding:0!important}
 html body.woocommerce-checkout #shipping_method li{display:flex!important;align-items:center!important;gap:10px!important;width:100%!important;margin:0!important;padding:12px 14px!important;min-height:0!important}
 html body.woocommerce-checkout #shipping_method li label{flex:1!important;display:flex!important;justify-content:space-between!important;gap:10px!important;font-size:14px!important;font-weight:400!important;line-height:1.35!important;word-break:normal!important}
 html body.woocommerce-checkout #shipping_method li label .amount{white-space:nowrap!important}
}
@media (max-width:699px){
 html body.woocommerce-checkout table.woocommerce-checkout-review-order-table,html body.woocommerce-checkout table.woocommerce-checkout-review-order-table thead,html body.woocommerce-checkout table.woocommerce-checkout-review-order-table tbody,html body.woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot{display:block!important;width:100%!important}
 html body.woocommerce-checkout table.woocommerce-checkout-review-order-table tr{display:flex!important;justify-content:space-between!important;align-items:baseline!important;gap:12px!important;width:100%!important}
 html body.woocommerce-checkout table.woocommerce-checkout-review-order-table tr > *{border-left:0!important;border-right:0!important}
}
@media (max-width:699px){ html body.woocommerce-checkout table.woocommerce-checkout-review-order-table tr{border-bottom:1px solid rgba(232,220,200,.12)!important} html body.woocommerce-checkout table.woocommerce-checkout-review-order-table tr > *{border-bottom:0!important;border-top:0!important} }

/* AZI — 27 sep: butoane principale unificate (Me3) — auriul brandului, text negru bold, colțuri drepte. Fără Home. Nu șterge nimic altceva */
html body.page-id-1135 main button[type="submit"],html body.page-id-1135 form button.i18n,html body.page-id-1145 form button.i18n,
html body.woocommerce-checkout #place_order,
html body.page-id-1435 a.story-cta-btn{background:#C9A95C!important;background-image:none!important;border:1px solid #C9A95C!important;color:#050405!important;font-weight:700!important;border-radius:0!important;box-shadow:none!important;transition:background .25s,transform .15s!important}
html body.page-id-1135 form button.i18n:hover,html body.page-id-1145 form button.i18n:hover,html body.woocommerce-checkout #place_order:hover,html body.page-id-1435 a.story-cta-btn:hover{background:#D8B968!important;border-color:#D8B968!important;color:#050405!important}
html body.page-id-1135 form button.i18n:active,html body.page-id-1145 form button.i18n:active,html body.woocommerce-checkout #place_order:active,html body.page-id-1435 a.story-cta-btn:active{transform:scale(.98)!important;background:#B8964A!important}

/* AZI — 28 sep: sugestii S5/S6/S8/S13 (stiluri). Nu șterge nimic altceva */
/* S8 — beneficii sub „Adaugă în coș” */
html body.single-product ul.azi-pdp-perks{list-style:none!important;margin:18px 0 6px!important;padding:0!important;display:flex!important;flex-wrap:wrap!important;gap:8px 18px!important}
html body.single-product ul.azi-pdp-perks li{position:relative;padding-left:16px!important;margin:0!important;font-family:'Jost',sans-serif!important;font-size:12.5px!important;letter-spacing:.06em!important;color:rgba(232,220,200,.78)!important}
html body.single-product ul.azi-pdp-perks li::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:#C9A95C}
/* S5 — opțiunea de cadou la checkout */
html body.woocommerce-checkout #azi_gift_field{margin:6px 0 10px!important;padding:14px 16px!important;border:1px solid rgba(201,169,92,.35)!important;background:rgba(201,169,92,.05)!important}
html body.woocommerce-checkout #azi_gift_field label{display:flex!important;align-items:center!important;gap:10px!important;color:#E8DCC8!important;font-size:14px!important;cursor:pointer}
html body.woocommerce-checkout #azi_gift_field input[type=checkbox]{accent-color:#C9A95C;width:18px;height:18px;margin:0!important}
html body.woocommerce-checkout #azi_gift_field .optional,html body.woocommerce-checkout #azi_gift_msg_field .optional{display:none!important}
html body.woocommerce-checkout #azi_gift_msg{min-height:84px!important}
/* S6 — bara fixă „Finalizează” în coș, pe mobil */
.azi-sticky-co{display:none}
@media (max-width:699px){
 .azi-sticky-co{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:60;align-items:center;justify-content:space-between;gap:14px;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,rgba(5,4,5,.85),rgba(5,4,5,.97) 35%);border-top:1px solid rgba(201,169,92,.25);transform:translateY(110%);transition:transform .3s ease}
 .azi-sticky-co.is-on{transform:none}
 .azi-sticky-co__total{font-family:'Cormorant Garamond',Georgia,serif;font-size:22px;color:#C9A95C}
 .azi-sticky-co__btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;background:#C9A95C;color:#050405!important;font-family:'Jost',sans-serif;font-weight:700;font-size:12px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none!important}
 .azi-sticky-co__btn:active{transform:scale(.97);background:#B8964A}
}
/* S13 — categoriile goale din Shop: „În curând” */
html body.woocommerce-shop a[data-soon]::after{content:attr(data-soon);display:inline-block;margin-left:8px;padding:2px 8px;border:1px solid rgba(201,169,92,.55);border-radius:999px;font-size:9px;letter-spacing:.14em;font-weight:500;color:#C9A95C;vertical-align:middle;line-height:1.5;text-transform:uppercase}
html body.woocommerce-shop #azi-soon-msg{text-align:center;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-size:22px;color:rgba(232,220,200,.8);margin:40px auto 60px;max-width:560px}

/* AZI — 28 sep (design): fundalul molten auriu cu ~28% mai discret pe toate paginile care îl au (Journal, Rituals, Our Story, ghiduri) — text mai lizibil, atmosferă mai apropiată de Shop/produse. Home nu are acest fundal. */
#journal-molten-bg,body:not(.woocommerce-page):not(.woocommerce-shop):not(.single-product):not(.page-id-552) #story-molten-bg{opacity:.72!important}

/* AZI — 28 sep (design): o singură paletă și un singur stil de hero pe tot site-ul (fără Home), aliniate la Our Story.
   Etichetele de deasupra titlurilor: subțiri, mici, auriu #C9A95C (nu bold 22px). Titlurile H1: crem (nu gri). Badge-uri și pastila RO/EN activă: auriul principal. */
html body .shop-hero .eyebrow,html body .account-hero .eyebrow,html body .wishlist-hero .eyebrow,html body .azi-journal__eyebrow{font-family:'Jost',sans-serif!important;font-weight:300!important;font-size:12px!important;letter-spacing:.34em!important;color:#C9A95C!important;text-transform:uppercase!important}
html body h1{color:#E8DCC8!important}
html body .shop-hero h1,html body .account-hero h1,html body .wishlist-hero h1{font-weight:300!important}
html body header .icon-badge,html body .azi-m-cart-count,html body #langToggle button.active{background:#C9A95C!important;color:#050405!important;border-color:#C9A95C!important}
html body .azi-wishlist-btn.azi-active{color:#C9A95C!important}

html body .azi-drawer__close{color:#C9A95C!important;border-color:rgba(201,169,92,.55)!important}
html body .story-back-top{border-color:#C9A95C!important;color:#C9A95C!important}

/* AZI — 28 sep: fără spațiu gol sub titlu pe paginile-ghid (Safety, Ingredients, How to Use, Which Candle, 404) */
html body .azg-hero{min-height:0!important;padding-top:190px!important;padding-bottom:44px!important}
html body .azg-intro{margin-bottom:34px!important}
@media (max-width:699px){html body .azg-hero{padding-top:130px!important;padding-bottom:28px!important}}

/* AZI — 28 sep: mai puțin gol sub titlu pe Ritual Guide și Journal */
html body .hub-hero{padding-bottom:28px!important}
html body .hub-hero + .hub-section{padding-top:40px!important}
html body .azi-journal-hero{margin-bottom:48px!important}

/* AZI — 28 sep (Mi3): sloganul „Lumânări de masaj · Ritualuri senzoriale · Ceaiuri botanice” de pe Home — nu mai stă ascuns sub header, ci ca etichetă aurie subțire deasupra logo-ului */
html body.page-id-42 .tagline-bar{position:absolute!important;top:150px!important;left:0!important;right:0!important;z-index:50!important;text-align:center!important;font-family:"Jost",sans-serif!important;font-weight:300!important;font-size:11px!important;letter-spacing:.34em!important;text-transform:uppercase!important;color:#C9A95C!important;background:none!important;padding:0 16px!important;pointer-events:none} @media (max-width:699px){html body.page-id-42 .tagline-bar{top:112px!important;font-size:9.5px!important;letter-spacing:.24em!important}}

/* AZI — 28 sep (N5): bold pe toate butoanele de acțiune (Home „Găsește-mi ritualul”, Coș „Aplică cuponul”, scurtăturile de pe Which Candle, categoriile din FAQ și Contact) */
html body a.azh-btn,html body.woocommerce-cart button[name="apply_coupon"],html body.woocommerce-cart button[name="update_cart"],html body .azg .azg-map a,html body .azg .azg-map a b,html body .azg .azg-btn{font-weight:700!important}
html body nav.faq-nav a,html body .contact-quick-links a{font-weight:600!important}
/* =====================================================================
   AZI Rituals — FIX-URI MOBIL (4 octombrie 2026)
   Lipește TOT blocul ăsta la FINALUL Additional CSS
   (Appearance → Customize → Additional CSS). Nu șterge nimic altceva.
   ===================================================================== */


/* ---------- 0. SITEWIDE — fără highlight / chenar albastru la atingere ----------
   (X-ul din pop-up-ul de cookies + orice buton care „se aprinde” când îl atingi) */
html, body, a, button, [role="button"], input, select, label, .cmplz-close {
  -webkit-tap-highlight-color: transparent !important;
}
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
[role="button"]:focus:not(:focus-visible),
[tabindex]:focus:not(:focus-visible) {
  outline: none !important;
  box-shadow: none;
}
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close:focus,
#cmplz-cookiebanner-container .cmplz-cookiebanner .cmplz-close:focus-visible {
  outline: none !important;
  box-shadow: none !important;
  border: 0 !important;
}


/* ---------- 1. HOMEPAGE (page-id-42) — fumul (Liquid Ether) pe toată pagina ----------
   Canvas-ul din hero devine fix, pe tot ecranul, în spatele conținutului.
   Interacțiunea la atingere vine din snippet-ul WPCode nou (azi-home-smoke-touch.js). */
body.page-id-42 {
  background-color: transparent !important; /* fundalul închis rămâne pe <html>, identic */
}
body.page-id-42 #liquid-ether-canvas {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100lvh !important; /* nu se re-calculează când dispare bara Safari */
  z-index: -1 !important;
  pointer-events: none !important;
}
/* secțiunile fără „benzi” mai închise — același fundal de sus până jos */
body.page-id-42 section.section-alt {
  background-color: transparent !important;
}


/* ---------- 2. HOMEPAGE — Ingrediente: „Vezi toată formula” centrat ---------- */
body.page-id-42 section.section-alt:has(.marquee-wrap) {
  padding-bottom: 0 !important;
}
body.page-id-42 section.section-alt .azh-formula {
  margin: 0 !important;
  padding: 30px 0 !important;
  text-align: center !important;
}


/* ---------- 3. HOMEPAGE — „Alege-ți ritualul”: grilă uniformă pe mobil ---------- */
@media (max-width: 767px) {
  body.page-id-42 #deck .azh-feel-opts {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    grid-auto-rows: 1fr;
    gap: 10px !important;
  }
  body.page-id-42 #deck .azh-feel-opt {
    width: auto !important;
    min-height: 52px;
    justify-content: flex-start !important;
    text-align: left !important;
    padding: 10px 12px 10px 34px !important;
    font-size: 13px !important;
    letter-spacing: .3px !important;
    line-height: 1.3 !important;
  }
  body.page-id-42 #deck .azh-feel-opt::before {
    left: 14px !important;
  }
  /* dacă vreodată sunt un număr impar de opțiuni, ultima stă centrată */
  body.page-id-42 #deck .azh-feel-opt:last-child:nth-child(odd) {
    grid-column: 1 / -1;
    justify-self: center;
    width: calc(50% - 5px) !important;
  }
}


/* ---------- 4. THE WORLD OF AZI / Journal (page-id-122) — poze afișate corect ----------
   Pozele sunt verticale (portret) dar erau tăiate în dreptunghiuri late → ieșeau
   decupate ciudat și ușor neclare. Pe mobil le afișăm în format portret. */
@media (max-width: 767px) {
  body.page-id-122 .azi-journal-card .azi-journal-card__img,
  body.page-id-122 .azi-journal-atelier__grid figure:last-child {
    aspect-ratio: 4 / 5 !important;
    height: auto !important;
  }
  body.page-id-122 .azi-journal-card__img img,
  body.page-id-122 .azi-journal-atelier__grid img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
}


/* ---------- 5. WISHLIST (page-id-552) — butonul Sign In ca restul brandului ---------- */
body.page-id-552 .azi-wishlist-page-empty a.azi-wishlist-page-cta {
  background: #8B6914 !important;
  border: 1px solid #8B6914 !important;
  color: #050405 !important;
  font-family: 'Jost', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
}


/* ---------- 6. CONTUL MEU (page-id-20) — fără „treaptă” de fundal sub titlu ----------
   Lumina aurie din spatele titlului era tăiată brusc; acum se stinge lin. */
body.page-id-20 .account-hero .account-hero-glow {
  -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 260px, transparent 480px);
          mask-image: linear-gradient(to bottom, #000 0, #000 260px, transparent 480px);
}


/* ---------- 7. COȘ (page-id-18) — chenar complet + buton Finalizează bold ---------- */
body.page-id-18 .elementor-shortcode > div.woocommerce {
  border-top: 1px solid rgba(232, 220, 200, .14) !important;
}
body.page-id-18 #aziStickyCo .azi-sticky-co__btn {
  font-weight: 700 !important;
}


/* ---------- 8. FINALIZARE COMANDĂ (page-id-19) ---------- */
/* 8a. Apple Pay / Google Pay — integrate într-un panou în stilul brandului
       (culoarea butoanelor în sine e impusă de Apple/Google, vezi instrucțiuni) */
body.page-id-19 form.checkout .wcpay-express-checkout-wrapper {
  border: 1px solid rgba(201, 169, 92, .35) !important;
  background: rgba(22, 19, 15, .6) !important;
  padding: 18px 16px 2px !important;
}
body.page-id-19 form.checkout #wcpay-express-checkout-element {
  margin-bottom: 16px !important;
}
body.page-id-19 form.checkout #wcpay-express-checkout-button-separator {
  display: flex !important;
  align-items: center;
  gap: 14px;
  margin: 0 0 16px !important;
  color: #C4A882 !important;
  font-family: 'Jost', sans-serif;
  font-size: 11px !important;
  letter-spacing: .3em;
  text-transform: uppercase;
}
body.page-id-19 form.checkout #wcpay-express-checkout-button-separator::before,
body.page-id-19 form.checkout #wcpay-express-checkout-button-separator::after {
  content: "";
  flex: 1;
  height: 1px;
  background: rgba(201, 169, 92, .35);
}

/* 8b. Produsul din „Comanda ta” — un singur rând curat, preț aliniat */
body.page-id-19 form.checkout table.woocommerce-checkout-review-order-table tr.cart_item {
  align-items: center !important;
  background: rgba(128, 128, 128, .07) !important;
  border-radius: 2px;
}
body.page-id-19 form.checkout table.woocommerce-checkout-review-order-table tr.cart_item td {
  background: transparent !important;
}
body.page-id-19 form.checkout table.woocommerce-checkout-review-order-table tr.cart_item td.product-name {
  flex: 1 1 auto !important;
  min-width: 0;
}
body.page-id-19 form.checkout table.woocommerce-checkout-review-order-table tr.cart_item td.product-total {
  flex: 0 0 auto !important;
  width: auto !important;
  text-align: right !important;
  white-space: nowrap;
  padding-left: 4px !important;
}


/* ---------- 9. COMANDA A FOST PRIMITĂ (order-received) ---------- */
/* 9a. Cuponul nu are ce căuta pe pagina de confirmare */
body.woocommerce-order-received .woocommerce-form-coupon-toggle,
body.woocommerce-order-received form.checkout_coupon {
  display: none !important;
}

/* 9b. Rezumatul comenzii — grilă curată pe 2 coloane, email pe tot rândul */
body.woocommerce-order-received .woocommerce ul.woocommerce-order-overview {
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  margin: 24px 0 32px !important;
  padding: 0 !important;
  list-style: none !important;
  border: 1px solid rgba(232, 220, 200, .14) !important;
  background: rgba(22, 19, 15, .62);
}
body.woocommerce-order-received .woocommerce ul.woocommerce-order-overview::before,
body.woocommerce-order-received .woocommerce ul.woocommerce-order-overview::after {
  display: none !important;
}
body.woocommerce-order-received .woocommerce ul.woocommerce-order-overview li {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 16px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(232, 220, 200, .14) !important;
  text-align: left !important;
  font-family: 'Jost', sans-serif !important;
  font-size: 10.5px !important;
  letter-spacing: .2em !important;
  text-transform: uppercase !important;
  color: #C4A882 !important;
  line-height: 1.4 !important;
}
body.woocommerce-order-received .woocommerce ul.woocommerce-order-overview li strong {
  display: block !important;
  margin-top: 6px !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: .02em !important;
  text-transform: none !important;
  color: #E8DCC8 !important;
  word-break: break-word;
}
body.woocommerce-order-received .woocommerce ul.woocommerce-order-overview li strong a {
  color: inherit !important;
  text-decoration: none !important;
  border: 0 !important;
}
/* ordine: Nr. comandă | Dată  /  Total | Metodă plată  /  Email (tot rândul) */
body.woocommerce-order-received .woocommerce-order-overview__order  { order: 1; border-right: 1px solid rgba(232, 220, 200, .14) !important; }
body.woocommerce-order-received .woocommerce-order-overview__date   { order: 2; }
body.woocommerce-order-received .woocommerce-order-overview__total  { order: 3; border-right: 1px solid rgba(232, 220, 200, .14) !important; }
body.woocommerce-order-received .woocommerce-order-overview__payment-method { order: 4; }
body.woocommerce-order-received .woocommerce-order-overview__email  { order: 5; grid-column: 1 / -1; border-bottom: 0 !important; }

/* ===================== SFÂRȘIT FIX-URI 4 OCT ===================== */
/* 10. HOMEPAGE — lumina aurie din hero se stinge lin (fără linie pe iPhone) */
body.page-id-42 section.hero .hero-glow {
  -webkit-mask-image: linear-gradient(to bottom, #000 0, #000 480px, transparent 700px);
          mask-image: linear-gradient(to bottom, #000 0, #000 480px, transparent 700px);
}

/* ---------- 11. HOMEPAGE — „Alege-ți ritualul”: opțiuni bifate + buton Continuă (4 oct 2026) ---------- */
body.page-id-42 #deck .azh-feel-opt.is-selected {
  border-color: #C9A95C !important;
  background: rgba(201, 169, 92, .10) !important;
  color: #E8DCC8 !important;
}
body.page-id-42 #deck .azh-feel-opt.is-selected::before {
  background: #C9A95C !important;
  border-color: #C9A95C !important;
}
body.page-id-42 #deck .azh-feel-go {
  display: table;
  margin: 34px auto 0;
  padding: 15px 34px;
  background: #8B6914;
  border: 1px solid #8B6914;
  color: #050405 !important;
  font-family: 'Jost', sans-serif;
  font-weight: 700;
  font-size: 12.5px;
  letter-spacing: .18em;
  text-transform: uppercase;
  text-decoration: none !important;
  transition: opacity .3s ease, background .3s ease;
}
body.page-id-42 #deck .azh-feel-go[aria-disabled="true"] {
  opacity: .35;
  cursor: default;
}
body.page-id-42 #deck .azh-feel-go + .azh-feel-skip {
  margin-top: 22px !important;
}

/* ---------- 12. LINKURI „INVIZIBILE” (5 oct 2026) ----------
   Culoarea globală Elementor pentru linkuri (maro închis) bătea stilul paginii.
   Candle Care: citat centrat + „Află mai multe…” + „Înapoi la Ghid” vizibile.
   Livrare & retururi: meniul de sus. Wholesale / Parteneriate: emailul din citat. */
body.page-id-1185 .guide-closing p.guide-quote { margin: 34px auto 0 !important; }
body.page-id-1185 a.guide-back { color: var(--muted, #A69C8D) !important; }
body.page-id-1185 a.guide-back:hover { color: var(--gold-light, #C9A95C) !important; }
body.page-id-1185 a.guide-cta-link { color: var(--gold-light, #C9A95C) !important; }
body.page-id-21 header nav a { color: #E8DCC8 !important; }
body.page-id-21 header nav a:hover { color: #C9A95C !important; }
body.page-id-1602 .legal-quote a[href^="mailto:"],
body.page-id-1604 .legal-quote a[href^="mailto:"] { color: #C9A95C !important; }

/* ---------- 13. SHOP — un singur mesaj „În curând” + focus auriu (5 oct 2026) ----------
   Pe tab-urile Ceaiuri / Seturi / Accesorii apăreau 2 mesaje unul sub altul.
   Rămâne doar „Acest ritual încă prinde formă.” (cel bilingv RO/EN). */
body:has(#shopEmptyState) #azi-soon-msg {
  display: none !important;
}
/* Navigare cu tastatura: contur auriu discret în loc de albastrul Chrome (sitewide) */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
[role="tab"]:focus-visible {
  outline: 1px solid #C9A95C !important;
  outline-offset: 4px !important;
  box-shadow: none !important;
}

/* ---------- 14. QA 8 oct 2026 — checkout + newsletter ----------
   Checkout: linkurile „politică de confidențialitate” și „termenii și condițiile”
   erau maro închis (culoarea globală Elementor). Newsletter: butonul „Începe”
   avea 3 variante — acum peste tot auriu deschis, colțuri 3px, text negru. */
body.page-id-19 a.woocommerce-privacy-policy-link,
body.page-id-19 a.woocommerce-terms-and-conditions-link {
  color: #C9A95C !important;
  text-decoration: underline !important;
  text-underline-offset: 3px;
}
body.page-id-19 a.woocommerce-privacy-policy-link:hover,
body.page-id-19 a.woocommerce-terms-and-conditions-link:hover {
  color: #E8DCC8 !important;
}
html body[class*="page-id-"] footer form.newsletter-form button,
html body.woocommerce footer form.newsletter-form button {
  background: #C9A95C !important;
  color: #050405 !important;
  border-radius: 3px !important;
}
html body[class*="page-id-"] footer form.newsletter-form button:hover,
html body.woocommerce footer form.newsletter-form button:hover {
  background: #E8DCC8 !important;
}
/* ---------- 15. AI UITAT PAROLA + CONFIRMARE (8 oct 2026) ----------
   Merge împreună cu snippet-ul WPCode „azi-lost-password.js”. Nu șterge nimic altceva. */
body.woocommerce-lost-password .woocommerce > .woocommerce-message,
body.woocommerce-lost-password .woocommerce > .woocommerce-info {
  display: none !important; /* confirmarea apare o singură dată, în card */
}
body.woocommerce-lost-password form.lost_reset_password .form-row {
  float: none !important;
  width: 100% !important;
}
body.woocommerce-lost-password form.lost_reset_password #user_login {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box;
  height: 52px;
  padding: 0 16px !important;
  font-size: 16px !important; /* 16px: iPhone nu mai face zoom pe câmp */
  letter-spacing: .01em;
}
body.woocommerce-lost-password form.lost_reset_password .azi-lp-back {
  display: block;
  margin-top: 18px;
  text-align: center;
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: #A69C8D !important;
  text-decoration: none !important;
}
body.woocommerce-lost-password form.lost_reset_password .azi-lp-back:hover { color: #C9A95C !important; }

/* Cardul de confirmare */
body.woocommerce-lost-password .woocommerce.azi-lp-sent-wrap {
  display: block !important;
  grid-template-columns: none !important;
}
body.woocommerce-lost-password .azi-lp-sent {
  max-width: 520px;
  margin: 0 auto;
  padding: 44px 36px 40px;
  border: 1px solid rgba(232, 220, 200, .14);
  background: rgba(22, 19, 15, .62);
  text-align: center;
}
body.woocommerce-lost-password .azi-lp-glyph { display: block; color: #C9A95C; font-size: 20px; margin-bottom: 14px; }
body.woocommerce-lost-password .azi-lp-sent .azi-lp-eyebrow {
  margin: 0 0 10px; font-family: 'Jost', sans-serif; font-size: 11px; font-weight: 500;
  letter-spacing: .26em; text-transform: uppercase; color: #C9A95C;
}
body.woocommerce-lost-password .azi-lp-sent h2 {
  margin: 0 0 16px; font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 500;
  font-size: 34px; line-height: 1.15; color: #E8DCC8;
}
body.woocommerce-lost-password .azi-lp-sent p { margin: 0 0 10px; color: #C4A882; line-height: 1.7; }
body.woocommerce-lost-password .azi-lp-sent .azi-lp-note { color: #A69C8D; font-size: 13px; margin-bottom: 28px; }
body.woocommerce-lost-password .azi-lp-actions { display: flex; flex-direction: column; align-items: center; gap: 16px; }
body.woocommerce-lost-password .azi-lp-primary {
  display: block; width: 100%; padding: 15px 24px; background: #C9A95C; color: #050405 !important;
  font-family: 'Jost', sans-serif; font-weight: 700; font-size: 12.5px; letter-spacing: .18em;
  text-transform: uppercase; text-decoration: none !important;
}
body.woocommerce-lost-password .azi-lp-primary:hover { background: #E8DCC8; }
body.woocommerce-lost-password .azi-lp-again {
  font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: #A69C8D !important; text-decoration: none !important;
}
body.woocommerce-lost-password .azi-lp-again:hover { color: #C9A95C !important; }
@media (max-width: 600px) {
  body.woocommerce-lost-password .azi-lp-sent { padding: 36px 22px 32px; }
  body.woocommerce-lost-password .azi-lp-sent h2 { font-size: 29px; }
}

/* ---------- 15b. BUTOANE: „Trimite linkul” + Login „Autentificare/Înregistrare” (8 oct 2026) ----------
   Auriu deschis #C9A95C, text negru bold — ca restul butoanelor (nu ca hero-ul homepage). */
body.woocommerce-lost-password form.lost_reset_password button[type="submit"] {
  background: #C9A95C !important; border-color: #C9A95C !important; color: #050405 !important; font-weight: 700 !important;
}
body.woocommerce-lost-password form.lost_reset_password button[type="submit"]:hover { background: #E8DCC8 !important; border-color: #E8DCC8 !important; }
html body.page-id-548 .azl-card form.woocommerce-form-login button[type="submit"],
html body.page-id-548 .azl-card form.woocommerce-form-register button[type="submit"],
body.page-id-548 form.woocommerce-form-login button[type="submit"],
body.page-id-548 form.woocommerce-form-register button[type="submit"] {
  background: #C9A95C !important; border-color: #C9A95C !important; color: #050405 !important; font-weight: 700 !important;
}
html body.page-id-548 .azl-card form.woocommerce-form-login button[type="submit"]:hover,
html body.page-id-548 .azl-card form.woocommerce-form-register button[type="submit"]:hover { background: #E8DCC8 !important; border-color: #E8DCC8 !important; }


/* ===== FIX 13 oct 2026 (QA) — adăugat la final, nu șterge nimic altceva ===== */

/* F-02: footer pe toată lățimea și pe Termeni (1130), Confidențialitate + Cookies (3), Livrare (21), Wholesale (1602), Parteneriate (1604) */
html body.page-id-1130 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-3 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-21 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-1602 .e-con-inner:has(> .elementor-widget > footer),
html body.page-id-1604 .e-con-inner:has(> .elementor-widget > footer) {
  max-width: none !important;
}

/* DS-04: pașii inactivi din finder-ul de pe Rituals, lizibili (contrast ~4:1, rămân estompați) */
html body.page-id-120 .azr-progress li {
  color: rgba(232, 220, 200, .5) !important;
}

/* DS-02: butonul „Anunță-mă la lansare” (Shop + produse) în auriul din paletă, bold */
html body .azi-soon__btn {
  border-color: #C9A95C !important;
  color: #C9A95C !important;
  font-weight: 700 !important;
}
html body .azi-soon__btn:hover,
html body .azi-soon__btn:focus-visible {
  background: #C9A95C !important;
  border-color: #C9A95C !important;
  color: #050405 !important;
}