.va-pedido-pagina,.va-seguimiento-pagina {
    min-height:calc(100vh - 88px);
    padding:42px 20px 72px;
    background:linear-gradient(135deg,#faf3e0 0,#f8fbf1 44%,#eef5e9 100%);
    color:#11211a
}
.va-pedido-contenedor {
    max-width:1180px;
    margin:auto
}
.va-pedido-regreso {
    display:inline-flex;
    gap:10px;
    align-items:center;
    color:#11211a;
    font-weight:800;
    text-decoration:none;
    margin-bottom:28px
}
.va-pedido-regreso:hover {
    color:#557f24
}
.va-pedido-encabezado {
    display:flex;
    justify-content:space-between;
    gap:24px;
    align-items:end;
    margin-bottom:24px
}
.va-pedido-encabezado h1 {
    font-size:clamp(2rem,4vw,3.5rem);
    line-height:1.02;
    margin:10px 0;
    color:#11211a
}
.va-pedido-encabezado p {
    max-width:650px;
    margin:0;
    color:#657269;
    font-size:1.05rem
}
.va-sobretitulo,.va-pedido-etiqueta {
    display:block;
    color:#72a928;
    font-size:.78rem;
    font-weight:900;
    letter-spacing:.16em;
    text-transform:uppercase
}
.va-sobretitulo-punto {
    display:inline-block;
    width:9px;
    height:9px;
    border-radius:50%;
    background:#a2c547;
    margin-right:8px
}
.va-pedido-referencia {
    border:1px solid #d4a373;
    background:#fffaf0;
    color:#6e4a28;
    border-radius:999px;
    padding:11px 16px;
    font-weight:800;
    white-space:nowrap
}
.va-pedido-progreso {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:10px;
    margin-bottom:22px
}
.va-pedido-progreso span {
    display:flex;
    align-items:center;
    gap:12px;
    padding:12px 14px;
    border:1px solid #dce5d7;
    background:rgba(255,255,255,.74);
    border-radius:14px;
    color:#718078
}
.va-pedido-progreso span.activo {
    background:#11211a;
    color:#fff;
    border-color:#11211a
}
.va-pedido-progreso b {
    font-size:.8rem
}
.va-pedido-progreso small {
    font-weight:800
}
.va-pedido-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) 330px;
    gap:22px;
    align-items:start
}
.va-pedido-principal,.va-pedido-resumen-lateral,.va-seguimiento-card {
    background:rgba(255,255,255,.9);
    border:1px solid #dce5d7;
    border-radius:24px;
    box-shadow:0 18px 45px rgba(17,33,26,.08)
}
.va-pedido-principal {
    padding:34px
}
.va-pedido-pagina-panel[hidden] {
    display:none!important
}
.va-pedido-pagina-panel h2 {
    font-size:clamp(1.45rem,3vw,2.25rem);
    margin:10px 0 5px
}
.va-pedido-pagina .va-boton,
.va-seguimiento-pagina .va-boton {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:44px;
    padding:11px 17px;
    border:1px solid transparent;
    border-radius:12px;
    font:inherit;
    font-size:.88rem;
    font-weight:800;
    line-height:1;
    text-decoration:none;
    cursor:pointer;
    transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease,box-shadow .18s ease
}
.va-pedido-pagina .va-boton:hover,
.va-seguimiento-pagina .va-boton:hover {
    transform:translateY(-1px)
}
.va-pedido-pagina .va-boton-primario,
.va-seguimiento-pagina .va-boton-primario {
    background:#a2c547;
    border-color:#8eb234;
    color:#11211a;
    box-shadow:0 8px 18px rgba(114,169,40,.18)
}
.va-pedido-pagina .va-boton-primario:hover,
.va-seguimiento-pagina .va-boton-primario:hover {
    background:#8eb234;
    border-color:#7c9f2b;
    color:#11211a
}
.va-pedido-pagina .va-boton-fantasma,
.va-seguimiento-pagina .va-boton-fantasma {
    background:#fff;
    border-color:#d6dfd4;
    color:#34443a
}
.va-pedido-pagina .va-boton-fantasma:hover,
.va-seguimiento-pagina .va-boton-fantasma:hover {
    background:#f1f6eb;
    border-color:#a2c547;
    color:#11211a
}
.va-pedido-pagina .va-boton-secundario,
.va-seguimiento-pagina .va-boton-secundario {
    background:#11211a;
    border-color:#11211a;
    color:#fff
}
.va-pedido-pagina .va-boton-secundario:hover,
.va-seguimiento-pagina .va-boton-secundario:hover {
    background:#254b35;
    border-color:#254b35;
    color:#fff
}
.va-pedido-ayuda {
    color:#718078;
    margin-bottom:24px
}
.va-pedido-items,.va-pedido-lateral-items {
    display:grid;
    gap:10px
}
.va-pedido-item {
    display:grid;
    grid-template-columns:64px 1fr auto;
    gap:14px;
    align-items:center;
    border:1px solid #e1e8df;
    border-radius:15px;
    padding:11px;
    background:#fbfcf8
}
.va-pedido-item img {
    width:64px;
    height:64px;
    object-fit:contain;
    border-radius:11px;
    background:#eef3e9
}
.va-pedido-item img[src=""] {
    display:none
}
.va-pedido-item strong,.va-pedido-lateral-item strong {
    display:block
}
.va-pedido-item small,.va-pedido-lateral-item small {
    display:block;
    color:#718078;
    margin-top:4px
}
.va-pedido-item b {
    color:#557f24
}
.va-pedido-panel-acciones {
    display:flex;
    justify-content:space-between;
    gap:12px;
    margin-top:28px;
    padding-top:20px;
    border-top:1px solid #e4eadf
}
.va-pedido-panel-acciones .va-boton:disabled {
    background:#e7ece5;
    border-color:#d8e0d5;
    color:#7b887f;
    cursor:not-allowed;
    opacity:1;
    box-shadow:none;
    transform:none
}
.va-pedido-panel-acciones .va-boton:disabled:hover {
    background:#e7ece5;
    border-color:#d8e0d5;
    color:#7b887f
}
.va-pedido-campos-grid {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:16px
}
.va-pedido-principal label {
    display:grid;
    gap:7px;
    color:#34443a;
    font-weight:800;
    font-size:.87rem;
    margin-bottom:16px
}
.va-pedido-principal label small {
    font-weight:500;
    color:#87938c
}
.va-pedido-principal input {
    width:100%;
    border:1px solid #d6dfd4;
    border-radius:11px;
    padding:12px 14px;
    background:#f8faf5;
    color:#11211a;
    font:inherit
}
.va-pedido-principal input:focus {
    outline:2px solid #a2c547;
    border-color:#72a928
}
.va-pedido-mapa-wrap {
    border:1px solid #e0e7da;
    border-radius:16px;
    padding:15px;
    margin:18px 0;
    background:#fbfcf8
}
.va-pedido-mapa-cabecera {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin-bottom:12px
}
.va-pedido-principal select {
    width:100%;
    border:1px solid #d6dfd4;
    border-radius:11px;
    padding:12px 14px;
    background:#f8faf5;
    color:#11211a;
    font:inherit
}
.va-pedido-principal select:focus {
    outline:2px solid #a2c547;
    border-color:#72a928
}
.va-pedido-mapa-cabecera strong {
    color:#11211a;
    font-size:1rem
}
.va-pedido-mapa-cabecera .va-boton {
    min-height:38px;
    padding:9px 13px;
    font-size:.82rem
}
.va-pedido-mapa {
    height:215px;
    border-radius:12px;
    overflow:hidden;
    background:#e8eee4;
    cursor:crosshair
}
.va-pedido-mapa-mensaje {
    font-size:.84rem;
    color:#718078;
    margin:10px 0 0
}
.va-pedido-forma-pago {
    border:0;
    padding:0;
    margin:22px 0 0
}
.va-pedido-forma-pago legend {
    font-weight:900;
    font-size:1rem;
    margin-bottom:12px
}
.va-pedido-opcion-pago {
    display:flex!important;
    grid-template-columns:none!important;
    align-items:center;
    gap:12px;
    border:1px solid #dbe5d6;
    border-radius:13px;
    padding:13px!important;
    background:#fff
}
.va-pedido-opcion-pago:has(input:checked) {
    border-color:#a2c547;
    background:#f3f9df
}
.va-pedido-opcion-pago input {
    width:auto
}
.va-pedido-opcion-pago span {
    display:grid;
    grid-template-columns:auto 1fr;
    gap:0 10px;
    align-items:center
}
.va-pedido-opcion-pago i {
    grid-row:span 2;
    color:#557f24
}
.va-pedido-opcion-pago small {
    grid-column:2
}
.va-pedido-confirmacion {
    display:grid;
    gap:12px
}
.va-pedido-confirmacion>div {
    padding:15px;
    border-radius:12px;
    background:#f6f8f1;
    border:1px solid #e1e8df
}
.va-pedido-feedback {
    margin-top:14px;
    color:#b34b35;
    font-weight:700
}
.va-pedido-feedback.ok {
    color:#557f24
}
.va-pedido-resumen-lateral {
    padding:22px;
    position:sticky;
    top:105px
}
.va-pedido-resumen-marca {
    display:grid;
    gap:4px;
    padding:10px 0 20px;
    border-bottom:1px solid #e3e9df
}
.va-pedido-resumen-marca span {
    font-size:.72rem;
    letter-spacing:.15em;
    color:#a27543;
    font-weight:900
}
.va-pedido-resumen-marca strong {
    font-size:1.5rem
}
.va-pedido-resumen-marca small {
    color:#718078
}
.va-pedido-lateral-items {
    padding:18px 0
}
.va-pedido-lateral-item {
    display:grid;
    grid-template-columns:48px 1fr;
    gap:10px;
    align-items:center
}
.va-pedido-lateral-item img {
    width:48px;
    height:48px;
    object-fit:contain;
    background:#eef3e9;
    border-radius:9px
}
.va-pedido-totales {
    border-top:1px solid #e3e9df;
    padding-top:15px
}
.va-pedido-totales>div {
    display:flex;
    justify-content:space-between;
    padding:5px 0;
    color:#718078
}
.va-pedido-totales .total {
    border-top:1px solid #e3e9df;
    margin-top:7px;
    padding-top:13px;
    color:#11211a;
    font-size:1.18rem
}
.va-pedido-seguridad {
    font-size:.78rem;
    color:#718078;
    margin:18px 0 0
}
.va-pedido-seguridad i {
    color:#a27543;
    margin-right:5px
}
.va-pedido-resultado {
    text-align:center;
    padding:40px 10px
}
.va-pedido-resultado>span,.va-seguimiento-vacio>span {
    display:grid;
    place-items:center;
    width:64px;
    height:64px;
    margin:0 auto 14px;
    border-radius:20px;
    background:#a2c547;
    color:#11211a;
    font-size:1.5rem
}
.va-pedido-resultado h2 {
    font-size:2rem
}
.va-pedido-resultado p {
    color:#718078
}
.va-pedido-resultado .va-comprobante-datos {
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:10px;
    text-align:left;
    margin:24px 0
}
.va-pedido-resultado .va-comprobante-datos div {
    padding:13px;
    border:1px solid #dce5d7;
    border-radius:12px
}
.va-pedido-resultado .va-comprobante-datos span {
    display:block;
    color:#718078;
    font-size:.75rem;
    text-transform:uppercase
}
.va-pedido-resultado .va-comprobante-datos strong {
    display:block;
    margin-top:5px
}
.va-seguimiento-pagina {
    padding-top:60px
}
.va-seguimiento-vacio {
    text-align:center;
    background:#fff;
    padding:70px 20px;
    border-radius:24px
}
.va-seguimiento-grid {
    display:grid;
    grid-template-columns:1.4fr 1fr;
    gap:20px;
    margin-bottom:20px
}
.va-seguimiento-card {
    padding:28px;
    margin-bottom:20px
}
.va-seguimiento-card h2 {
    margin:8px 0 18px
}
.va-seguimiento-linea {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:6px
}
.va-seguimiento-linea span {
    display:grid;
    gap:8px;
    color:#87938c;
    font-size:.78rem
}
.va-seguimiento-linea span.activo {
    color:#557f24;
    font-weight:800
}
.va-seguimiento-linea b {
    height:8px;
    border-radius:99px;
    background:#e2e8df
}
.va-seguimiento-linea .activo b {
    background:#a2c547
}
.va-seguimiento-nota {
    margin:20px 0 0;
    color:#718078
}
.va-seguimiento-productos {
    display:grid;
    gap:8px
}
.va-seguimiento-productos div {
    display:grid;
    grid-template-columns:1fr auto;
    gap:3px 18px;
    border-bottom:1px solid #e8ede6;
    padding:10px 0
}
.va-seguimiento-productos small {
    color:#718078
}
.va-seguimiento-productos b {
    grid-row:span 2;
    grid-column:2
}
.va-seguimiento-total {
    display:flex;
    justify-content:space-between;
    margin-top:16px;
    font-size:1.3rem
}
@media(max-width:850px) {
    .va-pedido-layout,.va-seguimiento-grid {
        grid-template-columns:1fr
    }
    .va-pedido-resumen-lateral {
        position:static;
        order:-1
    }
    .va-pedido-encabezado {
        display:block
    }
    .va-pedido-referencia {
        display:inline-block;
        margin-top:16px
    }
    .va-pedido-principal {
        padding:22px
    }
    .va-pedido-progreso {
        grid-template-columns:repeat(2,1fr)
    }
    .va-pedido-campos-grid {
        grid-template-columns:1fr
    }
    .va-pedido-panel-acciones {
        flex-wrap:wrap
    }
    .va-pedido-panel-acciones>* {
        flex:1;
        text-align:center
    }
    .va-pedido-resultado .va-comprobante-datos {
        grid-template-columns:1fr
    }
}
@media(max-width:450px) {
    .va-pedido-pagina,.va-seguimiento-pagina {
        padding:28px 12px 50px
    }
    .va-pedido-progreso small {
        font-size:.72rem
    }
    .va-pedido-item {
        grid-template-columns:50px 1fr auto
    }
    .va-pedido-item img {
        width:50px;
        height:50px
    }
    .va-pedido-mapa-cabecera {
        align-items:flex-start;
        flex-direction:column
    }
}

/* Guía pública: documento autónomo, sin navegación ni pie comercial. */
body.va-seguimiento-documento {
    min-width: 320px;
    margin: 0;
    background: #edf3e9;
    color: #11211a;
    font-family: Poppins, sans-serif;
}

.va-seguimiento-documento .va-seguimiento-pagina {
    min-height: 100vh;
    padding: 34px 20px 56px;
    background:
        linear-gradient(135deg, rgba(162, 197, 71, .14), transparent 36%),
        linear-gradient(180deg, #fdfefb, #edf3e9);
}

.va-seguimiento-contenedor {
    width: min(100%, 1040px);
    margin: 0 auto;
}

.va-seguimiento-marca {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 28px;
}

.va-seguimiento-marca img {
    width: 172px;
    max-height: 54px;
    object-fit: contain;
    object-position: left center;
}

.va-seguimiento-marca span {
    color: #657269;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.va-seguimiento-hero {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 28px;
    align-items: end;
    padding: 36px;
    border-radius: 24px;
    background: #11211a;
    color: #fff;
    box-shadow: 0 22px 42px rgba(17, 33, 26, .16);
}

.va-seguimiento-hero .va-pedido-etiqueta { color: #a2c547; }
.va-seguimiento-hero h1 { margin: 9px 0; font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.03; }
.va-seguimiento-hero p { max-width: 590px; margin: 0; color: rgba(255, 255, 255, .72); }

.va-seguimiento-referencia {
    display: grid;
    gap: 6px;
    min-width: 238px;
    padding: 18px;
    border: 1px solid rgba(162, 197, 71, .35);
    border-radius: 15px;
    background: rgba(255, 255, 255, .06);
}

.va-seguimiento-referencia span,
.va-seguimiento-referencia small {
    color: rgba(255, 255, 255, .65);
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
}

.va-seguimiento-referencia strong { font-size: .87rem; word-break: break-word; }

.va-seguimiento-progreso {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    margin: 18px 0;
}

.va-seguimiento-progreso article {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 9px;
    align-items: center;
    padding: 14px;
    border: 1px solid #dce5d7;
    border-radius: 14px;
    background: rgba(255, 255, 255, .78);
    color: #849087;
}

.va-seguimiento-progreso article.estado-activo { border-color: #a2c547; color: #254b35; }
.va-seguimiento-progreso span { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: #edf2e9; font-size: .7rem; font-weight: 900; }
.va-seguimiento-progreso .estado-activo span { background: #a2c547; color: #11211a; }
.va-seguimiento-progreso strong { font-size: .78rem; line-height: 1.2; }

.va-seguimiento-documento .va-seguimiento-grid {
    grid-template-columns: 1.1fr .9fr;
    gap: 18px;
    margin-bottom: 18px;
}

.va-seguimiento-documento .va-seguimiento-card {
    margin: 0;
    padding: 28px;
    border-radius: 20px;
    box-shadow: none;
}

.va-seguimiento-documento .va-seguimiento-card h2 { margin: 7px 0 10px; font-size: 1.32rem; }
.va-seguimiento-documento .va-seguimiento-card p { margin: 0; color: #657269; line-height: 1.65; }

.va-seguimiento-estado-card { border-color: #cbdcb8 !important; background: #fbfdf6 !important; }
.va-seguimiento-dato { display: flex; justify-content: space-between; gap: 12px; margin-top: 20px; padding-top: 16px; border-top: 1px solid #e1e9db; color: #657269; }
.va-seguimiento-dato strong { color: #254b35; text-transform: capitalize; }

.va-seguimiento-envio {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    margin-top: 20px;
    padding: 14px;
    border-radius: 12px;
    background: #f5f8f2;
    color: #254b35;
}

.va-seguimiento-envio i { color: #a27543; margin-top: 3px; }
.va-seguimiento-envio div { display: grid; gap: 2px; }
.va-seguimiento-envio span { color: #657269; font-size: .86rem; }
.va-seguimiento-envio.estado-pendiente { color: #657269; font-size: .88rem; line-height: 1.5; }

.va-seguimiento-productos-card { margin-bottom: 18px !important; }
.va-seguimiento-card-cabecera { display: flex; justify-content: space-between; gap: 16px; align-items: start; margin-bottom: 13px; }
.va-seguimiento-card-cabecera > span { padding: 6px 10px; border-radius: 999px; background: #f2f5ed; color: #657269; font-size: .75rem; font-weight: 800; white-space: nowrap; }
.va-seguimiento-documento .va-seguimiento-productos { gap: 0; }
.va-seguimiento-documento .va-seguimiento-productos article {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 13px 0;
    border-bottom: 1px solid #e8ede6;
}

.va-seguimiento-producto-imagen {
    display: grid;
    width: 48px;
    height: 48px;
    place-items: center;
    overflow: hidden;
    border: 1px solid #dce5d7;
    border-radius: 12px;
    background: #f3f7ed;
    color: #628b32;
}

.va-seguimiento-producto-imagen img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    background: #fff;
}
.va-seguimiento-documento .va-seguimiento-productos small { display: block; margin-top: 3px; color: #718078; }
.va-seguimiento-documento .va-seguimiento-productos b { color: #254b35; white-space: nowrap; }
.va-seguimiento-documento .va-seguimiento-total { margin-top: 16px; padding-top: 16px; border-top: 1px solid #dce5d7; color: #11211a; font-size: 1.08rem; }

.va-seguimiento-ayuda {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 14px;
    align-items: center;
    padding: 18px 22px;
    border-radius: 18px;
    background: #2b1e19;
    color: #fff;
}

.va-seguimiento-ayuda > i { color: #d4a373; font-size: 1.35rem; }
.va-seguimiento-ayuda div { display: grid; gap: 2px; }
.va-seguimiento-ayuda span { color: rgba(255, 255, 255, .7); font-size: .85rem; }
.va-seguimiento-ayuda a,
.va-seguimiento-contacto { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 11px 15px; border-radius: 10px; background: #a2c547; color: #11211a; font-size: .82rem; font-weight: 900; text-decoration: none; white-space: nowrap; }

.va-seguimiento-documento .va-seguimiento-vacio { max-width: 580px; margin: 11vh auto 0; box-shadow: 0 18px 45px rgba(17, 33, 26, .08); }
.va-seguimiento-contacto { margin-top: 10px; }

@media (max-width: 760px) {
    .va-seguimiento-documento .va-seguimiento-pagina { padding: 20px 14px 36px; }
    .va-seguimiento-marca { margin-bottom: 18px; }
    .va-seguimiento-marca img { width: 132px; }
    .va-seguimiento-hero { grid-template-columns: 1fr; gap: 20px; padding: 25px 22px; }
    .va-seguimiento-referencia { min-width: 0; }
    .va-seguimiento-progreso { grid-template-columns: repeat(2, 1fr); }
    .va-seguimiento-documento .va-seguimiento-grid { grid-template-columns: 1fr; }
    .va-seguimiento-documento .va-seguimiento-card { padding: 21px; }
    .va-seguimiento-ayuda { grid-template-columns: auto 1fr; }
    .va-seguimiento-ayuda a { grid-column: 1 / -1; }
}

@media (max-width: 450px) {
    .va-seguimiento-marca img { width: 142px; }
    .va-seguimiento-marca span { font-size: .66rem; }
    .va-seguimiento-hero { padding: 23px 19px; }
    .va-seguimiento-documento .va-seguimiento-productos article { grid-template-columns: 42px minmax(0, 1fr); gap: 11px; }
    .va-seguimiento-producto-imagen { width: 42px; height: 42px; border-radius: 10px; }
    .va-seguimiento-documento .va-seguimiento-productos b { grid-column: 2; font-size: .88rem; }
}