/* ═══════════════════════════════════════════════════════════
   Zygo PWA · Sistema de diseño móvil
   Fuente única de tokens y componentes para las vistas pwa.*
   ═══════════════════════════════════════════════════════════ */

body.zygo-pwa-order-page,
body.zygo-pwa-order-page *,
body.zygo-pwa-order-page *::before,
body.zygo-pwa-order-page *::after {
    box-sizing: border-box;
}
body.zygo-pwa-order-page { margin: 0; }
body.zygo-pwa-order-page button,
body.zygo-pwa-order-page input,
body.zygo-pwa-order-page select,
body.zygo-pwa-order-page textarea { font: inherit; }

.zy-order-card,
.zy-market-card,
.zy-store-inventory-card {
    content-visibility: auto;
    contain-intrinsic-size: auto 280px;
}

html,
body.zygo-pwa-order-page,
body.zygo-pwa-order-page #app,
body.zygo-pwa-order-page .section {
    background: #f5f8f2 !important;
    min-height: 100dvh;
    overflow-x: hidden;
}
/* El scroll vertical de la página es sagrado: ningún estilo global
   (mapas de escritorio, nicescroll, etc.) debe bloquearlo en la PWA. */
html:has(body.zygo-pwa-order-page),
body.zygo-pwa-order-page {
    height: auto !important;
    overflow-y: auto !important;
    position: static !important;
}
body.zygo-pwa-order-page {
    -webkit-tap-highlight-color: transparent;
}
body.zygo-pwa-order-page .nicescroll-rails {
    display: none !important;
}
body.zygo-pwa-order-page #app {
    background-image: none !important;
}
body.zygo-pwa-order-page .section {
    padding: 0 !important;
}

/* ── Contenedor de página ───────────────────────────────── */
.zy-app {
    --lime: #8af000;
    --lime-press: #74d400;
    --green: #2f7d00;
    --green-soft: #effde8;
    --green-line: #d9f7c9;
    --ink: #101014;
    --ink-2: #3c4454;
    --muted: #667085;
    --faint: #98a2b3;
    --line: #e4eadf;
    --field: #f8fbf6;
    --field-line: #dfe9db;
    --bg: #f5f8f2;
    --card: #fff;
    animation: zyPageIn .32s cubic-bezier(.22, .9, .3, 1);
    color: var(--ink);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin: 0 auto;
    max-width: 520px;
    min-height: 100dvh;
    padding: env(safe-area-inset-top) 16px calc(122px + env(safe-area-inset-bottom));
    position: relative;
}
.zy-app--bars {
    padding-bottom: calc(196px + env(safe-area-inset-bottom));
}
@keyframes zyPageIn {
    from { opacity: 0; transform: translateY(12px); }
    to { opacity: 1; transform: none; }
}

/* ── Header ─────────────────────────────────────────────── */
.zy-head {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 14px 2px 4px;
}
.zy-head-brand {
    align-items: center;
    display: inline-flex;
    gap: 9px;
    min-width: 0;
    text-decoration: none !important;
}
.zy-head-brand img {
    display: block;
    height: 28px;
    object-fit: contain;
    width: auto;
}
.zy-head-brand span {
    color: var(--muted);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.zy-head-avatar {
    align-items: center;
    background: var(--ink);
    border-radius: 999px;
    color: #c8ff7a;
    display: inline-flex;
    flex: 0 0 38px;
    font-size: 14px;
    font-weight: 900;
    height: 38px;
    justify-content: center;
    overflow: hidden;
    text-decoration: none !important;
    width: 38px;
}
.zy-head-avatar img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}
.zy-title-row {
    align-items: baseline;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 10px 2px 0;
}
.zy-title-row h1 {
    color: var(--ink);
    font-size: 26px;
    font-weight: 900;
    letter-spacing: -.02em;
    line-height: 1.05;
    margin: 0;
}
.zy-title-row .zy-count {
    background: var(--ink);
    border-radius: 999px;
    color: #c8ff7a;
    font-size: 11.5px;
    font-weight: 850;
    padding: 5px 10px;
    white-space: nowrap;
}
.zy-step-count {
    color: var(--faint);
    font-size: 13px;
    font-weight: 800;
    white-space: nowrap;
}
.zy-step-count b {
    color: var(--green);
    font-size: 15px;
}
.zy-page-hint {
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.45;
    margin: 6px 2px 14px;
}

/* ── Progreso (wizard) ──────────────────────────────────── */
.zy-progress {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, 1fr);
    margin: 14px 0 16px;
}
.zy-progress-seg {
    background: transparent;
    border: 0;
    cursor: default;
    padding: 0;
    text-align: left;
    -webkit-tap-highlight-color: transparent;
}
.zy-progress-seg i {
    background: #e2e8dd;
    border-radius: 999px;
    display: block;
    height: 5px;
    overflow: hidden;
    position: relative;
    transition: background .25s ease;
}
.zy-progress-seg span {
    align-items: center;
    color: var(--faint);
    display: inline-flex;
    font-size: 11px;
    font-style: normal;
    font-weight: 800;
    gap: 5px;
    margin-top: 7px;
    transition: color .2s ease;
}
.zy-progress-seg span:after {
    content: "✓";
    font-size: 10px;
    opacity: 0;
    transition: opacity .2s ease;
}
.zy-progress-seg.is-active i,
.zy-progress-seg.is-done i {
    background: var(--lime);
}
.zy-progress-seg.is-active span {
    color: var(--ink);
}
.zy-progress-seg.is-done span {
    color: var(--green);
}
.zy-progress-seg.is-done span:after {
    opacity: 1;
}
.zy-progress-seg.is-done {
    cursor: pointer;
}

/* ── Pasos + transiciones direccionales ─────────────────── */
.zy-step {
    display: none;
}
.zy-step.is-current {
    display: block;
}
.zy-step.is-current.zy-slide-fwd {
    animation: zyStepFwd .28s cubic-bezier(.22, .9, .3, 1);
}
.zy-step.is-current.zy-slide-back {
    animation: zyStepBack .28s cubic-bezier(.22, .9, .3, 1);
}
@keyframes zyStepFwd {
    from { opacity: 0; transform: translateX(28px); }
    to { opacity: 1; transform: none; }
}
@keyframes zyStepBack {
    from { opacity: 0; transform: translateX(-28px); }
    to { opacity: 1; transform: none; }
}
.zy-step-hint {
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.45;
    margin: 0 2px 12px;
}

/* ── Tarjetas ───────────────────────────────────────────── */
.zy-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(16, 24, 40, .05);
    margin-bottom: 12px;
    overflow: hidden;
    padding: 16px;
}
.zy-card-title {
    align-items: center;
    color: var(--ink);
    display: flex;
    font-size: 15px;
    font-weight: 900;
    gap: 9px;
    margin: 0 0 13px;
}
.zy-card-title i {
    align-items: center;
    background: var(--green-soft);
    border: 1px solid var(--green-line);
    border-radius: 11px;
    color: var(--green);
    display: inline-flex;
    flex: 0 0 32px;
    font-size: 13px;
    height: 32px;
    justify-content: center;
    width: 32px;
}
.zy-card-title small {
    color: var(--faint);
    font-size: 11px;
    font-weight: 750;
    margin-left: auto;
}

/* ── Campos y controles ─────────────────────────────────── */
.zy-field {
    margin-bottom: 12px;
}
.zy-field:last-child {
    margin-bottom: 0;
}
.zy-field-error {
    color: #b42318;
    font-size: 11.5px;
    font-weight: 750;
    line-height: 1.4;
    margin: 6px 2px 0;
    min-height: 0;
}
.zy-field-error:empty {
    display: none;
}
.zy-field.has-error .zy-input {
    background: #fff8f8;
    border-color: #e5484d;
    box-shadow: 0 0 0 4px rgba(229, 72, 77, .10);
}
.zy-field.has-error label,
.zy-field.has-error .zy-input > i {
    color: #b42318;
}
.zy-field label {
    color: var(--ink-2);
    display: block;
    font-size: 11px;
    font-weight: 850;
    letter-spacing: .05em;
    margin: 0 0 6px;
    text-transform: uppercase;
}
.zy-input {
    align-items: center;
    background: var(--field);
    border: 1.5px solid var(--field-line);
    border-radius: 15px;
    display: flex;
    gap: 10px;
    min-height: 52px;
    padding: 0 13px;
    position: relative;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.zy-input:focus-within {
    background: #fff;
    border-color: var(--green);
    box-shadow: 0 0 0 4px rgba(138, 240, 0, .16);
}
.zy-input > i {
    color: var(--green);
    flex: 0 0 17px;
    font-size: 14px;
    text-align: center;
}
.zy-input input,
.zy-input textarea {
    background: transparent;
    border: 0;
    color: var(--ink);
    flex: 1;
    font-size: 15px;
    font-weight: 650;
    min-width: 0;
    outline: 0;
    padding: 14px 0;
    width: 100%;
}
.zy-input textarea {
    min-height: 76px;
    resize: vertical;
}
.zy-input input::placeholder,
.zy-input textarea::placeholder {
    color: var(--faint);
    font-weight: 550;
}
.zy-input .zy-input-check {
    align-items: center;
    background: var(--lime);
    border-radius: 999px;
    color: #071004;
    display: none;
    flex: 0 0 20px;
    font-size: 10px;
    height: 20px;
    justify-content: center;
    width: 20px;
}
.zy-field.is-set .zy-input .zy-input-check {
    display: inline-flex;
}
.zy-control {
    background: var(--field);
    border: 1.5px solid var(--field-line);
    border-radius: 15px;
    color: var(--ink);
    font-size: 15px;
    font-weight: 650;
    min-height: 52px;
    outline: 0;
    padding: 13px;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
    width: 100%;
}
.zy-control:focus {
    background: #fff;
    border-color: var(--green);
    box-shadow: 0 0 0 4px rgba(138, 240, 0, .16);
}
.zy-control::placeholder {
    color: var(--faint);
    font-weight: 550;
}
textarea.zy-control {
    min-height: 88px;
    resize: vertical;
}
.zy-select {
    position: relative;
}
.zy-select select {
    appearance: none;
    -webkit-appearance: none;
    background: var(--field);
    border: 1.5px solid var(--field-line);
    border-radius: 15px;
    color: var(--ink);
    font-size: 15px;
    font-weight: 650;
    min-height: 52px;
    outline: 0;
    padding: 0 40px 0 13px;
    transition: border-color .15s ease, box-shadow .15s ease;
    width: 100%;
}
.zy-select select:focus {
    background: #fff;
    border-color: var(--green);
    box-shadow: 0 0 0 4px rgba(138, 240, 0, .16);
}
.zy-select:after {
    border-bottom: 2px solid var(--muted);
    border-right: 2px solid var(--muted);
    content: "";
    height: 8px;
    pointer-events: none;
    position: absolute;
    right: 17px;
    top: 50%;
    transform: translateY(-70%) rotate(45deg);
    width: 8px;
}
.zy-help {
    color: var(--faint);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    margin: 6px 2px 0;
}
.zy-file {
    align-items: center;
    background: var(--field);
    border: 1.5px dashed #cfe0c4;
    border-radius: 15px;
    color: var(--ink-2);
    display: flex;
    font-size: 13px;
    font-weight: 750;
    gap: 10px;
    min-height: 52px;
    padding: 0 13px;
    position: relative;
    transition: .15s ease;
}
.zy-file input {
    cursor: pointer;
    inset: 0;
    opacity: 0;
    position: absolute;
    width: 100%;
    z-index: 2;
}
.zy-file > i {
    color: var(--green);
    flex: 0 0 17px;
    text-align: center;
}
.zy-file .zy-file-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-file.has-file {
    background: var(--green-soft);
    border-color: #c4ecab;
    border-style: solid;
}
.zy-file.has-file > i:before {
    content: "\f00c";
}

/* ── Switch ─────────────────────────────────────────────── */
.zy-switch {
    align-items: center;
    color: var(--muted);
    cursor: pointer;
    display: flex;
    font-size: 12.5px;
    font-weight: 700;
    gap: 10px;
    margin: 11px 2px 0;
    -webkit-tap-highlight-color: transparent;
}
.zy-switch input {
    appearance: none;
    -webkit-appearance: none;
    background: #dbe3d5;
    border: 0;
    border-radius: 999px;
    cursor: pointer;
    flex: 0 0 38px;
    height: 22px;
    margin: 0;
    position: relative;
    transition: background .18s ease;
    width: 38px;
}
.zy-switch input:before {
    background: #fff;
    border-radius: 999px;
    box-shadow: 0 1px 3px rgba(16, 24, 40, .25);
    content: "";
    height: 18px;
    left: 2px;
    position: absolute;
    top: 2px;
    transition: transform .18s ease;
    width: 18px;
}
.zy-switch input:checked {
    background: var(--lime);
}
.zy-switch input:checked:before {
    transform: translateX(16px);
}
.zy-switch--row {
    background: var(--field);
    border: 1.5px solid var(--field-line);
    border-radius: 15px;
    color: var(--ink);
    font-size: 13.5px;
    font-weight: 800;
    margin: 0 0 9px;
    min-height: 54px;
    padding: 0 13px;
}
.zy-switch--row input {
    margin-left: auto;
    order: 2;
}

/* ── Riel de ruta ───────────────────────────────────────── */
.zy-route {
    display: grid;
    gap: 12px;
    grid-template-columns: 18px 1fr;
}
.zy-route-rail {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding: 20px 0 14px;
}
.zy-route-rail .dot {
    background: var(--lime);
    border: 3px solid #d6f7ae;
    border-radius: 999px;
    flex: 0 0 14px;
    height: 14px;
    width: 14px;
}
.zy-route-rail .line {
    border-left: 2px dashed #c9d6c2;
    flex: 1;
    margin: 4px 0;
    width: 0;
}
.zy-route-rail .pin {
    color: var(--ink);
    flex: 0 0 auto;
    font-size: 15px;
}
.zy-route-fields {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
}
.zy-route--view {
    gap: 11px;
    grid-template-columns: 14px 1fr;
}
.zy-route--view .zy-route-rail {
    padding: 6px 0;
}
.zy-route--view .zy-route-rail .dot {
    border-width: 2px;
    flex: 0 0 11px;
    height: 11px;
    width: 11px;
}
.zy-route--view .zy-route-rail .pin {
    font-size: 13px;
}
.zy-route--view .zy-route-fields {
    gap: 9px;
}
.zy-stop span {
    color: var(--faint);
    display: block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.zy-stop strong {
    color: var(--ink);
    display: block;
    font-size: 13px;
    font-weight: 750;
    line-height: 1.3;
    margin-top: 1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ── Mapa ───────────────────────────────────────────────── */
.zy-map-card {
    padding: 0;
}
.zy-map-card .zy-map {
    border-radius: inherit;
    overflow: hidden;
}
.zy-map {
    background: linear-gradient(135deg, #f2f7ee, #e9f2e4);
    height: 150px;
    position: relative;
}
#pwaRouteMap {
    inset: 0;
    position: absolute;
}
.zy-map-meta {
    align-items: center;
    border-top: 1px solid var(--line);
    display: flex;
    gap: 14px;
    padding: 12px 16px;
}
.zy-map-meta .item span {
    color: var(--faint);
    display: block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.zy-map-meta .item strong {
    color: var(--ink);
    display: block;
    font-size: 15px;
    font-weight: 900;
    margin-top: 2px;
}

/* ── Chips ──────────────────────────────────────────────── */
.zy-quote-chip {
    align-items: center;
    background: var(--field);
    border: 1px solid var(--field-line);
    border-radius: 999px;
    color: var(--muted);
    display: inline-flex;
    font-size: 11px;
    font-weight: 800;
    margin-left: auto;
    padding: 6px 11px;
    white-space: nowrap;
}
.zy-quote-chip.is-ready {
    background: var(--green-soft);
    border-color: var(--green-line);
    color: var(--green);
}
.zy-quote-chip.is-error {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #be123c;
}
.zy-status {
    align-items: center;
    border-radius: 999px;
    display: inline-flex;
    font-size: 11px;
    font-weight: 850;
    gap: 6px;
    padding: 6px 10px;
    white-space: nowrap;
}
.zy-status .dot {
    background: currentColor;
    border-radius: 999px;
    flex: 0 0 6px;
    height: 6px;
    width: 6px;
}
.zy-status--searching,
.zy-status--pending {
    background: #fff7ed;
    color: #c2410c;
}
.zy-status--accepted {
    background: #eff6ff;
    color: #1d4ed8;
}
.zy-status--delivered {
    background: #ecfdf3;
    color: #047857;
}
.zy-status--cancelled {
    background: #fff1f2;
    color: #be123c;
}
.zy-status--searching .dot,
.zy-status--pending .dot,
.zy-status--accepted .dot {
    animation: zyPulse 1.3s ease infinite;
}
@keyframes zyPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .3; transform: scale(.65); }
}
.zy-badge {
    border-radius: 999px;
    display: inline-flex;
    font-size: 10.5px;
    font-weight: 900;
    padding: 6px 10px;
}
.zy-badge.green { background: #ecfdf3; color: #047857; }
.zy-badge.blue { background: #eff6ff; color: #1d4ed8; }
.zy-badge.warm { background: #fff7ed; color: #c2410c; }
.zy-badge.muted { background: #f1f5f9; color: #475569; }

/* ── Filtros sticky ─────────────────────────────────────── */
.zy-filters {
    background: linear-gradient(var(--bg) 78%, rgba(245, 248, 242, 0));
    display: flex;
    gap: 8px;
    margin: 0 -2px 8px;
    overflow-x: auto;
    padding: 10px 2px 12px;
    position: sticky;
    scrollbar-width: none;
    top: 0;
    z-index: 15;
}
.zy-filters::-webkit-scrollbar {
    display: none;
}
.zy-filter {
    align-items: center;
    background: #fff;
    border: 1.5px solid var(--line);
    border-radius: 999px;
    color: var(--ink-2);
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 12.5px;
    font-weight: 800;
    gap: 7px;
    min-height: 40px;
    padding: 0 14px;
    -webkit-tap-highlight-color: transparent;
    transition: .15s ease;
    text-decoration: none;
}
.zy-filter b {
    background: #f1f5ec;
    border-radius: 999px;
    color: var(--muted);
    font-size: 10.5px;
    font-weight: 850;
    line-height: 1;
    padding: 4px 7px;
}
.zy-filter.is-active {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
}
.zy-filter.is-active b {
    background: rgba(255, 255, 255, .16);
    color: #c8ff7a;
}
.zy-orders-pager {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: 1fr auto 1fr;
    margin: 18px 0 8px;
}
.zy-orders-pager a,
.zy-orders-pager span {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 14px;
    color: var(--ink);
    display: inline-flex;
    font-size: 11px;
    font-weight: 850;
    gap: 5px;
    justify-content: center;
    min-height: 44px;
    padding: 0 10px;
    text-decoration: none;
}
.zy-orders-pager span[aria-disabled="true"] { color: var(--faint); opacity: .58; }
.zy-orders-pager small { color: var(--muted); font-size: 10.5px; font-weight: 850; white-space: nowrap; }
.zy-orders-pager a > svg,
.zy-orders-pager span > svg { height: 16px; width: 16px; }

/* ── Tarjeta de envío (Mis envíos) ──────────────────────── */
.zy-order-head {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 12px;
}
.zy-order-id {
    color: var(--ink);
    display: block;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.15;
}
.zy-order-date {
    color: var(--faint);
    display: block;
    font-size: 11px;
    font-weight: 700;
    margin-top: 3px;
}
.zy-order-foot {
    align-items: center;
    border-top: 1px solid #eef2ea;
    display: flex;
    gap: 12px;
    margin-top: 12px;
    padding-top: 12px;
}
.zy-order-price {
    color: var(--ink);
    font-size: 17px;
    font-weight: 900;
    letter-spacing: -.01em;
}
.zy-order-sub {
    color: var(--muted);
    font-size: 11.5px;
    font-weight: 700;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-card.is-live-updated {
    animation: zyOrderLiveUpdated .9s cubic-bezier(.22, 1, .36, 1);
}
@keyframes zyOrderLiveUpdated {
    0% { box-shadow: 0 0 0 0 rgba(126, 232, 0, .34), 0 14px 34px rgba(16, 24, 40, .07); transform: translateY(0); }
    38% { box-shadow: 0 0 0 5px rgba(126, 232, 0, .15), 0 16px 34px rgba(16, 24, 18, .12); transform: translateY(-2px); }
    100% { box-shadow: 0 0 0 0 rgba(126, 232, 0, 0), 0 14px 34px rgba(16, 24, 40, .07); transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
    .zy-card.is-live-updated { animation: none; }
}
.zy-order-actions {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
    margin-left: auto;
}
.zy-order-cancel-btn {
    align-items: center;
    background: #fff7f7;
    border: 1px solid #f2c8c8;
    border-radius: 14px;
    color: #9f1d1d;
    cursor: pointer;
    display: flex;
    gap: 10px;
    margin-top: 10px;
    min-height: 48px;
    padding: 8px 12px;
    text-align: left;
    transition: background .16s ease, border-color .16s ease, transform .16s ease;
    width: 100%;
}
.zy-order-cancel-btn > i {
    align-items: center;
    background: #ffe8e8;
    border-radius: 10px;
    display: inline-flex;
    flex: 0 0 32px;
    height: 32px;
    justify-content: center;
    width: 32px;
}
.zy-order-cancel-btn span,
.zy-order-cancel-btn strong,
.zy-order-cancel-btn small {
    display: block;
}
.zy-order-cancel-btn strong {
    color: #8f1717;
    font-size: 12px;
    font-weight: 900;
}
.zy-order-cancel-btn small {
    color: #9d5d5d;
    font-size: 10px;
    font-weight: 650;
    margin-top: 1px;
}
.zy-order-cancel-btn:hover,
.zy-order-cancel-btn:focus {
    background: #fff0f0;
    border-color: #e9aaaa;
    color: #8f1717;
}
.zy-order-cancel-btn:active {
    transform: scale(.985);
}
.zy-order-cancel-btn:disabled {
    cursor: wait;
    opacity: .65;
    transform: none;
}

/* ── Mis envíos: tarjetas comerciales y cancelación segura ───────── */
.zy-order-card {
    background:
        radial-gradient(circle at 100% 0, rgba(138,240,0,.10), transparent 31%),
        #fff;
    border-color: #dfe9da;
    border-radius: 22px;
    box-shadow: 0 16px 38px rgba(20,35,24,.08);
    overflow: hidden;
    padding: 17px;
    position: relative;
}
.zy-order-card-accent {
    background: linear-gradient(180deg, var(--lime), #4fb000);
    border-radius: 0 0 999px 999px;
    height: 52px;
    left: 0;
    position: absolute;
    top: 18px;
    width: 3px;
}
.zy-order-card .zy-order-head { align-items: flex-start; margin-bottom: 14px; padding-left: 2px; }
.zy-order-type {
    align-items: center;
    color: #4b735b;
    display: inline-flex;
    font-size: 9px;
    font-weight: 900;
    gap: 5px;
    letter-spacing: .07em;
    margin-bottom: 5px;
    text-transform: uppercase;
}
.zy-order-type i { color: var(--green); font-size: 9px; }
.zy-order-card .zy-order-id { font-size: 17px; letter-spacing: -.025em; }
.zy-order-card .zy-status { box-shadow: inset 0 0 0 1px currentColor; font-size: 9.5px; padding: 6px 9px; }
.zy-order-route {
    background: linear-gradient(135deg, #f8fbf6, #f3f8f0);
    border: 1px solid #e1eadc;
    border-radius: 17px;
    padding: 12px;
    position: relative;
}
.zy-order-stop { align-items: center; display: grid; gap: 10px; grid-template-columns: 38px minmax(0,1fr); min-height: 43px; position: relative; z-index: 1; }
.zy-order-marker {
    align-items: center;
    display: flex;
    height: 38px;
    justify-content: center;
    position: relative;
    width: 38px;
}
.zy-order-marker:after { background: rgba(37,61,45,.13); border-radius: 50%; bottom: 0; content: ""; filter: blur(2px); height: 5px; position: absolute; width: 24px; }
.zy-order-marker img { display: block; height: 35px; object-fit: contain; position: relative; width: 35px; z-index: 1; }
.zy-order-stop > div { min-width: 0; }
.zy-order-stop > div > span { color: #768279; display: block; font-size: 9px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.zy-order-stop strong { color: var(--ink); display: block; font-size: 12px; font-weight: 800; line-height: 1.35; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zy-order-route-line { border-left: 2px dashed #b9cbb0; display: block; height: 15px; margin: -1px 0 -1px 18px; }
.zy-order-meta { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 10px; }
.zy-order-meta span { align-items: center; background: #f7faf5; border: 1px solid #e4ebe0; border-radius: 999px; color: #58645d; display: inline-flex; font-size: 10px; font-weight: 750; gap: 6px; min-height: 28px; padding: 0 9px; }
.zy-order-meta i { color: var(--green); font-size: 10px; }
.zy-order-card .zy-order-foot { margin-top: 13px; padding-top: 13px; }
.zy-order-card .zy-order-price { font-size: 19px; }
.zy-order-card .zy-track-btn { background: var(--ink); box-shadow: 0 10px 22px rgba(16,16,20,.18); min-height: 44px; }
.zy-order-card .zy-icon-btn { border: 1px solid #dfe7db; height: 44px; width: 44px; }
.zy-order-card .zy-order-cancel-btn {
    background: transparent;
    border: 1px solid #eadfdf;
    border-radius: 15px;
    color: var(--ink);
    display: grid;
    gap: 9px;
    grid-template-columns: 34px minmax(0,1fr) auto;
    margin-top: 12px;
    min-height: 54px;
    padding: 8px 9px;
}
.zy-order-cancel-icon { align-items: center; background: #fff1f1; border: 1px solid #f6d7d7; border-radius: 10px; color: #b42318; display: flex; height: 34px; justify-content: center; width: 34px; }
.zy-order-cancel-icon svg { height: 18px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; width: 18px; }
.zy-order-card .zy-order-cancel-btn strong { color: #3d4540; font-size: 11px; }
.zy-order-card .zy-order-cancel-btn small { color: #7f8882; font-size: 9.5px; }
.zy-order-cancel-action { background: #fff0f0; border-radius: 999px; color: #9f1d1d; font-size: 9.5px; font-weight: 900; padding: 7px 9px; }
.zy-order-card .zy-order-cancel-btn:hover,
.zy-order-card .zy-order-cancel-btn:focus { background: #fffafa; border-color: #e9c5c5; }

body.zy-cancel-open { overflow: hidden !important; }
.zy-cancel-dialog { align-items: flex-end; display: flex; inset: 0; justify-content: center; padding: max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom)); position: fixed; z-index: 10040; }
.zy-cancel-dialog[hidden] { display: none !important; }
.zy-cancel-scrim { background: rgba(10,15,11,.58); border: 0; inset: 0; opacity: 0; padding: 0; position: absolute; transition: opacity .2s ease; width: 100%; }
.zy-cancel-sheet {
    background: #fff;
    border: 1px solid rgba(255,255,255,.7);
    border-radius: 25px;
    box-shadow: 0 30px 90px rgba(0,0,0,.32);
    max-height: calc(100dvh - max(24px,env(safe-area-inset-top)) - max(24px,env(safe-area-inset-bottom)));
    max-width: 430px;
    opacity: 0;
    overflow: auto;
    padding: 10px 19px 19px;
    position: relative;
    transform: translateY(28px) scale(.98);
    transition: opacity .22s ease, transform .26s cubic-bezier(.22,.85,.28,1);
    width: 100%;
    z-index: 1;
}
.zy-cancel-dialog.is-open .zy-cancel-scrim { opacity: 1; }
.zy-cancel-dialog.is-open .zy-cancel-sheet { opacity: 1; transform: none; }
.zy-cancel-handle { background: #dce4d8; border-radius: 999px; display: block; height: 4px; margin: 0 auto 12px; width: 42px; }
.zy-cancel-close { align-items: center; background: #f3f6f1; border: 0; border-radius: 50%; color: #687269; display: flex; height: 38px; justify-content: center; position: absolute; right: 14px; top: 14px; width: 38px; }
.zy-cancel-illustration { align-items: center; background: #fff1ef; border: 1px solid #ffd5d0; border-radius: 17px; color: #b42318; display: flex; height: 58px; justify-content: center; margin: 8px 0 14px; width: 58px; }
.zy-cancel-illustration svg { height: 30px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 30px; }
.zy-cancel-eyebrow { color: #9f1d1d; display: block; font-size: 9.5px; font-weight: 900; letter-spacing: .07em; margin-bottom: 5px; text-transform: uppercase; }
.zy-cancel-sheet h2 { color: var(--ink, #101014); font-size: clamp(21px,6vw,25px); font-weight: 950; letter-spacing: -.035em; line-height: 1.08; margin: 0; }
.zy-cancel-sheet > p { color: #667085; font-size: 12.5px; font-weight: 650; line-height: 1.55; margin: 9px 0 0; }
.zy-cancel-sheet > p strong { color: #313932; font-weight: 900; }
.zy-cancel-note { align-items: flex-start; background: #f7faf5; border: 1px solid #e2ebe0; border-radius: 14px; color: #5d695f; display: grid; font-size: 10.5px; font-weight: 700; gap: 9px; grid-template-columns: 18px 1fr; line-height: 1.45; margin-top: 14px; padding: 11px; }
.zy-cancel-note i { color: var(--green, #2f7d00); margin-top: 2px; text-align: center; }
.zy-cancel-note[hidden],.zy-cancel-keep[hidden] { display: none !important; }
.zy-cancel-actions { display: grid; gap: 9px; grid-template-columns: 1fr 1.15fr; margin-top: 17px; }
.zy-cancel-actions button { align-items: center; border-radius: 14px; display: inline-flex; font-size: 11.5px; font-weight: 900; justify-content: center; min-height: 48px; padding: 0 13px; }
.zy-cancel-keep { background: #fff; border: 1px solid #dfe7db; color: #4c574f; }
.zy-cancel-confirm { background: #b42318; border: 1px solid #b42318; box-shadow: 0 10px 22px rgba(180,35,24,.18); color: #fff; gap: 8px; }
.zy-cancel-confirm:disabled { cursor: wait; opacity: .66; }
.zy-cancel-dialog.is-success .zy-cancel-illustration { background: #ecfdf3; border-color: #b7ebca; color: #027a48; }
.zy-cancel-dialog.is-success .zy-cancel-eyebrow { color: #027a48; }
.zy-cancel-dialog.is-success .zy-cancel-confirm { background: var(--ink, #101014); border-color: var(--ink, #101014); box-shadow: none; color: #fff; }
.zy-cancel-dialog.is-info .zy-cancel-illustration { background: #fff8e8; border-color: #f5dd9f; color: #9a6200; }
.zy-cancel-dialog.is-info .zy-cancel-eyebrow { color: #9a6200; }
.zy-cancel-dialog.is-info .zy-cancel-confirm,
.zy-cancel-dialog.is-error .zy-cancel-confirm { background: var(--ink, #101014); border-color: var(--ink, #101014); box-shadow: none; color: #fff; }
.zy-cancel-confirm span,.zy-cancel-confirm i { color: inherit; }
.zy-cancel-close:focus-visible,.zy-cancel-keep:focus-visible,.zy-cancel-confirm:focus-visible { outline: 3px solid rgba(37,99,235,.18); outline-offset: 3px; }

@media (min-width: 680px) {
    .zy-cancel-dialog { align-items: center; }
    .zy-cancel-sheet { padding: 18px 24px 24px; }
    .zy-cancel-handle { display: none; }
}
@media (max-width: 370px) {
    .zy-order-card { padding: 14px; }
    .zy-order-card .zy-order-foot { align-items: stretch; flex-direction: column; }
    .zy-order-actions { margin-left: 0; width: 100%; }
    .zy-order-card .zy-track-btn { flex: 1; justify-content: center; }
    .zy-order-cancel-action { display: none; }
    .zy-order-card .zy-order-cancel-btn { grid-template-columns: 34px minmax(0,1fr); }
    .zy-cancel-actions { grid-template-columns: 1fr; }
    .zy-cancel-confirm { grid-row: 1; }
}
@media (prefers-reduced-motion: reduce) {
    .zy-cancel-scrim,.zy-cancel-sheet { transition: none; }
}

.zy-store-hours {
    background: #f7faf5;
    border: 1px solid #dce6d8;
    border-radius: 14px;
    margin-top: 10px;
    overflow: hidden;
}
.zy-store-hours > summary {
    align-items: center;
    color: #17211a;
    cursor: pointer;
    display: flex;
    font-size: 11.5px;
    font-weight: 800;
    justify-content: space-between;
    min-height: 48px;
    padding: 0 13px;
}
.zy-store-hours > summary span { align-items: center; display: inline-flex; gap: 8px; }
.zy-store-hours > summary .zygo-vector-icon,
.zy-store-hours > summary i { height: 16px; width: 16px; }
.zy-store-hours-list { border-top: 1px solid #dce6d8; padding: 8px; }
.zy-store-hour-row {
    align-items: center;
    display: grid;
    gap: 6px;
    grid-template-columns: minmax(84px,1fr) 74px 8px 74px;
    min-height: 43px;
}
.zy-store-hour-row label { align-items: center; display: flex; font-size: 10px; font-weight: 750; gap: 6px; }
.zy-store-hour-row input[type="checkbox"] { accent-color: #62c800; height: 17px; width: 17px; }
.zy-store-hour-row input[type="time"] {
    background: #fff;
    border: 1px solid #d4ddd1;
    border-radius: 9px;
    color: #17211a;
    font: 650 10px/1 Inter, sans-serif;
    min-height: 34px;
    padding: 0 5px;
    width: 100%;
}
.zy-track-btn {
    align-items: center;
    background: var(--ink);
    border-radius: 13px;
    color: #fff;
    display: inline-flex;
    font-size: 12.5px;
    font-weight: 850;
    gap: 7px;
    min-height: 42px;
    padding: 0 15px;
    text-decoration: none !important;
    transition: transform .12s ease;
}
.zy-track-btn:active {
    transform: scale(.95);
}
.zy-icon-btn {
    align-items: center;
    background: #fff;
    border: 1.5px solid var(--field-line);
    border-radius: 13px;
    color: var(--green);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 14px;
    height: 42px;
    justify-content: center;
    text-decoration: none !important;
    transition: transform .12s ease;
    width: 42px;
}
.zy-icon-btn:active {
    transform: scale(.92);
}
.zy-icon-btn.is-muted {
    color: var(--faint);
}

/* ── Estado vacío ───────────────────────────────────────── */
.zy-empty {
    background: #fff;
    border: 1.5px dashed #d4e3c8;
    border-radius: 22px;
    padding: 34px 22px;
    text-align: center;
}
.zy-empty > i {
    align-items: center;
    background: var(--green-soft);
    border: 1px solid var(--green-line);
    border-radius: 18px;
    color: var(--green);
    display: inline-flex;
    font-size: 20px;
    height: 54px;
    justify-content: center;
    width: 54px;
}
.zy-empty strong {
    color: var(--ink);
    display: block;
    font-size: 16px;
    font-weight: 900;
    margin: 13px 0 4px;
}
.zy-empty p {
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.5;
    margin: 0 0 16px;
}
.zy-empty .zy-btn-primary {
    width: auto;
}

/* ── Resumen (wizard paso 3) ────────────────────────────── */
.zy-sum {
    list-style: none;
    margin: 0;
    padding: 0;
}
.zy-sum li {
    align-items: center;
    border-bottom: 1px solid #eef2ea;
    cursor: pointer;
    display: flex;
    gap: 11px;
    padding: 11px 2px;
    -webkit-tap-highlight-color: transparent;
}
.zy-sum li:last-child {
    border-bottom: 0;
}
.zy-sum li > i:first-child {
    align-items: center;
    background: var(--field);
    border: 1px solid var(--field-line);
    border-radius: 10px;
    color: var(--green);
    display: inline-flex;
    flex: 0 0 30px;
    font-size: 12px;
    height: 30px;
    justify-content: center;
    width: 30px;
}
.zy-sum li .txt {
    flex: 1;
    min-width: 0;
}
.zy-sum li .txt span {
    color: var(--faint);
    display: block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.zy-sum li .txt strong {
    color: var(--ink);
    display: block;
    font-size: 13.5px;
    font-weight: 750;
    line-height: 1.3;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-sum li > i.chev {
    color: #c3cabb;
    font-size: 11px;
}
.zy-total {
    align-items: center;
    background: var(--ink);
    border-radius: 16px;
    color: #fff;
    display: flex;
    gap: 14px;
    margin-top: 13px;
    padding: 14px 16px;
}
.zy-total .item span {
    color: rgba(255, 255, 255, .55);
    display: block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.zy-total .item strong {
    color: #fff;
    display: block;
    font-size: 15px;
    font-weight: 900;
    margin-top: 2px;
}
.zy-total .item.price {
    margin-left: auto;
    text-align: right;
}
.zy-total .item.price strong {
    color: var(--lime);
    font-size: 22px;
    letter-spacing: -.02em;
}

/* ── Destinatario obligatorio + resumen móvil ───────────── */
.zy-recipient-card {
    padding-top: 14px;
}
.zy-recipient-head {
    align-items: center;
    border-bottom: 1px solid #edf2e9;
    display: grid;
    gap: 10px;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    margin: 0 0 16px;
    padding: 0 0 14px;
}
.zy-recipient-avatar {
    align-items: center;
    background: var(--ink);
    border-radius: 13px;
    color: var(--lime);
    display: inline-flex;
    font-size: 15px;
    height: 42px;
    justify-content: center;
    width: 42px;
}
.zy-recipient-head h2,
.zy-summary-head h2 {
    color: var(--ink);
    font-size: 16px;
    font-weight: 900;
    line-height: 1.2;
    margin: 0;
}
.zy-recipient-head p {
    color: var(--muted);
    font-size: 11.5px;
    font-weight: 650;
    line-height: 1.35;
    margin: 3px 0 0;
}
.zy-required-badge {
    background: #fff1f2;
    border: 1px solid #fecdd3;
    border-radius: 999px;
    color: #be123c;
    font-size: 9.5px;
    font-weight: 900;
    padding: 5px 8px;
    text-transform: uppercase;
}
.zy-recipient-card .zy-field label span {
    color: #be123c;
}
.zy-summary-card {
    padding-top: 14px;
}
.zy-summary-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}
.zy-summary-kicker {
    color: var(--green);
    display: block;
    font-size: 9.5px;
    font-weight: 900;
    margin-bottom: 3px;
    text-transform: uppercase;
}
.zy-summary-ready {
    align-items: center;
    background: var(--green-soft);
    border: 1px solid var(--green-line);
    border-radius: 999px;
    color: var(--green);
    display: inline-flex;
    font-size: 10.5px;
    font-weight: 900;
    gap: 5px;
    min-height: 30px;
    padding: 0 10px;
}
.zy-summary-route,
.zy-summary-contact {
    background: transparent;
    border: 0;
    color: var(--ink);
    display: grid;
    min-height: 48px;
    padding: 12px 0;
    text-align: left;
    touch-action: manipulation;
    width: 100%;
}
.zy-summary-route {
    border-bottom: 1px solid #edf2e9;
    border-top: 1px solid #edf2e9;
    gap: 12px;
    grid-template-columns: 14px minmax(0, 1fr) 32px;
}
.zy-summary-route-rail {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding: 5px 0;
}
.zy-summary-route-rail i {
    background: var(--lime);
    border: 2px solid var(--green);
    border-radius: 999px;
    flex: 0 0 10px;
    height: 10px;
    width: 10px;
}
.zy-summary-route-rail i:last-child {
    background: var(--green);
}
.zy-summary-route-rail b {
    border-left: 2px dotted #b8c5b0;
    flex: 1;
    margin: 3px 0;
}
.zy-summary-route-copy {
    display: grid;
    gap: 12px;
    min-width: 0;
}
.zy-summary-stop,
.zy-summary-contact > span:nth-child(2) {
    display: block;
    min-width: 0;
}
.zy-summary-stop small,
.zy-summary-contact small {
    color: var(--faint);
    display: block;
    font-size: 9.5px;
    font-weight: 900;
    text-transform: uppercase;
}
.zy-summary-stop strong,
.zy-summary-contact strong {
    color: var(--ink);
    display: block;
    font-size: 12.5px;
    font-weight: 780;
    line-height: 1.35;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-summary-contact {
    align-items: center;
    gap: 10px;
    grid-template-columns: 38px minmax(0, 1fr) 32px;
}
.zy-summary-contact-icon {
    align-items: center;
    background: var(--green-soft);
    border: 1px solid var(--green-line);
    border-radius: 12px;
    color: var(--green);
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}
.zy-summary-edit {
    align-items: center;
    background: var(--field);
    border: 1px solid var(--field-line);
    border-radius: 10px;
    color: var(--green);
    display: inline-flex;
    font-size: 10px;
    height: 32px;
    justify-content: center;
    width: 32px;
}
.zy-summary-route:active,
.zy-summary-contact:active {
    opacity: .68;
}
.zy-summary-card .zy-total {
    margin-top: 4px;
}

@media (max-width: 370px) {
    .zy-recipient-head {
        grid-template-columns: 40px minmax(0, 1fr);
    }
    .zy-required-badge {
        grid-column: 2;
        justify-self: start;
    }
}

/* ── Métodos de pago (include compartido) ───────────────── */
.zygo-payment-grid #divPaymentMethods {
    display: grid;
    gap: 9px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin: 0;
}
.zygo-payment-grid #divPaymentMethods > [class*="col-"] {
    max-width: none;
    padding: 0 !important;
}
.zygo-payment-grid .paymentMethodCard {
    align-items: center;
    background: var(--field);
    border: 1.5px solid var(--field-line);
    border-radius: 15px;
    box-shadow: none;
    color: var(--ink);
    cursor: pointer;
    display: grid;
    gap: 9px;
    grid-template-columns: 36px 1fr 20px;
    min-height: 64px;
    padding: 10px;
    transition: .15s ease;
}
.zygo-payment-grid .paymentMethodCard:active {
    transform: scale(.97);
}
.zygo-payment-grid .paymentMethodCard.is-selected {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
}
.zygo-payment-grid .paymentMethodIcon {
    align-items: center;
    background: #fff;
    border: 1px solid var(--field-line);
    border-radius: 11px;
    color: var(--green);
    display: inline-flex;
    height: 36px;
    justify-content: center;
    width: 36px;
}
.zygo-payment-grid .paymentMethodIcon img {
    max-height: 22px;
    max-width: 26px;
}
.zygo-payment-grid .paymentMethodText strong {
    display: block;
    font-size: 12.5px;
    font-weight: 850;
    line-height: 1.15;
}
.zygo-payment-grid .paymentMethodText small {
    color: var(--muted);
    display: block;
    font-size: 10px;
    font-weight: 700;
    margin-top: 3px;
}
.zygo-payment-grid .paymentMethodCard.is-selected .paymentMethodText small {
    color: rgba(255, 255, 255, .62);
}
.zygo-payment-grid .paymentMethodCheck {
    align-items: center;
    background: var(--lime);
    border-radius: 999px;
    color: #071004;
    display: none;
    font-size: 10px;
    height: 20px;
    justify-content: center;
    width: 20px;
}
.zygo-payment-grid .paymentMethodCard.is-selected .paymentMethodCheck {
    display: inline-flex;
}

/* ── Barra de acción flotante ───────────────────────────── */
.zy-actionbar {
    align-items: center;
    background: var(--ink);
    border-radius: 20px;
    bottom: calc(94px + env(safe-area-inset-bottom));
    box-shadow: 0 18px 40px rgba(16, 24, 40, .35);
    display: flex;
    gap: 10px;
    left: 50%;
    max-width: 488px;
    padding: 10px;
    position: fixed;
    transform: translateX(-50%);
    width: calc(100% - 32px);
    z-index: 25;
}
.zy-actionbar-back {
    align-items: center;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 14px;
    color: #fff;
    display: none;
    flex: 0 0 44px;
    font-size: 14px;
    height: 44px;
    justify-content: center;
    -webkit-tap-highlight-color: transparent;
    width: 44px;
}
.zy-actionbar.has-back .zy-actionbar-back {
    display: inline-flex;
}
.zy-actionbar-quote {
    flex: 1;
    min-width: 0;
    padding-left: 4px;
}
.zy-actionbar-quote span {
    color: rgba(255, 255, 255, .55);
    display: block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.zy-actionbar-quote strong {
    color: var(--lime);
    display: block;
    font-size: 17px;
    font-weight: 900;
    letter-spacing: -.01em;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-cta {
    align-items: center;
    background: var(--lime);
    border: 0;
    border-radius: 15px;
    color: #071004;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 14px;
    font-weight: 900;
    gap: 8px;
    justify-content: center;
    min-height: 48px;
    padding: 0 18px;
    -webkit-tap-highlight-color: transparent;
    transition: .15s ease;
}
.zy-cta-icon {
    align-items: center;
    display: inline-flex;
    flex: 0 0 18px;
    height: 18px;
    justify-content: center;
    width: 18px;
}
.zy-cta-icon::before,
.zy-cta-icon::after,
.zy-cta::before,
.zy-cta::after {
    content: none !important;
    display: none !important;
}
.zy-cta-icon .zygo-icon-svg {
    height: 18px;
    stroke-width: 2.2;
    width: 18px;
}
.zy-cta-icon.is-spinning .zygo-icon-svg {
    animation: zyCtaSpin .8s linear infinite !important;
}
@keyframes zyCtaSpin {
    to { transform: rotate(360deg); }
}
.zy-cta:active {
    background: var(--lime-press);
    transform: scale(.97);
}
.zy-cta:disabled {
    background: rgba(255, 255, 255, .12);
    color: rgba(255, 255, 255, .38);
    cursor: not-allowed;
    transform: none;
}
.zy-actionbar--solo .zy-cta {
    flex: 1;
}
.zy-pop {
    animation: zyPop .4s cubic-bezier(.3, 1.4, .5, 1);
}
@keyframes zyPop {
    0% { opacity: .3; transform: scale(.6); }
    60% { transform: scale(1.14); }
    100% { opacity: 1; transform: scale(1); }
}

/* ── Botones ────────────────────────────────────────────── */
.zy-btn-primary {
    align-items: center;
    background: var(--lime);
    border: 0;
    border-radius: 16px;
    box-shadow: 0 12px 28px rgba(79, 176, 0, .22);
    color: #071004;
    display: inline-flex;
    font-size: 14.5px;
    font-weight: 900;
    gap: 9px;
    justify-content: center;
    min-height: 52px;
    padding: 0 18px;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none !important;
    transition: transform .12s ease;
    width: 100%;
}
.zy-btn-primary:active {
    transform: scale(.97);
}
.zy-btn-primary.is-loading {
    opacity: .75;
    pointer-events: none;
}
.zy-btn-ghost {
    align-items: center;
    background: #fff;
    border: 1.5px solid var(--field-line);
    border-radius: 16px;
    color: var(--ink);
    display: inline-flex;
    font-size: 13.5px;
    font-weight: 850;
    gap: 8px;
    justify-content: center;
    min-height: 52px;
    padding: 0 14px;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none !important;
    transition: transform .12s ease;
}
.zy-btn-ghost:active {
    transform: scale(.97);
}
.zy-btn-danger {
    align-items: center;
    background: #fff1f2;
    border: 1.5px solid #fecdd3;
    border-radius: 16px;
    color: #be123c;
    display: inline-flex;
    font-size: 13.5px;
    font-weight: 850;
    gap: 8px;
    justify-content: center;
    min-height: 52px;
    padding: 0 14px;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none !important;
    width: 100%;
}

/* ── Hoja inferior + scrim ──────────────────────────────── */
.zy-scrim {
    background: rgba(16, 16, 20, .5);
    inset: 0;
    opacity: 0;
    pointer-events: none;
    position: fixed;
    transition: opacity .2s ease;
    z-index: 35;
}
.zy-scrim.is-visible {
    opacity: 1;
    pointer-events: auto;
}
.zy-sheet {
    --lime: #8af000;
    --green: #2f7d00;
    --ink: #101014;
    --ink-2: #3c4454;
    --muted: #667085;
    --faint: #98a2b3;
    --field: #f8fbf6;
    --field-line: #dfe9db;
    background: #fff;
    border-radius: 26px 26px 0 0;
    bottom: 0;
    box-shadow: 0 -24px 60px rgba(16, 24, 40, .3);
    left: 50%;
    max-width: 520px;
    padding: 22px 18px calc(18px + env(safe-area-inset-bottom));
    position: fixed;
    transform: translateX(-50%) translateY(105%);
    transition: transform .28s cubic-bezier(.32, .72, .25, 1);
    width: 100%;
    z-index: 40;
    color: var(--ink);
}
.zy-sheet.is-visible {
    transform: translateX(-50%) translateY(0);
}
.zy-sheet-grab {
    background: #e2e8dd;
    border-radius: 999px;
    height: 4px;
    left: 50%;
    position: absolute;
    top: 10px;
    transform: translateX(-50%);
    width: 40px;
}
.zy-sheet-icon {
    align-items: center;
    background: var(--lime);
    border-radius: 18px;
    color: #071004;
    display: inline-flex;
    font-size: 21px;
    height: 52px;
    justify-content: center;
    width: 52px;
}
.zy-sheet h3 {
    color: var(--ink);
    font-size: 23px;
    font-weight: 900;
    letter-spacing: -.02em;
    margin: 12px 0 4px;
}
.zy-sheet > p {
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    line-height: 1.45;
    margin: 0 0 14px;
}
.zy-share-row {
    align-items: center;
    background: var(--field);
    border: 1px solid var(--field-line);
    border-radius: 15px;
    display: flex;
    gap: 8px;
    margin-bottom: 10px;
    padding: 8px;
}
.zy-share-row input {
    background: transparent;
    border: 0;
    color: var(--ink-2);
    flex: 1;
    font-size: 12px;
    font-weight: 700;
    min-width: 0;
    outline: 0;
    padding-left: 6px;
}
.zy-share-row button,
.zy-share-row a {
    align-items: center;
    background: #fff;
    border: 1px solid var(--field-line);
    border-radius: 11px;
    color: var(--green);
    display: inline-flex;
    flex: 0 0 42px;
    font-size: 14px;
    height: 38px;
    justify-content: center;
    text-decoration: none !important;
    width: 42px;
}
.zy-whats-btn {
    align-items: center;
    background: #25d366;
    border: 0;
    border-radius: 16px;
    color: #fff;
    display: flex;
    font-size: 14px;
    font-weight: 850;
    gap: 9px;
    justify-content: center;
    margin-bottom: 10px;
    min-height: 50px;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none !important;
    transition: transform .12s ease;
    width: 100%;
}
.zy-whats-btn:active {
    transform: scale(.97);
}
.zy-sheet-actions {
    display: grid;
    gap: 9px;
    grid-template-columns: 1fr 1fr;
}
.zy-confetti {
    height: 0;
    left: 0;
    overflow: visible;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 3;
}
.zy-confetti i {
    animation: zyConfetti 2s cubic-bezier(.2, .6, .6, 1) forwards;
    border-radius: 2px;
    height: 12px;
    opacity: 0;
    position: absolute;
    width: 8px;
}
@keyframes zyConfetti {
    0% { opacity: 1; transform: translateY(-14px) rotate(0); }
    100% { opacity: 0; transform: translateY(250px) rotate(560deg); }
}

/* ── Dock de navegación ─────────────────────────────────── */
.zy-dock {
    align-items: end;
    backdrop-filter: blur(20px) saturate(1.4);
    -webkit-backdrop-filter: blur(20px) saturate(1.4);
    background: rgba(255, 255, 255, .9);
    border: 1px solid rgba(226, 232, 221, .85);
    border-bottom: 0;
    border-radius: 26px 26px 0 0;
    bottom: 0;
    box-shadow: 0 -16px 44px rgba(16, 24, 40, .16);
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    left: 50%;
    max-width: 520px;
    padding: 10px 6px calc(10px + env(safe-area-inset-bottom));
    position: fixed;
    transform: translateX(-50%);
    width: 100%;
    z-index: 30;
}
.zy-dock-item {
    align-items: center;
    border-radius: 14px;
    color: var(--faint, #98a2b3);
    display: flex;
    flex-direction: column;
    font-size: 10px;
    font-weight: 800;
    gap: 4px;
    justify-content: center;
    min-height: 50px;
    min-width: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none !important;
    touch-action: manipulation;
    transition: transform .12s ease, color .15s ease;
    user-select: none;
}
.zy-dock-item span {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-inline-icon,
.zy-dock-svg {
    display: block;
    fill: none;
    flex: 0 0 auto;
    height: 20px;
    overflow: visible;
    stroke: currentColor;
    vector-effect: non-scaling-stroke;
    width: 20px;
}
.zy-dock-svg--fab {
    height: 24px;
    width: 24px;
}
.zy-dock-item:active {
    transform: scale(.9);
}
.zy-dock-item.is-active {
    color: #101014;
}
.zy-dock-item.is-active:after {
    background: #8af000;
    border-radius: 999px;
    bottom: 1px;
    content: "";
    height: 5px;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 5px;
}
.zy-dock-fab {
    align-items: center;
    color: #3c4454;
    display: flex;
    flex-direction: column;
    font-size: 10px;
    font-weight: 850;
    gap: 5px;
    justify-content: flex-end;
    min-height: 50px;
    min-width: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    text-decoration: none !important;
    touch-action: manipulation;
    user-select: none;
}
.zy-dock-fab b {
    align-items: center;
    background: linear-gradient(150deg, #9dff1e, #74d400);
    border-radius: 999px;
    box-shadow: 0 12px 26px rgba(103, 216, 0, .42), 0 0 0 6px #f5f8f2;
    color: #0a1404;
    display: flex;
    font-size: 20px;
    height: 56px;
    justify-content: center;
    margin-top: -36px;
    transition: transform .15s ease;
    width: 56px;
}
.zy-dock-fab:active b {
    transform: scale(.92);
}
.zy-dock-fab.is-active {
    color: #101014;
}

/* ── Hero (invitado) + login ────────────────────────────── */
.zy-hero {
    background:
        radial-gradient(circle at 86% 10%, rgba(138, 240, 0, .3), transparent 38%),
        linear-gradient(145deg, #101014, #14200f);
    border-radius: 24px;
    color: #fff;
    margin-top: 8px;
    overflow: hidden;
    padding: 22px 20px;
    position: relative;
}
.zy-hero:before {
    background:
        linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
    background-size: 28px 28px;
    content: "";
    inset: 0;
    mask-image: linear-gradient(180deg, rgba(0, 0, 0, .7), transparent 85%);
    -webkit-mask-image: linear-gradient(180deg, rgba(0, 0, 0, .7), transparent 85%);
    position: absolute;
}
.zy-hero > * {
    position: relative;
    z-index: 1;
}
.zy-hero-pill {
    align-items: center;
    background: rgba(138, 240, 0, .14);
    border: 1px solid rgba(138, 240, 0, .26);
    border-radius: 999px;
    color: #c8ff7a;
    display: inline-flex;
    font-size: 11px;
    font-weight: 900;
    gap: 7px;
    letter-spacing: .05em;
    padding: 6px 11px;
    text-transform: uppercase;
}
.zy-hero h1 {
    color: #fff;
    font-size: 27px;
    font-weight: 900;
    letter-spacing: -.02em;
    line-height: 1.05;
    margin: 13px 0 7px;
}
.zy-hero p {
    color: rgba(255, 255, 255, .7);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.5;
    margin: 0;
}
.zy-login-head {
    align-items: center;
    display: flex;
    gap: 13px;
    margin-bottom: 15px;
}
.zy-login-head .zy-sheet-icon {
    border-radius: 15px;
    flex: 0 0 46px;
    font-size: 17px;
    height: 46px;
    width: 46px;
}
.zy-login-head h2 {
    color: var(--ink);
    font-size: 19px;
    font-weight: 900;
    letter-spacing: -.01em;
    margin: 0 0 3px;
}
.zy-login-head p {
    color: var(--muted);
    font-size: 12px;
    font-weight: 650;
    line-height: 1.4;
    margin: 0;
}
.zy-login-error {
    background: #fff1f2;
    border: 1px solid #fecdd3;
    border-radius: 13px;
    color: #be123c;
    display: none;
    font-size: 12px;
    font-weight: 750;
    line-height: 1.35;
    margin: 0 0 12px;
    padding: 10px 12px;
}
.zy-login-links {
    align-items: center;
    display: flex;
    gap: 18px;
    justify-content: center;
    margin-top: 14px;
}
.zy-login-links a {
    color: var(--green);
    font-size: 12.5px;
    font-weight: 850;
    text-decoration: none !important;
}

/* ── Login móvil ────────────────────────────────────────── */
.zy-app--auth {
    padding-bottom: calc(30px + env(safe-area-inset-bottom));
}
.zy-hero-photo {
    align-items: flex-end;
    border-radius: 24px;
    display: flex;
    margin-top: 6px;
    min-height: 224px;
    overflow: hidden;
    padding: 18px 20px 58px;
    position: relative;
}
.zy-hero-photo > img {
    height: 100%;
    inset: 0;
    object-fit: cover;
    position: absolute;
    width: 100%;
}
.zy-hero-photo:after {
    background: linear-gradient(198deg, rgba(16, 16, 20, .04) 26%, rgba(16, 16, 20, .58) 66%, rgba(16, 16, 20, .88) 100%);
    content: "";
    inset: 0;
    position: absolute;
}
.zy-hero-photo .inner {
    position: relative;
    z-index: 2;
}
.zy-hero-photo h1 {
    color: #fff;
    font-size: 26px;
    font-weight: 900;
    letter-spacing: -.02em;
    line-height: 1.05;
    margin: 11px 0 0;
    text-shadow: 0 2px 14px rgba(16, 16, 20, .4);
}
.zy-login-hero-status {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 13px;
}
.zy-login-hero-status span {
    align-items: center;
    background: rgba(255, 255, 255, .13);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 999px;
    color: rgba(255, 255, 255, .9);
    display: inline-flex;
    font-size: 11px;
    font-weight: 850;
    gap: 6px;
    padding: 7px 10px;
}
.zy-login-hero-status i {
    color: var(--lime);
    font-size: 7px;
    filter: drop-shadow(0 0 7px rgba(138, 240, 0, .65));
}
.zy-login-card {
    border-radius: 22px;
    box-shadow: 0 18px 48px rgba(16, 24, 40, .12);
    margin: -38px 6px 0;
    padding: 20px 18px;
    position: relative;
    z-index: 2;
}
.zy-login-title {
    color: var(--ink);
    font-size: 24px;
    font-weight: 900;
    letter-spacing: -.02em;
    margin: 0 0 4px;
}
.zy-login-sub {
    color: var(--muted);
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.4;
    margin: 0 0 16px;
}
.zy-login-fast {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 0 16px;
}
.zy-login-fast span {
    background: #f8fbf6;
    border: 1px solid var(--line);
    border-radius: 15px;
    min-width: 0;
    padding: 11px 9px;
}
.zy-login-fast i,
.zy-login-fast b,
.zy-login-fast small {
    display: block;
}
.zy-login-fast i {
    color: var(--green);
    font-size: 13px;
    margin-bottom: 7px;
}
.zy-login-fast b {
    color: var(--ink);
    font-size: 11.5px;
    font-weight: 900;
    line-height: 1.15;
}
.zy-login-fast small {
    color: var(--muted);
    font-size: 10px;
    font-weight: 700;
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-eye {
    background: transparent;
    border: 0;
    color: var(--faint);
    flex: 0 0 30px;
    font-size: 14px;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
}
.zy-eye:hover,
.zy-eye:focus {
    color: var(--ink-2);
}
.zy-login-foot {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    justify-content: center;
    margin-top: 18px;
}
.zy-login-chip {
    align-items: center;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 999px;
    color: var(--muted);
    display: inline-flex;
    font-size: 11px;
    font-weight: 750;
    gap: 6px;
    padding: 7px 11px;
    white-space: nowrap;
}
.zy-login-chip i {
    color: var(--green);
    font-size: 11px;
}

/* UI/UX Pro Max + Motion Framer refresh */
.zy-app {
    --blue: #2563eb;
    --blue-soft: #eff6ff;
    --orange: #ea580c;
    --orange-soft: #fff7ed;
}
.zy-card,
.zy-provider,
.zy-product,
.zy-login-fast span,
.zy-recharge-row {
    transition: transform .18s cubic-bezier(.2, .8, .2, 1), border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.zy-card:focus-within {
    border-color: rgba(37, 99, 235, .28);
    box-shadow: 0 16px 38px rgba(37, 99, 235, .10);
}
.zy-provider:active,
.zy-product:active,
.zy-login-fast span:active {
    transform: scale(.98);
}
.zy-btn-primary:focus-visible,
.zy-cta:focus-visible,
.zy-eye:focus-visible,
.zy-location-btn:focus-visible,
.zy-retry-btn:focus-visible {
    outline: 3px solid rgba(37, 99, 235, .22);
    outline-offset: 3px;
}
.zy-card-title i:nth-child(1),
.zy-login-head .zy-sheet-icon {
    box-shadow: 0 8px 18px rgba(79, 176, 0, .12);
}
.zy-address-state.is-loading,
.zy-recharge-loading i,
.zy-recharge-message i {
    color: var(--blue);
}
.zy-quote-chip.is-error,
.zy-address-state.is-error {
    animation: zySoftShake .28s ease;
}
@keyframes zySoftShake {
    0%, 100% { transform: translateX(0); }
    35% { transform: translateX(-3px); }
    70% { transform: translateX(3px); }
}

/* ── Alertas ────────────────────────────────────────────── */
.zy-alert {
    background: #fff8eb;
    border: 1px solid #fed7aa;
    border-radius: 17px;
    color: #92400e;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.45;
    margin: 12px 0;
    padding: 14px;
}
.zy-alert.ok {
    background: #ecfdf3;
    border-color: #bbf7d0;
    color: #047857;
}
.zy-alert.error {
    background: #fff1f2;
    border-color: #fecdd3;
    color: #be123c;
}

/* ── Perfil ─────────────────────────────────────────────── */
.zy-id {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding: 14px 0 4px;
    text-align: center;
}
.zy-id-avatar {
    position: relative;
}
.zy-id-avatar > span {
    align-items: center;
    background: var(--ink);
    border-radius: 999px;
    box-shadow: 0 0 0 4px #fff, 0 0 0 7px var(--lime);
    color: #c8ff7a;
    display: flex;
    font-size: 32px;
    font-weight: 900;
    height: 88px;
    justify-content: center;
    overflow: hidden;
    width: 88px;
}
.zy-id-avatar img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}
.zy-id-cam {
    align-items: center;
    background: var(--ink);
    border: 3px solid var(--bg);
    border-radius: 999px;
    bottom: -4px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 11px;
    height: 32px;
    justify-content: center;
    position: absolute;
    right: -6px;
    width: 32px;
    z-index: 2;
}
.zy-id-cam input {
    cursor: pointer;
    inset: 0;
    opacity: 0;
    position: absolute;
}
.zy-id h1 {
    color: var(--ink);
    font-size: 22px;
    font-weight: 900;
    letter-spacing: -.02em;
    margin: 14px 0 3px;
}
.zy-id p {
    color: var(--muted);
    font-size: 13px;
    font-weight: 650;
    margin: 0 0 10px;
}
.zy-meta-grid {
    display: grid;
    gap: 9px;
    grid-template-columns: repeat(2, 1fr);
    margin: 14px 0 12px;
}
.zy-meta {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px;
}
.zy-meta span {
    color: var(--faint);
    display: block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}
.zy-meta strong {
    color: var(--ink);
    display: block;
    font-size: 14px;
    font-weight: 850;
    margin-top: 4px;
    word-break: break-word;
}

/* ── Mi tienda ──────────────────────────────────────────── */
.zy-store-id {
    align-items: center;
    display: flex;
    gap: 12px;
}
.zy-store-logo {
    align-items: center;
    background: var(--green-soft);
    border: 1px solid var(--green-line);
    border-radius: 16px;
    color: var(--green);
    display: inline-flex;
    flex: 0 0 54px;
    font-size: 20px;
    height: 54px;
    justify-content: center;
    overflow: hidden;
    width: 54px;
}
.zy-store-logo img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}
.zy-store-id .txt {
    flex: 1;
    min-width: 0;
}
.zy-store-id .txt strong {
    color: var(--ink);
    display: block;
    font-size: 16px;
    font-weight: 900;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-store-id .txt span {
    color: var(--muted);
    display: block;
    font-size: 12px;
    font-weight: 650;
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-stats {
    display: grid;
    gap: 9px;
    grid-template-columns: repeat(3, 1fr);
    margin: 0 0 12px;
}
.zy-stat {
    background: #fff;
    border: 1px solid var(--line);
    border-radius: 16px;
    padding: 12px;
}
.zy-stat span {
    color: var(--faint);
    display: block;
    font-size: 10px;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.zy-stat strong {
    color: var(--ink);
    display: block;
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
    margin-top: 6px;
}
.zy-mini-row {
    align-items: center;
    background: var(--field);
    border: 1px solid var(--field-line);
    border-radius: 15px;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin-bottom: 8px;
    padding: 11px 13px;
}
.zy-mini-row:last-child {
    margin-bottom: 0;
}
.zy-mini-row strong {
    color: var(--ink);
    display: block;
    font-size: 13px;
    font-weight: 850;
}
.zy-mini-row span {
    color: var(--muted);
    display: block;
    font-size: 11px;
    font-weight: 700;
    margin-top: 2px;
}
.zy-mini-row em {
    background: #fff;
    border: 1px solid var(--field-line);
    border-radius: 999px;
    color: var(--green);
    font-size: 10px;
    font-style: normal;
    font-weight: 900;
    padding: 6px 9px;
    white-space: nowrap;
}

/* ── Comunicados (Inicio) ───────────────────────────────── */
.zy-section-row {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
    margin: 16px 2px 10px;
}
.zy-section-row h2 {
    color: var(--ink);
    font-size: 17px;
    font-weight: 900;
    letter-spacing: -.01em;
    margin: 0;
}
.zy-section-row span {
    color: var(--faint);
    font-size: 12px;
    font-weight: 750;
}
.zy-news {
    cursor: pointer;
    padding: 0;
    -webkit-tap-highlight-color: transparent;
    transition: transform .12s ease;
}
.zy-news:active {
    transform: scale(.985);
}
.zy-news-img {
    aspect-ratio: 21 / 9;
    display: block;
    object-fit: cover;
    width: 100%;
}
.zy-news-body {
    padding: 14px 16px 15px;
}
.zy-news-top {
    align-items: center;
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}
.zy-news-pin {
    align-items: center;
    background: var(--green-soft);
    border: 1px solid var(--green-line);
    border-radius: 999px;
    color: var(--green);
    display: inline-flex;
    font-size: 10px;
    font-weight: 900;
    gap: 5px;
    letter-spacing: .04em;
    padding: 5px 9px;
    text-transform: uppercase;
}
.zy-news-date {
    color: var(--faint);
    font-size: 11px;
    font-weight: 750;
    margin-left: auto;
    white-space: nowrap;
}
.zy-news h3 {
    color: var(--ink);
    font-size: 16px;
    font-weight: 900;
    letter-spacing: -.01em;
    line-height: 1.25;
    margin: 0 0 5px;
}
.zy-news p {
    color: var(--muted);
    display: -webkit-box;
    font-size: 13px;
    font-weight: 650;
    line-height: 1.5;
    margin: 0;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
}
.zy-news-more {
    align-items: center;
    color: var(--green);
    display: inline-flex;
    font-size: 12.5px;
    font-weight: 850;
    gap: 6px;
    margin-top: 9px;
}

/* ── Lector de comunicado (bottom sheet) ────────────────── */
.zy-sheet--reader {
    display: flex;
    flex-direction: column;
    max-height: 86dvh;
}
.zy-reader-scroll {
    flex: 1;
    margin: 0 -18px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding: 0 18px 4px;
}
.zy-reader-img {
    border-radius: 16px;
    display: block;
    margin: 2px 0 14px;
    max-height: 220px;
    object-fit: cover;
    width: 100%;
}
.zy-reader-content {
    color: var(--ink-2);
    font-size: 14.5px;
    font-weight: 550;
    line-height: 1.65;
    white-space: normal;
    word-break: break-word;
}
.zy-reader-content p {
    margin: 0 0 12px;
}
.zy-reader-content h1,
.zy-reader-content h2,
.zy-reader-content h3 {
    color: var(--ink);
    font-weight: 900;
    letter-spacing: -.01em;
    line-height: 1.25;
    margin: 18px 0 8px;
}
.zy-reader-content h1 { font-size: 20px; }
.zy-reader-content h2 { font-size: 18px; }
.zy-reader-content h3 { font-size: 16px; }
.zy-reader-content img {
    border-radius: 14px;
    display: block;
    height: auto;
    margin: 12px 0;
    max-width: 100%;
}
.zy-reader-content iframe {
    aspect-ratio: 16 / 9;
    border: 0;
    border-radius: 14px;
    display: block;
    height: auto;
    margin: 12px 0;
    max-width: 100%;
    width: 100%;
}
.zy-reader-content blockquote {
    border-left: 3px solid var(--lime);
    color: var(--muted);
    margin: 12px 0;
    padding: 4px 0 4px 14px;
}
.zy-reader-content ul,
.zy-reader-content ol {
    margin: 0 0 12px;
    padding-left: 22px;
}
.zy-reader-content li {
    margin-bottom: 5px;
}
.zy-reader-content a {
    color: var(--green);
    font-weight: 750;
}
.zy-sheet--reader .zy-btn-ghost {
    margin-top: 12px;
    width: 100%;
}

/* ── Blindaje contra a:hover/:focus de Bootstrap ────────── */
/* Bootstrap define a:hover con azul (#0056b3) y mayor especificidad
   que una clase sola; en móvil el hover queda pegado tras cada tap. */
.zy-dock-item:hover,
.zy-dock-item:focus {
    color: #98a2b3;
}
.zy-dock-item.is-active:hover,
.zy-dock-item.is-active:focus {
    color: #101014;
}
.zy-dock-fab:hover,
.zy-dock-fab:focus {
    color: #3c4454;
}
.zy-dock-fab.is-active:hover,
.zy-dock-fab.is-active:focus {
    color: #101014;
}
.zy-head-brand:hover,
.zy-head-avatar:hover,
.zy-head-avatar:focus {
    color: #c8ff7a;
}
.zy-track-btn:hover,
.zy-track-btn:focus {
    color: #fff;
}
.zy-icon-btn:hover,
.zy-icon-btn:focus {
    color: #2f7d00;
}
.zy-btn-primary:hover,
.zy-btn-primary:focus {
    color: #071004;
}
.zy-btn-ghost:hover,
.zy-btn-ghost:focus {
    color: #101014;
}
.zy-btn-danger:hover,
.zy-btn-danger:focus {
    color: #be123c;
}
.zy-whats-btn:hover,
.zy-whats-btn:focus {
    color: #fff;
}
.zy-login-links a:hover,
.zy-share-row a:hover,
.zy-share-row a:focus {
    color: #2f7d00;
}

/* ── Google Places ──────────────────────────────────────── */
.pac-container {
    border: 1px solid #e4eadf;
    border-radius: 16px;
    box-shadow: 0 24px 70px rgba(16, 24, 40, .22);
    font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    margin-top: 6px;
    max-width: calc(100vw - 16px) !important;
    overflow: hidden !important;
    touch-action: manipulation;
    z-index: 2147483647 !important;
}
.pac-item {
    border-color: #f0f4ec;
    color: #344054 !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
    min-height: 50px;
    padding: 9px 13px !important;
    white-space: normal !important;
}
.pac-item-query {
    color: #101014 !important;
    font-size: 14px !important;
    font-weight: 850;
}
.pac-matched {
    color: #2f7d00 !important;
    font-weight: 950 !important;
}

/* ── Responsive ─────────────────────────────────────────── */
@media (max-width: 370px) {
    .zy-title-row h1 {
        font-size: 23px;
    }
    .zygo-payment-grid #divPaymentMethods,
    .zy-stats {
        grid-template-columns: 1fr;
    }
    .zy-meta-grid {
        grid-template-columns: 1fr;
    }
    .zy-app {
        padding-left: 12px;
        padding-right: 12px;
    }
}

/* ── Capa UI/UX Pro Max + Motion Framer ───────────────────
   Mejora confianza visual, foco accesible y microinteracciones
   usando solo transform/opacity para mantener rendimiento móvil. */
.zy-app {
    --trust-blue: #2563eb;
    --trust-blue-soft: rgba(37, 99, 235, .16);
    --delivery-orange: #ea580c;
    --delivery-orange-soft: rgba(234, 88, 12, .14);
    --field-focus-ring: rgba(37, 99, 235, .16);
}

body.zygo-pwa-order-page,
body.zygo-pwa-order-page #app,
body.zygo-pwa-order-page .section {
    background:
        linear-gradient(180deg, #eff6ff 0%, #f5f8f2 32%, #f7faf4 100%) !important;
}

.zy-card,
.zy-news,
.zy-empty {
    border-color: rgba(37, 99, 235, .10);
    box-shadow: 0 14px 34px rgba(16, 24, 40, .07);
    transition: transform .2s cubic-bezier(.2, .8, .2, 1), box-shadow .2s ease, border-color .2s ease;
}

.zy-card:focus-within {
    border-color: rgba(37, 99, 235, .24);
    box-shadow: 0 18px 42px rgba(37, 99, 235, .10);
}

@media (hover: hover) {
    .zy-card:hover,
    .zy-news:hover,
    .zy-empty:hover {
        border-color: rgba(37, 99, 235, .18);
        box-shadow: 0 18px 42px rgba(16, 24, 40, .09);
        transform: translateY(-2px);
    }
}

.zy-card-title i,
.zy-empty > i {
    background: linear-gradient(135deg, var(--green-soft), #eff6ff);
    border-color: rgba(37, 99, 235, .14);
}

.zy-input:focus-within,
.zy-control:focus,
.zy-select select:focus {
    border-color: var(--trust-blue);
    box-shadow: 0 0 0 4px var(--field-focus-ring);
}

.zy-input input:focus-visible,
.zy-input textarea:focus-visible,
.zy-control:focus-visible,
.zy-select select:focus-visible,
.zy-file input:focus-visible + *,
.zy-switch input:focus-visible,
.zy-filter:focus-visible,
.zy-btn-primary:focus-visible,
.zy-btn-ghost:focus-visible,
.zy-btn-danger:focus-visible,
.zy-cta:focus-visible,
.zy-actionbar-back:focus-visible,
.zy-track-btn:focus-visible,
.zy-order-cancel-btn:focus-visible,
.zy-icon-btn:focus-visible,
.zy-dock-item:focus-visible,
.zy-dock-fab:focus-visible,
.zy-share-row button:focus-visible,
.zy-share-row a:focus-visible,
.zy-whats-btn:focus-visible {
    outline: 3px solid var(--field-focus-ring);
    outline-offset: 3px;
}

.zy-btn-primary,
.zy-cta {
    box-shadow: 0 12px 28px rgba(79, 176, 0, .22);
    transition: transform .16s cubic-bezier(.2, .8, .2, 1), box-shadow .16s ease, filter .16s ease;
}

.zy-btn-primary:hover,
.zy-cta:hover {
    color: #071004;
    filter: saturate(1.04) brightness(1.02);
    transform: translateY(-1px);
}

.zy-btn-primary:active,
.zy-btn-ghost:active,
.zy-cta:active,
.zy-filter:active,
.zy-track-btn:active,
.zy-order-cancel-btn:active,
.zy-icon-btn:active {
    transform: scale(.97);
}

.zy-btn-primary:disabled,
.zy-cta:disabled {
    filter: grayscale(.15);
    transform: none;
}

.zy-btn-ghost,
.zy-filter,
.zygo-payment-grid .paymentMethodCard {
    transition: transform .16s cubic-bezier(.2, .8, .2, 1), border-color .16s ease, box-shadow .16s ease, background .16s ease;
}

.zy-btn-ghost:hover,
.zy-filter:hover,
.zygo-payment-grid .paymentMethodCard:hover {
    border-color: rgba(37, 99, 235, .20);
    box-shadow: 0 10px 24px rgba(16, 24, 40, .06);
}

.zy-filter.is-active,
.zygo-payment-grid .paymentMethodCard.is-selected,
.zy-total {
    background: linear-gradient(135deg, #101014, #172554);
}

.zy-filter.is-active {
    border-color: #172554;
}

.zy-status--accepted,
.zy-badge.blue {
    background: #eff6ff;
    color: #1d4ed8;
}

.zy-status--searching,
.zy-status--pending,
.zy-badge.warm {
    background: #fff7ed;
    color: #c2410c;
}

.zy-field.has-error .zy-input,
.zy-field.has-error .zy-control,
.zy-field.has-error .zy-select select {
    animation: zyFieldShake .24s ease;
    border-color: #fb7185;
    box-shadow: 0 0 0 4px rgba(251, 113, 133, .14);
}

@keyframes zyFieldShake {
    0%, 100% { transform: translateX(0); }
    35% { transform: translateX(-4px); }
    70% { transform: translateX(4px); }
}

.zy-password-toggle {
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: transform .16s ease, border-color .16s ease, color .16s ease;
}

.zy-password-toggle:active {
    transform: scale(.94);
}

.zy-register-overview {
    animation: zyPageIn .32s cubic-bezier(.22, .9, .3, 1);
}

@media (prefers-reduced-motion: reduce) {
    .zy-app,
    .zy-app *,
    .zy-app *::before,
    .zy-app *::after,
    .zy-scrim,
    .zy-sheet {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .001ms !important;
    }

    .zy-card:hover,
    .zy-news:hover,
    .zy-empty:hover,
    .zy-btn-primary:hover,
    .zy-cta:hover {
        transform: none;
    }
}

/* ── Login: ruta viva en el hero (jul 2026) ─────────────── */
.zy-login-route {
    display: block;
    height: auto;
    margin: 14px 0 2px;
    width: 100%;
}
.zy-login-route .draw {
    animation: zyLoginRouteDraw 7s cubic-bezier(.45, .05, .4, .96) infinite;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
}
@keyframes zyLoginRouteDraw {
    0%, 6% { stroke-dashoffset: 1; }
    46%, 90% { stroke-dashoffset: 0; }
    97%, 100% { stroke-dashoffset: 1; }
}
.zy-login-route .pin {
    animation: zyLoginPinPop 7s cubic-bezier(.34, 1.56, .64, 1) infinite;
    transform: scale(0);
    transform-box: fill-box;
    transform-origin: 50% 100%;
}
@keyframes zyLoginPinPop {
    0%, 44% { transform: scale(0); }
    50%, 90% { transform: scale(1); }
    97%, 100% { transform: scale(0); }
}
.zy-login-route .rider {
    animation: zyLoginRider 7s linear infinite;
}
@keyframes zyLoginRider {
    0%, 4% { opacity: 0; }
    7%, 44% { opacity: 1; }
    48%, 100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .zy-login-route .draw { animation: none; stroke-dashoffset: 0; }
    .zy-login-route .pin { animation: none; transform: scale(1); }
    .zy-login-route .rider { animation: none; opacity: 0; }
}

/* En el login, la tarjeta se solapa -38px sobre el hero: reservamos aire */
.zy-app--auth .zy-hero {
    padding-bottom: 64px;
}

/* ── PWA compacta: jerarquía densa sin perder tactilidad ── */
.zy-title-row h1 {
    font-size: 23px;
    letter-spacing: 0;
}
.zy-page-hint,
.zy-step-hint {
    font-size: 12px;
}
.zy-card-title {
    font-size: 14px;
}
.zy-btn-primary,
.zy-btn-ghost,
.zy-btn-danger,
.zy-cta {
    font-size: 13.5px;
}
.zy-input input,
.zy-input textarea,
.zy-control,
.zy-select select {
    font-size: 16px;
}
.zy-sheet-open {
    overflow: hidden !important;
}

/* Crear envío: el contenido principal cabe entre header y barras fijas. */
.zy-order-create .zy-head {
    padding: 8px 2px 2px;
}
.zy-order-create .zy-head-brand img {
    height: 25px;
}
.zy-order-create .zy-head-avatar {
    flex-basis: 34px;
    height: 34px;
    width: 34px;
}
.zy-order-create .zy-title-row {
    padding-top: 5px;
}
.zy-order-create .zy-progress {
    margin: 8px 0 9px;
}
.zy-order-create .zy-progress-seg span {
    font-size: 9.5px;
    margin-top: 4px;
}
.zy-order-create .zy-step-hint {
    font-size: 11px;
    line-height: 1.35;
    margin-bottom: 7px;
}
.zy-order-create .zy-card {
    border-radius: 16px;
    margin-bottom: 8px;
    padding: 11px;
}
.zy-order-create .zy-card.zy-map-card {
    padding: 0;
}
.zy-order-create .zy-field {
    margin-bottom: 7px;
}
.zy-order-create .zy-field label {
    font-size: 9.5px;
    letter-spacing: 0;
    margin-bottom: 4px;
}
.zy-order-create .zy-input {
    border-radius: 12px;
    min-height: 44px;
    padding: 0 10px;
}
.zy-order-create .zy-input input {
    padding: 10px 0;
}
.zy-order-create .zy-route {
    gap: 8px;
    grid-template-columns: 14px minmax(0, 1fr);
}
.zy-order-create .zy-route-rail {
    padding: 16px 0 11px;
}
.zy-order-create .zy-route-fields {
    gap: 7px;
}
.zy-order-create .zy-address-state {
    font-size: 9.5px;
    margin-top: 3px;
}
.zy-order-create .zy-switch {
    font-size: 10.5px;
    margin-top: 7px;
}
.zy-order-create .zy-map {
    height: 96px;
}
.zy-order-create .zy-recipient-card {
    padding-top: 10px;
}
.zy-order-create .zy-recipient-head {
    gap: 8px;
    grid-template-columns: 36px minmax(0, 1fr) auto;
    margin-bottom: 10px;
    padding-bottom: 9px;
}
.zy-order-create .zy-recipient-avatar {
    border-radius: 11px;
    height: 36px;
    width: 36px;
}
.zy-order-create .zy-recipient-head h2,
.zy-order-create .zy-summary-head h2 {
    font-size: 14px;
}
.zy-order-create .zy-recipient-head p,
.zy-order-create .zy-help,
.zy-order-create .zy-field-error {
    font-size: 10px;
}
.zy-order-create #inputObservation {
    min-height: 52px;
}
.zy-order-create .zy-summary-head {
    margin-bottom: 7px;
}
.zy-order-create .zy-summary-route,
.zy-order-create .zy-summary-contact {
    padding-bottom: 8px;
    padding-top: 8px;
}
.zy-order-create .zy-summary-route-copy {
    gap: 8px;
}
.zy-order-create .zy-total {
    padding: 10px 12px;
}
.zy-order-create .zygo-payment-grid .paymentMethodCard {
    min-height: 52px;
    padding: 7px;
}
.zy-order-create .zygo-payment-grid .paymentMethodIcon {
    height: 32px;
    width: 32px;
}

@media (max-height: 720px) {
    .zy-order-create .zy-map {
        height: 72px;
    }
    .zy-order-create .zy-step-hint {
        display: none;
    }
    .zy-order-create .zy-route-tools .zy-help {
        display: none;
    }
    .zy-order-create .zy-card {
        margin-bottom: 6px;
    }
}

/* Mi tienda: resumen operativo y configuración por bloques. */
.zy-store-page {
    padding-bottom: calc(104px + env(safe-area-inset-bottom));
}
.zy-store-page.zy-store-settings-active {
    padding-bottom: calc(188px + env(safe-area-inset-bottom));
}
.zy-store-tabs {
    background: #e9efe5;
    border: 1px solid #dfe9db;
    border-radius: 13px;
    display: grid;
    gap: 4px;
    grid-template-columns: 1fr 1fr;
    margin: 8px 0 10px;
    padding: 4px;
}
.zy-store-tabs button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 10px;
    color: #667085;
    display: inline-flex;
    font-size: 12px;
    font-weight: 850;
    gap: 7px;
    justify-content: center;
    min-height: 42px;
    touch-action: manipulation;
    transition: background .18s ease, color .18s ease, box-shadow .18s ease, transform .12s ease;
}
.zy-store-tabs button.is-active {
    background: #fff;
    box-shadow: 0 5px 14px rgba(16, 24, 40, .08);
    color: #101014;
}
.zy-store-tabs button:active {
    transform: scale(.97);
}
.zy-store-panel[hidden] {
    display: none !important;
}
.zy-store-panel.is-current {
    animation: zyStorePanelIn .22s cubic-bezier(.22, .9, .3, 1);
}
@keyframes zyStorePanelIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}
.zy-store-hero {
    background: linear-gradient(145deg, #101014, #172554);
    border: 0;
    color: #fff;
}
.zy-store-hero .zy-store-logo {
    background: rgba(138, 240, 0, .14);
    border-color: rgba(200, 255, 122, .25);
    color: #c8ff7a;
}
.zy-store-hero .zy-store-id .txt small {
    color: #c8ff7a;
    display: block;
    font-size: 8.5px;
    font-weight: 900;
    margin-bottom: 2px;
    text-transform: uppercase;
}
.zy-store-hero .zy-store-id .txt strong {
    color: #fff;
}
.zy-store-hero .zy-store-id .txt span {
    color: rgba(255, 255, 255, .66);
}
.zy-store-edit-btn {
    align-items: center;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 12px;
    color: #c8ff7a;
    display: inline-flex;
    flex: 0 0 44px;
    height: 44px;
    justify-content: center;
    touch-action: manipulation;
    width: 44px;
}
.zy-store-share {
    background: rgba(255, 255, 255, .09);
    border-color: rgba(255, 255, 255, .12);
    margin: 11px 0 0;
}
.zy-store-share input {
    color: rgba(255, 255, 255, .8);
}
.zy-store-progress-card {
    padding: 13px;
}
.zy-store-progress-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.zy-store-progress-head small,
.zy-store-progress-head strong {
    display: block;
}
.zy-store-progress-head small {
    color: #667085;
    font-size: 9px;
    font-weight: 850;
    text-transform: uppercase;
}
.zy-store-progress-head strong {
    color: #101014;
    font-size: 13px;
    font-weight: 900;
    margin-top: 2px;
}
.zy-store-progress-head > span {
    background: #effde8;
    border-radius: 999px;
    color: #2f7d00;
    font-size: 10.5px;
    font-weight: 900;
    padding: 6px 9px;
}
.zy-store-progress {
    background: #e7ede3;
    border-radius: 999px;
    height: 7px;
    margin: 10px 0;
    overflow: hidden;
}
.zy-store-progress i {
    background: #74d400;
    border-radius: inherit;
    display: block;
    height: 100%;
    transition: width .28s ease;
}
.zy-store-checks {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.zy-store-checks span {
    align-items: center;
    background: #f6f8f4;
    border: 1px solid #e4eadf;
    border-radius: 999px;
    color: #667085;
    display: inline-flex;
    font-size: 9.5px;
    font-weight: 750;
    gap: 5px;
    padding: 5px 7px;
}
.zy-store-checks span.is-done {
    background: #effde8;
    border-color: #d9f7c9;
    color: #2f7d00;
}
.zy-store-actions {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-bottom: 10px;
}
.zy-store-actions a,
.zy-store-actions button {
    align-items: center;
    background: #fff;
    border: 1px solid #e4eadf;
    border-radius: 14px;
    color: #101014;
    display: grid;
    gap: 8px;
    grid-template-columns: 34px minmax(0, 1fr) 10px;
    min-height: 64px;
    padding: 9px;
    text-align: left;
    text-decoration: none !important;
    touch-action: manipulation;
    width: 100%;
}
.zy-store-actions button:disabled {
    cursor: not-allowed;
    opacity: .5;
}
.zy-store-actions > * > i:first-child {
    align-items: center;
    background: #effde8;
    border-radius: 10px;
    color: #2f7d00;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}
.zy-store-actions > * > i:last-child {
    color: #b4bdad;
    font-size: 9px;
}
.zy-store-actions strong,
.zy-store-actions small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.zy-store-actions strong {
    font-size: 11.5px;
    font-weight: 900;
}
.zy-store-actions small {
    color: #667085;
    font-size: 9px;
    font-weight: 650;
    margin-top: 2px;
}
.zy-store-section-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
}
.zy-store-section-head h2 {
    color: #101014;
    font-size: 14px;
    font-weight: 900;
    margin: 0;
}
.zy-store-section-head a {
    color: #2f7d00;
    font-size: 10.5px;
    font-weight: 850;
}
.zy-store-section-head > span {
    color: #98a2b3;
    font-size: 9.5px;
    font-weight: 750;
}
.zy-reader-empty {
    background: #f8fbf6;
    border: 1px solid #dfe9db;
    border-radius: 12px;
    color: #667085;
    padding: 12px;
}
.zy-store-empty-row {
    align-items: center;
    color: #667085;
    display: flex;
    gap: 10px;
    padding: 8px 0 2px;
}
.zy-store-empty-row > i {
    align-items: center;
    background: #f1f5ec;
    border-radius: 10px;
    color: #2f7d00;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}

/* PWA: más espacio útil, avatar resistente y formularios contextuales. */
.zy-sr-only {
    border: 0 !important;
    clip: rect(0, 0, 0, 0) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    white-space: nowrap !important;
    width: 1px !important;
}
.zy-head-avatar,
.zy-id-avatar > span {
    position: relative;
}
.zy-avatar-fallback {
    align-items: center;
    display: flex;
    inset: 0;
    justify-content: center;
    position: absolute;
}
.zy-head-avatar img,
.zy-id-avatar img {
    inset: 0;
    position: absolute;
    z-index: 1;
}
.zy-order-create .zy-progress {
    margin-top: 5px;
}
.zy-order-create .zy-switch--pickup {
    border: 0;
    color: #475467;
    font-size: 10.5px;
    margin: 5px 0 0;
    min-height: 44px;
    padding: 0 2px;
}
.zy-address-share {
    align-items: center;
    background: transparent;
    border: 0;
    border-top: 1px solid #e7eee2;
    color: #101014;
    display: grid;
    gap: 9px;
    grid-template-columns: 34px minmax(0, 1fr) 14px;
    margin-top: 5px;
    min-height: 56px;
    padding: 7px 2px 0;
    text-align: left;
    touch-action: manipulation;
    width: 100%;
}
.zy-address-share-icon {
    align-items: center;
    background: #e9fbf1;
    border: 1px solid #b7efce;
    border-radius: 999px;
    color: #087a3e;
    display: inline-flex;
    font-size: 17px;
    height: 34px;
    justify-content: center;
    width: 34px;
}
.zy-address-share strong,
.zy-address-share small {
    display: block;
    letter-spacing: 0;
}
.zy-address-share strong {
    font-size: 11.5px;
    font-weight: 900;
    line-height: 1.2;
}
.zy-address-share small {
    color: #667085;
    font-size: 9.5px;
    font-weight: 650;
    line-height: 1.3;
    margin-top: 2px;
}
.zy-address-share > .fa-chevron-right {
    color: #98a2b3;
    font-size: 10px;
    transition: transform .16s ease;
}
.zy-address-share:active > .fa-chevron-right {
    transform: translateX(3px);
}
.zy-order-create .zy-map {
    height: clamp(220px, 36dvh, 320px);
}
.zy-order-create .zy-map-card {
    min-height: clamp(222px, 36dvh, 322px);
}
/* Login: fotografía real, marca clara y composición editorial sobria. */
.zy-login-photo {
    border-radius: 0 0 24px 24px;
    margin: calc(-1 * env(safe-area-inset-top)) -16px 0;
    min-height: 318px;
    padding: calc(82px + env(safe-area-inset-top)) 20px 56px;
}
.zy-login-photo > img {
    animation: zyLoginPhotoIn .42s cubic-bezier(.2, .8, .2, 1) both;
    object-position: 50% 52%;
}
.zy-login-photo:after {
    background: linear-gradient(180deg, rgba(8, 10, 9, .62) 0%, rgba(8, 10, 9, .08) 38%, rgba(8, 10, 9, .94) 100%);
}
.zy-login-photo-brand {
    align-items: center;
    display: flex;
    gap: 10px;
    left: 20px;
    position: absolute;
    top: calc(18px + env(safe-area-inset-top));
    z-index: 3;
}
.zy-login-photo-brand img {
    height: auto;
    width: 96px;
}
.zy-login-photo-brand span {
    border-left: 1px solid rgba(255, 255, 255, .42);
    color: rgba(255, 255, 255, .82);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0;
    padding-left: 10px;
    text-transform: uppercase;
}
.zy-login-photo .inner {
    width: min(100%, 330px);
}
.zy-login-photo h1 {
    font-size: 29px;
    letter-spacing: 0;
    line-height: 1.08;
    margin-top: 10px;
}
.zy-login-photo p {
    color: rgba(255, 255, 255, .82);
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.45;
    margin: 7px 0 0;
}
.zy-login-photo .zy-login-hero-status {
    margin-top: 11px;
}
.zy-login-photo .zy-login-hero-status span {
    background: rgba(12, 16, 13, .46);
    border-color: rgba(255, 255, 255, .23);
    font-size: 9.5px;
    min-height: 30px;
    padding: 5px 9px;
}
.zy-login-photo .zy-login-hero-status i {
    font-size: 9px;
}
.zy-app--auth .zy-login-card {
    margin-top: -34px;
}
@keyframes zyLoginPhotoIn {
    from { opacity: .65; transform: scale(1.035); }
    to { opacity: 1; transform: scale(1); }
}
@media (max-height: 720px) {
    .zy-order-create .zy-map {
        height: clamp(180px, 29dvh, 220px);
    }
    .zy-order-create .zy-map-card {
        min-height: clamp(182px, 29dvh, 222px);
    }
    .zy-login-photo {
        min-height: 276px;
        padding-bottom: 46px;
    }
}
.zy-store-empty-row strong,
.zy-store-empty-row small {
    display: block;
}
.zy-store-empty-row strong {
    color: #101014;
    font-size: 11.5px;
    font-weight: 850;
}
.zy-store-empty-row small {
    font-size: 9.5px;
    margin-top: 2px;
}
.zy-store-settings-hint {
    color: #667085;
    font-size: 11px;
    font-weight: 650;
    line-height: 1.4;
    margin: 0 2px 8px;
}
.zy-store-section {
    background: #fff;
    border: 1px solid #e4eadf;
    border-radius: 14px;
    margin-bottom: 8px;
    overflow: hidden;
}
.zy-store-section > summary {
    align-items: center;
    cursor: pointer;
    display: grid;
    gap: 9px;
    grid-template-columns: 36px minmax(0, 1fr) 18px;
    list-style: none;
    min-height: 58px;
    padding: 8px 11px;
    touch-action: manipulation;
}
.zy-store-section > summary::-webkit-details-marker {
    display: none;
}
.zy-store-section > summary > span {
    align-items: center;
    background: #effde8;
    border-radius: 10px;
    color: #2f7d00;
    display: inline-flex;
    height: 36px;
    justify-content: center;
    width: 36px;
}
.zy-store-section > summary strong,
.zy-store-section > summary small {
    display: block;
}
.zy-store-section > summary strong {
    color: #101014;
    font-size: 12.5px;
    font-weight: 900;
}
.zy-store-section > summary small {
    color: #667085;
    font-size: 9.5px;
    font-weight: 650;
    margin-top: 2px;
}
.zy-store-section > summary > i {
    color: #98a2b3;
    font-size: 10px;
    text-align: center;
    transition: transform .18s ease;
}
.zy-store-section[open] > summary > i {
    transform: rotate(180deg);
}
.zy-store-section-body {
    border-top: 1px solid #edf2e9;
    padding: 11px;
}
.zy-store-section-body .zy-control,
.zy-store-section-body .zy-select select,
.zy-store-section-body .zy-file {
    border-radius: 12px;
    min-height: 48px;
}
.zy-store-section-body textarea.zy-control {
    min-height: 68px;
}
.zy-store-section-body .zy-switch--row {
    min-height: 48px;
}
.zy-store-page .zy-actionbar .zy-cta.has-changes {
    box-shadow: 0 0 0 3px rgba(138, 240, 0, .22), 0 12px 28px rgba(79, 176, 0, .22);
}

@media (max-width: 370px) {
    .zy-store-actions {
        grid-template-columns: 1fr;
    }
    .zy-store-checks span {
        font-size: 9px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .zy-store-panel.is-current,
    .zy-recharge-step-card.is-forward,
    .zy-recharge-step-card.is-back {
        animation: none;
    }
}

/* Shell estable: la aplicación no se desplaza; sólo el contenido central. */
html:has(body.zygo-pwa-order-page),
body.zygo-pwa-order-page {
    height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none;
}
body.zygo-pwa-order-page #app,
body.zygo-pwa-order-page #app > .section {
    height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
}
body.zygo-pwa-order-page .zy-app {
    height: 100%;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior-y: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}
body.zygo-pwa-order-page .zy-app::-webkit-scrollbar {
    display: none;
}
body.zygo-pwa-order-page .zy-head {
    background: rgba(245, 248, 242, .96);
    backdrop-filter: blur(12px);
    margin: 0 -4px;
    padding-left: 4px;
    padding-right: 4px;
    position: sticky;
    top: 0;
    z-index: 30;
}
.zy-recharge-page {
    overflow-x: hidden !important;
    overflow-y: auto !important;
}
.zy-map,
#pwaRouteMap,
#pwaRouteMap .gm-style {
    overscroll-behavior: contain;
    touch-action: none !important;
}

/* Crear envío · Paso 3
   Cierre del flujo con la misma jerarquía, superficies y acento de la PWA. */
.zy-order-create #zyStep3 {
    padding-bottom: 8px;
}

/* En el cierre no reservamos espacio de scroll ficticio: el contenido termina
   justo antes de la barra de acción y permanece completo dentro del viewport. */
.zy-order-create.is-step3 {
    overflow-y: hidden !important;
    padding-bottom: calc(124px + env(safe-area-inset-bottom)) !important;
}

.zy-order-create .zy-step3-intro {
    align-items: center;
    background: linear-gradient(135deg, #ffffff 0%, #f1fce9 100%);
    border: 1px solid #dcead5;
    border-radius: 18px;
    box-shadow: 0 10px 26px rgba(16, 24, 40, .055);
    display: none;
    gap: 12px;
    grid-template-columns: 46px minmax(0, 1fr);
    margin-bottom: 9px;
    padding: 13px;
}

.zy-order-create .zy-step3-intro-icon {
    align-items: center;
    background: #101014;
    border-radius: 14px;
    color: #b8ff68;
    display: inline-flex;
    font-size: 21px;
    height: 46px;
    justify-content: center;
    width: 46px;
}

.zy-order-create .zy-step3-eyebrow {
    color: #2f7d00;
    display: block;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .09em;
    line-height: 1;
    margin-bottom: 4px;
    text-transform: uppercase;
}

.zy-order-create .zy-step3-intro h2 {
    color: #101014;
    font-size: 17px;
    font-weight: 950;
    letter-spacing: -.025em;
    line-height: 1.05;
    margin: 0;
}

.zy-order-create .zy-step3-intro p {
    color: #667085;
    font-size: 10.5px;
    font-weight: 650;
    line-height: 1.35;
    margin: 4px 0 0;
}

.zy-order-create #zyStep3 .zy-step3-card,
.zy-order-create #zyStep3 .zy-step3-payment {
    border-color: #dfe9db;
    border-radius: 18px;
    box-shadow: 0 12px 30px rgba(16, 24, 40, .06);
    padding: 13px;
}

.zy-order-create #zyStep3 .zy-summary-head {
    margin-bottom: 10px;
}

.zy-order-create #zyStep3 .zy-summary-head h2 {
    font-size: 15px;
    letter-spacing: -.015em;
}

.zy-order-create #zyStep3 .zy-summary-kicker {
    letter-spacing: .07em;
    margin-bottom: 4px;
}

.zy-order-create #zyStep3 .zy-summary-ready {
    background: #effde8;
    border-color: #d2f2c0;
    min-height: 28px;
    padding: 0 9px;
}

.zy-order-create #zyStep3 .zy-summary-route,
.zy-order-create #zyStep3 .zy-summary-contact {
    background: #f8fbf6;
    border: 1px solid #e1eadd;
    border-radius: 15px;
    min-height: 54px;
    padding: 10px;
    transition: background .16s ease, border-color .16s ease, box-shadow .16s ease, transform .14s ease;
}

.zy-order-create #zyStep3 .zy-summary-route {
    gap: 10px;
    grid-template-columns: 16px minmax(0, 1fr) 32px;
}

.zy-order-create #zyStep3 .zy-summary-contact {
    margin-top: 7px;
}

.zy-order-create #zyStep3 .zy-summary-route:hover,
.zy-order-create #zyStep3 .zy-summary-contact:hover {
    background: #fff;
    border-color: #cfe5c2;
    box-shadow: 0 8px 20px rgba(16, 24, 40, .05);
}

.zy-order-create #zyStep3 .zy-summary-route:active,
.zy-order-create #zyStep3 .zy-summary-contact:active {
    opacity: 1;
    transform: scale(.985);
}

.zy-order-create #zyStep3 .zy-summary-route-rail {
    padding: 4px 0;
}

.zy-order-create #zyStep3 .zy-summary-route-rail b {
    border-left-color: #9ebc8e;
}

.zy-order-create #zyStep3 .zy-summary-route-copy {
    gap: 9px;
}

.zy-order-create #zyStep3 .zy-summary-stop small,
.zy-order-create #zyStep3 .zy-summary-contact small {
    color: #768178;
    font-size: 9px;
    letter-spacing: .045em;
}

.zy-order-create #zyStep3 .zy-summary-stop strong,
.zy-order-create #zyStep3 .zy-summary-contact strong {
    font-size: 12px;
    font-weight: 800;
}

.zy-order-create #zyStep3 .zy-summary-contact-icon {
    background: #effde8;
    border-color: #d9f7c9;
    color: #2f7d00;
}

.zy-order-create #zyStep3 .zy-summary-edit {
    background: #fff;
    border-color: #dfe9db;
    color: #2f7d00;
}

.zy-order-create #zyStep3 .zy-total {
    background:
        radial-gradient(circle at 84% 18%, rgba(138, 240, 0, .20), transparent 38%),
        linear-gradient(135deg, #101014 0%, #151b13 100%);
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 17px;
    box-shadow: 0 14px 28px rgba(16, 16, 20, .16);
    margin-top: 9px;
    min-height: 72px;
    padding: 12px 14px;
}

.zy-order-create #zyStep3 .zy-total .item span {
    align-items: center;
    display: flex;
    gap: 5px;
}

.zy-order-create #zyStep3 .zy-total .item span .zygo-vector-icon,
.zy-order-create #zyStep3 .zy-total .item span > i {
    color: #b8ff68;
    font-size: 12px;
}

.zy-order-create #zyStep3 .zy-total .item strong {
    font-size: 14px;
}

.zy-order-create #zyStep3 .zy-total .item.price strong {
    color: #b8ff68;
    font-size: 23px;
}

.zy-order-create .zy-step3-payment-head {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: 40px minmax(0, 1fr) auto;
    margin-bottom: 11px;
}

.zy-order-create .zy-step3-payment-icon {
    align-items: center;
    background: #effde8;
    border: 1px solid #d9f7c9;
    border-radius: 12px;
    color: #2f7d00;
    display: inline-flex;
    font-size: 18px;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.zy-order-create .zy-step3-payment-head > div > span {
    color: #2f7d00;
    display: block;
    font-size: 8.5px;
    font-weight: 900;
    letter-spacing: .08em;
    margin-bottom: 3px;
    text-transform: uppercase;
}

.zy-order-create .zy-step3-payment-head h2 {
    color: #101014;
    font-size: 14px;
    font-weight: 950;
    line-height: 1.1;
    margin: 0;
}

.zy-order-create .zy-step3-secure {
    align-items: center;
    background: #f5f8f2;
    border: 1px solid #e1e9dd;
    border-radius: 999px;
    color: #59655d;
    display: inline-flex;
    font-size: 9px;
    font-weight: 850;
    gap: 5px;
    min-height: 28px;
    padding: 0 8px;
}

.zy-order-create #zyStep3 .zygo-payment-grid #divPaymentMethods {
    gap: 7px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.zy-order-create #zyStep3 .zygo-payment-grid #divPaymentMethods > :only-child,
.zy-order-create #zyStep3 .zygo-payment-grid #divPaymentMethods > :last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard {
    background: #f8fbf6;
    border-color: #dfe9db;
    border-radius: 14px;
    gap: 10px;
    grid-template-columns: 38px minmax(0, 1fr) 22px;
    min-height: 58px;
    padding: 9px 10px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard:hover {
    border-color: #bcdbaa;
    box-shadow: 0 8px 20px rgba(16, 24, 40, .05);
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard.is-selected {
    background: #101014;
    border-color: #101014;
    box-shadow: 0 12px 24px rgba(16, 16, 20, .14);
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodIcon {
    background: #fff;
    border-radius: 11px;
    height: 38px;
    width: 38px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodText strong {
    font-size: 12.5px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCheck {
    height: 22px;
    width: 22px;
}

.zy-order-create .zy-step3-payment-note {
    align-items: flex-start;
    color: #667085;
    display: flex;
    font-size: 9.5px;
    font-weight: 650;
    gap: 6px;
    line-height: 1.35;
    margin: 10px 1px 0;
}

.zy-order-create .zy-step3-payment-note .zygo-vector-icon,
.zy-order-create .zy-step3-payment-note > i {
    color: #2f7d00;
    flex: 0 0 auto;
    font-size: 13px;
    margin-top: 1px;
}

.zy-order-create #zyStep3 .zy-summary-route:focus-visible,
.zy-order-create #zyStep3 .zy-summary-contact:focus-visible,
.zy-order-create #zyStep3 .paymentMethodCard:focus-visible {
    outline: 3px solid rgba(76, 152, 11, .28);
    outline-offset: 2px;
}

@media (max-width: 370px) {
    .zy-order-create .zy-step3-intro {
        grid-template-columns: 42px minmax(0, 1fr);
        padding: 11px;
    }
    .zy-order-create .zy-step3-intro-icon {
        height: 42px;
        width: 42px;
    }
    .zy-order-create .zy-step3-secure {
        font-size: 8px;
        padding: 0 6px;
    }
    .zy-order-create #zyStep3 .zy-total .item.price strong {
        font-size: 20px;
    }
}

@media (max-height: 760px) {
    .zy-order-create .zy-step3-intro {
        display: none;
    }
    .zy-order-create .zy-step3-intro p,
    .zy-order-create .zy-step3-payment-note {
        display: none;
    }
    .zy-order-create #zyStep3 .zy-step3-card,
    .zy-order-create #zyStep3 .zy-step3-payment {
        padding: 11px;
    }
    .zy-order-create #zyStep3 .zy-summary-route,
    .zy-order-create #zyStep3 .zy-summary-contact {
        padding-bottom: 6px;
        padding-top: 6px;
    }
    .zy-order-create #zyStep3 .zy-summary-route-copy {
        gap: 6px;
    }
    .zy-order-create #zyStep3 .zy-summary-contact {
        margin-top: 5px;
        min-height: 50px;
    }
    .zy-order-create #zyStep3 .zy-total {
        margin-top: 6px;
        min-height: 58px;
        padding-bottom: 7px;
        padding-top: 7px;
    }
    .zy-order-create .zy-step3-payment-head {
        margin-bottom: 7px;
    }
    .zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard {
        min-height: 54px;
        padding-bottom: 7px;
        padding-top: 7px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .zy-cta-icon.is-spinning .zygo-icon-svg {
        animation-duration: 1.5s !important;
    }
}

/* Crear envío · bandeja de ruta minimizable */
.zy-order-create .zy-route-panel {
    margin-bottom: 24px;
    overflow: visible;
    padding-bottom: 34px !important;
    position: relative;
}

.zy-order-create .zy-route-minimize {
    align-items: center;
    background: #101014;
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: 999px;
    bottom: 0;
    box-shadow: 0 10px 24px rgba(16, 16, 20, .22);
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 10.5px;
    font-weight: 900;
    gap: 7px;
    justify-content: center;
    left: 50%;
    min-height: 40px;
    min-width: 148px;
    padding: 0 14px;
    position: absolute;
    touch-action: manipulation;
    transform: translate(-50%, 50%);
    transition: background .16s ease, box-shadow .16s ease, transform .16s cubic-bezier(.22, 1, .36, 1);
    white-space: nowrap;
    width: 148px;
    z-index: 18;
}

.zy-order-create .zy-route-minimize:hover {
    background: #1d2519;
    box-shadow: 0 12px 28px rgba(16, 16, 20, .28);
}

.zy-order-create .zy-route-minimize:active {
    transform: translate(-50%, 50%) scale(.97);
}

.zy-order-create .zy-route-minimize:focus-visible {
    outline: 3px solid rgba(138, 240, 0, .34);
    outline-offset: 3px;
}

.zy-order-create .zy-route-minimize-icon {
    align-items: center;
    color: #a8f75e;
    display: inline-flex;
    font-size: 16px;
    height: 18px;
    justify-content: center;
    width: 18px;
}

.zy-order-create #zyStep1.is-route-minimized .zy-route-panel [data-zygo-route-extra] {
    display: none !important;
}

.zy-order-create #zyStep1.is-route-minimized .zy-route-panel {
    padding-bottom: 34px !important;
}

.zy-order-create #zyStep1.is-route-minimized .zy-route-fields {
    gap: 4px;
}

.zy-order-create #zyStep1.is-route-minimized .zy-route-rail {
    padding-bottom: 8px;
    padding-top: 15px;
}

.zy-order-create #zyStep1.is-route-minimized .zy-map,
.zy-order-create #zyStep1.is-route-minimized .zy-map-card {
    height: clamp(330px, 52dvh, 480px);
    min-height: clamp(330px, 52dvh, 480px);
}

/* Paso 3 · pago compacto, táctil y alineado al lenguaje PWA */
.zy-order-create #zyStep3 .zy-step3-payment {
    background: #fff;
    border: 1px solid #dfe9db;
    border-radius: 22px;
    box-shadow: 0 12px 30px rgba(16, 24, 40, .06);
    padding: 14px;
}

.zy-order-create #zyStep3 .zy-step3-payment-head {
    gap: 12px;
    grid-template-columns: 44px minmax(0, 1fr);
    margin-bottom: 12px;
}

.zy-order-create #zyStep3 .zy-step3-payment-icon {
    background: #eff8e9;
    border-color: transparent;
    border-radius: 14px;
    font-size: 20px;
    height: 44px;
    width: 44px;
}

.zy-order-create #zyStep3 .zy-step3-payment-head h2 {
    font-size: 18px;
    letter-spacing: -.025em;
}

.zy-order-create #zyStep3 .zygo-payment-grid #divPaymentMethods {
    gap: 8px;
    grid-template-columns: 1fr;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard,
.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard.is-selected {
    background: #f8fbf6;
    border: 1px solid #dfe9db;
    border-radius: 18px;
    box-sizing: border-box;
    box-shadow: none;
    color: #101014;
    gap: 11px;
    grid-template-columns: 24px 42px minmax(0, 1fr);
    min-height: 68px;
    padding: 9px 12px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard.is-selected {
    background: #f1faeb;
    border-color: #72cc34;
    box-shadow: 0 0 0 3px rgba(114, 204, 52, .12);
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodIcon {
    background: rgba(255, 255, 255, .7);
    border-radius: 12px;
    grid-column: 2;
    grid-row: 1;
    height: 42px;
    width: 42px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodIcon img {
    max-height: 24px;
    max-width: 28px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodText strong {
    color: #101014;
    font-size: 14px;
    line-height: 1.1;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodText small {
    color: #78827a;
    font-size: 10px;
    margin-top: 4px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCheck,
.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard.is-selected .paymentMethodCheck {
    background: #fff;
    border: 2px solid #79a65b;
    color: transparent;
    display: inline-flex;
    font-size: 0;
    grid-column: 1;
    grid-row: 1;
    height: 20px;
    position: relative;
    width: 20px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCheck::after {
    background: #63c600;
    border-radius: 50%;
    content: "";
    height: 10px;
    opacity: 0;
    transform: scale(.45);
    transition: opacity .16s ease, transform .16s ease;
    width: 10px;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard.is-selected .paymentMethodCheck {
    border-color: #3f8310;
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard.is-selected .paymentMethodCheck::after {
    opacity: 1;
    transform: scale(1);
}

.zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodText {
    grid-column: 3;
    grid-row: 1;
}

.zy-order-create #zyStep3 .zy-step3-payment-note {
    display: none;
}

@media (max-height: 720px) {
    .zy-order-create #zyStep1.is-route-minimized .zy-map,
    .zy-order-create #zyStep1.is-route-minimized .zy-map-card {
        height: clamp(270px, 43dvh, 340px);
        min-height: clamp(270px, 43dvh, 340px);
    }
    .zy-order-create #zyStep3 .zy-step3-payment {
        border-radius: 17px;
        padding: 9px 10px;
    }
    .zy-order-create #zyStep3 .zy-step3-payment-head {
        grid-template-columns: 34px minmax(0, 1fr);
        margin-bottom: 7px;
    }
    .zy-order-create #zyStep3 .zy-step3-payment-icon {
        border-radius: 10px;
        font-size: 16px;
        height: 34px;
        width: 34px;
    }
    .zy-order-create #zyStep3 .zy-step3-payment-head h2 {
        font-size: 14px;
    }
    .zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard,
    .zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodCard.is-selected {
        border-radius: 14px;
        grid-template-columns: 20px 34px minmax(0, 1fr);
        min-height: 52px;
        padding: 6px 9px;
    }
    .zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodIcon {
        border-radius: 10px;
        height: 34px;
        width: 34px;
    }
    .zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodText strong {
        font-size: 12px;
    }
    .zy-order-create #zyStep3 .zygo-payment-grid .paymentMethodText small {
        font-size: 8.5px;
        margin-top: 2px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .zy-order-create .zy-route-minimize {
        transition: none !important;
    }
}

/* Login PWA · una sola pantalla, sin desplazamiento y adaptable por altura. */
html:has(body.zygo-pwa-login-page),
body.zygo-pwa-login-page {
    height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    overscroll-behavior: none;
}

/* Marketplace PWA · descubrimiento comercial y acceso separado a Mi negocio */
.zy-market {
    padding-bottom: calc(112px + env(safe-area-inset-bottom));
}

.zy-market-hero {
    background: #101014;
    border-radius: 24px;
    color: #fff;
    margin: 14px 0 12px;
    overflow: hidden;
    padding: 22px 20px 18px;
    position: relative;
}

.zy-market-hero::after {
    background: #8af000;
    border-radius: 999px;
    content: "";
    filter: blur(1px);
    height: 92px;
    opacity: .16;
    position: absolute;
    right: -34px;
    top: -34px;
    width: 92px;
}

.zy-market-kicker {
    align-items: center;
    color: #c8ff7a;
    display: inline-flex;
    font-size: 10px;
    font-weight: 900;
    gap: 6px;
    letter-spacing: .09em;
    text-transform: uppercase;
}

.zy-market-kicker .zygo-vector-icon,
.zy-market-kicker i {
    height: 15px;
    width: 15px;
}

.zy-market-hero h1 {
    color: #fff;
    font-size: clamp(25px, 7vw, 32px);
    font-weight: 950;
    letter-spacing: -.045em;
    line-height: 1.02;
    margin: 12px 0 9px;
    max-width: 340px;
}

.zy-market-hero > p {
    color: rgba(255,255,255,.72);
    font-size: 12.5px;
    font-weight: 650;
    line-height: 1.5;
    margin: 0;
    max-width: 350px;
}

.zy-market-business-link {
    align-items: center;
    background: rgba(255,255,255,.09);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 16px;
    color: #fff !important;
    display: grid;
    gap: 10px;
    grid-template-columns: 34px minmax(0,1fr) 18px;
    margin-top: 16px;
    min-height: 58px;
    padding: 9px 11px;
    text-decoration: none !important;
}

.zy-market-business-link > .zygo-vector-icon:first-child,
.zy-market-business-link > i:first-child {
    background: #8af000;
    border-radius: 10px;
    color: #101014;
    height: 34px;
    padding: 8px;
    width: 34px;
}

.zy-market-business-link strong,
.zy-market-business-link small {
    display: block;
}

.zy-market-business-link strong { font-size: 12.5px; font-weight: 900; }
.zy-market-business-link small { color: rgba(255,255,255,.64); font-size: 9.5px; font-weight: 650; margin-top: 2px; }
.zy-market-business-link > .zygo-vector-icon:last-child,
.zy-market-business-link > i:last-child { color: #c8ff7a; height: 18px; width: 18px; }

.zy-market-search {
    align-items: center;
    background: #fff;
    border: 1px solid #dfe9db;
    border-radius: 17px;
    box-shadow: 0 10px 24px rgba(16,24,40,.055);
    display: grid;
    gap: 10px;
    grid-template-columns: 20px minmax(0,1fr) auto;
    margin: 12px 0;
    min-height: 54px;
    padding: 0 14px;
}

.zy-market-search > .zygo-vector-icon,
.zy-market-search > i { color: #536158; height: 19px; width: 19px; }
.zy-market-search input { background: transparent; border: 0; color: #101014; font-size: 16px; font-weight: 700; min-width: 0; outline: 0; width: 100%; }
.zy-market-search input::placeholder { color: #98a2b3; }
.zy-market-search a { align-items: center; color: #667085; display: inline-flex; height: 42px; justify-content: center; width: 42px; }

.zy-market-categories {
    display: flex;
    gap: 8px;
    margin: 0 -16px 16px;
    overflow-x: auto;
    padding: 0 16px 4px;
    scrollbar-width: none;
}

.zy-market-categories::-webkit-scrollbar { display: none; }
.zy-market-categories a { align-items: center; background: #fff; border: 1px solid #dfe9db; border-radius: 18px; color: #536158; display: inline-flex; flex: 0 0 86px; flex-direction: column; font-size: 11px; font-weight: 850; gap: 3px; justify-content: center; min-height: 94px; padding: 7px 8px 9px; text-decoration: none !important; }
.zy-market-categories a img { display: block; height: 58px; object-fit: contain; pointer-events: none; width: 58px; }
.zy-market-categories a span { display: block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zy-market-categories a.is-active { background: #101014; border-color: #101014; color: #c8ff7a; }
.zy-market-filters { display:flex; gap:7px; margin:9px -16px 0; overflow-x:auto; padding:3px 16px 7px; scrollbar-width:none; }
.zy-market-filters::-webkit-scrollbar { display:none; }
.zy-market-filters a { align-items:center; background:#fff; border:1px solid #dfe7dc; border-radius:999px; color:#536158; display:inline-flex; flex:0 0 auto; font-size:10px; font-weight:800; gap:6px; min-height:40px; padding:0 12px; text-decoration:none!important; }
.zy-market-filters a.is-active { background:#101014; border-color:#101014; color:#c8ff7a; }
.zy-market-filters a .zygo-vector-icon,.zy-market-filters a i { height:14px; width:14px; }

.zy-market-section-head {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    margin: 4px 1px 11px;
}

.zy-market-section-head div > span { color: #2f7d00; display: block; font-size: 9px; font-weight: 900; letter-spacing: .08em; margin-bottom: 2px; text-transform: uppercase; }
.zy-market-section-head h2 { color: #101014; font-size: 18px; font-weight: 950; letter-spacing: -.025em; margin: 0; }
.zy-market-section-head > span { background: #eaf7e3; border-radius: 999px; color: #2f7d00; font-size: 10px; font-weight: 900; padding: 5px 9px; }

.zy-market-grid { display: grid; gap: 12px; }
.zy-market-card { background: #fff; border: 1px solid #dfe9db; border-radius: 20px; box-shadow: 0 10px 24px rgba(16,24,40,.05); overflow: hidden; position: relative; }
.zy-market-card.is-unavailable .zy-market-card-cover > img:not(.zy-market-card-logo) { filter:saturate(.68); opacity:.82; }
.zy-market-card-cover { background: #edf3e9; display: block; height: 138px; overflow: hidden; position: relative; }
.zy-market-card-cover > img:not(.zy-market-card-logo) { height: 100%; object-fit: cover; width: 100%; }
.zy-market-card-cover > span { align-items: center; color: #9aaa9f; display: flex; height: 100%; justify-content: center; }
.zy-market-card-cover > span .zygo-vector-icon,
.zy-market-card-cover > span i { height: 38px; width: 38px; }
.zy-market-card-logo { background: #fff; border: 3px solid #fff; border-radius: 14px; bottom: 10px; box-shadow: 0 7px 18px rgba(16,24,40,.16); height: 48px; left: 12px; object-fit: cover; position: absolute; width: 48px; }
.zy-market-card-share { align-items: center; -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); background: rgba(255,255,255,.94); border: 1px solid rgba(218,226,214,.96); border-radius: 13px; box-shadow: 0 8px 20px rgba(16,24,40,.16); color: #101014; cursor: pointer; display: inline-flex; height: 44px; justify-content: center; padding: 0; position: absolute; right: 10px; top: 10px; width: 44px; z-index: 3; }
.zy-market-card-share:hover { background: #8af000; border-color: #8af000; }
.zy-market-card-share:focus-visible { outline: 3px solid rgba(138,240,0,.45); outline-offset: 2px; }
.zy-market-card-share .zygo-vector-icon,
.zy-market-card-share i { height: 18px; width: 18px; }
.zy-market-card-favorite { align-items:center; backdrop-filter:blur(10px); background:rgba(255,255,255,.94); border:1px solid rgba(218,226,214,.96); border-radius:13px; box-shadow:0 8px 20px rgba(16,24,40,.16); color:#536158; cursor:pointer; display:inline-flex; height:44px; justify-content:center; padding:0; position:absolute; right:62px; top:10px; width:44px; z-index:3; }
.zy-market-card-favorite.is-favorite { background:#effde8; border-color:#caeeb8; color:#397f00; }
.zy-market-card-favorite .zygo-vector-icon,.zy-market-card-favorite i { height:18px; width:18px; }
.zy-market-card-body { padding: 13px; }
.zy-market-card-title { align-items: flex-start; display: flex; gap: 10px; justify-content: space-between; }
.zy-market-card-title h3 { color: #101014; font-size: 15px; font-weight: 950; letter-spacing: -.02em; margin: 0; }
.zy-market-card-title p { color: #7b877f; font-size: 10px; font-weight: 650; margin: 3px 0 0; }
.zy-market-card-title > span { align-items: center; background: #effde8; border-radius: 999px; color: #2f7d00; display: inline-flex; flex: 0 0 auto; font-size: 10px; font-weight: 900; gap: 4px; min-height: 27px; padding: 5px 8px; }
.zy-market-card-title > span .zygo-vector-icon,
.zy-market-card-title > span i { fill: currentColor; height: 12px; width: 12px; }
.zy-market-card-title > span.is-new { background: #eef1f4; color: #536158; }
.zy-market-status { align-items:center; align-self:flex-start; background:#effbe9; border:1px solid #d7ecca; border-radius:999px; color:#397b1c; display:inline-flex; font-size:9.5px; font-weight:800; gap:5px; margin-top:9px; min-height:27px; padding:4px 8px; }
.zy-market-status .zygo-vector-icon,.zy-market-status i { height:12px; width:12px; }
.zy-market-status.is-warning { background:#fff7e8; border-color:#f0d6aa; color:#8b5b0c; }
.zy-market-status.is-muted { background:#f2f4f3; border-color:#dfe4e1; color:#68746d; }
.zy-market-card-meta { display: flex; flex-wrap: wrap; gap: 6px; margin: 11px 0; }
.zy-market-card-meta span { align-items: center; color: #536158; display: inline-flex; font-size: 9.5px; font-weight: 750; gap: 5px; }
.zy-market-card-meta .zygo-vector-icon,
.zy-market-card-meta i { color: #2f7d00; height: 13px; width: 13px; }
.zy-market-card-cta { align-items: center; background: #101014; border-radius: 12px; color: #fff !important; display: flex; font-size: 11.5px; font-weight: 900; justify-content: space-between; min-height: 43px; padding: 0 13px; text-decoration: none !important; }
.zy-market-card-cta .zygo-vector-icon,
.zy-market-card-cta i { color: #c8ff7a; height: 16px; width: 16px; }

.zy-market-empty { background: #fff; border: 1px dashed #cad7cc; border-radius: 20px; padding: 40px 20px; text-align: center; }
.zy-market-empty > .zygo-vector-icon,
.zy-market-empty > i { color: #91a097; height: 36px; width: 36px; }
.zy-market-empty h2 { color: #101014; font-size: 17px; font-weight: 950; margin: 12px 0 4px; }
.zy-market-empty p { color: #667085; font-size: 12px; line-height: 1.45; margin: 0 0 14px; }
.zy-market-empty a { color: #2f7d00; font-size: 12px; font-weight: 900; }
.zy-market-pagination { margin-top: 18px; }

@media (min-width: 520px) {
    .zy-market-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    .zy-market-card,
    .zy-market-business-link { transition: none !important; }
}

body.zygo-pwa-login-page #app,
body.zygo-pwa-login-page #app > .section {
    height: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

.zy-login-shell {
    box-sizing: border-box;
    display: grid;
    grid-template-rows: clamp(138px, 29dvh, 238px) minmax(0, 1fr);
    height: 100dvh !important;
    max-height: 100dvh !important;
    min-height: 0 !important;
    overflow: hidden !important;
    padding: 0 16px calc(8px + env(safe-area-inset-bottom)) !important;
}

.zy-login-shell .zy-login-photo {
    border-radius: 0 0 24px 24px;
    box-sizing: border-box;
    height: 100%;
    margin: 0 -16px;
    min-height: 0;
    padding: calc(58px + env(safe-area-inset-top)) 20px 22px;
}

.zy-login-shell .zy-login-photo > img {
    object-position: 50% 54%;
}

.zy-login-shell .zy-login-photo:after {
    background: linear-gradient(180deg, rgba(7, 10, 8, .62) 0%, rgba(7, 10, 8, .10) 38%, rgba(7, 10, 8, .91) 100%);
}

.zy-login-shell .zy-login-photo-brand {
    left: 18px;
    top: calc(14px + env(safe-area-inset-top));
}

.zy-login-shell .zy-login-photo-brand img {
    width: clamp(78px, 24vw, 94px);
}

.zy-login-shell .zy-login-photo .inner {
    width: min(100%, 340px);
}

.zy-login-shell .zy-login-photo h1 {
    font-size: clamp(20px, 6.4vw, 27px);
    line-height: 1.04;
    margin-top: 7px;
}

.zy-login-shell .zy-login-photo p {
    font-size: 11px;
    line-height: 1.35;
    margin-top: 5px;
}

.zy-login-shell .zy-login-photo .zy-hero-pill {
    font-size: 8.5px;
    min-height: 25px;
    padding: 5px 8px;
}

.zy-login-shell .zy-login-hero-status {
    gap: 6px;
    margin-top: 7px;
}

.zy-login-shell .zy-login-photo .zy-login-hero-status span {
    font-size: 8px;
    min-height: 24px;
    padding: 4px 7px;
}

.zy-login-shell .zy-login-card {
    align-self: center;
    border-radius: 20px;
    box-sizing: border-box;
    margin: -24px 0 0;
    max-height: calc(100% + 24px);
    overflow: hidden;
    padding: clamp(12px, 2dvh, 17px) 16px;
    width: 100%;
}

.zy-login-shell .zy-login-title {
    font-size: clamp(19px, 5.4vw, 22px);
    line-height: 1.05;
    margin-bottom: 3px;
}

.zy-login-shell .zy-login-sub {
    font-size: 11px;
    line-height: 1.3;
    margin-bottom: clamp(8px, 1.4dvh, 12px);
}

.zy-login-shell .zy-field {
    margin-bottom: clamp(5px, 1dvh, 8px);
}

.zy-login-shell .zy-field label {
    font-size: 9px;
    letter-spacing: .025em;
    margin-bottom: 3px;
}

.zy-login-shell .zy-input {
    border-radius: 12px;
    min-height: clamp(42px, 6.2dvh, 48px);
    padding: 0 11px;
}

.zy-login-shell .zy-input input {
    font-size: 16px;
    padding: 9px 0;
}

.zy-login-shell .zy-eye {
    align-items: center;
    display: inline-flex;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.zy-login-shell .zy-login-remember {
    font-size: 10.5px;
    margin: 4px 2px clamp(7px, 1.2dvh, 11px);
    min-height: 24px;
}

.zy-login-shell .zy-login-error {
    font-size: 10.5px;
    margin-bottom: 7px;
    padding: 7px 9px;
}

.zy-login-shell .has-login-error .zy-login-sub {
    display: none;
}

.zy-login-shell .zy-btn-primary {
    border-radius: 13px;
    min-height: clamp(44px, 6.4dvh, 48px);
}

.zy-login-shell .zy-login-links {
    gap: 16px;
    margin-top: clamp(7px, 1.2dvh, 10px);
}

.zy-login-shell .zy-login-links a {
    font-size: 11.5px;
}

@media (max-height: 650px) {
    .zy-login-shell {
        grid-template-rows: clamp(104px, 25dvh, 148px) minmax(0, 1fr);
    }
    .zy-login-shell .zy-login-photo {
        padding-bottom: 15px;
        padding-top: calc(46px + env(safe-area-inset-top));
    }
    .zy-login-shell .zy-login-photo p,
    .zy-login-shell .zy-login-hero-status {
        display: none;
    }
    .zy-login-shell .zy-login-photo h1 {
        font-size: clamp(18px, 5.5vw, 22px);
        margin-top: 5px;
    }
    .zy-login-shell .zy-login-card {
        margin-top: -18px;
        max-height: calc(100% + 18px);
        padding-bottom: 11px;
        padding-top: 11px;
    }
}

@media (max-height: 520px) {
    .zy-login-shell {
        grid-template-rows: 82px minmax(0, 1fr);
        padding-bottom: calc(4px + env(safe-area-inset-bottom)) !important;
    }
    .zy-login-shell .zy-login-photo {
        padding: calc(38px + env(safe-area-inset-top)) 16px 8px;
    }
    .zy-login-shell .zy-login-photo-brand {
        top: calc(8px + env(safe-area-inset-top));
    }
    .zy-login-shell .zy-login-photo-brand span,
    .zy-login-shell .zy-login-photo .inner {
        display: none;
    }
    .zy-login-shell .zy-login-card {
        margin-top: -12px;
        max-height: calc(100% + 12px);
        padding: 9px 13px;
    }
    .zy-login-shell .zy-login-sub {
        display: none;
    }
    .zy-login-shell .zy-login-title {
        font-size: 18px;
        margin-bottom: 5px;
    }
    .zy-login-shell .zy-field {
        margin-bottom: 4px;
    }
    .zy-login-shell .zy-input {
        min-height: 40px;
    }
    .zy-login-shell .zy-login-remember {
        margin-bottom: 5px;
        margin-top: 2px;
    }
    .zy-login-shell .zy-btn-primary {
        min-height: 42px;
    }
    .zy-login-shell .zy-login-links {
        margin-top: 5px;
    }
}

@media (max-height: 410px) {
    .zy-login-shell .zy-login-remember {
        display: none;
    }
    .zy-login-shell .zy-field label {
        margin-bottom: 1px;
    }
    .zy-login-shell .zy-login-links a {
        font-size: 10.5px;
    }
}

/* Crear envío · viewport fijo y mapa completamente táctil. */
body.zygo-pwa-order-page .zy-order-create--fixed {
    box-sizing: border-box;
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    overflow: hidden !important;
    overscroll-behavior: none;
}

.zy-order-create--fixed #zygoPwaOrderForm {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.zy-order-create--fixed .zy-step.is-current {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.zy-order-create--fixed #zyStep1.is-current {
    display: flex;
    flex-direction: column;
}

.zy-order-create--fixed #zyStep1 > .zy-step-hint,
.zy-order-create--fixed #zyStep1 > .zy-api-status,
.zy-order-create--fixed #zyStep1 > .zy-route-panel {
    flex: 0 0 auto;
}

.zy-order-create--fixed #zyStep1 > .zy-map-card {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    height: auto !important;
    margin-bottom: 0;
    min-height: 96px !important;
    overflow: hidden !important;
}

.zy-order-create--fixed #zyStep1 > .zy-map-card .zy-map {
    flex: 1 1 auto;
    height: 100% !important;
    min-height: 0 !important;
}

.zy-order-create--fixed .zy-route-minimize {
    min-height: 44px;
}

.zy-map-zoom {
    align-items: center;
    background: rgba(255, 255, 255, .96);
    border: 1px solid rgba(16, 24, 40, .14);
    border-radius: 16px;
    box-shadow: 0 12px 28px rgba(16, 24, 40, .2);
    display: grid;
    grid-template-columns: 46px 1px 46px;
    overflow: hidden;
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 8;
}

.zy-map-zoom > span {
    background: #dfe6dc;
    height: 28px;
    width: 1px;
}

.zy-map-zoom button {
    align-items: center;
    background: transparent;
    border: 0;
    color: #101014;
    cursor: pointer;
    display: inline-flex;
    height: 46px;
    justify-content: center;
    padding: 0;
    touch-action: manipulation;
    transition: background .14s ease, color .14s ease, transform .12s ease;
    width: 46px;
}

.zy-map-zoom button:hover {
    background: #f2faec;
    color: #2f7d00;
}

.zy-map-zoom button:active {
    background: #e9f8df;
    transform: scale(.92);
}

.zy-map-zoom button:focus-visible {
    outline: 3px solid rgba(47, 125, 0, .24);
    outline-offset: -3px;
}

.zy-map-zoom button:disabled {
    color: #98a2b3;
    cursor: wait;
    opacity: .58;
    transform: none;
}

.zy-map-zoom .zygo-icon-svg,
.zy-map-zoom button > i {
    height: 21px;
    stroke-width: 2.5;
    width: 21px;
}

@media (max-height: 650px) {
    .zy-order-create--fixed #zyStep1 .zy-address-state,
    .zy-order-create--fixed #zyStep1 .zy-switch--pickup {
        display: none;
    }

    .zy-order-create--fixed #zyStep1 .zy-address-share {
        min-height: 44px;
        padding-top: 4px;
    }

    .zy-order-create--fixed #zyStep1 .zy-route-tools {
        margin-top: 3px;
    }

    .zy-order-create--fixed #zyStep1 > .zy-map-card {
        min-height: 88px !important;
    }

    .zy-map-zoom {
        right: 8px;
        top: 8px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .zy-map-zoom button {
        transition: none !important;
    }
}

/* Mi tienda · operación móvil y contratación transparente. */
.zy-store-business-strip {
    display: grid;
    gap: 8px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 10px 0 12px;
}
.zy-store-business-strip > div {
    background: #f6f8f4;
    border: 1px solid #e5eade;
    border-radius: 14px;
    min-width: 0;
    padding: 11px 9px;
}
.zy-store-business-strip span,
.zy-store-business-strip strong { display: block; }
.zy-store-business-strip span { color: #667085; font-size: 10px; font-weight: 800; line-height: 1.2; }
.zy-store-business-strip strong { color: #111318; font-size: 16px; font-weight: 950; margin-top: 4px; }
.zy-store-tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.zy-store-tabs button { min-width: 0; position: relative; }
.zy-store-tabs button b {
    align-items: center; background: #101014; border: 2px solid #fff; border-radius: 999px; color: #fff;
    display: inline-flex; font-size: 9px; height: 18px; justify-content: center; min-width: 18px; padding: 0 4px;
    position: absolute; right: 7px; top: 5px;
}
.zy-store-publish,
.zy-store-contract-link,
.zy-store-pos-separate {
    align-items: center; background: #101014; border: 1px solid #232329; border-radius: 18px; color: #fff;
    display: flex; gap: 12px; margin: 12px 0; min-height: 66px; padding: 12px 14px; text-decoration: none;
}
.zy-store-publish > div,
.zy-store-contract-link > span,
.zy-store-pos-separate > span { flex: 1; min-width: 0; }
.zy-store-publish span,
.zy-store-publish strong,
.zy-store-contract-link strong,
.zy-store-contract-link small,
.zy-store-pos-separate strong,
.zy-store-pos-separate small { display: block; }
.zy-store-publish span,
.zy-store-contract-link small,
.zy-store-pos-separate small { color: #b7bec8; font-size: 11px; font-weight: 750; line-height: 1.3; }
.zy-store-publish strong,
.zy-store-contract-link strong,
.zy-store-pos-separate strong { color: #fff; font-size: 13px; font-weight: 900; }
.zy-store-publish button {
    align-items: center; background: #8af000; border: 0; border-radius: 999px; color: #122000; display: inline-flex;
    font-size: 12px; font-weight: 950; gap: 6px; min-height: 40px; padding: 0 13px;
}
.zy-store-publish button.is-live { background: #fff; color: #101014; }
.zy-store-publish svg,
.zy-store-contract-link svg,
.zy-store-pos-separate svg { height: 20px; width: 20px; }
.zy-store-mobile-panel-head { align-items: flex-end; display: flex; justify-content: space-between; margin: 6px 2px 14px; }
.zy-store-mobile-panel-head span { color: #667085; display: block; font-size: 11px; font-weight: 850; text-transform: uppercase; }
.zy-store-mobile-panel-head h2 { color: #101014; font-size: 26px; font-weight: 950; margin: 2px 0 0; }
.zy-store-mobile-panel-head b { background: #ecfbdc; border-radius: 999px; color: #315f0b; font-size: 11px; padding: 7px 10px; }
.zy-store-mobile-list,
.zy-store-mobile-products { display: grid; gap: 10px; }
.zy-store-mobile-order,
.zy-store-mobile-products > article {
    background: #fff; border: 1px solid #e6e9e1; border-radius: 18px; box-shadow: 0 8px 22px rgba(16, 24, 40, .045); padding: 14px;
}
.zy-store-mobile-order header,
.zy-store-mobile-order footer { align-items: center; display: flex; justify-content: space-between; gap: 10px; }
.zy-store-mobile-order header strong,
.zy-store-mobile-order header span { display: block; }
.zy-store-mobile-order header strong { font-size: 14px; font-weight: 950; }
.zy-store-mobile-order header span,
.zy-store-mobile-order footer span { color: #667085; font-size: 11px; }
.zy-store-mobile-order header em { background: #f0f4ed; border-radius: 999px; color: #344054; font-size: 10px; font-style: normal; font-weight: 850; padding: 6px 9px; }
.zy-store-mobile-order-items { border-bottom: 1px solid #edf0e9; border-top: 1px solid #edf0e9; display: grid; gap: 3px; margin: 11px 0; padding: 9px 0; }
.zy-store-mobile-order-items span { color: #475467; font-size: 12px; font-weight: 700; }
.zy-store-order-primary,
.zy-store-product-submit {
    align-items: center; background: #101014; border: 0; border-radius: 12px; color: #fff; display: flex; font-size: 12px;
    font-weight: 900; gap: 7px; justify-content: center; margin-top: 11px; min-height: 42px; width: 100%;
}
.zy-store-mobile-products > article { align-items: center; display: flex; gap: 11px; }
.zy-store-mobile-products img { background: #f2f5ef; border-radius: 12px; height: 54px; object-fit: cover; width: 54px; }
.zy-store-mobile-products article > div { flex: 1; min-width: 0; }
.zy-store-mobile-products strong,
.zy-store-mobile-products span,
.zy-store-mobile-products small { display: block; }
.zy-store-mobile-products strong { font-size: 13px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zy-store-mobile-products span,
.zy-store-mobile-products small { color: #667085; font-size: 10px; margin-top: 2px; }
.zy-store-mobile-products form button { align-items: center; background: #f1f4ee; border: 0; border-radius: 999px; color: #344054; display: flex; height: 38px; justify-content: center; width: 38px; }
.zy-store-advanced-link { align-items: center; color: #355d14; display: flex; font-size: 12px; font-weight: 900; gap: 7px; justify-content: center; margin: 15px 0 5px; text-decoration: none; }
.zy-store-mobile-empty { align-items: center; background: #f7f9f5; border: 1px dashed #d8ded2; border-radius: 18px; color: #667085; display: flex; flex-direction: column; padding: 28px 18px; text-align: center; }
.zy-store-mobile-empty svg { color: #667085; height: 26px; margin-bottom: 8px; width: 26px; }
.zy-store-mobile-empty strong { color: #1d2939; font-size: 14px; }
.zy-store-mobile-empty span { font-size: 11px; margin-top: 3px; }
.zy-store-location-btn { align-items: center; background: #eef9e6; border: 1px solid #cce9b5; border-radius: 12px; color: #2e6b09; display: flex; font-size: 12px; font-weight: 900; gap: 8px; justify-content: center; min-height: 44px; width: 100%; }
.zy-store-location-btn.is-loading svg { animation: zy-spin 1s linear infinite; }
.zy-store-location-status { color: #667085; display: block; font-size: 10px; margin: 7px 2px 13px; }
.zy-store-location-status.is-valid { color: #2f7d00; font-weight: 850; }

.zy-store-contract-gate { padding: 5px 0 18px; }
.zy-store-contract-hero {
    background: radial-gradient(circle at 90% 0, rgba(138, 240, 0, .27), transparent 40%), #101014;
    border-radius: 24px; color: #fff; overflow: hidden; padding: 24px 20px; position: relative;
}
.zy-store-contract-hero > span { align-items: center; color: #bffb78; display: flex; font-size: 11px; font-weight: 900; gap: 7px; text-transform: uppercase; }
.zy-store-contract-hero h2 { font-size: 27px; font-weight: 950; letter-spacing: -.7px; line-height: 1.05; margin: 13px 0 9px; max-width: 310px; }
.zy-store-contract-hero p { color: #c4cad3; font-size: 12px; font-weight: 650; line-height: 1.55; margin: 0; }
.zy-store-contract-benefits { display: grid; gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 10px 0 18px; }
.zy-store-contract-benefits > div { align-items: center; background: #fff; border: 1px solid #e2e7de; border-radius: 14px; display: flex; gap: 9px; min-width: 0; padding: 10px; }
.zy-store-contract-benefits > div > svg { background: #eff9e8; border-radius: 10px; color: #3b750f; flex: 0 0 36px; height: 36px; padding: 8px; width: 36px; }
.zy-store-contract-benefits span,
.zy-store-contract-benefits strong,
.zy-store-contract-benefits small { display: block; min-width: 0; }
.zy-store-contract-benefits strong { color: #172019; font-size: 11px; font-weight: 900; line-height: 1.25; }
.zy-store-contract-benefits small { color: #667085; font-size: 9px; line-height: 1.3; margin-top: 2px; }
.zy-store-contract-costs { display: grid; gap: 8px; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0 0 12px; position: relative; z-index: 2; }
.zy-store-contract-costs div { background: #fff; border: 1px solid #e2e7de; border-radius: 14px; box-shadow: 0 10px 24px rgba(16, 24, 40, .09); min-width: 0; padding: 11px 9px; }
.zy-store-contract-costs span,
.zy-store-contract-costs strong { display: block; }
.zy-store-contract-costs span { color: #667085; font-size: 9px; font-weight: 800; line-height: 1.2; }
.zy-store-contract-costs strong { color: #101014; font-size: 12px; font-weight: 950; line-height: 1.2; margin-top: 4px; overflow-wrap: anywhere; }
.zy-store-contract-form { background: #fff; border: 1px solid #e2e7de; border-radius: 20px; padding: 15px; }
.zy-store-contract-details { background: #f6f8f4; border: 1px solid #e4e9df; border-radius: 14px; margin-bottom: 13px; overflow: hidden; }
.zy-store-contract-details summary { align-items: center; color: #1d2939; cursor: pointer; display: flex; font-size: 11px; font-weight: 900; justify-content: space-between; list-style: none; min-height: 46px; padding: 0 12px; }
.zy-store-contract-details summary::-webkit-details-marker { display: none; }
.zy-store-contract-details summary span { align-items: center; display: flex; gap: 7px; }
.zy-store-contract-details summary svg { height: 16px; width: 16px; }
.zy-store-contract-details[open] summary > svg { transform: rotate(180deg); }
.zy-store-contract-details .zy-store-contract-terms { border: 0; border-radius: 0; margin: 0; }
.zy-store-contract-terms { background: #f6f8f4; border: 1px solid #e4e9df; border-radius: 14px; color: #475467; font-size: 11px; line-height: 1.55; max-height: 156px; overflow: auto; padding: 13px; }
.zy-store-contract-check { align-items: flex-start; display: flex; gap: 10px; margin: 14px 2px; }
.zy-store-contract-check input { accent-color: #6dcc00; flex: 0 0 20px; height: 20px; margin-top: 1px; width: 20px; }
.zy-store-contract-check strong,
.zy-store-contract-check small { display: block; }
.zy-store-contract-check strong { color: #101014; font-size: 13px; font-weight: 900; }
.zy-store-contract-check small { color: #667085; font-size: 10px; line-height: 1.4; margin-top: 2px; }
.zy-store-contract-submit { align-items: center; background: #8af000; border: 0; border-radius: 14px; color: #142000; display: flex; font-size: 13px; font-weight: 950; gap: 8px; justify-content: center; min-height: 50px; width: 100%; }
.zy-store-contract-submit:disabled { filter: grayscale(1); opacity: .55; }
.zy-store-pos-separate { background: #fff; border-color: #e2e7de; color: #101014; }
.zy-store-pos-separate strong { color: #101014; }
.zy-store-pos-separate small { color: #667085; }

@keyframes zy-spin { to { transform: rotate(360deg); } }

@media (max-width: 370px) {
    .zy-store-tabs button { font-size: 9px; padding-left: 3px; padding-right: 3px; }
    .zy-store-contract-costs { grid-template-columns: 1fr; }
    .zy-store-contract-benefits { grid-template-columns: 1fr; }
}

/* Login PWA · acceso comercial y permiso explícito para alertas. */
.zy-login-shell .zy-login-photo > img {
    filter: saturate(.92) contrast(1.03);
    object-position: 55% 50%;
}

.zy-login-shell .zy-login-photo:after {
    background:
        linear-gradient(90deg, rgba(7, 10, 8, .68) 0%, rgba(7, 10, 8, .16) 62%, rgba(7, 10, 8, .06) 100%),
        linear-gradient(180deg, rgba(7, 10, 8, .48) 0%, rgba(7, 10, 8, .03) 38%, rgba(7, 10, 8, .91) 100%);
}

.zy-login-shell .zy-login-card {
    border: 1px solid #dce7d8;
    box-shadow: 0 22px 54px rgba(16, 24, 20, .16);
}

.zy-login-shell .zy-login-card::before {
    background: linear-gradient(90deg, #79df00, #a3f84b);
    border-radius: 999px;
    content: "";
    height: 4px;
    left: 50%;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 58px;
}

.zy-login-card-head {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: 40px minmax(0, 1fr);
    margin-bottom: clamp(8px, 1.25dvh, 12px);
}

.zy-login-card-icon {
    align-items: center;
    background: #effae8;
    border: 1px solid #d6edc7;
    border-radius: 12px;
    color: #34720f;
    display: inline-flex;
    font-size: 15px;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.zy-login-shell .zy-login-card-head .zy-login-title,
.zy-login-shell .zy-login-card-head .zy-login-sub {
    margin-bottom: 0;
}

.zy-login-options {
    align-items: center;
    display: grid;
    gap: 7px;
    grid-template-columns: minmax(0, .92fr) minmax(0, 1.28fr);
    margin: 4px 0 clamp(7px, 1.2dvh, 10px);
}

.zy-login-shell .zy-login-options .zy-login-remember {
    background: #f7faf5;
    border: 1px solid #e2eadf;
    border-radius: 12px;
    font-size: 9.5px;
    margin: 0;
    min-height: 44px;
    padding: 0 8px;
}

.zy-login-notify {
    align-items: center;
    background: #101014;
    border: 1px solid #101014;
    border-radius: 12px;
    color: #fff;
    display: grid;
    gap: 7px;
    grid-template-columns: 30px minmax(0, 1fr) 10px;
    min-height: 44px;
    padding: 5px 8px;
    text-align: left;
    touch-action: manipulation;
    transition: background .18s ease, border-color .18s ease, transform .16s ease;
    width: 100%;
}

.zy-login-notify-icon {
    align-items: center;
    background: #8af000;
    border-radius: 9px;
    color: #142000;
    display: inline-flex;
    height: 30px;
    justify-content: center;
    position: relative;
    width: 30px;
}

.zy-login-notify:not(.is-enabled):not(.is-denied):not(.is-unsupported) .zy-login-notify-icon::after {
    animation: zyLoginNotifyPulse 1.8s ease-in-out infinite;
    border: 1px solid rgba(138, 240, 0, .62);
    border-radius: 11px;
    content: "";
    inset: -3px;
    position: absolute;
}

.zy-login-notify strong,
.zy-login-notify small {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.zy-login-notify strong { color: #fff; font-size: 9.5px; font-weight: 850; line-height: 1.15; }
.zy-login-notify small { color: rgba(255,255,255,.66); font-size: 7.5px; font-weight: 650; line-height: 1.2; margin-top: 2px; }
.zy-login-notify-arrow { color: #baff68; font-size: 8px; transition: transform .16s ease; }
.zy-login-notify:active { transform: scale(.98); }
.zy-login-notify:active .zy-login-notify-arrow { transform: translateX(2px); }

.zy-login-notify.is-enabled {
    background: #eefbe5;
    border-color: #bddd9f;
}
.zy-login-notify.is-enabled .zy-login-notify-icon { background: #d8f7c1; color: #2f700b; }
.zy-login-notify.is-enabled strong { color: #214b0c; }
.zy-login-notify.is-enabled small { color: #4d6c3e; }
.zy-login-notify.is-enabled .zy-login-notify-arrow { color: #3d7d18; }

.zy-login-notify.is-denied {
    background: #fff3f1;
    border-color: #f0c9c4;
}
.zy-login-notify.is-denied .zy-login-notify-icon { background: #ffe2df; color: #b42318; }
.zy-login-notify.is-denied strong { color: #8f2118; }
.zy-login-notify.is-denied small { color: #98645f; }
.zy-login-notify.is-denied .zy-login-notify-arrow { color: #b42318; }

.zy-login-notify.is-unsupported { background: #f2f4f1; border-color: #dfe4dc; cursor: not-allowed; opacity: .7; }
.zy-login-notify.is-unsupported .zy-login-notify-icon { background: #e5e9e3; color: #707b73; }
.zy-login-notify.is-unsupported strong { color: #4f5952; }
.zy-login-notify.is-unsupported small { color: #7d877f; }

.zy-login-notify.is-requesting .zy-login-notify-icon i { animation: zy-spin .7s linear infinite; }

@keyframes zyLoginNotifyPulse {
    50% { opacity: .2; transform: scale(1.16); }
}

@media (max-height: 650px) {
    .zy-login-card-head { margin-bottom: 6px; }
    .zy-login-card-icon { height: 34px; width: 34px; }
    .zy-login-card-head { grid-template-columns: 34px minmax(0, 1fr); }
    .zy-login-options { margin-bottom: 5px; margin-top: 2px; }
    .zy-login-shell .zy-login-options .zy-login-remember,
    .zy-login-notify { min-height: 40px; }
    .zy-login-notify-icon { height: 28px; width: 28px; }
}

@media (max-height: 520px) {
    .zy-login-card-icon { display: none; }
    .zy-login-card-head { display: block; margin-bottom: 3px; }
    .zy-login-options { gap: 5px; }
    .zy-login-notify strong { font-size: 9px; }
    .zy-login-notify small { font-size: 7px; }
}

@media (max-height: 410px) {
    .zy-login-options { grid-template-columns: 1fr; }
    .zy-login-shell .zy-login-options .zy-login-remember { display: none; }
    .zy-login-notify { min-height: 38px; }
}

@media (prefers-reduced-motion: reduce) {
    .zy-login-notify-icon::after { animation: none !important; }
}

/* Mi tienda PWA · centro operativo de pedidos e inventario. */
.zy-store-page .zy-store-tabs {
    backdrop-filter: blur(14px);
    background: rgba(233, 239, 229, .94);
    position: sticky;
    top: calc(4px + env(safe-area-inset-top));
    z-index: 20;
}
.zy-store-page .zy-store-tabs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.zy-store-page .zy-store-tabs.is-full { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.zy-store-page .zy-store-tabs button { min-height: 46px; }
.zy-store-page .zy-store-tabs button > svg { height: 17px; width: 17px; }
.zy-store-page .zy-store-tabs button:focus-visible,
.zy-store-page button:focus-visible,
.zy-store-page a:focus-visible,
.zy-store-page input:focus-visible,
.zy-store-page summary:focus-visible {
    outline: 3px solid rgba(79, 164, 0, .32);
    outline-offset: 2px;
}
.zy-store-section-label {
    align-items: baseline;
    display: flex;
    justify-content: space-between;
    margin: 16px 2px 8px;
}
.zy-store-section-label span { color: #111318; font-size: 13px; font-weight: 950; }
.zy-store-section-label small { color: #7a8492; font-size: 10px; font-weight: 700; }
.zy-store-actions--operations { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.zy-store-actions--operations > * { transition: border-color .18s ease, box-shadow .18s ease, transform .12s ease; }
.zy-store-actions--operations > *:active { transform: scale(.98); }
.zy-store-actions--operations > *:first-child {
    background: #101014;
    border-color: #101014;
    color: #fff;
}
.zy-store-actions--operations > *:first-child small { color: #bac2cb; }
.zy-store-actions--operations > *:first-child > i:first-child { background: #8af000; color: #142000; }
.zy-store-attention {
    background: #fff;
    border: 1px solid #e2e7df;
    border-radius: 20px;
    box-shadow: 0 10px 28px rgba(16, 24, 40, .055);
    margin: 12px 0;
    padding: 14px;
}
.zy-store-attention-head { align-items: center; display: flex; justify-content: space-between; margin-bottom: 9px; }
.zy-store-attention-head span { color: #64706b; display: block; font-size: 9px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.zy-store-attention-head h2 { color: #111318; font-size: 15px; font-weight: 950; margin: 2px 0 0; }
.zy-store-attention-head > svg { color: #4d8e16; height: 19px; width: 19px; }
.zy-store-attention-grid { display: grid; gap: 8px; }
.zy-store-attention-grid button {
    align-items: center;
    background: #f7f9f5;
    border: 1px solid #e7ece3;
    border-radius: 14px;
    color: #18211b;
    display: grid;
    gap: 10px;
    grid-template-columns: 40px minmax(0, 1fr) 18px;
    min-height: 62px;
    padding: 9px 10px;
    text-align: left;
    touch-action: manipulation;
    width: 100%;
}
.zy-store-attention-grid button > span:nth-child(2) { min-width: 0; }
.zy-store-attention-grid button strong,
.zy-store-attention-grid button small { display: block; }
.zy-store-attention-grid button strong { font-size: 12px; font-weight: 900; }
.zy-store-attention-grid button small { color: #6b7581; font-size: 10px; font-weight: 700; margin-top: 2px; }
.zy-store-attention-grid button > svg { color: #8a949d; height: 17px; width: 17px; }
.zy-store-attention-icon { align-items: center; border-radius: 12px; display: flex; height: 40px; justify-content: center; width: 40px; }
.zy-store-attention-icon svg { height: 19px; width: 19px; }
.zy-store-attention-icon.is-order { background: #fff0d5; color: #9b5700; }
.zy-store-attention-icon.is-stock { background: #fee9e5; color: #b42318; }
.zy-mini-row em.is-urgent,
.zy-mini-row em.is-preparing { background: #fff0d5; color: #8b4e00; }
.zy-mini-row em.is-ready { background: #eaf8dc; color: #3f6f13; }
.zy-mini-row em.is-transit { background: #e4f4fb; color: #08627b; }
.zy-mini-row em.is-done { background: #edf7e8; color: #347015; }

.zy-store-order-summary,
.zy-store-inventory-summary {
    display: grid;
    gap: 7px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0 0 12px;
}
.zy-store-order-summary > div {
    background: #fff;
    border: 1px solid #e5e9e2;
    border-radius: 13px;
    min-width: 0;
    padding: 10px 7px;
    text-align: center;
}
.zy-store-order-summary span,
.zy-store-order-summary strong { display: block; }
.zy-store-order-summary span { color: #77818d; font-size: 8.5px; font-weight: 800; line-height: 1.2; }
.zy-store-order-summary strong { color: #141818; font-size: 17px; font-variant-numeric: tabular-nums; font-weight: 950; margin-top: 3px; }
.zy-store-toolbar { margin-bottom: 12px; }
.zy-store-search {
    align-items: center;
    background: #fff;
    border: 1px solid #dfe5dc;
    border-radius: 14px;
    display: flex;
    gap: 9px;
    min-height: 48px;
    padding: 0 13px;
}
.zy-store-search > svg { color: #7b858f; flex: 0 0 18px; height: 18px; width: 18px; }
.zy-store-search input {
    background: transparent;
    border: 0;
    color: #141818;
    flex: 1;
    font-size: 13px;
    font-weight: 700;
    height: 46px;
    min-width: 0;
    outline: 0;
}
.zy-store-search:focus-within { border-color: #76be37; box-shadow: 0 0 0 3px rgba(118, 190, 55, .13); }
.zy-store-filter-row {
    display: flex;
    gap: 7px;
    margin-top: 8px;
    overflow-x: auto;
    padding: 1px 1px 3px;
    scrollbar-width: none;
}
.zy-store-filter-row::-webkit-scrollbar { display: none; }
.zy-store-filter-row button {
    background: #f1f4ef;
    border: 1px solid #e0e6dc;
    border-radius: 999px;
    color: #59636c;
    flex: 0 0 auto;
    font-size: 10.5px;
    font-weight: 850;
    min-height: 44px;
    padding: 0 13px;
    touch-action: manipulation;
}
.zy-store-filter-row button.is-active { background: #101014; border-color: #101014; color: #fff; }
.zy-store-mobile-list { gap: 12px; }
.zy-store-mobile-order {
    border-left: 4px solid #cad2c7;
    border-radius: 18px;
    padding: 14px 13px;
}
.zy-store-mobile-order.is-urgent { border-left-color: #e89921; box-shadow: 0 10px 28px rgba(196, 112, 0, .10); }
.zy-store-mobile-order.is-preparing { border-left-color: #ef8e32; }
.zy-store-mobile-order.is-ready { border-left-color: #70bc2f; }
.zy-store-mobile-order.is-transit { border-left-color: #2494b3; }
.zy-store-mobile-order.is-done { border-left-color: #68a43c; }
.zy-store-mobile-order.is-cancelled { border-left-color: #d4584e; opacity: .82; }
.zy-store-order-head {
    align-items: center !important;
    display: grid !important;
    gap: 9px !important;
    grid-template-columns: 38px minmax(0, 1fr) auto;
}
.zy-store-order-state {
    align-items: center;
    background: #f1f4ef;
    border-radius: 11px;
    color: #526059;
    display: flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}
.zy-store-order-state svg { height: 18px; width: 18px; }
.zy-store-mobile-order.is-urgent .zy-store-order-state { background: #fff1d9; color: #985500; }
.zy-store-mobile-order.is-preparing .zy-store-order-state { background: #fff0df; color: #a45105; }
.zy-store-mobile-order.is-ready .zy-store-order-state { background: #ebf9df; color: #477d16; }
.zy-store-mobile-order.is-transit .zy-store-order-state { background: #e2f4f9; color: #0b738e; }
.zy-store-order-head > div { min-width: 0; }
.zy-store-order-head > div strong { font-size: 13px; font-weight: 950; }
.zy-store-order-head > div span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zy-store-order-head em { max-width: 112px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zy-store-order-main {
    background: #f7f9f6;
    border: 1px solid #edf0eb;
    border-radius: 13px;
    display: grid;
    gap: 5px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 11px 0 8px;
    padding: 10px;
}
.zy-store-order-main > div { border-right: 1px solid #e4e8e1; min-width: 0; padding: 0 7px; }
.zy-store-order-main > div:first-child { padding-left: 0; }
.zy-store-order-main > div:last-child { border-right: 0; padding-right: 0; }
.zy-store-order-main span,
.zy-store-order-main strong { display: block; }
.zy-store-order-main span { color: #7a8490; font-size: 8px; font-weight: 800; }
.zy-store-order-main strong { color: #1b211e; font-size: 10.5px; font-weight: 900; line-height: 1.25; margin-top: 3px; overflow-wrap: anywhere; }
.zy-store-order-detail { border-bottom: 1px solid #edf0eb; }
.zy-store-order-detail > summary {
    align-items: center;
    color: #56616a;
    cursor: pointer;
    display: flex;
    font-size: 10.5px;
    font-weight: 850;
    justify-content: space-between;
    list-style: none;
    min-height: 44px;
}
.zy-store-order-detail > summary::-webkit-details-marker { display: none; }
.zy-store-order-detail > summary span { align-items: center; display: flex; gap: 7px; }
.zy-store-order-detail > summary svg { height: 15px; transition: transform .18s ease; width: 15px; }
.zy-store-order-detail[open] > summary > svg { transform: rotate(180deg); }
.zy-store-order-detail .zy-store-mobile-order-items { border: 0; margin: 0; padding: 4px 0 9px; }
.zy-store-order-detail p { align-items: flex-start; color: #66717b; display: flex; font-size: 10.5px; gap: 7px; line-height: 1.4; margin: 0 0 8px; }
.zy-store-order-detail p svg { flex: 0 0 15px; height: 15px; margin-top: 1px; width: 15px; }
.zy-store-order-primary { min-height: 48px; }
.zy-store-order-primary svg { height: 18px; width: 18px; }
.zy-store-order-primary:active,
.zy-store-stock-save:active { transform: scale(.985); }
.zy-store-order-live {
    align-items: center;
    background: #f1f9e9;
    border: 1px solid #d9ebc7;
    border-radius: 13px;
    color: #47731e;
    display: flex;
    gap: 10px;
    margin-top: 10px;
    min-height: 50px;
    padding: 8px 11px;
}
.zy-store-order-live.is-transit { background: #eaf7fb; border-color: #cce9f1; color: #116b82; }
.zy-store-order-live > svg { flex: 0 0 19px; height: 19px; width: 19px; }
.zy-store-order-live:not(.is-transit) > svg { animation: zy-spin 1.2s linear infinite; }
.zy-store-order-live strong,
.zy-store-order-live small { display: block; }
.zy-store-order-live strong { font-size: 11px; font-weight: 900; }
.zy-store-order-live small { color: #68776a; font-size: 9px; font-weight: 700; margin-top: 2px; }
.zy-store-order-cancel { text-align: center; }
.zy-store-order-cancel button {
    background: transparent;
    border: 0;
    color: #a5423b;
    font-size: 10.5px;
    font-weight: 850;
    min-height: 44px;
    padding: 8px 12px 0;
}
.zy-store-order-cancel svg { height: 14px; margin-right: 5px; width: 14px; }

.zy-store-inventory-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.zy-store-inventory-summary > div {
    align-items: center;
    background: #fff;
    border: 1px solid #e3e8df;
    border-radius: 14px;
    display: flex;
    gap: 8px;
    min-width: 0;
    padding: 10px 9px;
}
.zy-store-inventory-summary > div > svg { color: #477d18; flex: 0 0 19px; height: 19px; width: 19px; }
.zy-store-inventory-summary > div.has-warning { background: #fff8e8; border-color: #f1d99d; }
.zy-store-inventory-summary > div.has-warning > svg { color: #996000; }
.zy-store-inventory-summary > div.has-danger { background: #fff0ee; border-color: #efc9c4; }
.zy-store-inventory-summary > div.has-danger > svg { color: #b42318; }
.zy-store-inventory-summary strong,
.zy-store-inventory-summary small { display: block; }
.zy-store-inventory-summary strong { color: #151918; font-size: 15px; font-variant-numeric: tabular-nums; font-weight: 950; }
.zy-store-inventory-summary small { color: #77818c; font-size: 8.5px; font-weight: 800; line-height: 1.15; }
.zy-store-inventory-toolbar { margin-top: 12px; }
.zy-store-mobile-products { gap: 11px; }
.zy-store-mobile-products > article.zy-store-inventory-card {
    display: block;
    padding: 12px;
}
.zy-store-inventory-card.is-low { border-color: #ead6a9; box-shadow: 0 8px 22px rgba(170, 106, 0, .07); }
.zy-store-inventory-card.is-out { border-color: #edc8c4; box-shadow: 0 8px 22px rgba(180, 35, 24, .07); }
.zy-store-inventory-product {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-template-columns: 58px minmax(0, 1fr) 44px;
}
.zy-store-mobile-products .zy-store-inventory-product img { border-radius: 13px; height: 58px; width: 58px; }
.zy-store-inventory-product > div { min-width: 0; }
.zy-store-inventory-product strong { font-size: 12.5px; }
.zy-store-inventory-product span { font-size: 10px; }
.zy-store-inventory-product small { color: #4f7c29; font-size: 9.5px; font-weight: 850; }
.zy-store-inventory-product small.is-low { color: #9a6200; }
.zy-store-inventory-product small.is-out,
.zy-store-inventory-product small.is-paused { color: #ad372e; }
.zy-store-inventory-product form button {
    border: 1px solid #e0e6dc;
    height: 44px;
    width: 44px;
}
.zy-store-variant-link {
    align-items: center;
    background: #f6f8f4;
    border-radius: 12px;
    color: #253129;
    display: flex;
    justify-content: space-between;
    margin-top: 10px;
    min-height: 50px;
    padding: 8px 10px;
    text-decoration: none !important;
}
.zy-store-variant-link > span { align-items: center; display: grid; gap: 1px 8px; grid-template-columns: 22px minmax(0, 1fr); }
.zy-store-variant-link > span > svg { grid-row: 1 / 3; height: 18px; width: 18px; }
.zy-store-variant-link strong,
.zy-store-variant-link small { display: block; }
.zy-store-variant-link strong { font-size: 10.5px; font-weight: 900; }
.zy-store-variant-link small { color: #758078; font-size: 9px; }
.zy-store-variant-link > svg { color: #879189; height: 16px; width: 16px; }
.zy-store-stock-form {
    align-items: center;
    border-top: 1px solid #edf0eb;
    display: grid;
    gap: 8px;
    grid-template-columns: auto minmax(128px, 1fr) 84px;
    margin-top: 10px;
    padding-top: 10px;
}
.zy-store-stock-form > label { color: #66716b; font-size: 9.5px; font-weight: 850; }
.zy-store-stock-stepper {
    align-items: center;
    background: #f4f6f2;
    border: 1px solid #e0e5dd;
    border-radius: 12px;
    display: grid;
    grid-template-columns: 40px minmax(42px, 1fr) 40px;
    min-height: 44px;
    overflow: hidden;
}
.zy-store-mobile-products .zy-store-stock-form .zy-store-stock-stepper button {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #34413a;
    height: 44px;
    width: 100%;
}
.zy-store-stock-stepper button svg { height: 15px; width: 15px; }
.zy-store-stock-stepper input {
    appearance: textfield;
    background: #fff;
    border: 0;
    border-left: 1px solid #e0e5dd;
    border-right: 1px solid #e0e5dd;
    color: #121716;
    font-size: 13px;
    font-variant-numeric: tabular-nums;
    font-weight: 950;
    height: 44px;
    min-width: 0;
    text-align: center;
    width: 100%;
}
.zy-store-stock-stepper input::-webkit-inner-spin-button { appearance: none; margin: 0; }
.zy-store-mobile-products .zy-store-stock-form > .zy-store-stock-save {
    align-items: center;
    background: #101014;
    border: 0;
    border-radius: 11px;
    color: #fff;
    display: flex;
    font-size: 10px;
    font-weight: 900;
    gap: 5px;
    justify-content: center;
    min-height: 44px;
    width: 100%;
}
.zy-store-stock-save svg { height: 14px; width: 14px; }
.zy-store-filter-empty { grid-column: 1 / -1; }
.zy-store-filter-empty[hidden] { display: none !important; }
.zy-store-page [data-store-busy-form].is-busy { opacity: .72; pointer-events: none; }
.zy-store-page [data-store-busy-form].is-busy button[type="submit"] svg { animation: zy-spin .75s linear infinite; }

@media (max-width: 380px) {
    .zy-store-order-head { grid-template-columns: 36px minmax(0, 1fr); }
    .zy-store-order-head em { grid-column: 2; justify-self: start; max-width: none; }
    .zy-store-order-main { grid-template-columns: 1fr 1fr; }
    .zy-store-order-main > div { border-right: 0; }
    .zy-store-order-main > div:last-child { border-top: 1px solid #e4e8e1; grid-column: 1 / -1; padding-top: 7px; }
    .zy-store-stock-form { grid-template-columns: 1fr 78px; }
    .zy-store-stock-form > label { grid-column: 1 / -1; }
}

@media (prefers-reduced-motion: reduce) {
    .zy-store-order-live > svg,
    .zy-store-page [data-store-busy-form].is-busy button[type="submit"] svg { animation: none !important; }
    .zy-store-actions--operations > *,
    .zy-store-order-primary,
    .zy-store-stock-save { transition: none !important; }
}
@view-transition { navigation: auto; }

.zygo-connection-state{align-items:center;background:#101014;border:1px solid rgba(255,255,255,.12);border-radius:999px;box-shadow:0 14px 38px rgba(16,24,40,.2);color:#fff;display:flex;gap:7px;left:50%;max-width:calc(100vw - 28px);opacity:0;padding:8px 13px;pointer-events:none;position:fixed;top:calc(env(safe-area-inset-top,0px) + 10px);transform:translate(-50%,-14px);transition:opacity .2s ease,transform .24s cubic-bezier(.22,1,.36,1);z-index:12000}.zygo-connection-state.is-visible{opacity:1;transform:translate(-50%,0)}.zygo-connection-state>span{background:#ffb020;border-radius:50%;box-shadow:0 0 0 4px rgba(255,176,32,.16);height:7px;width:7px}.zygo-connection-state strong{font-size:11px;font-weight:900}.zygo-connection-state small{color:rgba(255,255,255,.68);font-size:9px;font-weight:700}
.zygo-update-banner{align-items:center;background:#fff;border:1px solid #dce7d7;border-radius:20px;bottom:calc(var(--zy-dock-total,84px) + env(safe-area-inset-bottom,0px) + 12px);box-shadow:0 24px 70px rgba(16,24,40,.2);display:grid;gap:9px;grid-template-columns:42px minmax(0,1fr) auto auto;left:12px;opacity:0;padding:11px;position:fixed;right:12px;transform:translateY(24px);transition:opacity .2s ease,transform .28s cubic-bezier(.22,1,.36,1);z-index:11990}.zygo-update-banner.is-visible{opacity:1;transform:translateY(0)}.zygo-update-banner__icon{align-items:center;background:#effde4;border-radius:13px;color:#397f00;display:flex;height:42px;justify-content:center;width:42px}.zygo-update-banner__icon svg{height:20px;width:20px}.zygo-update-banner strong,.zygo-update-banner small{display:block}.zygo-update-banner strong{color:#101014;font-size:12px;font-weight:950}.zygo-update-banner small{color:#667085;font-size:9px;font-weight:700;margin-top:2px}.zygo-update-banner button{background:transparent;border:0;border-radius:11px;color:#667085;font-size:10px;font-weight:900;min-height:40px;padding:0 9px}.zygo-update-banner button.is-primary{background:#82ed00;color:#101014;padding:0 12px}
.zygo-runtime-toast{background:#101014;border:1px solid rgba(255,255,255,.12);border-radius:15px;bottom:calc(var(--zy-dock-total,84px) + env(safe-area-inset-bottom,0px) + 14px);box-shadow:0 18px 50px rgba(16,24,40,.24);color:#fff;font-size:11px;font-weight:800;left:50%;max-width:calc(100vw - 32px);opacity:0;padding:12px 15px;pointer-events:none;position:fixed;transform:translate(-50%,18px);transition:opacity .2s ease,transform .22s ease;width:max-content;z-index:12010}.zygo-runtime-toast.is-visible{opacity:1;transform:translate(-50%,0)}.zygo-runtime-toast[data-tone="success"]{border-color:rgba(130,237,0,.42)}.zygo-runtime-toast[data-tone="error"]{border-color:rgba(244,63,94,.55)}.is-sync-pending{opacity:.72}.is-sync-pending button[type="submit"]{position:relative}.is-sync-pending button[type="submit"]:after{background:#ffb020;border:2px solid #fff;border-radius:50%;content:"";height:9px;position:absolute;right:5px;top:5px;width:9px}

@media(max-width:430px){.zygo-update-banner{grid-template-columns:40px minmax(0,1fr) auto}.zygo-update-banner button[data-zygo-update-later]{display:none}.zygo-update-banner button.is-primary{grid-column:3;grid-row:1}}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}.zygo-connection-state,.zygo-update-banner,.zygo-runtime-toast{transition:none!important}}