:root {
    --skeleton-base-dark: rgba(255, 255, 255, 0.08);
    --skeleton-highlight-dark: rgba(255, 255, 255, 0.16);
    --skeleton-base-light: rgba(39, 34, 48, 0.08);
    --skeleton-highlight-light: rgba(39, 34, 48, 0.14);
}

@keyframes skeleton-shimmer {
    0% {
        background-position: 200% 0;
    }

    100% {
        background-position: -200% 0;
    }
}

body.page-loading {
    pointer-events: none;
}

body.page-loading .meseros-main,
body.page-loading .perfil-summary,
body.page-loading .perfil-form-panel,
body.page-loading .pedidos-main,
body.page-loading .mesas-main,
body.page-loading .tables-sidebar,
body.page-loading .layout-panel,
body.page-loading .floor-canvas,
body.page-loading .productos-main,
body.page-loading .productos-sidebar,
body.page-loading .productos-content {
    position: relative;
}

body.page-loading .page-title,
body.page-loading .page-subtitle,
body.page-loading .eyebrow,
body.page-loading .service-badge,
body.page-loading .menu-card h2,
body.page-loading .menu-card p,
body.page-loading .menu-tag,
body.page-loading .btn-pill,
body.page-loading .table-chip,
body.page-loading .summary-stats strong,
body.page-loading .summary-stats span,
body.page-loading .panel-tag,
body.page-loading .panel-header h2,
body.page-loading .panel-header p,
body.page-loading .verification-pill,
body.page-loading .profile-copy h1,
body.page-loading .profile-copy p,
body.page-loading .profile-status,
body.page-loading .side-action,
body.page-loading .field-label,
body.page-loading .gender-option span,
body.page-loading .dark-input,
body.page-loading .form-actions .btn,
body.page-loading .back-link,
body.page-loading .pedidos-eyebrow,
body.page-loading .pedidos-title,
body.page-loading .pedidos-subtitle,
body.page-loading .mesas-eyebrow,
body.page-loading .mesas-title,
body.page-loading .mesas-subtitle,
body.page-loading .productos-eyebrow,
body.page-loading .productos-title,
body.page-loading .productos-section-title,
body.page-loading .productos-group-title,
body.page-loading .filter-chip,
body.page-loading .mesas-search,
body.page-loading .mesas-select,
body.page-loading .productos-search,
body.page-loading .productos-primary-btn,
body.page-loading .category-item,
body.page-loading .category-icon,
body.page-loading .category-name,
body.page-loading .category-count,
body.page-loading .filter-btn,
body.page-loading .view-btn,
body.page-loading .product-card,
body.page-loading .product-tag,
body.page-loading .product-name,
body.page-loading .product-price,
body.page-loading .add-dish-button,
body.page-loading .add-product-card h4,
body.page-loading .btn-layout-primary,
body.page-loading .btn-layout-secondary,
body.page-loading .btn-layout-link,
body.page-loading .table-list-item,
body.page-loading .table-list-name,
body.page-loading .table-list-amount,
body.page-loading .table-list-meta,
body.page-loading .layout-legend,
body.page-loading .layout-legend span,
body.page-loading .cashier-block,
body.page-loading .layout-table,
body.page-loading .table-capacity,
body.page-loading .order-person h2,
body.page-loading .order-id,
body.page-loading .detail-label,
body.page-loading .detail-row strong,
body.page-loading .stat-row span,
body.page-loading .stat-row strong,
body.page-loading .status-badge {
    color: transparent !important;
    border-color: transparent !important;
    text-shadow: none !important;
    background-image: linear-gradient(
        90deg,
        var(--skeleton-base-dark) 0%,
        var(--skeleton-highlight-dark) 50%,
        var(--skeleton-base-dark) 100%
    ) !important;
    background-size: 220% 100% !important;
    animation: skeleton-shimmer 1.15s linear infinite;
    box-shadow: none !important;
}

body.page-loading .page-title,
body.page-loading .panel-header h2,
body.page-loading .pedidos-title,
body.page-loading .profile-copy h1,
body.page-loading .mesas-title,
body.page-loading .productos-title,
body.page-loading .productos-section-title,
body.page-loading .productos-group-title {
    border-radius: 14px;
}

body.page-loading .page-subtitle,
body.page-loading .panel-header p,
body.page-loading .pedidos-subtitle,
body.page-loading .menu-card p,
body.page-loading .mesas-subtitle,
body.page-loading .table-list-item,
body.page-loading .category-item,
body.page-loading .product-card {
    border-radius: 12px;
}

body.page-loading .btn-pill,
body.page-loading .form-actions .btn,
body.page-loading .filter-chip,
body.page-loading .back-link,
body.page-loading .service-badge,
body.page-loading .verification-pill,
body.page-loading .profile-status,
body.page-loading .side-action,
body.page-loading .status-badge,
body.page-loading .productos-primary-btn,
body.page-loading .category-count,
body.page-loading .filter-btn,
body.page-loading .view-btn,
body.page-loading .add-dish-button,
body.page-loading .btn-layout-primary,
body.page-loading .btn-layout-secondary,
body.page-loading .btn-layout-link,
body.page-loading .table-capacity {
    border-radius: 999px !important;
}

body.page-loading .food-image,
body.page-loading .profile-avatar,
body.page-loading .order-avatar,
body.page-loading .sidebar-profile img,
body.page-loading .product-image {
    opacity: 0 !important;
}

body.page-loading .card-illustration,
body.page-loading .profile-avatar-wrap,
body.page-loading .sidebar-profile img,
body.page-loading .order-avatar,
body.page-loading .product-image-wrap {
    background-image: linear-gradient(
        90deg,
        var(--skeleton-base-dark) 0%,
        var(--skeleton-highlight-dark) 50%,
        var(--skeleton-base-dark) 100%
    ) !important;
    background-size: 220% 100% !important;
    animation: skeleton-shimmer 1.15s linear infinite;
}

body.page-loading .dark-input,
body.page-loading .gender-option {
    caret-color: transparent;
}

body.page-loading .dark-input::placeholder {
    color: transparent;
}

body.page-loading .order-card,
body.page-loading .order-table-badge,
body.page-loading .order-summary h2,
body.page-loading .order-summary p,
body.page-loading .status-title,
body.page-loading .status-note,
body.page-loading .order-time-row span,
body.page-loading .order-time-row strong,
body.page-loading .order-items-head span,
body.page-loading .order-item-row span,
body.page-loading .order-item-row strong,
body.page-loading .order-total-row span,
body.page-loading .order-total-row strong,
body.page-loading .order-btn {
    color: transparent !important;
    border-color: transparent !important;
    text-shadow: none !important;
    background-image: linear-gradient(
        90deg,
        var(--skeleton-base-dark) 0%,
        var(--skeleton-highlight-dark) 50%,
        var(--skeleton-base-dark) 100%
    ) !important;
    background-size: 220% 100% !important;
    animation: skeleton-shimmer 1.15s linear infinite;
    box-shadow: none !important;
}

body.page-loading .order-table-badge,
body.page-loading .status-title,
body.page-loading .order-btn {
    border-radius: 16px !important;
}

body.page-loading .order-card {
    border-radius: 24px !important;
}

body.theme-light.page-loading .page-title,
body.theme-light.page-loading .page-subtitle,
body.theme-light.page-loading .eyebrow,
body.theme-light.page-loading .service-badge,
body.theme-light.page-loading .menu-card h2,
body.theme-light.page-loading .menu-card p,
body.theme-light.page-loading .menu-tag,
body.theme-light.page-loading .btn-pill,
body.theme-light.page-loading .table-chip,
body.theme-light.page-loading .summary-stats strong,
body.theme-light.page-loading .summary-stats span,
body.theme-light.page-loading .panel-tag,
body.theme-light.page-loading .panel-header h2,
body.theme-light.page-loading .panel-header p,
body.theme-light.page-loading .verification-pill,
body.theme-light.page-loading .profile-copy h1,
body.theme-light.page-loading .profile-copy p,
body.theme-light.page-loading .profile-status,
body.theme-light.page-loading .side-action,
body.theme-light.page-loading .field-label,
body.theme-light.page-loading .gender-option span,
body.theme-light.page-loading .dark-input,
body.theme-light.page-loading .form-actions .btn,
body.theme-light.page-loading .back-link,
body.theme-light.page-loading .pedidos-eyebrow,
body.theme-light.page-loading .pedidos-title,
body.theme-light.page-loading .pedidos-subtitle,
body.theme-light.page-loading .mesas-eyebrow,
body.theme-light.page-loading .mesas-title,
body.theme-light.page-loading .mesas-subtitle,
body.theme-light.page-loading .productos-eyebrow,
body.theme-light.page-loading .productos-title,
body.theme-light.page-loading .productos-section-title,
body.theme-light.page-loading .productos-group-title,
body.theme-light.page-loading .filter-chip,
body.theme-light.page-loading .mesas-search,
body.theme-light.page-loading .mesas-select,
body.theme-light.page-loading .productos-search,
body.theme-light.page-loading .productos-primary-btn,
body.theme-light.page-loading .category-item,
body.theme-light.page-loading .category-icon,
body.theme-light.page-loading .category-name,
body.theme-light.page-loading .category-count,
body.theme-light.page-loading .filter-btn,
body.theme-light.page-loading .view-btn,
body.theme-light.page-loading .product-card,
body.theme-light.page-loading .product-tag,
body.theme-light.page-loading .product-name,
body.theme-light.page-loading .product-price,
body.theme-light.page-loading .add-dish-button,
body.theme-light.page-loading .add-product-card h4,
body.theme-light.page-loading .btn-layout-primary,
body.theme-light.page-loading .btn-layout-secondary,
body.theme-light.page-loading .btn-layout-link,
body.theme-light.page-loading .table-list-item,
body.theme-light.page-loading .table-list-name,
body.theme-light.page-loading .table-list-amount,
body.theme-light.page-loading .table-list-meta,
body.theme-light.page-loading .layout-legend,
body.theme-light.page-loading .layout-legend span,
body.theme-light.page-loading .cashier-block,
body.theme-light.page-loading .layout-table,
body.theme-light.page-loading .table-capacity,
body.theme-light.page-loading .order-person h2,
body.theme-light.page-loading .order-id,
body.theme-light.page-loading .detail-label,
body.theme-light.page-loading .detail-row strong,
body.theme-light.page-loading .stat-row span,
body.theme-light.page-loading .stat-row strong,
body.theme-light.page-loading .status-badge,
body.theme-light.page-loading .card-illustration,
body.theme-light.page-loading .profile-avatar-wrap,
body.theme-light.page-loading .sidebar-profile img,
body.theme-light.page-loading .order-avatar,
body.theme-light.page-loading .product-image-wrap {
    background-image: linear-gradient(
        90deg,
        var(--skeleton-base-light) 0%,
        var(--skeleton-highlight-light) 50%,
        var(--skeleton-base-light) 100%
    ) !important;
}

body.theme-light.page-loading .order-card,
body.theme-light.page-loading .order-table-badge,
body.theme-light.page-loading .order-summary h2,
body.theme-light.page-loading .order-summary p,
body.theme-light.page-loading .status-title,
body.theme-light.page-loading .status-note,
body.theme-light.page-loading .order-time-row span,
body.theme-light.page-loading .order-time-row strong,
body.theme-light.page-loading .order-items-head span,
body.theme-light.page-loading .order-item-row span,
body.theme-light.page-loading .order-item-row strong,
body.theme-light.page-loading .order-total-row span,
body.theme-light.page-loading .order-total-row strong,
body.theme-light.page-loading .order-btn {
    color: transparent !important;
    border-color: transparent !important;
    text-shadow: none !important;
    background-image: linear-gradient(
        90deg,
        var(--skeleton-base-light) 0%,
        var(--skeleton-highlight-light) 50%,
        var(--skeleton-base-light) 100%
    ) !important;
    background-size: 220% 100% !important;
    animation: skeleton-shimmer 1.15s linear infinite;
    box-shadow: none !important;
}

body.page-loading .nuevo-pedido-main.checkout-page {
    position: relative;
}

/* Checkout: shimmer mientras body.page-loading está activo */
body.page-loading .checkout-page-eyebrow,
body.page-loading .checkout-page-title,
body.page-loading .checkout-field-label,
body.page-loading .checkout-document-hint,
body.page-loading .checkout-card-title,
body.page-loading .checkout-order-id,
body.page-loading .checkout-account-total-heading,
body.page-loading .checkout-order-summary-label,
body.page-loading .checkout-order-summary-val,
body.page-loading .checkout-total-label,
body.page-loading .checkout-total-value,
body.page-loading .checkout-account-pay-btn,
body.page-loading .np-quick-action,
body.page-loading .checkout-split-title,
body.page-loading .checkout-split-hint,
body.page-loading .checkout-split-name,
body.page-loading .checkout-split-pay-btn,
body.page-loading .checkout-split-paid-badge,
body.page-loading .checkout-split-line dt,
body.page-loading .checkout-split-line dd,
body.page-loading .checkout-split-check,
body.page-loading .checkout-section-title,
body.page-loading .checkout-section-sub,
body.page-loading .checkout-field-hint,
body.page-loading .checkout-owner-tag,
body.page-loading .checkout-owner-name,
body.page-loading .checkout-order-line-title,
body.page-loading .checkout-order-line-qty,
body.page-loading .checkout-order-line-name,
body.page-loading .checkout-order-line-price,
body.page-loading .checkout-order-line-base,
body.page-loading .checkout-order-addons-label,
body.page-loading .checkout-order-addon span,
body.page-loading .checkout-order-addon-price,
body.page-loading .checkout-order-line-sub span,
body.page-loading .checkout-whatsapp-btn,
body.page-loading .checkout-whatsapp-btn-text,
body.page-loading .checkout-input,
body.page-loading .checkout-select {
    color: transparent !important;
    border-color: transparent !important;
    text-shadow: none !important;
    background-image: linear-gradient(
        90deg,
        var(--skeleton-base-dark) 0%,
        var(--skeleton-highlight-dark) 50%,
        var(--skeleton-base-dark) 100%
    ) !important;
    background-size: 220% 100% !important;
    animation: skeleton-shimmer 1.15s linear infinite;
    box-shadow: none !important;
}

body.page-loading .checkout-page-title,
body.page-loading .checkout-card-title,
body.page-loading .checkout-section-title,
body.page-loading .checkout-account-total-heading {
    border-radius: 14px;
}

body.page-loading .checkout-page-eyebrow,
body.page-loading .checkout-section-sub,
body.page-loading .checkout-document-hint,
body.page-loading .checkout-split-hint,
body.page-loading .checkout-field-hint {
    border-radius: 10px;
}

body.page-loading .checkout-input,
body.page-loading .checkout-select {
    caret-color: transparent;
}

body.page-loading .checkout-input::placeholder {
    color: transparent;
}

body.page-loading .np-quick-action-icon svg,
body.page-loading .checkout-whatsapp-btn-icon svg {
    opacity: 0 !important;
}

body.theme-light.page-loading .checkout-page-eyebrow,
body.theme-light.page-loading .checkout-page-title,
body.theme-light.page-loading .checkout-field-label,
body.theme-light.page-loading .checkout-document-hint,
body.theme-light.page-loading .checkout-card-title,
body.theme-light.page-loading .checkout-order-id,
body.theme-light.page-loading .checkout-account-total-heading,
body.theme-light.page-loading .checkout-order-summary-label,
body.theme-light.page-loading .checkout-order-summary-val,
body.theme-light.page-loading .checkout-total-label,
body.theme-light.page-loading .checkout-total-value,
body.theme-light.page-loading .checkout-account-pay-btn,
body.theme-light.page-loading .np-quick-action,
body.theme-light.page-loading .checkout-split-title,
body.theme-light.page-loading .checkout-split-hint,
body.theme-light.page-loading .checkout-split-name,
body.theme-light.page-loading .checkout-split-pay-btn,
body.theme-light.page-loading .checkout-split-paid-badge,
body.theme-light.page-loading .checkout-split-line dt,
body.theme-light.page-loading .checkout-split-line dd,
body.theme-light.page-loading .checkout-split-check,
body.theme-light.page-loading .checkout-section-title,
body.theme-light.page-loading .checkout-section-sub,
body.theme-light.page-loading .checkout-field-hint,
body.theme-light.page-loading .checkout-owner-tag,
body.theme-light.page-loading .checkout-owner-name,
body.theme-light.page-loading .checkout-order-line-title,
body.theme-light.page-loading .checkout-order-line-qty,
body.theme-light.page-loading .checkout-order-line-name,
body.theme-light.page-loading .checkout-order-line-price,
body.theme-light.page-loading .checkout-order-line-base,
body.theme-light.page-loading .checkout-order-addons-label,
body.theme-light.page-loading .checkout-order-addon span,
body.theme-light.page-loading .checkout-order-addon-price,
body.theme-light.page-loading .checkout-order-line-sub span,
body.theme-light.page-loading .checkout-whatsapp-btn,
body.theme-light.page-loading .checkout-whatsapp-btn-text,
body.theme-light.page-loading .checkout-input,
body.theme-light.page-loading .checkout-select {
    background-image: linear-gradient(
        90deg,
        var(--skeleton-base-light) 0%,
        var(--skeleton-highlight-light) 50%,
        var(--skeleton-base-light) 100%
    ) !important;
}

@media (prefers-reduced-motion: reduce) {
    body.page-loading .page-title,
    body.page-loading .page-subtitle,
    body.page-loading .eyebrow,
    body.page-loading .service-badge,
    body.page-loading .menu-card h2,
    body.page-loading .menu-card p,
    body.page-loading .menu-tag,
    body.page-loading .btn-pill,
    body.page-loading .table-chip,
    body.page-loading .summary-stats strong,
    body.page-loading .summary-stats span,
    body.page-loading .panel-tag,
    body.page-loading .panel-header h2,
    body.page-loading .panel-header p,
    body.page-loading .verification-pill,
    body.page-loading .profile-copy h1,
    body.page-loading .profile-copy p,
    body.page-loading .profile-status,
    body.page-loading .side-action,
    body.page-loading .field-label,
    body.page-loading .gender-option span,
    body.page-loading .dark-input,
    body.page-loading .form-actions .btn,
    body.page-loading .back-link,
    body.page-loading .pedidos-eyebrow,
    body.page-loading .pedidos-title,
    body.page-loading .pedidos-subtitle,
    body.page-loading .mesas-eyebrow,
    body.page-loading .mesas-title,
    body.page-loading .mesas-subtitle,
    body.page-loading .productos-eyebrow,
    body.page-loading .productos-title,
    body.page-loading .productos-section-title,
    body.page-loading .productos-group-title,
    body.page-loading .filter-chip,
    body.page-loading .mesas-search,
    body.page-loading .mesas-select,
    body.page-loading .productos-search,
    body.page-loading .productos-primary-btn,
    body.page-loading .category-item,
    body.page-loading .category-icon,
    body.page-loading .category-name,
    body.page-loading .category-count,
    body.page-loading .filter-btn,
    body.page-loading .view-btn,
    body.page-loading .product-card,
    body.page-loading .product-tag,
    body.page-loading .product-name,
    body.page-loading .product-price,
    body.page-loading .add-dish-button,
    body.page-loading .add-product-card h4,
    body.page-loading .btn-layout-primary,
    body.page-loading .btn-layout-secondary,
    body.page-loading .btn-layout-link,
    body.page-loading .table-list-item,
    body.page-loading .table-list-name,
    body.page-loading .table-list-amount,
    body.page-loading .table-list-meta,
    body.page-loading .layout-legend,
    body.page-loading .layout-legend span,
    body.page-loading .cashier-block,
    body.page-loading .layout-table,
    body.page-loading .table-capacity,
    body.page-loading .order-person h2,
    body.page-loading .order-id,
    body.page-loading .detail-label,
    body.page-loading .detail-row strong,
    body.page-loading .stat-row span,
    body.page-loading .stat-row strong,
    body.page-loading .status-badge,
    body.page-loading .card-illustration,
    body.page-loading .profile-avatar-wrap,
    body.page-loading .sidebar-profile img,
    body.page-loading .order-avatar,
    body.page-loading .product-image-wrap,
    body.page-loading .checkout-page-eyebrow,
    body.page-loading .checkout-page-title,
    body.page-loading .checkout-field-label,
    body.page-loading .checkout-document-hint,
    body.page-loading .checkout-card-title,
    body.page-loading .checkout-order-id,
    body.page-loading .checkout-account-total-heading,
    body.page-loading .checkout-order-summary-label,
    body.page-loading .checkout-order-summary-val,
    body.page-loading .checkout-total-label,
    body.page-loading .checkout-total-value,
    body.page-loading .checkout-account-pay-btn,
    body.page-loading .np-quick-action,
    body.page-loading .checkout-split-title,
    body.page-loading .checkout-split-hint,
    body.page-loading .checkout-split-name,
    body.page-loading .checkout-split-pay-btn,
    body.page-loading .checkout-split-paid-badge,
    body.page-loading .checkout-split-line dt,
    body.page-loading .checkout-split-line dd,
    body.page-loading .checkout-split-check,
    body.page-loading .checkout-section-title,
    body.page-loading .checkout-section-sub,
    body.page-loading .checkout-field-hint,
    body.page-loading .checkout-owner-tag,
    body.page-loading .checkout-owner-name,
    body.page-loading .checkout-order-line-title,
    body.page-loading .checkout-order-line-qty,
    body.page-loading .checkout-order-line-name,
    body.page-loading .checkout-order-line-price,
    body.page-loading .checkout-order-line-base,
    body.page-loading .checkout-order-addons-label,
    body.page-loading .checkout-order-addon span,
    body.page-loading .checkout-order-addon-price,
    body.page-loading .checkout-order-line-sub span,
    body.page-loading .checkout-whatsapp-btn,
    body.page-loading .checkout-whatsapp-btn-text,
    body.page-loading .checkout-input,
    body.page-loading .checkout-select {
        animation: none !important;
    }
}

/* Tablet/móvil: sidebar a 100% de ancho no debe compartir fila con <main> (banda vacía + doble scroll). */
@media (max-width: 991.98px) {
    .meseros-shell {
        flex-direction: column;
        align-items: stretch;
        max-width: 100%;
        overflow-x: hidden;
    }

    .meseros-shell > main {
        width: 100%;
        max-width: 100%;
        min-width: 0;
    }
}

/* Loader global (meseros-loader.js) */
.meseros-app-loader {
    position: fixed;
    inset: 0;
    z-index: 120000;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.18s ease, visibility 0.18s ease;
}

.meseros-app-loader.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
}

.meseros-app-loader-backdrop {
    position: absolute;
    inset: 0;
    background: #ffffff;
    backdrop-filter: none;
}

.meseros-app-loader-core {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.meseros-app-loader-core img {
    display: block;
    width: 220px;
    height: 220px;
    object-fit: contain;
    filter: drop-shadow(0 14px 32px rgba(0, 0, 0, 0.22));
}

body.theme-light .meseros-app-loader-backdrop {
    background: #ffffff;
}

body.theme-light .meseros-app-loader-core {
    background: transparent;
    box-shadow: none;
}

body.theme-light .meseros-app-loader-core img {
    filter: drop-shadow(0 8px 20px rgba(60, 52, 75, 0.18));
}

body.meseros-loader-active {
    overflow: hidden;
}
