/* ================= Aura Essenza · página del carrito ================= */
.cart-body { background: var(--bg); }
.nav-cart.is-current { border-color: var(--gold); color: var(--gold); }
.nav-cart.is-current .nav-cart-ic { color: var(--gold); }
.cart-main { max-width: var(--maxw); margin: 0 auto; padding: clamp(2.2rem, 5vw, 3.6rem) var(--gutter) clamp(4rem, 8vw, 6rem); }
.cart-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 1rem 2rem; margin-bottom: 2rem; }
.cart-head h1 { font-family: var(--serif); font-weight: 400; font-size: clamp(2.3rem, 6vw, 4.2rem); line-height: 1; letter-spacing: -.015em; }
.cart-head h1 em { font-style: italic; color: var(--gold); }
.cart-continue { font-size: .66rem; letter-spacing: .2em; text-transform: uppercase; color: var(--cream-2); transition: color .3s; }
.cart-continue:hover { color: var(--gold); }

.cart-layout[hidden] { display: none; }
.cart-layout { display: grid; grid-template-columns: 1fr; gap: 2.4rem; animation: cart-fade-in .5s var(--ease-out); }
@media (min-width: 960px) { .cart-layout { grid-template-columns: 1fr 380px; gap: 3.5rem; align-items: start; } }
@keyframes cart-fade-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }

/* regalo por compra */
.cart-gift { padding: 1.1rem 1.3rem; border: 1px solid rgba(201,165,92,.4); background: rgba(201,165,92,.06); margin-bottom: 1.4rem; }
.cart-gift[hidden] { display: none; }
.cart-gift-top { display: flex; gap: .8rem; align-items: center; }
.cart-gift-ic { font-size: 1.2rem; }
.cart-gift-top p { margin: 0; font-size: .9rem; color: var(--cream-2); font-weight: 300; }
.cart-gift-top p b { color: var(--gold); font-weight: 500; }
.cart-gift-bar { height: 3px; background: var(--hair); margin-top: .9rem; overflow: hidden; }
.cart-gift-bar i { display: block; height: 100%; width: 0; background: var(--gold); transition: width .8s var(--ease-out); }

/* artículos */
.cart-items { display: flex; flex-direction: column; }
.cart-item { display: grid; grid-template-columns: 84px 1fr auto; gap: 1.2rem; align-items: center; padding: 1.3rem 0; border-top: 1px solid var(--hair); }
.cart-item:first-child { border-top: 0; padding-top: 0; }
.cart-gift-items:empty { display: none; }
.cart-gift-items .cart-item { border-top: 1px dashed rgba(201,165,92,.35); }
.ci-media { display: block; width: 84px; aspect-ratio: 4 / 5; overflow: hidden; }
.ci-media img { width: 100%; height: 100%; object-fit: cover; display: block; background: #E9E3D7; }
.ci-ph { display: block; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(243,236,221,.06), rgba(243,236,221,.02)); border: 1px solid var(--hair); }
.ci-media-gift { display: grid; place-items: center; font-size: 1.6rem; background: rgba(201,165,92,.1); border: 1px solid rgba(201,165,92,.4); }
.ci-info small { display: block; font-size: .6rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.ci-name { display: block; font-family: var(--serif); font-size: 1.45rem; line-height: 1.1; color: var(--cream); margin-top: .15rem; }
a.ci-name:hover { color: var(--gold); }
.ci-meta { display: block; font-size: .78rem; color: var(--cream-3); margin-top: .3rem; font-weight: 300; }
.ci-ctrl { display: flex; align-items: center; gap: .3rem; margin-top: .8rem; }
.ci-ctrl button { width: 32px; height: 32px; border: 1px solid var(--line); background: transparent; color: var(--cream-2); font-size: 1rem; cursor: pointer; transition: all .25s; }
.ci-ctrl button:hover { border-color: var(--gold); color: var(--gold); }
.ci-ctrl em { min-width: 32px; text-align: center; font-style: normal; font-size: .95rem; }
.ci-del { width: auto !important; height: auto !important; border: 0 !important; margin-left: .6rem; font-size: .62rem !important; letter-spacing: .16em; text-transform: uppercase; color: var(--cream-3) !important; }
.ci-del:hover { color: var(--gold) !important; }
.ci-price { font-family: var(--sans); font-weight: 300; font-size: 1.15rem; letter-spacing: .04em; white-space: nowrap; }
.ci-price.is-free { color: var(--gold); font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; }

/* resumen */
.cart-summary-box { position: sticky; top: 92px; padding: 1.6rem 1.5rem 1.7rem; background: var(--panel); border: 1px solid var(--hair); }
.cart-summary-box h2 { font-family: var(--serif); font-weight: 400; font-size: 1.7rem; margin-bottom: 1.1rem; }
.cart-row { display: flex; justify-content: space-between; align-items: baseline; padding: .5rem 0; font-size: .86rem; color: var(--cream-2); font-weight: 300; }
.cart-row[hidden] { display: none; }
.cart-row b { font-weight: 400; color: var(--cream); }
.cart-row b.is-free { color: var(--gold); font-size: .66rem; letter-spacing: .18em; text-transform: uppercase; }
.cart-row-total { margin-top: .4rem; padding-top: .9rem; border-top: 1px solid var(--hair); font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; }
.cart-row-total b { font-family: var(--serif); font-size: 2rem; letter-spacing: 0; }
.cart-note { margin-top: .8rem; font-size: .76rem; color: var(--cream-3); font-weight: 300; line-height: 1.55; }

/* formulario */
.cart-form { margin-top: 1.4rem; padding-top: 1.3rem; border-top: 1px solid var(--hair); display: flex; flex-direction: column; gap: .9rem; }
.cart-form .field { display: flex; flex-direction: column; gap: .35rem; }
.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.cart-form label { font-size: .6rem; letter-spacing: .2em; text-transform: uppercase; color: var(--cream-3); }
.cart-form label span { color: var(--gold); }
.cart-form input, .cart-form select { width: 100%; padding: .75rem .9rem; background: rgba(8,8,10,.6); border: 1px solid var(--line); color: var(--cream); font-family: var(--sans); font-size: .92rem; font-weight: 300; outline: none; transition: border-color .3s; }
.cart-form select { cursor: pointer; }
.cart-form select option { background: #0B0B0C; }
.cart-form input:focus, .cart-form select:focus { border-color: var(--gold); }
.btn-order { margin-top: .4rem; padding: 1rem 1.4rem; background: var(--gold); color: var(--bg); font-family: var(--sans); font-size: .7rem; letter-spacing: .22em; text-transform: uppercase; border: 0; cursor: pointer; transition: background .3s; }
.btn-order:hover { background: var(--gold-2); }
.cart-form-msg { min-height: 1.2em; font-size: .8rem; color: var(--cream-2); }
.cart-form-msg.is-error { color: #E0A18C; }
.cart-contact { margin-top: 1.2rem; padding-top: 1.2rem; border-top: 1px solid var(--hair); animation: cart-fade-in .5s var(--ease-out); }
.cart-contact[hidden] { display: none; }
.cart-contact-lead { font-size: .84rem; color: var(--cream-2); font-weight: 300; margin-bottom: .8rem; }
.btn-contact { display: block; margin-top: .6rem; padding: .85rem 1rem; text-align: center; border: 1px solid var(--gold); color: var(--gold); font-size: .68rem; letter-spacing: .18em; text-transform: uppercase; transition: all .3s; }
.btn-contact:hover { background: var(--gold); color: var(--bg); }

/* completa tu pedido */
.cart-related { margin-top: clamp(3rem, 7vw, 5rem); padding-top: 2.5rem; border-top: 1px solid var(--hair); }
.cart-related[hidden] { display: none; }
.cart-related h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.8rem, 4vw, 2.6rem); line-height: 1; margin-bottom: 1.6rem; }
.cart-related h2 em { font-style: italic; color: var(--gold); }
.cart-related-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--hair); border: 1px solid var(--hair); }
@media (min-width: 900px) { .cart-related-grid { grid-template-columns: repeat(4, 1fr); } }
.rel-card { background: var(--panel); padding: 0 1.2rem 1.2rem; display: flex; flex-direction: column; gap: .3rem; }
.rel-media { display: block; aspect-ratio: 4 / 5; margin: 0 -1.2rem .9rem; overflow: hidden; }
.rel-media img { width: 100%; height: 100%; object-fit: cover; display: block; background: #E9E3D7; }
.rel-ph { display: block; width: 100%; height: 100%; background: linear-gradient(180deg, rgba(243,236,221,.05), rgba(243,236,221,.015)); }
.rel-card small { font-size: .58rem; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
.rel-name { font-family: var(--serif); font-size: 1.3rem; line-height: 1.1; color: var(--cream); }
.rel-name:hover { color: var(--gold); }
.rel-meta { font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cream-3); }
.rel-foot { margin-top: auto; padding-top: .9rem; display: flex; justify-content: space-between; align-items: center; }
.rel-foot b { font-weight: 300; font-size: 1rem; }
.rel-add { padding: .55rem 1rem; border: 1px solid var(--gold); background: transparent; color: var(--gold); font-family: var(--sans); font-size: .6rem; letter-spacing: .18em; text-transform: uppercase; cursor: pointer; transition: all .3s; }
.rel-add:hover { background: var(--gold); color: var(--bg); }

/* vacío */
.cart-empty[hidden] { display: none; }
.cart-empty { text-align: center; padding: 4rem 1rem; }
.cart-empty p { font-family: var(--serif); font-style: italic; font-size: 1.5rem; color: var(--cream-3); margin-bottom: 1.4rem; }
.btn-back-shop { display: inline-block; padding: .95rem 2.2rem; background: var(--gold); color: var(--bg); font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; }
@media (max-width: 640px) {
  .cart-item { grid-template-columns: 64px 1fr; }
  .ci-media { width: 64px; }
  .ci-price { grid-column: 2; justify-self: end; }
  .field-row { grid-template-columns: 1fr; }
  .cart-summary-box { position: static; }
}