/* ============================================================================
   El carrito lateral y /carrito/ (inc/inloff-carritos-aviso.php, ADR-162).
   - Carrito lateral: una fila fija entre los productos y el pie con «Guárdalo
     por email» y «Avísame aquí» (decisión del owner, 24-sep). Cada botón abre
     su panel debajo; cerrada, ocupa una sola fila.
   - /carrito/: «¿Te avisamos en este navegador?» es una línea con la misma forma
     que la captura del email (inloff-cart-page.css, .inloff-cart-page__recovery).
   - Cuándo le llega y si llega a su fecha (fase 1 de la recuperación, 24-sep):
     en el pie del carrito lateral y como fila de la entrega en /carrito/.
   ========================================================================= */

/* ── La fila del carrito lateral ────────────────────────────────────────── */

.inloff-carritos-acciones {
    flex: none;
    padding: 0 22px;
    border-top: 1px dashed #E6DECE;
    color: var(--inloff-navy, #1B2540);
}

.inloff-carritos-acciones[hidden] {
    display: none;
}

.inloff-carritos-acciones__fila {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 22px;
}

/* Flatsome pone los botones en mayúsculas, con margen y peso propio: aquí no. */
.inloff-carritos-acciones .inloff-carritos-acciones__boton,
.inloff-avisos .inloff-avisos__activar {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    margin: 0;
    padding: 4px 0;
    border: 0;
    background: transparent;
    color: var(--inloff-navy, #1B2540);
    font-family: inherit;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer;
    transition: color 140ms ease-out;
}

.inloff-carritos-acciones .inloff-carritos-acciones__boton svg {
    flex: none;
    color: var(--inloff-bronze-text, #8A6A4F);
}

.inloff-carritos-acciones .inloff-carritos-acciones__boton:hover,
.inloff-avisos .inloff-avisos__activar:hover {
    color: var(--inloff-bronze-text, #8A6A4F);
}

.inloff-carritos-acciones .inloff-carritos-acciones__boton[aria-expanded="true"] span {
    text-decoration: underline;
    text-decoration-color: var(--inloff-heart, #C5A184);
    text-underline-offset: 4px;
}

.inloff-avisos .inloff-avisos__activar:disabled {
    cursor: default;
    opacity: 0.7;
}

.inloff-carritos-acciones button:focus-visible,
.inloff-carritos-acciones a:focus-visible,
.inloff-avisos .inloff-avisos__activar:focus-visible,
.inloff-avisos a:focus-visible,
.inloff-carritos-entrega a:focus-visible,
.inloff-carritos-evento a:focus-visible {
    outline: 2px solid var(--inloff-heart, #C5A184);
    outline-offset: 2px;
    border-radius: 4px;
}

/* «✓ Guardado en tu email», «✓ Aviso activado». */
.inloff-carritos-acciones .inloff-carritos-acciones__hecho {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 40px;
    margin: 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--inloff-navy, #1B2540);
}

.inloff-carritos-acciones .inloff-carritos-acciones__hecho svg,
.inloff-carritos-acciones .inloff-carritos-guardar__hecho svg,
.inloff-avisos .inloff-avisos__hecho svg {
    flex: none;
    color: var(--inloff-success, #4F7A52);
}

/* ── Los paneles: el email y el aviso ───────────────────────────────────── */

.inloff-carritos-acciones__panel {
    padding: 0 0 12px;
}

.inloff-carritos-acciones .inloff-carritos-guardar__ayuda,
.inloff-carritos-acciones .inloff-carritos-aviso__nota {
    margin: 0 0 8px;
    font-size: 12px;
    line-height: 1.45;
    color: #6E6759;
}

.inloff-carritos-acciones .inloff-carritos-guardar__ayuda a,
.inloff-carritos-acciones .inloff-carritos-aviso__nota a,
.inloff-avisos .inloff-avisos__nota a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
}

.inloff-carritos-guardar__fila {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 6px;
}

/* Flatsome da a los input[type=email] alto, sombra interior y esquinas rectas. */
.inloff-carritos-acciones .inloff-carritos-guardar__email {
    flex: 1 1 160px;
    min-width: 0;
    width: auto;
    height: 36px;
    margin: 0;
    padding: 0 11px;
    border: 1px solid #DDD4C5;
    border-radius: 8px;
    background: #FFF;
    box-shadow: none;
    font-size: 13px;
    color: var(--inloff-navy, #1B2540);
    transition: border-color 140ms ease-out, box-shadow 140ms ease-out;
}

.inloff-carritos-acciones .inloff-carritos-guardar__email:focus {
    outline: 0;
    border-color: var(--inloff-navy, #1B2540);
    box-shadow: 0 0 0 3px rgba(27, 37, 64, 0.08);
}

.inloff-carritos-acciones .inloff-carritos-guardar__enviar,
.inloff-carritos-acciones .inloff-carritos-aviso__activar {
    appearance: none;
    flex: 0 0 auto;
    height: 36px;
    min-height: 0;
    margin: 0;
    padding: 0 16px;
    border: 0;
    border-radius: 8px;
    background: var(--inloff-navy, #1B2540);
    color: #FAF7F2;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color 140ms ease-out;
}

.inloff-carritos-acciones .inloff-carritos-guardar__enviar:hover,
.inloff-carritos-acciones .inloff-carritos-aviso__activar:hover {
    background: #2A3759;
}

.inloff-carritos-acciones .inloff-carritos-guardar__enviar:disabled,
.inloff-carritos-acciones .inloff-carritos-aviso__activar:disabled {
    opacity: 0.6;
    cursor: progress;
}

.inloff-carritos-acciones .inloff-carritos-guardar__estado,
.inloff-carritos-acciones .inloff-carritos-aviso__estado {
    margin: 6px 0 0;
    font-size: 12px;
    line-height: 1.4;
    color: #6E6759;
}

.inloff-carritos-acciones .inloff-carritos-guardar__estado:empty,
.inloff-carritos-acciones .inloff-carritos-aviso__estado:empty {
    display: none;
}

/* La confirmación dentro del panel: a qué dirección le escribiremos, o que el aviso está activo. */
.inloff-carritos-acciones .inloff-carritos-guardar__hecho {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    font-size: 13px;
    line-height: 1.45;
    color: var(--inloff-navy, #1B2540);
    overflow-wrap: anywhere;
}

.inloff-carritos-acciones .inloff-carritos-guardar__hecho svg {
    margin-top: 2px;
}

/* ── /carrito/: la línea del aviso junto a la captura del email ─────────── */

.inloff-avisos {
    color: var(--inloff-navy, #1B2540);
}

.inloff-avisos--pagina {
    margin-top: 10px;
    padding-top: 12px;
    border-top: 1px dashed #E6DECE;
}

.inloff-avisos .inloff-avisos__nota,
.inloff-avisos .inloff-avisos__estado {
    margin: 0 0 0 22px;
    font-size: 12px;
    line-height: 1.4;
    color: #6E6759;
}

.inloff-avisos .inloff-avisos__estado {
    margin-top: 4px;
}

.inloff-avisos .inloff-avisos__estado:empty {
    display: none;
}

.inloff-avisos .inloff-avisos__hecho {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0;
    padding: 4px 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--inloff-navy, #1B2540);
}

.inloff-avisos .inloff-avisos__hecho svg {
    margin-top: 1px;
}

/* ── Cuándo le llega (pie del carrito lateral) ──────────────────────────── */

.inloff-carritos-entrega {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 10px;
    font-size: 13px;
    line-height: 1.45;
    color: var(--inloff-navy, #1B2540);
    text-align: left;
}

.inloff-carritos-entrega svg {
    flex: none;
    margin-top: 2px;
    color: var(--inloff-bronze-text, #8A6A4F);
}

.inloff-carritos-entrega strong {
    font-weight: 600;
    white-space: nowrap;
}

.inloff-carritos-entrega a,
.inloff-carritos-evento a {
    color: inherit;
    text-decoration: underline;
    text-underline-offset: 2px;
    overflow-wrap: anywhere;
}

.inloff-carritos-entrega--ok svg {
    color: var(--inloff-success, #4F7A52);
}

/* No llega a su fecha: se ve, sin alarmas (tinte del heart, no rojo). */
.inloff-carritos-entrega--aviso {
    margin-top: -2px;
    padding: 10px 12px;
    background: #F6EEE6;
    border: 1px solid #E6D3C2;
    border-radius: 10px;
}

/* ── Su fecha, en la lista de la entrega de /carrito/ ───────────────────── */

.inloff-carritos-evento--aviso .inloff-cart-page__delivery-text {
    color: var(--inloff-navy, #1B2540);
}

/* ── Móvil y táctil ─────────────────────────────────────────────────────── */

/* Mismo margen lateral que los productos del carrito lateral en el móvil. */
@media (max-width: 600px) {
    .inloff-carritos-acciones {
        padding-left: 18px;
        padding-right: 18px;
    }
}

/* Pulsables de 44 px en pantallas táctiles; el email a 16 px para que el
   iPhone no amplíe la página al escribir. */
@media (pointer: coarse) {
    .inloff-carritos-acciones .inloff-carritos-acciones__boton,
    .inloff-carritos-acciones .inloff-carritos-acciones__hecho,
    .inloff-avisos .inloff-avisos__activar,
    .inloff-carritos-acciones .inloff-carritos-guardar__email,
    .inloff-carritos-acciones .inloff-carritos-guardar__enviar,
    .inloff-carritos-acciones .inloff-carritos-aviso__activar {
        min-height: 44px;
    }
    .inloff-carritos-acciones .inloff-carritos-guardar__email {
        font-size: 16px;
    }
}