body.order-module{
    background:
        radial-gradient(circle at top left, rgba(0,104,71,.12), transparent 28%),
        linear-gradient(180deg, var(--theme-page-bg-start) 0%, var(--theme-page-bg-mid) 45%, var(--theme-page-bg-end) 100%);
}

.order-shell{
    padding:42px 0 100px;
}

.order-summary,
.order-admin-card{
    background:var(--theme-surface);
    border:1px solid var(--theme-border-soft);
    border-radius:28px;
    box-shadow:var(--theme-shadow);
}

.order-pill{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:7px 14px;
    border-radius:999px;
    background:var(--theme-pill-bg);
    color:var(--theme-pill-text);
    font-size:.88rem;
    font-weight:700;
}

.order-price{
    color:var(--theme-heading);
    font-size:1.35rem;
    font-weight:800;
}

.order-total-box{
    position:sticky;
    top:110px;
}

.order-summary{
    padding:24px;
}

.order-cart-item{
    display:grid;
    grid-template-columns:120px 1fr auto;
    gap:18px;
    padding:18px 0;
    border-top:1px solid var(--theme-border-soft);
}

.order-cart-item:first-child{
    border-top:0;
    padding-top:0;
}

.order-cart-thumb{
    width:120px;
    aspect-ratio:1/1;
    border-radius:20px;
    overflow:hidden;
    background:rgba(255,255,255,.04);
}

.order-cart-thumb img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
}

.order-form-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:16px;
}

.order-form-grid .full{
    grid-column:1/-1;
}

.order-payment-option{
    padding:16px;
    border-radius:20px;
    border:1px solid var(--theme-border-soft);
    background:var(--theme-surface-2);
}

.order-empty{
    padding:56px 24px;
    text-align:center;
}

.order-admin-table td,
.order-admin-table th{
    vertical-align:middle;
}

.order-muted{
    color:var(--theme-text-muted);
}

@media (max-width:768px){
    .order-shell{
        padding:34px 0 92px;
    }

    .order-cart-item{
        grid-template-columns:1fr;
    }

    .order-cart-thumb{
        width:100%;
    }

    .order-form-grid{
        grid-template-columns:1fr;
    }
}

/* ==============================
   UNIFIED ORDER LIST
============================== */

/* Flash de confirmación */
.lj-order-added-bar{
    position:fixed;
    top:72px;left:0;right:0;
    z-index:300;
    background:#006847;
    color:#fff;
    text-align:center;
    padding:10px 16px;
    font-weight:700;
    animation:lj-fadeout 2.8s forwards;
}
@keyframes lj-fadeout{
    0%,65%{opacity:1}
    100%{opacity:0;pointer-events:none}
}

/* Barra flotante del carrito */
.lj-order-bar{
    position:fixed;
    bottom:0;left:0;right:0;
    z-index:200;
    background:rgba(3,7,3,.97);
    border-top:2px solid #006847;
    padding:12px 0;
    transform:translateY(100%);
    transition:transform .28s ease;
}
.lj-order-bar--active{transform:translateY(0)}

/* Botón volver arriba */
.lj-back-top{
    position:fixed;
    bottom:76px;right:18px;
    z-index:190;
    width:42px;height:42px;
    border-radius:50%;
    background:#006847;
    color:#fff;
    border:0;
    font-size:1.1rem;
    cursor:pointer;
    align-items:center;
    justify-content:center;
    box-shadow:0 4px 14px rgba(0,104,71,.45);
    transition:opacity .2s;
}
.lj-back-top:hover{opacity:.85}

/* Pills de categoría */
.lj-order-cats-wrap{
    margin-bottom:1.5rem;
}
.lj-order-cats{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
}
.lj-order-hero{
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:1.5rem;
    flex-wrap:wrap;
}
.lj-order-search-wrap{
    flex-shrink:0;
    width:280px;
}
.lj-order-search{
    width:100%;
    padding:9px 14px 9px 38px;
    border:1px solid var(--theme-border-soft);
    border-radius:999px;
    background:var(--theme-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='8' stroke='%23888' stroke-width='2'/%3E%3Cpath d='m21 21-4.35-4.35' stroke='%23888' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 12px center / 16px;
    color:var(--theme-text-main);
    font-size:.9rem;
    font-family:inherit;
    transition:border-color .18s,box-shadow .18s;
}
.lj-order-search:focus{
    outline:none;
    border-color:#006847;
    box-shadow:0 0 0 3px rgba(0,104,71,.15);
}
.lj-order-search::placeholder{
    color:var(--theme-text-muted);
}

.lj-order-cat-link{
    padding:7px 16px;
    border-radius:999px;
    background:var(--theme-surface);
    border:1px solid var(--theme-border-soft);
    color:var(--theme-text-main);
    font-size:.88rem;
    font-weight:700;
    white-space:nowrap;
    cursor:pointer;
    transition:background .18s,color .18s,border-color .18s;
}
.lj-order-cat-link:hover,
.lj-order-cat-link.active{
    background:#006847;
    color:#fff;
    border-color:#006847;
}
.lj-order-cat-separator{
    display:inline-flex;
    align-items:center;
    min-height:34px;
    margin-left:8px;
    padding-left:14px;
    border-left:2px solid rgba(0,104,71,.28);
    color:var(--theme-text-muted);
    font-size:.74rem;
    font-weight:900;
    letter-spacing:.12em;
    text-transform:uppercase;
}

/* Cabecera de sección */
.lj-order-cat-header h2{
    font-size:1.35rem;
    font-weight:800;
}

/* Grid de 2 columnas: usa gap 1px + bg del contenedor como línea divisoria */
.lj-order-list{
    display:grid;
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:1px;
    background:var(--theme-border-soft);
    border:1px solid var(--theme-border-soft);
    border-radius:20px;
    overflow:hidden;
}

/* Fila = miniatura izquierda + cuerpo derecha */
.lj-order-row{
    display:grid;
    grid-template-columns:72px 1fr;
    gap:14px;
    padding:16px;
    background:var(--theme-surface);
    align-items:start;
    transition:background .18s;
}
.lj-order-row:hover{background:var(--theme-surface-2)}
.lj-order-row--unavail{opacity:.42;pointer-events:none}
.lj-order-row--display-only{
    background:linear-gradient(180deg, rgba(0,104,71,.045), var(--theme-surface));
}

/* Miniatura */
.lj-order-thumb{
    display:block;
    width:72px;
    height:72px;
    border-radius:12px;
    overflow:hidden;
    flex-shrink:0;
    background:rgba(255,255,255,.04);
    text-decoration:none;
    cursor:zoom-in;
}
.lj-order-thumb img{
    width:100%;height:100%;
    object-fit:cover;
    display:block;
    transition:transform .22s ease;
}
.lj-order-thumb:hover img{transform:scale(1.08)}

.lj-order-thumb--empty{
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(0,104,71,.1);
    font-size:1.7rem;
    border-radius:12px;
    width:72px;height:72px;
    flex-shrink:0;
}

/* Cuerpo del platillo */
.lj-order-body{
    display:flex;
    flex-direction:column;
    gap:7px;
    min-width:0;
}

.lj-order-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:8px;
}

.lj-order-name{
    font-weight:700;
    font-size:.97rem;
    color:var(--theme-heading);
    line-height:1.3;
}
.lj-order-name-es{
    font-weight:400;
    font-size:.84rem;
    color:var(--theme-text-muted);
    margin-left:4px;
}
.lj-order-price-col{
    font-size:1.05rem;
    font-weight:800;
    color:var(--theme-heading);
    white-space:nowrap;
    flex-shrink:0;
}
.lj-order-desc{
    font-size:.83rem;
    color:var(--theme-text-muted);
    line-height:1.45;
}
.lj-order-unavail-tag{
    display:inline-block;
    padding:1px 8px;
    border-radius:999px;
    background:rgba(196,18,48,.13);
    color:#C41230;
    font-size:.78rem;
    font-weight:700;
}
.lj-order-menu-tag{
    display:inline-block;
    padding:1px 8px;
    border-radius:999px;
    background:rgba(0,104,71,.12);
    color:#006847;
    font-size:.78rem;
    font-weight:800;
}
.lj-order-display-note{
    margin-top:4px;
    padding:8px 10px;
    border-radius:10px;
    background:rgba(0,104,71,.08);
    color:var(--theme-text-muted);
    font-size:.82rem;
    font-weight:700;
}

/* Selects y notas */
.lj-order-select,
.lj-order-notes{
    font-size:.84rem !important;
    padding:5px 9px !important;
    border-radius:9px !important;
}

/* Fila de cantidad */
.lj-order-qty-row{
    display:flex;
    align-items:center;
    gap:7px;
}
.lj-qty-wrap{
    display:flex;
    align-items:center;
    border:1px solid var(--theme-border-soft);
    border-radius:9px;
    overflow:hidden;
    background:var(--theme-surface-2);
    flex-shrink:0;
}
.lj-qty-btn{
    width:32px;height:32px;
    border:0;
    background:transparent;
    color:var(--theme-text-main);
    font-size:1rem;
    cursor:pointer;
    font-weight:700;
    transition:background .14s;
}
.lj-qty-btn:hover{background:rgba(0,104,71,.18)}
.lj-qty-input{
    width:34px;height:32px;
    border:0;
    border-left:1px solid var(--theme-border-soft);
    border-right:1px solid var(--theme-border-soft);
    background:transparent;
    color:var(--theme-text-main);
    text-align:center;
    font-weight:700;
    font-size:.9rem;
    -moz-appearance:textfield;
}
.lj-qty-input::-webkit-inner-spin-button,
.lj-qty-input::-webkit-outer-spin-button{-webkit-appearance:none}

.lj-order-add{
    flex:1;
    height:32px;
    padding:0 12px;
    font-size:.87rem;
    white-space:nowrap;
}

/* Espacio para que la barra flotante no tape el último item */
.order-shell{padding-bottom:100px !important}

/* Dialog lightbox */
.lj-img-dialog{
    border:0;
    background:transparent;
    padding:0;
    max-width:92vw;
    max-height:92vh;
    outline:none;
}
.lj-img-dialog::backdrop{background:rgba(0,0,0,.88)}
.lj-img-dialog img{
    max-width:90vw;
    max-height:86vh;
    border-radius:14px;
    object-fit:contain;
    display:block;
}
.lj-img-close{
    position:fixed;
    top:18px;right:22px;
    font-size:2.2rem;
    line-height:1;
    color:#fff;
    background:transparent;
    border:0;
    cursor:pointer;
    font-weight:300;
}

/* Mobile: 1 columna */
@media (max-width:768px){
    .lj-order-list{
        grid-template-columns:1fr;
    }
    .lj-order-row{
        grid-template-columns:64px 1fr;
        gap:12px;
        padding:14px;
    }
    .lj-order-thumb,
    .lj-order-thumb--empty{
        width:64px;height:64px;
    }
    .lj-order-cat-separator{
        flex-basis:100%;
        margin:8px 0 0;
        padding-left:0;
        border-left:0;
        border-top:1px solid rgba(0,104,71,.22);
        padding-top:8px;
        min-height:0;
    }
    .lj-back-top{bottom:70px;right:14px}
}