@import url('https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@400;500;600;700;800&display=swap');

:root {
    --app-primary: var(--color-primary, #0057c8);
    --app-primary-dark: #003f9e;
    --app-accent: #2f4fb3;
    --app-success: #168a55;
    --app-warning: #b7791f;
    --app-danger: #c2413a;
    --app-bg: #f4f7fb;
    --app-surface: #ffffff;
    --app-surface-2: #f8fafc;
    --app-card: #ffffff;
    --app-soft: #f8fafc;
    --app-primary-soft: rgba(0, 87, 200, 0.1);
    --app-border: #dbe3ec;
    --app-text: #172033;
    --app-muted: #64748b;
    --app-shadow-soft: 0 6px 16px rgba(15, 23, 42, 0.05);
    --app-radius-sm: 8px;
    --app-sidebar: #ffffff;
    --app-sidebar-text: #334155;
    --app-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
    --app-radius: 8px;
    --sidebar-open: 248px;
    --sidebar-closed: 76px;
    --navbar-height: 64px;
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
}

body {
    margin: 0;
    font-family: 'Nunito Sans', Arial, sans-serif;
    background: var(--app-bg);
    color: var(--app-text);
    font-size: 15px;
    letter-spacing: 0;
}

a {
    color: var(--app-primary);
}

a:hover {
    color: var(--app-primary-dark);
    text-decoration: none;
}

.btn {
    border-radius: 7px;
    font-weight: 700;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
}

.btn-primary {
    background: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
    color: #ffffff !important;
}

.btn-primary:hover,
.btn-primary:focus {
    background: var(--app-primary-dark) !important;
    border-color: var(--app-primary-dark) !important;
}

.btn-light {
    background: #eef4f8;
    border-color: #dbe3ec;
    color: var(--app-text);
}

.btn-outline-secondary {
    border-color: #cbd5e1;
    color: #475569;
}

.form-control {
    border-radius: 7px;
    border-color: var(--app-border);
    min-height: 42px;
    color: var(--app-text);
}

.form-control:focus,
.search-control input:focus {
    border-color: rgba(0, 87, 200, 0.6);
    box-shadow: 0 0 0 3px rgba(0, 87, 200, 0.12);
    outline: 0;
}

label {
    color: var(--app-text);
    font-weight: 700;
}

.login-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: var(--app-bg);
}

.bg-e8effa {
    background: var(--app-bg);
}

.bordeMenu {
    border-bottom: 1px solid var(--app-border);
}

.menufixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 72px;
    z-index: 1020;
    background: var(--app-surface) !important;
}

.menufixed img {
    max-height: 60px;
}

.loginForm {
    min-height: calc(100vh - 112px);
    margin: 0;
    padding: 104px 18px 76px;
}

.loginForm .card {
    border: 1px solid var(--app-border);
    border-radius: 0;
    box-shadow: var(--app-shadow);
    background: var(--app-surface);
}

.loginForm .card-header {
    min-height: 48px;
    display: flex;
    align-items: center;
    padding: 0 20px;
    background: var(--app-surface-2);
    border-bottom: 1px solid var(--app-border);
    color: var(--app-text);
    font-weight: 800;
}

.loginForm .card-body {
    padding: 34px 36px;
}

.loginForm .form-control {
    min-height: 44px;
}

.loginForm .btn-primary {
    min-width: 150px;
    margin-top: 28px;
}

.footer {
    position: fixed;
    left: 8px;
    bottom: 8px;
    color: #64748b;
    font-weight: 800;
}

.footer p {
    margin: 0;
}

.loading {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: 1s all;
    opacity: 0;
    pointer-events: none;
}

.loading.show {
    opacity: 1;
}

.loading .spin,
.module-loader .spin {
    border: 3px solid rgba(0, 87, 200, 0.2);
    border-top-color: var(--app-primary);
    border-radius: 50%;
    width: 3em;
    height: 3em;
    animation: spin 1s linear infinite;
}

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

.login-card {
    width: min(410px, 100%);
    padding: 28px;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow);
}

.login-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px;
}

.login-brand h1 {
    margin: 0;
    font-size: 1.55rem;
    font-weight: 800;
}

.login-brand p {
    margin: 2px 0 0;
    color: var(--app-muted);
    font-weight: 700;
}

.brand-mark,
.navbar-logo-mark {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    color: #fff;
    background: var(--app-primary);
    border-radius: 8px;
    font-weight: 900;
}

.login-card label {
    display: block;
    margin-top: 14px;
}

.login-card input {
    width: 100%;
    min-height: 42px;
    padding: 0 12px;
    border: 1px solid var(--app-border);
    border-radius: 7px;
}

.login-card button {
    width: 100%;
    margin-top: 18px;
}

.alert,
.inline-status {
    padding: 10px 12px;
    border-radius: 7px;
    background: rgba(0, 87, 200, 0.08);
    color: var(--app-primary-dark);
    font-weight: 700;
}

.error {
    background: #fff1f0;
    color: var(--app-danger);
}

.dashboard-layout .sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--sidebar-open);
    background: var(--app-sidebar);
    border-right: 1px solid var(--app-border);
    z-index: 1040;
    transition: width .18s ease;
}

.dashboard-layout .sidebar.collapsed {
    width: var(--sidebar-closed);
}

.sidebar-brand {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: var(--navbar-height);
    padding: 0 16px;
    border-bottom: 1px solid var(--app-border);
    font-weight: 900;
}

.collapse-btn {
    width: 42px;
    height: 42px;
    border: 0;
    border-radius: 8px;
    color: var(--app-primary);
    background: rgba(0, 87, 200, 0.08);
    cursor: pointer;
}

.sidebar-nav {
    display: grid;
    gap: 6px;
    padding: 16px 12px;
}

.sidebar-nav a,
.sidebar-actions a,
.sidebar-actions button {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 44px;
    padding: 0 12px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--app-sidebar-text);
    font-weight: 800;
    cursor: pointer;
}

.sidebar-nav a i,
.sidebar-actions a i,
.sidebar-actions button i {
    width: 22px;
    text-align: center;
    color: var(--app-primary);
}

.sidebar-nav a:hover,
.sidebar-actions a:hover,
.sidebar-actions button:hover,
.sidebar-nav a.active {
    background: rgba(0, 87, 200, 0.09);
    color: var(--app-primary-dark);
}

.sidebar-nav a.is-disabled {
    opacity: .48;
    pointer-events: none;
}

.dashboard-layout .sidebar.collapsed span {
    display: none;
}

.dashboard-layout .sidebar.collapsed .sidebar-brand {
    justify-content: center;
}

.dashboard-layout .sidebar.collapsed .sidebar-nav a,
.dashboard-layout .sidebar.collapsed .sidebar-actions a,
.dashboard-layout .sidebar.collapsed .sidebar-actions button {
    justify-content: center;
    padding: 0;
}

.sidebar-actions {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 16px;
    display: grid;
    gap: 6px;
}

.navbar {
    position: fixed;
    top: 0;
    left: var(--sidebar-open);
    right: 0;
    height: var(--navbar-height);
    background: var(--app-surface);
    border-bottom: 1px solid var(--app-border);
    z-index: 1030;
    transition: left .18s ease;
}

.navbar.collapsed {
    left: var(--sidebar-closed);
}

.navbar-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 900;
}

.navbar-brand span:last-child {
    color: var(--app-muted);
    font-size: .85rem;
}

.profile-button {
    width: 42px;
    height: 42px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
}

.perfil-avatar-iniciales {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(0, 87, 200, 0.12);
    color: var(--app-primary);
    font-weight: 900;
}

.content {
    min-height: 100vh;
    margin-left: var(--sidebar-open);
    padding: calc(var(--navbar-height) + 24px) 24px 24px;
    transition: margin-left .18s ease;
}

.content.collapsed {
    margin-left: var(--sidebar-closed);
}

.module-shell {
    max-width: 1480px;
    margin: 0 auto 18px;
}

.module-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.module-title {
    display: flex;
    align-items: center;
    gap: 14px;
}

.module-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 8px;
    background: rgba(0, 87, 200, 0.1);
    color: var(--app-primary);
    font-size: 1.25rem;
}

.module-title h1,
.form-panel-header h2 {
    margin: 0;
    color: var(--app-text);
    font-size: 1.6rem;
    font-weight: 900;
}

.module-title p,
.form-panel-header p {
    margin: 2px 0 0;
    color: var(--app-muted);
    font-weight: 600;
}

.module-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 16px;
}

.module-tile {
    display: grid;
    gap: 8px;
    min-height: 145px;
    padding: 18px;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow);
    color: var(--app-text);
}

.module-tile:hover,
.module-tile:focus {
    transform: translateY(-1px);
    color: var(--app-text);
}

.module-tile i {
    color: var(--app-primary);
    font-size: 1.5rem;
}

.module-tile strong {
    font-size: 1.2rem;
    font-weight: 900;
}

.module-tile span {
    color: var(--app-muted);
    font-weight: 700;
}

.module-tile.is-disabled {
    opacity: .62;
}

.module-panel {
    max-width: 1480px;
    margin: 0 auto 16px;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow);
}

.module-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
}

.module-toolbar-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.search-control {
    flex: 1;
    max-width: 420px;
    min-width: 220px;
    position: relative;
}

.search-control i {
    position: absolute;
    top: 50%;
    left: 14px;
    transform: translateY(-50%);
    color: var(--app-muted);
}

.search-control input {
    width: 100%;
    height: 42px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 0 12px 0 40px;
    color: var(--app-text);
}

.table-panel {
    padding: 0;
}

.table-panel .inline-status {
    margin: 14px;
}

.table-responsive {
    overflow-x: auto;
}

.module-table {
    margin: 0;
    color: var(--app-text);
}

.module-table thead th {
    background: var(--app-surface);
    border-top: 0;
    border-bottom: 1px solid var(--app-border);
    color: var(--app-muted);
    font-size: 0.82rem;
    text-transform: uppercase;
    font-weight: 800;
}

.module-table td,
.module-table th {
    padding: 13px 16px;
    vertical-align: middle;
    border-color: var(--app-border);
    white-space: nowrap;
}

.text-right {
    text-align: right !important;
}

.empty-cell {
    color: var(--app-muted);
    text-align: center !important;
}

.form-panel {
    padding: 16px;
}

.form-panel-header,
.form-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 12px;
    margin: 14px 0;
}

.form-grid label {
    margin: 0;
}

.form-actions {
    justify-content: flex-end;
}

.actions-cell {
    display: flex;
    gap: 8px;
}

.btn-small,
.icon-action {
    min-width: 34px;
    min-height: 34px;
    border: 1px solid rgba(0, 87, 200, 0.14);
    border-radius: 8px;
    padding: 0 10px;
    color: var(--app-primary);
    background: rgba(0, 87, 200, 0.08);
    font-weight: 800;
}

.btn-small:hover,
.icon-action:hover {
    background: rgba(0, 87, 200, 0.14);
}

.btn-small.danger,
.icon-action.is-danger {
    color: var(--app-danger);
    background: rgba(194, 65, 58, 0.1);
    border-color: rgba(194, 65, 58, 0.18);
}

.status-pill {
    display: inline-flex;
    align-items: center;
    min-height: 26px;
    padding: 4px 9px;
    border-radius: 999px;
    color: var(--app-primary-dark);
    background: rgba(0, 87, 200, 0.1);
    font-size: 12px;
    font-weight: 800;
}

.status-3 {
    color: #991b1b;
    background: #fee2e2;
}

.status-4 {
    color: #166534;
    background: #dcfce7;
}

.status-5 {
    color: #92400e;
    background: #fef3c7;
}

.profile-layout {
    display: grid;
    grid-template-columns: minmax(240px, 320px) minmax(0, 1fr);
    gap: 18px;
}

.profile-photo-panel,
.profile-password-panel {
    min-height: 100%;
}

.profile-photo-panel .module-panel-body {
    display: grid;
    gap: 18px;
    justify-items: center;
    text-align: center;
}

.profile-photo-preview {
    display: grid;
    place-items: center;
    width: 156px;
    height: 156px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
    overflow: hidden;
}

.profile-photo-preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.perfil-avatar-grande {
    width: 96px;
    height: 96px;
    font-size: 2rem;
}

.password-change-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
}

.password-change-grid label {
    display: grid;
    gap: 8px;
    margin: 0;
}

.profile-form-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 18px;
}

@media (max-width: 920px) {
    .dashboard-layout .sidebar {
        width: var(--sidebar-closed);
    }

    .dashboard-layout .sidebar span {
        display: none;
    }

    .navbar,
    .navbar.collapsed {
        left: var(--sidebar-closed);
    }

    .content,
    .content.collapsed {
        margin-left: var(--sidebar-closed);
        padding: calc(var(--navbar-height) + 16px) 14px 16px;
    }

    .module-header,
    .module-toolbar,
    .form-panel-header {
        align-items: stretch;
        flex-direction: column;
    }

    .module-toolbar-actions,
    .search-control {
        width: 100%;
        max-width: none;
    }

    .profile-layout,
    .password-change-grid {
        grid-template-columns: 1fr;
    }
}

.module-shell {
    position: relative;
}

.module-shell.is-module-loading {
    min-height: 260px;
}

.module-loader {
    position: absolute;
    inset: 0;
    z-index: 20;
    display: grid;
    place-items: center;
    background: rgba(244, 247, 251, 0.82);
    backdrop-filter: blur(2px);
}

.module-loader-card {
    display: grid;
    gap: 12px;
    place-items: center;
    min-width: 220px;
    padding: 22px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-surface);
    color: var(--app-text);
    box-shadow: var(--app-shadow);
}

.inline-field-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
}

.inline-field-row .swal2-input {
    margin: 0 !important;
}

.inline-field-row .btn {
    min-height: 42px;
    margin: 0;
}

.reservation-swal-form .inline-status {
    margin-top: 8px;
    padding: 10px 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.availability-panel {
    display: grid;
    gap: 12px;
}

.availability-controls {
    display: flex;
    align-items: center;
    gap: 8px;
}

.availability-controls .form-control {
    min-width: 158px;
}

.availability-grid {
    --availability-days: 14;
    display: grid;
    grid-template-columns: minmax(150px, 190px) repeat(var(--availability-days), minmax(92px, 1fr));
    gap: 6px;
    overflow-x: auto;
    padding-bottom: 4px;
}

.availability-cell {
    min-height: 52px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 8px;
    background: var(--app-surface);
    color: var(--app-text);
    text-align: left;
}

.availability-cell.is-heading {
    min-height: 38px;
    background: var(--app-surface-2);
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
    text-align: center;
    text-transform: uppercase;
}

.availability-room {
    display: grid;
    gap: 2px;
    align-content: center;
}

.availability-room span,
.availability-room small,
.availability-day small {
    color: var(--app-muted);
    font-size: 12px;
}

.availability-day {
    display: grid;
    gap: 2px;
    align-content: center;
    cursor: pointer;
    font: inherit;
}

.availability-day.is-free {
    border-color: rgba(22, 101, 52, 0.28);
    background: #ecfdf3;
    color: #166534;
}

.availability-day.is-free small {
    color: #15803d;
}

.availability-day.is-free:hover {
    border-color: rgba(22, 101, 52, 0.46);
    background: #dcfce7;
}

.availability-day.is-busy {
    border-color: rgba(153, 27, 27, 0.2);
    background: #fff1f2;
    color: #991b1b;
    cursor: default;
}

.availability-day.is-busy small {
    color: #b45309;
}

@media (max-width: 760px) {
    .availability-controls {
        width: 100%;
        align-items: stretch;
        flex-direction: column;
    }

    .availability-grid {
        grid-template-columns: minmax(136px, 160px) repeat(var(--availability-days), minmax(82px, 1fr));
    }
}

.reservation-detail {
    display: grid;
    gap: 14px;
    text-align: left;
}

.detail-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
    gap: 10px;
}

.detail-summary-item {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.detail-summary-item span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.detail-summary-item strong {
    color: var(--app-text);
    font-size: 14px;
}

.detail-summary-item.is-balance strong {
    color: var(--app-danger);
}

.detail-table-wrap {
    max-height: 280px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
}

.detail-table {
    margin: 0;
}

.detail-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.detail-columns section {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 12px;
    background: var(--app-surface);
}

.detail-columns h3 {
    margin: 0 0 10px;
    color: var(--app-text);
    font-size: 14px;
}

.detail-line {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-top: 1px solid var(--app-border);
}

.detail-line:first-of-type {
    border-top: 0;
}

.detail-line span,
.detail-empty {
    color: var(--app-muted);
    font-size: 13px;
}

.detail-line strong {
    white-space: nowrap;
}

.detail-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
}

.service-list {
    display: grid;
    gap: 4px;
    max-height: 220px;
    overflow: auto;
    padding: 8px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.service-row {
    grid-template-columns: minmax(0, 1fr) auto auto auto;
}

.service-row span {
    display: grid;
    gap: 2px;
}

.service-row small {
    color: var(--app-muted);
    font-size: 11px;
}

.btn.danger {
    color: var(--app-danger);
    border-color: rgba(194, 65, 58, 0.22);
    background: rgba(194, 65, 58, 0.08);
}

.btn.danger:hover {
    background: rgba(194, 65, 58, 0.14);
}

.module-filters {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    align-items: end;
    gap: 12px;
    margin-top: 16px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.module-filters label {
    display: grid;
    gap: 6px;
    margin: 0;
}

.module-filters label span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.module-filters .btn {
    min-height: 42px;
}

.operation-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    margin: 0 0 16px;
}

.operation-summary-item {
    display: grid;
    gap: 6px;
    min-height: 86px;
    padding: 14px 16px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    color: var(--app-text);
    text-align: left;
    box-shadow: var(--app-shadow);
    cursor: pointer;
}

.operation-summary-item span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.operation-summary-item strong {
    color: var(--app-primary);
    font-size: 30px;
    line-height: 1;
}

.operation-summary-item.is-warning strong {
    color: var(--app-warning);
}

.operation-summary-item.is-success strong {
    color: var(--app-success);
}

.operation-summary-item:hover,
.operation-summary-item:focus {
    border-color: rgba(0, 87, 200, 0.45);
    outline: 0;
}

.employee-productivity {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
}

.employee-productivity-card {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.employee-productivity-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.employee-productivity-card strong {
    color: var(--app-text);
}

.employee-productivity-card small,
.employee-productivity-metric span {
    color: var(--app-muted);
}

.employee-productivity-metrics {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}

.employee-productivity-metric {
    display: grid;
    gap: 2px;
    padding: 8px;
    border-radius: 8px;
    background: var(--app-surface-2);
}

.employee-productivity-metric b {
    color: var(--app-primary);
    font-size: 20px;
    line-height: 1;
}

.operation-exits {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 12px;
}

.operation-exit-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow);
}

.operation-exit-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.operation-exit-card strong {
    color: var(--app-text);
}

.operation-exit-card small,
.operation-exit-body span {
    color: var(--app-muted);
}

.operation-exit-body {
    display: grid;
    gap: 6px;
    font-size: 13px;
}

.operation-exit-body span {
    display: flex;
    align-items: center;
    gap: 8px;
}

.operation-exit-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.availability-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 10px;
    margin: 10px 0 12px;
}

.availability-summary-item {
    display: grid;
    gap: 4px;
    padding: 10px 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.availability-summary-item span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.availability-summary-item strong {
    color: var(--app-primary);
    font-size: 22px;
    line-height: 1;
}

.availability-legend {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 0 0 12px;
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 700;
}

.availability-legend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.legend-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    border: 1px solid var(--app-border);
}

.legend-dot.is-free {
    background: rgba(37, 120, 92, 0.18);
    border-color: rgba(37, 120, 92, 0.5);
}

.legend-dot.is-busy {
    background: rgba(194, 65, 58, 0.18);
    border-color: rgba(194, 65, 58, 0.5);
}

.legend-dot.is-today,
.availability-cell.is-today {
    box-shadow: inset 0 0 0 2px rgba(0, 87, 200, 0.35);
}

.availability-controls select.form-control {
    min-width: 105px;
}

.availability-filterbar {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    align-items: end;
    gap: 10px;
    margin: 10px 0 12px;
    padding: 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.availability-filterbar label {
    display: grid;
    gap: 6px;
    margin: 0;
}

.availability-filterbar label span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
}

.quick-client-panel {
    display: grid;
    gap: 10px;
    margin: 8px 0 10px;
    padding: 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.quick-client-panel[hidden] {
    display: none;
}

.reservation-debt-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 12px;
}

.reservation-debt-card {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    box-shadow: var(--app-shadow);
}

.reservation-debt-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.reservation-debt-card strong {
    color: var(--app-text);
}

.reservation-debt-card small {
    color: var(--app-muted);
}

.reservation-debt-metrics {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
}

.reservation-debt-metrics span {
    display: grid;
    gap: 2px;
    padding: 8px;
    border-radius: 8px;
    background: var(--app-surface-2);
    color: var(--app-text);
}

.reservation-debt-metrics b {
    color: var(--app-muted);
    font-size: 11px;
    text-transform: uppercase;
}

.detail-log {
    margin-top: 16px;
}

.detail-log h3 {
    margin: 0 0 10px;
}

.detail-log-line {
    align-items: flex-start;
    display: grid;
    gap: 4px;
}

.detail-log-line span {
    display: block;
}

.detail-log-line small {
    color: var(--app-muted);
    font-size: 12px;
}

.home-today-panel {
    margin-bottom: 18px;
}

.home-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.home-summary-card {
    display: grid;
    align-content: start;
    gap: 10px;
    min-height: 190px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.home-summary-card header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--app-border);
}

.home-summary-card header span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--app-muted);
    font-weight: 800;
}

.home-summary-card header strong {
    color: var(--app-primary);
    font-size: 22px;
    font-weight: 900;
}

.home-summary-line {
    display: grid;
    gap: 2px;
    padding: 8px;
    border: 1px solid transparent;
    border-radius: 7px;
    color: var(--app-text);
}

.home-summary-line:hover {
    border-color: var(--app-border);
    background: var(--app-surface-2);
    color: var(--app-primary);
}

.home-summary-line span {
    font-weight: 800;
}

.home-summary-line small,
.home-summary-empty {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 700;
}

@media (max-width: 1180px) {
    .home-summary-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 700px) {
    .home-summary-grid {
        grid-template-columns: 1fr;
    }
}

.turno-detail {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(128px, 1fr));
    gap: 8px;
    margin-top: 12px;
    padding: 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.turno-detail[hidden] {
    display: none;
}

.turno-detail div {
    display: grid;
    gap: 4px;
    min-height: 58px;
    padding: 9px 10px;
    border: 1px solid var(--app-border);
    border-radius: 7px;
    background: var(--app-surface-2);
}

.turno-detail span,
.turno-detail small {
    color: var(--app-muted);
    font-size: 11px;
    font-weight: 800;
    text-transform: uppercase;
}

.turno-detail strong {
    color: var(--app-primary);
    font-size: 16px;
    line-height: 1.1;
}

.turno-detail small {
    grid-column: 1 / -1;
    text-transform: none;
}
.stats-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.stats-card {
    display: grid;
    gap: 6px;
    min-height: 112px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.stats-card span,
.stats-card small {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
}

.stats-card strong {
    color: var(--app-primary);
    font-size: 22px;
    font-weight: 900;
}

.stats-panels {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.stats-list {
    display: grid;
    gap: 8px;
}

.stats-row {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.stats-row div,
.stats-row b {
    position: relative;
    z-index: 1;
}

.stats-row strong,
.stats-row span {
    display: block;
}

.stats-row span,
.stats-empty {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
}

.stats-row b {
    color: var(--app-primary);
    font-weight: 900;
}

.stats-row i {
    position: absolute;
    inset: auto 0 0 0;
    height: 3px;
    width: var(--bar);
    background: var(--app-primary);
}

@media (max-width: 1180px) {
    .stats-grid,
    .stats-panels {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 700px) {
    .stats-grid,
    .stats-panels {
        grid-template-columns: 1fr;
    }
}
.stats-trend-panel {
    margin-bottom: 18px;
}

.stats-trend-list {
    display: grid;
    gap: 8px;
}

.stats-trend-row {
    position: relative;
    display: grid;
    grid-template-columns: 120px repeat(4, minmax(0, 1fr));
    gap: 10px;
    overflow: hidden;
    padding: 10px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.stats-trend-row::after {
    content: "";
    position: absolute;
    inset: auto 0 0 0;
    width: var(--bar);
    height: 3px;
    background: var(--app-primary);
}

.stats-trend-row strong,
.stats-trend-row span {
    position: relative;
    z-index: 1;
}

.stats-trend-row span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
}

.stats-trend-row b {
    color: var(--app-text);
}

@media (max-width: 900px) {
    .stats-trend-row {
        grid-template-columns: 1fr 1fr;
    }
}
.stats-range-presets {
    align-self: end;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.stats-range-presets .btn.is-active {
    border-color: var(--app-primary);
    color: var(--app-primary);
}
.stats-card .stats-delta {
    align-self: end;
    display: inline-flex;
    font-size: 11px;
}

.stats-delta.is-up {
    color: #13795b;
}

.stats-delta.is-down {
    color: #b42318;
}

.stats-delta.is-flat {
    color: var(--app-muted);
}
.swal-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    text-align: left;
}

.swal-form-grid .span-2 {
    grid-column: 1 / -1;
}

.swal-check {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    margin: 0;
    padding: 8px 10px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-soft);
    color: var(--app-text);
    font-weight: 700;
}

.swal-check input {
    width: 16px;
    height: 16px;
}

@media (max-width: 640px) {
    .swal-form-grid {
        grid-template-columns: 1fr;
    }
}

.config-launcher {
    padding-bottom: 14px;
}

.config-nav-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
    padding: 0 14px 14px;
}

.config-nav-card {
    display: grid;
    gap: 8px;
    min-height: 118px;
    padding: 16px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-surface);
    color: var(--app-text);
    text-align: left;
    cursor: pointer;
    transition: transform .16s ease, border-color .16s ease, background .16s ease;
}

.config-nav-card:hover,
.config-nav-card:focus {
    transform: translateY(-1px);
    border-color: var(--app-primary);
    outline: none;
}

.config-nav-card.is-active {
    border-color: var(--app-primary);
    background: rgba(0, 87, 200, 0.08);
}

.config-nav-card i {
    color: var(--app-primary);
    font-size: 1.35rem;
}

.config-nav-card strong {
    font-size: 1rem;
    font-weight: 900;
}

.config-nav-card span {
    color: var(--app-muted);
    font-size: .86rem;
    font-weight: 700;
}

.config-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding: 0 14px 14px;
}

.config-field {
    display: grid;
    gap: 6px;
    margin: 0;
}

.config-field.span-2 {
    grid-column: 1 / -1;
}

.config-field textarea.form-control {
    min-height: 84px;
    resize: vertical;
}

.config-check {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-surface-2);
    color: var(--app-text);
    font-weight: 800;
}

.config-check input {
    width: 17px;
    height: 17px;
}

@media (max-width: 720px) {
    .config-form-grid {
        grid-template-columns: 1fr;
    }

    .config-field.span-2 {
        grid-column: auto;
    }
}

.home-actions {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
    margin-bottom: 18px;
}

.home-action {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 82px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-surface);
    color: var(--app-text);
    text-decoration: none;
    box-shadow: var(--app-shadow-sm);
    transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.home-action:hover,
.home-action:focus {
    transform: translateY(-1px);
    border-color: var(--app-primary);
    box-shadow: var(--app-shadow);
    outline: none;
}

.home-action i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: rgba(0, 87, 200, 0.1);
    color: var(--app-primary);
    font-size: 1.05rem;
    flex: 0 0 auto;
}

.home-action span {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.home-action strong {
    color: var(--app-text);
    font-size: .98rem;
    font-weight: 900;
}

.home-action small {
    color: var(--app-muted);
    font-size: .82rem;
    font-weight: 700;
    line-height: 1.3;
}

.quick-client-panel .btn {
    justify-self: start;
}



.room-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

.room-summary-card {
    display: grid;
    gap: 6px;
    min-height: 86px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-surface-2);
}

.room-summary-card span {
    color: var(--app-muted);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.room-summary-card strong {
    color: var(--app-text);
    font-size: 1.35rem;
    font-weight: 900;
}

.service-summary-panel {
    padding: 14px;
}

.service-summary-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 12px;
}

.service-summary-card {
    display: grid;
    gap: 6px;
    min-height: 86px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-surface-2);
}

.service-summary-card span {
    color: var(--app-muted);
    font-size: .78rem;
    font-weight: 800;
    text-transform: uppercase;
}

.service-summary-card strong {
    color: var(--app-text);
    font-size: 1.18rem;
    font-weight: 900;
    line-height: 1.2;
}

.service-summary-card small {
    color: var(--app-muted);
    font-weight: 800;
}

/* Ciclo entorno comun POS: shell, login y perfil */
.menufixed {
    border-bottom: 1px solid var(--app-border);
}

.menufixed img {
    max-height: 52px;
}

.loginForm {
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--app-bg);
}

#login {
    width: 100%;
}

#login .card {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
}

#login .card-body {
    padding: 34px 36px;
}

#login .form-row {
    row-gap: 14px;
}

#login .form-control {
    height: 44px;
}

#login .btn[type="submit"] {
    margin-top: 14px;
    min-width: 150px;
}

.footer {
    left: 18px;
    right: 18px;
    bottom: 0;
    z-index: 1010;
    min-height: 48px;
    padding: 10px 0 14px;
    background: transparent;
    color: var(--app-muted);
    font-weight: 700;
    display: flex;
    align-items: center;
}

.dashboard-layout .sidebar {
    inset: 0 auto 0 0;
    box-shadow: 8px 0 24px rgba(15, 23, 42, 0.05);
    z-index: 1030;
    display: flex;
    flex-direction: column;
    transition: width 0.2s ease;
}

.sidebar-brand {
    height: var(--navbar-height);
    min-height: var(--navbar-height);
    gap: 10px;
    padding: 12px;
    overflow: visible;
}

.sidebar-brand span {
    font-size: 0.95rem;
    font-weight: 800;
    color: var(--app-text);
    white-space: nowrap;
}

.sidebar-nav {
    flex: 1;
    padding: 12px 10px;
    overflow-y: auto;
}

.dashboard-layout .sidebar.collapsed .sidebar-nav {
    overflow: visible;
}

.sidebar-nav a,
.sidebar-actions a,
.sidebar-actions button {
    position: relative;
    width: 100%;
    padding: 10px 12px;
    margin-bottom: 4px;
    text-align: left;
}

.dashboard-layout .sidebar.collapsed .sidebar-nav a,
.dashboard-layout .sidebar.collapsed .sidebar-actions a,
.dashboard-layout .sidebar.collapsed .sidebar-actions button {
    padding-inline: 8px;
}

.dashboard-layout .sidebar.collapsed [data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% + 10px);
    top: 50%;
    transform: translate(-4px, -50%);
    z-index: 2000;
    min-width: max-content;
    max-width: 220px;
    padding: 7px 10px;
    border-radius: 7px;
    background: #172033;
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.1;
    opacity: 0;
    pointer-events: none;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
    transition: opacity 0.14s ease, transform 0.14s ease;
}

.dashboard-layout .sidebar.collapsed [data-tooltip]:hover::after,
.dashboard-layout .sidebar.collapsed [data-tooltip]:focus-visible::after {
    opacity: 1;
    transform: translate(0, -50%);
}

.collapse-btn[data-tooltip] {
    position: relative;
}

.dashboard-layout .sidebar:not(.collapsed) .collapse-btn[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% + 10px);
    top: 50%;
    transform: translate(-4px, -50%);
    z-index: 2000;
    min-width: max-content;
    padding: 7px 10px;
    border-radius: 7px;
    background: #172033;
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.1;
    opacity: 0;
    pointer-events: none;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
    transition: opacity 0.14s ease, transform 0.14s ease;
}

.dashboard-layout .sidebar:not(.collapsed) .collapse-btn[data-tooltip]:hover::after,
.dashboard-layout .sidebar:not(.collapsed) .collapse-btn[data-tooltip]:focus-visible::after {
    opacity: 1;
    transform: translate(0, -50%);
}

.navbar {
    background: rgba(255, 255, 255, 0.92);
    backdrop-filter: blur(10px);
    z-index: 1020;
    transition: left 0.2s ease;
}

.navbar-brand {
    gap: 12px;
    color: var(--app-text);
    font-weight: 800;
}

.navbar-brand img {
    max-height: 38px;
}

.profile-button {
    border: 1px solid var(--app-border);
    background: var(--app-surface);
    overflow: visible;
    cursor: pointer;
}

.profile-button img,
.profile-button .perfil-avatar-iniciales {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    overflow: hidden;
}


.profile-button img {
    display: block;
    object-fit: cover;
}

.profile-button::after {
    display: none;
}

.profile-button[data-tooltip] {
    position: relative;
}

.profile-button[data-tooltip]::before {
    content: attr(data-tooltip);
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    z-index: 50;
    padding: 7px 10px;
    border: 1px solid var(--app-border);
    border-radius: 6px;
    background: var(--app-surface);
    color: var(--app-text);
    box-shadow: var(--app-shadow);
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transform: translateY(-4px);
    transition: opacity .16s ease, transform .16s ease;
}

.profile-button[data-tooltip]:hover::before,
.profile-button[data-tooltip]:focus-visible::before {
    opacity: 1;
    transform: translateY(0);
}
/* Ciclo perfil POS */
.profile-header-panel {
    padding: 20px 18px;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow);
}

.profile-layout-pos,
.profile-layout {
    display: grid;
    grid-template-columns: minmax(340px, 1.05fr) minmax(320px, .95fr);
    gap: 16px;
    align-items: stretch;
}

.profile-summary-panel {
    grid-row: span 2;
    padding: 18px;
}

.profile-summary-main {
    display: flex;
    align-items: center;
    gap: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--app-border);
}

.profile-summary-copy span,
.profile-info-item span,
.profile-upload-box span {
    display: block;
    color: var(--app-muted);
}

.profile-summary-copy h2 {
    margin: 2px 0 4px;
    font-size: 1.55rem;
    font-weight: 800;
    color: var(--app-text);
}

.profile-summary-copy p {
    margin: 0;
    color: var(--app-muted);
    overflow-wrap: anywhere;
}

.profile-info-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
    padding-top: 18px;
}

.profile-info-item {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.profile-info-item-wide {
    grid-column: 1 / -1;
}

.profile-info-item i,
.profile-upload-box i {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    color: var(--app-primary);
    background: rgba(0, 87, 200, 0.08);
}

.profile-info-item strong {
    display: block;
    min-width: 0;
    color: var(--app-text);
    overflow-wrap: anywhere;
}

.profile-photo-panel,
.profile-password-panel {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.profile-photo-panel .module-panel-body,
.profile-password-panel .module-panel-body {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.profile-password-panel form {
    flex: 1;
    min-height: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.password-change-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 14px;
}

.password-change-grid label {
    margin: 0;
    display: grid;
    gap: 8px;
}

.profile-form-actions {
    margin-top: 16px;
    display: flex;
    justify-content: flex-end;
}

.profile-photo-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
}

.profile-summary-avatar {
    width: 148px;
    height: 148px;
    border-radius: 50%;
    border: 3px solid rgba(0, 87, 200, 0.16);
    background: var(--app-surface);
    overflow: hidden;
}

.profile-summary-avatar img,
.profile-summary-avatar .perfil-avatar-iniciales {
    width: 100%;
    height: 100%;
    border-radius: 50%;
}

.profile-summary-avatar .perfil-avatar-iniciales {
    font-size: 2rem;
}

.profile-upload-box {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    margin-bottom: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.profile-upload-box strong {
    display: block;
    color: var(--app-text);
}

.profile-file-input .custom-file-label {
    border-color: var(--app-border);
    color: var(--app-text);
}

@media (max-width: 920px) {
    .profile-layout-pos,
    .profile-layout {
        grid-template-columns: 1fr;
    }

    .profile-summary-panel {
        grid-row: auto;
    }

    .profile-summary-main {
        align-items: flex-start;
    }

    .profile-info-grid,
    .password-change-grid {
        grid-template-columns: 1fr;
    }
}
/* Ciclo shell POS: densidad de dashboard y paneles */
.module-header {
    align-items: flex-start;
    gap: 18px;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    padding: 18px;
    box-shadow: var(--app-shadow);
}

.module-title {
    gap: 14px;
    min-width: 0;
}

.module-icon {
    width: 50px;
    height: 50px;
    border-radius: 8px;
    background: rgba(0, 87, 200, 0.1);
    color: var(--app-primary);
    font-size: 1.35rem;
    flex: 0 0 auto;
}

.module-title h1,
.form-panel-header h2 {
    font-size: 1.45rem;
    line-height: 1.2;
    font-weight: 800;
}

.module-title p,
.form-panel-header p {
    margin-top: 4px;
    line-height: 1.35;
}

.module-grid {
    gap: 14px;
}

.metric-card {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    padding: 16px;
    gap: 12px;
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.05);
}

.metric-icon {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    background: var(--app-surface-2);
    color: var(--app-primary);
}

.metric-card strong {
    font-size: 1.2rem;
    font-weight: 800;
}

.module-panel {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow);
    overflow: hidden;
}

.module-toolbar {
    gap: 12px;
    padding: 14px;
    background: var(--app-surface-2);
    border-bottom: 1px solid var(--app-border);
}

.module-panel-body {
    padding: 18px;
}

.btn,
.module-actions .btn,
.profile-form-actions .btn {
    min-height: 40px;
    padding-inline: 14px;
}
/* Ciclo perfil POS v2: layout ancho y sin encimes */
.profile-layout.profile-layout-pos {
    width: 100%;
    max-width: 1480px;
    margin: 0 auto 18px;
    display: grid;
    grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr);
    gap: 16px;
    align-items: stretch;
    justify-items: stretch;
}

.profile-layout.profile-layout-pos > .module-panel {
    width: 100%;
    min-width: 0;
    justify-self: stretch;
}

.profile-layout.profile-layout-pos .profile-summary-panel {
    grid-column: 1;
    grid-row: 1 / span 2;
}

.profile-layout.profile-layout-pos .profile-photo-panel {
    grid-column: 2;
    grid-row: 1;
}

.profile-layout.profile-layout-pos .profile-password-panel {
    grid-column: 2;
    grid-row: 2;
}

.profile-layout.profile-layout-pos .profile-photo-panel .module-panel-body,
.profile-layout.profile-layout-pos .profile-password-panel .module-panel-body {
    align-items: stretch;
    justify-items: stretch;
    text-align: left;
}

.profile-layout.profile-layout-pos .profile-upload-box {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    text-align: left;
    gap: 12px;
}

.profile-layout.profile-layout-pos .profile-upload-box i {
    flex: 0 0 38px;
}

.profile-layout.profile-layout-pos .profile-upload-box > div {
    flex: 1 1 auto;
    min-width: 0;
}

.profile-layout.profile-layout-pos .profile-upload-box strong,
.profile-layout.profile-layout-pos .profile-upload-box span {
    text-align: left;
    overflow-wrap: anywhere;
}

.profile-layout.profile-layout-pos .profile-file-input {
    width: 100%;
}

.profile-layout.profile-layout-pos .profile-summary-avatar {
    flex: 0 0 148px;
}

.profile-layout.profile-layout-pos .profile-info-item i {
    flex: 0 0 38px;
}

@media (max-width: 1100px) {
    .profile-layout.profile-layout-pos {
        grid-template-columns: 1fr;
    }

    .profile-layout.profile-layout-pos .profile-summary-panel,
    .profile-layout.profile-layout-pos .profile-photo-panel,
    .profile-layout.profile-layout-pos .profile-password-panel {
        grid-column: 1;
        grid-row: auto;
    }
}
/* Ciclo sidebar POS seguro: margenes, tooltip y sin scroll horizontal */
.dashboard-layout .sidebar {
    overflow: visible;
}

.sidebar-nav {
    display: block;
    padding: 10px 8px 118px;
    max-height: calc(100vh - var(--navbar-height) - 118px);
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
}

.sidebar-actions {
    left: 8px;
    right: 8px;
    bottom: 12px;
    gap: 4px;
}

.sidebar-nav a,
.sidebar-actions a,
.sidebar-actions button {
    position: relative;
    width: 100%;
    min-height: 40px;
    margin-bottom: 3px;
    padding: 8px 10px;
}

.dashboard-layout .sidebar.collapsed .sidebar-nav,
.dashboard-layout .sidebar.collapsed .sidebar-actions {
    overflow: visible;
}

.dashboard-layout .sidebar.collapsed .sidebar-nav a,
.dashboard-layout .sidebar.collapsed .sidebar-actions a,
.dashboard-layout .sidebar.collapsed .sidebar-actions button {
    width: 44px;
    min-height: 40px;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
}

.dashboard-layout .sidebar.collapsed [data-tooltip]::after,
.dashboard-layout .sidebar:not(.collapsed) .collapse-btn[data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% + 10px);
    top: 50%;
    transform: translate(-4px, -50%);
    z-index: 3000;
    min-width: max-content;
    max-width: 220px;
    padding: 7px 10px;
    border-radius: 7px;
    background: #172033;
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.1;
    opacity: 0;
    pointer-events: none;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
    transition: opacity 0.14s ease, transform 0.14s ease;
}

.dashboard-layout .sidebar.collapsed [data-tooltip]:hover::after,
.dashboard-layout .sidebar.collapsed [data-tooltip]:focus-visible::after,
.dashboard-layout .sidebar:not(.collapsed) .collapse-btn[data-tooltip]:hover::after,
.dashboard-layout .sidebar:not(.collapsed) .collapse-btn[data-tooltip]:focus-visible::after {
    opacity: 1;
    transform: translate(0, -50%);
}
/* Ciclo sidebar ayuda y tono POS */
.sidebar-nav a i,
.sidebar-actions a i,
.sidebar-actions button i,
.sidebar-help a i {
    color: inherit;
}

.sidebar-help {
    padding: 10px;
    border-top: 1px solid var(--app-border);
}

.sidebar-help a {
    position: relative;
    width: 100%;
    min-height: 44px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--app-sidebar-text);
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 12px;
    margin-bottom: 4px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.sidebar-help a i {
    width: 22px;
    text-align: center;
    font-size: 1.05rem;
}

.sidebar-help a:hover {
    background: rgba(0, 87, 200, 0.08);
    color: var(--app-primary);
}

.sidebar-actions {
    border-top: 1px solid var(--app-border);
}

.dashboard-layout .sidebar.collapsed .sidebar-help a {
    justify-content: center;
    padding-inline: 8px;
}

.dashboard-layout .sidebar.collapsed .sidebar-help span {
    display: none;
}

.dashboard-layout .sidebar.collapsed .sidebar-help [data-tooltip]::after {
    content: attr(data-tooltip);
    position: absolute;
    left: calc(100% + 10px);
    top: 50%;
    transform: translate(-4px, -50%);
    z-index: 3000;
    min-width: max-content;
    max-width: 220px;
    padding: 7px 10px;
    border-radius: 7px;
    background: #172033;
    color: #ffffff;
    font-size: 0.86rem;
    font-weight: 800;
    line-height: 1.1;
    opacity: 0;
    pointer-events: none;
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.18);
    transition: opacity 0.14s ease, transform 0.14s ease;
}

.dashboard-layout .sidebar.collapsed .sidebar-help [data-tooltip]:hover::after,
.dashboard-layout .sidebar.collapsed .sidebar-help [data-tooltip]:focus-visible::after {
    opacity: 1;
    transform: translate(0, -50%);
}
/* Ciclo sidebar ayuda v2: separacion inferior */
.sidebar-nav {
    padding-bottom: 136px;
    max-height: calc(100vh - var(--navbar-height) - 156px);
}

.sidebar-help {
    padding: 8px 10px;
    background: var(--app-sidebar);
}

.sidebar-help a {
    min-height: 40px;
    margin-bottom: 0;
    padding: 8px 10px;
}

.sidebar-actions {
    padding-top: 8px;
    background: var(--app-sidebar);
}

.sidebar-actions a,
.sidebar-actions button {
    min-height: 40px;
    margin-bottom: 2px;
}

.dashboard-layout .sidebar.collapsed .sidebar-help a,
.dashboard-layout .sidebar.collapsed .sidebar-actions a,
.dashboard-layout .sidebar.collapsed .sidebar-actions button {
    width: 44px;
    min-height: 40px;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
}
/* Ciclo sidebar ayuda v3: separadores completos */
.dashboard-layout .sidebar.collapsed .sidebar-help {
    width: 100%;
    padding: 8px 8px;
    border-top: 1px solid var(--app-border);
    box-sizing: border-box;
}

.dashboard-layout .sidebar.collapsed .sidebar-actions {
    left: 0;
    right: 0;
    width: 100%;
    padding: 8px 8px 10px;
    border-top: 1px solid var(--app-border);
    box-sizing: border-box;
}

.dashboard-layout .sidebar.collapsed .sidebar-help a,
.dashboard-layout .sidebar.collapsed .sidebar-actions a,
.dashboard-layout .sidebar.collapsed .sidebar-actions button {
    width: 44px;
    margin-left: auto;
    margin-right: auto;
}
/* Ciclo sidebar POS v4: columna estable sin encimes */
.dashboard-layout .sidebar {
    display: flex;
    flex-direction: column;
    overflow: visible;
    z-index: 1040;
}

.dashboard-layout .navbar {
    z-index: 1030;
}

.sidebar-brand {
    flex: 0 0 auto;
}

.sidebar-nav {
    flex: 1 1 auto;
    display: grid;
    align-content: start;
    gap: 6px;
    max-height: none;
    padding: 10px 8px 8px;
    overflow: visible;
}

.sidebar-help {
    flex: 0 0 auto;
    width: 100%;
    margin-top: auto;
    padding: 8px 8px;
    border-top: 1px solid var(--app-border);
    background: var(--app-sidebar);
    box-sizing: border-box;
}

.sidebar-actions {
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    flex: 0 0 auto;
    width: 100%;
    padding: 8px 8px 10px;
    border-top: 1px solid var(--app-border);
    background: var(--app-sidebar);
    box-sizing: border-box;
}

.sidebar-help a,
.sidebar-actions a,
.sidebar-actions button {
    width: 44px;
    min-height: 40px;
    margin: 0 auto 2px;
    padding: 0;
    justify-content: center;
}

.sidebar-help a {
    margin-bottom: 0;
}

.dashboard-layout .sidebar:not(.collapsed) .sidebar-help a,
.dashboard-layout .sidebar:not(.collapsed) .sidebar-actions a,
.dashboard-layout .sidebar:not(.collapsed) .sidebar-actions button {
    width: auto;
    justify-content: flex-start;
    padding: 0 12px;
}

.dashboard-layout .sidebar.collapsed .sidebar-help span,
.dashboard-layout .sidebar.collapsed .sidebar-actions span {
    display: none;
}
/* Ciclo sidebar negocio: nombre real con recorte */
.sidebar-brand {
    min-width: 0;
}

.sidebar-brand .sidebar-brand-name {
    display: block;
    min-width: 0;
    max-width: 156px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.dashboard-layout .sidebar.collapsed .sidebar-brand .sidebar-brand-name {
    display: none;
}
/* Ciclo sidebar acciones v5: eje inferior uniforme */
.sidebar-help,
.sidebar-actions {
    padding-left: 8px;
    padding-right: 8px;
}

.sidebar-help a,
.sidebar-actions a,
.sidebar-actions button {
    box-sizing: border-box;
    display: flex;
    align-items: center;
    gap: 12px;
    border: 0;
    appearance: none;
    -webkit-appearance: none;
    font: inherit;
    text-align: left;
}

.dashboard-layout .sidebar.collapsed .sidebar-help a,
.dashboard-layout .sidebar.collapsed .sidebar-actions a,
.dashboard-layout .sidebar.collapsed .sidebar-actions button {
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
    justify-content: center;
}

.dashboard-layout .sidebar:not(.collapsed) .sidebar-help a,
.dashboard-layout .sidebar:not(.collapsed) .sidebar-actions a,
.dashboard-layout .sidebar:not(.collapsed) .sidebar-actions button {
    width: 100%;
    min-width: 0;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-left: 12px;
    padding-right: 12px;
    justify-content: flex-start;
}

.sidebar-help a i,
.sidebar-actions a i,
.sidebar-actions button i {
    flex: 0 0 22px;
    width: 22px;
    text-align: center;
}
/* Ciclo sidebar acciones v6: recuperar peso visual */
.sidebar-help a,
.sidebar-actions a,
.sidebar-actions button {
    font-weight: 800;
    color: var(--app-sidebar-text);
}

.sidebar-help a span,
.sidebar-actions a span,
.sidebar-actions button span {
    font-weight: 800;
}
/* Ciclo habitaciones vista operativa */
.rooms-board-panel {
    padding: 18px;
}

.section-heading-inline {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 14px;
}

.section-heading-inline h2 {
    margin: 0 0 4px;
    font-size: 1.05rem;
    font-weight: 900;
    color: var(--app-text);
}

.section-heading-inline p {
    margin: 0;
    color: var(--app-muted);
    font-size: 0.9rem;
}

.rooms-card-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    gap: 12px;
}

.room-card {
    display: flex;
    flex-direction: column;
    min-height: 236px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.06);
}

.room-card-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.room-card-label,
.room-card-metrics span {
    display: block;
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.room-card-top strong {
    display: block;
    margin-top: 2px;
    color: var(--app-text);
    font-size: 1.85rem;
    font-weight: 900;
    line-height: 1;
}

.room-card-status {
    flex: 0 0 auto;
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(0, 87, 200, 0.1);
    color: var(--app-primary);
    font-size: 0.78rem;
    font-weight: 900;
}


.room-card-type {
    min-height: 42px;
    margin: 12px 0;
    color: var(--app-text);
    font-weight: 800;
    line-height: 1.35;
}

.room-card-metrics {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin-bottom: 12px;
}

.room-card-metrics div {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 9px 10px;
    border: 1px solid var(--app-border);
    border-radius: 7px;
    background: var(--app-surface-2);
}

.room-card-metrics strong {
    color: var(--app-text);
    font-weight: 900;
    text-align: right;
}

.room-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: auto;
}

.room-card-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 36px;
    padding: 0 10px;
    border: 1px solid var(--app-border);
    border-radius: 7px;
    background: var(--app-surface-2);
    color: var(--app-primary);
    font-weight: 900;
    cursor: pointer;
}

.room-card-action:hover {
    background: rgba(0, 87, 200, 0.1);
}

.room-card-action.danger {
    color: var(--app-danger);
}

.rooms-empty-state {
    grid-column: 1 / -1;
    padding: 18px;
    border: 1px dashed var(--app-border);
    border-radius: 8px;
    color: var(--app-muted);
    font-weight: 800;
    text-align: center;
}


@media (max-width: 720px) {
    .rooms-card-grid {
        grid-template-columns: 1fr;
    }
}
/* Ciclo habitaciones filtros compactos y paginacion POS */
.rooms-control-panel .rooms-toolbar {
    align-items: center;
    gap: 12px;
}

.rooms-filter-group {
    display: flex;
    align-items: stretch;
    flex: 1 1 620px;
    max-width: 760px;
    min-width: 280px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    overflow: hidden;
}

.rooms-filter-group .search-control {
    flex: 1 1 390px;
    max-width: none;
    min-width: 220px;
}

.rooms-filter-group .search-control input {
    height: 42px;
    border: 0;
    border-radius: 0;
}



.rooms-status-panel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 12px 14px;
}

.module-pager {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-left: auto;
}

.module-pager span {
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 900;
    text-align: center;
}

.module-pager .btn {
    min-height: 36px;
    min-width: 40px;
    padding: 0 12px;
}

.module-pager .btn[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}

@media (max-width: 900px) {
    .rooms-control-panel .module-toolbar,
    .rooms-control-panel .module-toolbar-actions {
        align-items: stretch;
        width: 100%;
    }

    .rooms-filter-group {
        flex: 1 1 100%;
        max-width: none;
        min-width: 0;
        flex-direction: column;
    }

    .rooms-filter-group .search-control {
        min-width: 0;
        width: 100%;
    }


    .rooms-status-panel {
        align-items: stretch;
        flex-direction: column;
    }

    .module-pager {
        width: 100%;
        justify-content: center;
        text-align: center;
    }

    .module-pager span {
        line-height: 1.25;
    }
}


/* Ciclo habitaciones formulario modal */
.room-form-popup .swal2-title {
    margin: 0;
    color: var(--app-text);
    font-size: 1.35rem;
    font-weight: 900;
}

.room-form-popup .swal2-html-container {
    margin: 14px 0 0;
    overflow: visible;
}

.room-form-popup .swal2-actions {
    margin-top: 18px;
    gap: 10px;
}

.room-form-swal {
    display: grid;
    gap: 16px;
    text-align: left;
}

.room-form-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
}

.room-form-head .module-icon {
    width: 44px;
    height: 44px;
    font-size: 1.05rem;
}

.room-form-head strong {
    display: block;
    color: var(--app-text);
    font-size: 1rem;
    font-weight: 900;
}

.room-form-head small {
    display: block;
    margin-top: 2px;
    color: var(--app-muted);
    font-size: 0.84rem;
    font-weight: 700;
}

.room-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.room-field {
    display: grid;
    gap: 6px;
    margin: 0;
}

.room-field span {
    color: var(--app-muted);
    font-size: 0.75rem;
    font-weight: 900;
    text-transform: uppercase;
}

.room-field .form-control {
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 12px;
    font-size: 1rem;
    font-weight: 800;
}

.room-field-wide {
    grid-column: 1 / -1;
}

@media (max-width: 640px) {
    .room-form-grid {
        grid-template-columns: 1fr;
    }
}




/* Ciclo habitaciones modal deshabilitadas estilo archivados */
.archived-modal-layout {
    position: relative;
    display: grid;
    gap: 16px;
    text-align: left;
}

.archived-export-bar {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    margin-left: auto;
    padding: 5px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.archived-export-bar > span {
    padding: 0 8px;
    color: var(--app-muted);
    font-size: 0.68rem;
    font-weight: 900;
    text-transform: uppercase;
}

.archived-modal-toolbar {
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 0;
    border: 0;
    background: transparent;
}

.archived-modal-toolbar .search-control {
    width: min(100%, 420px);
    max-width: 420px;
}

.archived-table-wrap {
    width: 100%;
    overflow-x: auto;
}

.archived-table {
    width: 100%;
    border-collapse: collapse;
    color: var(--app-text);
    font-size: 0.9rem;
}

.archived-table th,
.archived-table td {
    padding: 12px 14px;
    border-bottom: 1px solid var(--app-border);
    text-align: left;
    vertical-align: middle;
}

.archived-table th {
    color: var(--app-muted);
    font-size: 0.72rem;
    font-weight: 900;
    text-transform: uppercase;
}

.archived-table td:last-child,
.archived-table th:last-child {
    text-align: right;
}

.archived-modal-pager {
    justify-content: flex-end;
    margin-top: 2px;
}

.archived-modal-pager .btn {
    gap: 7px;
}

.compact-empty-state {
    padding: 18px;
    border: 0;
    background: transparent;
}

@media (max-width: 760px) {
    .archived-export-bar,
    .archived-modal-toolbar,
    .archived-modal-toolbar .search-control,
    .archived-modal-pager {
        width: 100%;
    }

    .archived-export-bar,
    .archived-modal-pager {
        justify-content: center;
    }

    .archived-modal-toolbar {
        align-items: stretch;
        flex-direction: column;
    }
}



.spinner-local {
    width: 100%;
    min-height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.spinner-local .spin {
    width: 38px;
    height: 38px;
    border: 4px solid rgba(0, 87, 200, 0.18);
    border-top-color: var(--app-primary);
    border-radius: 50%;
    animation: spin 0.75s linear infinite;
}

.room-loading-popup {
    width: auto !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.room-loading-popup .swal2-html-container {
    margin: 0 !important;
    overflow: visible !important;
}

.rooms-card-grid .spinner-local {
    grid-column: 1 / -1;
}

/* Export interno en modales */
.modal-export-box {
    display: grid;
    gap: 8px;
    justify-items: end;
    margin-bottom: 10px;
}

.modal-export-overlay {
    align-items: center;
    background: rgba(12, 20, 33, 0.32);
    border-radius: 8px;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    padding: 12px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 25;
}

.modal-export-actions {
    align-items: center;
    background: var(--app-soft);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: inline-flex;
    gap: 5px;
    padding: 4px;
}

.modal-export-label {
    color: var(--app-muted);
    font-size: 11px;
    font-weight: 800;
    padding: 0 7px;
    text-transform: uppercase;
}

.modal-export-btn {
    align-items: center;
    background: var(--app-card);
    border: 1px solid var(--app-border);
    border-radius: 6px;
    color: var(--app-text);
    cursor: pointer;
    display: inline-flex;
    font-size: 12px;
    font-weight: 800;
    gap: 6px;
    min-height: 32px;
    padding: 0 9px;
}

.modal-export-btn:hover {
    border-color: var(--app-primary);
    color: var(--app-primary);
}

.modal-export-btn.pdf i { color: #dc3545; }
.modal-export-btn.excel i { color: #198754; }

.modal-export-panel {
    background: var(--app-card);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(15, 32, 55, 0.22);
    display: flex;
    flex-direction: column;
    max-width: 720px;
    overflow: hidden;
    padding: 0;
    position: relative;
    text-align: left;
    width: min(92%, 720px);
    z-index: 1;
}

.modal-export-panel-head {
    align-items: center;
    background: var(--app-soft);
    border-bottom: 1px solid var(--app-border);
    display: flex;
    gap: 10px;
    justify-content: space-between;
    min-height: 54px;
    padding: 10px 54px 10px 16px;
}

.modal-export-panel-head strong {
    color: var(--app-text);
    flex: 1 1 auto;
    font-size: 1rem;
    text-align: center;
}

.modal-export-close {
    align-items: center;
    background: var(--app-card);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    color: var(--app-muted);
    cursor: pointer;
    display: inline-flex;
    height: 34px;
    justify-content: center;
    position: absolute;
    right: 12px;
    top: 10px;
    width: 34px;
}

.modal-export-close:hover,
.modal-export-close:focus {
    background: var(--app-soft);
    border-color: rgba(0, 87, 200, 0.28);
    color: var(--app-primary);
}

.modal-export-options {
    align-items: flex-start;
    display: grid;
    gap: 10px;
    margin: 0;
    padding: 14px;
}

.modal-export-options label {
    align-items: center;
    color: var(--app-text);
    display: inline-flex;
    font-size: 0.9rem;
    font-weight: 700;
    gap: 6px;
    margin: 0;
}

.modal-export-range {
    display: inline-grid;
    gap: 8px;
    grid-template-columns: repeat(2, minmax(74px, 96px));
    margin-left: 22px;
}

.modal-export-range label {
    align-items: stretch;
    display: grid;
    gap: 4px;
}

.modal-export-range .form-control {
    font-size: 0.9rem;
    min-height: 32px;
    padding: 4px 8px;
}

.modal-export-footer {
    align-items: center;
    border-top: 1px solid var(--app-border);
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 0;
    padding: 12px 14px;
    width: 100%;
}

.modal-export-footer .btn-primary { margin-left: auto; }
.modal-export-footer .btn-primary,
.modal-export-footer .btn-primary span,
.modal-export-footer .btn-primary i { color: #ffffff !important; }

[data-modal-export-status] {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 700;
}

.disabled-rooms-modal-layout {
    position: relative;
}

.disabled-rooms-modal-layout .archived-inner-overlay {
    align-items: center;
    background: rgba(12, 20, 33, 0.32);
    border-radius: 8px;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    padding: 12px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 8;
}

.disabled-rooms-modal-layout .archived-inner-overlay[hidden] {
    display: none !important;
}

.disabled-room-inner-panel {
    max-width: 620px;
    width: min(100%, 620px);
}


/* Compatibilidad visual POS: base compartida para modulos administrativos */
.module-header {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow);
    gap: 18px;
    padding: 18px;
}

.module-icon {
    background: rgba(0, 87, 200, 0.1);
    border-radius: 8px;
    color: var(--app-primary);
    font-size: 1.35rem;
    height: 50px;
    width: 50px;
}

.module-title h1 {
    color: var(--app-text);
    font-size: 1.45rem;
    font-weight: 800;
    line-height: 1.2;
}

.module-title p {
    color: var(--app-muted);
    line-height: 1.35;
    margin-top: 4px;
}

.module-actions {
    gap: 8px;
}

.module-actions .btn,
.module-toolbar .btn,
.archived-modal-layout .btn,
.modal-export-footer .btn {
    border-radius: 7px;
    font-weight: 700;
    min-height: 40px;
}

.btn-light {
    background: #eef4f8 !important;
    border-color: #dbe3ec !important;
    color: var(--app-text) !important;
}

.btn-outline-secondary {
    background: transparent;
    border-color: #cbd5e1 !important;
    color: #475569 !important;
}

.btn-outline-danger {
    background: transparent;
    border-color: rgba(194, 65, 58, 0.45) !important;
    color: var(--app-danger) !important;
}

.btn-outline-success {
    background: transparent;
    border-color: rgba(22, 138, 85, 0.45) !important;
    color: var(--app-success) !important;
}

.module-grid {
    gap: 14px;
}

.metric-card {
    align-items: center;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    box-shadow: var(--app-shadow-soft);
    gap: 12px;
    padding: 16px;
}

.metric-icon {
    background: var(--app-surface-2);
    border-radius: 8px;
    color: var(--app-primary);
    height: 42px;
    width: 42px;
}

.metric-card strong {
    color: var(--app-text);
    font-size: 1.2rem;
    font-weight: 800;
}

.metric-card span {
    color: var(--app-muted);
}

.rooms-metrics-grid {
    grid-template-columns: repeat(2, minmax(240px, 1fr));
}

.modal-export-actions {
    background: var(--app-soft);
}

.modal-export-btn,
.modal-export-panel,
.modal-export-close {
    background: var(--app-card);
}

.modal-export-panel-head {
    background: var(--app-soft);
}

@media (max-width: 760px) {
    .rooms-metrics-grid {
        grid-template-columns: 1fr;
    }
}

/* Habitaciones afinado visual POS */
.rooms-module-shell .module-grid.rooms-metrics-grid {
    display: grid;
    gap: 14px;
    margin: 0 0 18px;
}

.rooms-module-shell .metric-card {
    display: flex !important;
    align-items: center !important;
    min-height: 84px;
    gap: 12px !important;
    padding: 16px !important;
    background: var(--app-surface) !important;
    border: 1px solid var(--app-border) !important;
    border-radius: var(--app-radius) !important;
    box-shadow: var(--app-shadow-soft) !important;
}

.rooms-module-shell .metric-card .metric-icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 42px;
    width: 42px !important;
    height: 42px !important;
    border-radius: 8px !important;
    background: var(--app-surface-2) !important;
    color: var(--app-primary) !important;
    font-size: 1rem;
}

.rooms-module-shell .metric-card > div {
    display: grid;
    gap: 2px;
    min-width: 0;
}

.rooms-module-shell .metric-card strong {
    display: block !important;
    color: var(--app-text) !important;
    font-size: 1.2rem !important;
    font-weight: 800 !important;
    line-height: 1.15 !important;
    margin: 0 !important;
}

.rooms-module-shell .metric-card > div > span {
    display: block !important;
    color: var(--app-muted) !important;
    font-size: 0.98rem !important;
    font-weight: 500 !important;
    line-height: 1.25 !important;
}

/* Habitaciones ajuste final contra POS */
.rooms-module-shell,
.rooms-board-panel,
.rooms-status-panel {
    max-width: none !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.rooms-module-shell .module-grid.rooms-metrics-grid {
    grid-template-columns: repeat(2, minmax(260px, 1fr));
}

.rooms-module-shell .metric-card .metric-icon,
.rooms-module-shell .metric-card .metric-icon i {
    color: var(--app-muted) !important;
}

.rooms-card-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}

.swal-form {
    display: grid;
    gap: 8px;
    text-align: left;
}

.swal-form label {
    color: var(--app-text);
    font-size: 0.88rem;
    font-weight: 800;
    margin: 0;
}

.export-scope-form {
    max-width: 360px;
    margin: 0 auto;
}

.export-scope-form .compact-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    margin: 6px 0 2px;
}

.export-scope-form .compact-form-grid label {
    display: grid;
    gap: 4px;
}

.export-scope-form .form-control {
    min-height: 42px;
    margin: 0;
}

@media (max-width: 760px) {
    .rooms-module-shell .module-grid.rooms-metrics-grid,
    .export-scope-form .compact-form-grid {
        grid-template-columns: 1fr;
    }
}

/* Habitaciones margen y busqueda POS */
.rooms-module-shell,
.rooms-board-panel,
.rooms-status-panel {
    margin-left: 26px !important;
    margin-right: 26px !important;
    width: auto !important;
}

.rooms-control-panel {
    margin-left: 26px !important;
    margin-right: 26px !important;
    width: auto !important;
}

.rooms-toolbar .rooms-filter-group {
    flex: 1 1 auto;
    max-width: none;
}

.rooms-toolbar .search-control,
.rooms-filter-group .search-control {
    flex: 1 1 auto;
    max-width: none !important;
    width: 100%;
}

@media (max-width: 760px) {
    .rooms-module-shell,
    .rooms-control-panel,
    .rooms-board-panel,
    .rooms-status-panel {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}

/* Habitaciones buscador ancho completo */
.rooms-toolbar {
    align-items: center;
}

.rooms-toolbar .rooms-filter-group {
    display: flex;
    flex: 1 1 0;
    min-width: 0;
    width: auto;
}

.rooms-toolbar .module-toolbar-actions {
    flex: 0 0 auto;
}

.rooms-toolbar .search-control {
    max-width: none !important;
    width: 100% !important;
}

/* Habitaciones filtro igual ancho que secciones */
.rooms-control-panel {
    max-width: none !important;
}

.rooms-control-panel .rooms-toolbar {
    width: 100%;
}

.rooms-control-panel .rooms-filter-group {
    flex: 1 1 0 !important;
    max-width: none !important;
    width: 100% !important;
}

/* Habitaciones filtro alineado con POS */
.rooms-module-shell .rooms-control-panel {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

.rooms-module-shell .rooms-toolbar {
    justify-content: space-between;
    width: 100%;
}

.rooms-module-shell .rooms-toolbar .rooms-filter-group {
    flex: 0 1 520px !important;
    max-width: 520px !important;
    min-width: 280px;
    width: 520px !important;
}

.rooms-module-shell .rooms-toolbar .search-control {
    max-width: 520px !important;
    width: 100% !important;
}

@media (max-width: 760px) {
    .rooms-module-shell .rooms-toolbar .rooms-filter-group,
    .rooms-module-shell .rooms-toolbar .search-control {
        max-width: none !important;
        width: 100% !important;
    }
}

/* Reservaciones: formulario de estancia */
.reservation-form-popup {
    max-width: 920px;
}

.reservation-booking-form {
    display: grid;
    gap: 12px;
    text-align: left;
}

.reservation-booking-form .swal2-input {
    margin: 0;
    width: 100%;
}

.booking-section {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
}

.booking-section-main {
    background: var(--app-surface-2);
}

.booking-section-head {
    display: flex;
    align-items: center;
    gap: 12px;
}

.booking-section-head strong {
    display: block;
    color: var(--app-text);
    font-size: 1rem;
    font-weight: 800;
}

.booking-section-head small {
    color: var(--app-muted);
    font-size: 0.85rem;
}

.booking-icon {
    align-items: center;
    background: var(--app-surface-2);
    border-radius: 8px;
    color: var(--app-muted);
    display: inline-flex;
    flex: 0 0 38px;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.booking-grid {
    display: grid;
    gap: 12px;
}

.booking-grid-2 {
    grid-template-columns: minmax(0, 1fr);
}

.booking-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.booking-grid-room {
    grid-template-columns: minmax(0, 1fr) 140px;
}

.booking-field {
    display: grid;
    gap: 6px;
    margin: 0;
}

.booking-field > span {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.booking-inline-search {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    gap: 8px;
}

.booking-summary {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
    color: var(--app-primary);
    font-size: 1rem;
    font-weight: 800;
    padding: 12px;
}



.booking-room-contract {
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(90px, 0.6fr) minmax(0, 1.6fr) minmax(140px, 0.8fr);
}

.booking-room-contract div {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 4px;
    min-width: 0;
    padding: 10px 12px;
}

.booking-room-contract span {
    color: var(--app-muted);
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
}

.booking-room-contract strong {
    color: var(--app-text);
    font-size: 1rem;
    font-weight: 800;
    overflow-wrap: anywhere;
}

.booking-room-contract div:first-child strong,
.booking-room-contract div:last-child strong {
    color: var(--app-primary);
    font-size: 1.1rem;
}
.booking-stay-section .booking-summary {
    align-content: center;
    display: grid;
    gap: 4px;
    min-height: 56px;
}

.booking-stay-section .booking-summary span {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.booking-stay-section .booking-summary strong {
    color: var(--app-primary);
    font-size: 1.05rem;
}


.booking-total-row {
    display: grid;
    gap: 4px;
}

.booking-total-row + .booking-total-row {
    border-top: 1px solid var(--app-border);
    margin-top: 8px;
    padding-top: 8px;
}

.booking-total-row.accent strong {
    color: var(--app-text);
}
.booking-field-hint {
    color: var(--app-muted);
    font-size: 0.78rem;
    font-weight: 700;
}
.booking-quick-client {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
    display: grid;
    gap: 10px;
    padding: 12px;
}

.booking-quick-client[hidden] {
    display: none;
}

.booking-quick-client .btn {
    justify-self: start;
}

@media (max-width: 760px) {
    .booking-grid-2,
    .booking-grid-3,
    .booking-grid-room,
    .booking-inline-search {
        grid-template-columns: 1fr;
    }
}
.app-modal[hidden] {
    display: none !important;
}

body.modal-open {
    overflow: hidden;
}

.app-modal {
    align-items: center;
    display: grid;
    inset: 0;
    justify-items: center;
    padding: 24px;
    position: fixed;
    z-index: 1250;
}

.app-modal-backdrop {
    background: rgba(15, 23, 42, 0.48);
    inset: 0;
    position: absolute;
}

.app-modal-panel {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.25);
    max-height: calc(100vh - 48px);
    overflow: auto;
    position: relative;
    width: min(1120px, calc(100vw - 48px));
    z-index: 1;
}

.pedido-detail-panel {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
}

.pedido-detail-header {
    align-items: center;
    border-bottom: 1px solid var(--app-border);
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 18px 20px;
}

.pedido-detail-title {
    align-items: center;
    display: flex;
    gap: 12px;
    min-width: 0;
}

.pedido-detail-title h2 {
    color: var(--app-text);
    font-size: 1.35rem;
    font-weight: 800;
    line-height: 1.15;
    margin: 0;
}

.pedido-detail-title p {
    color: var(--app-muted);
    font-size: 0.92rem;
    margin: 4px 0 0;
}

.icon-only {
    min-width: 40px;
    padding-inline: 0;
}

.pedido-detail-content {
    display: grid;
    gap: 14px;
    padding: 18px 20px 20px;
}

.pedido-detail-grid {
    display: grid;
    gap: 14px;
}

.pedido-detail-summary {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.pedido-detail-card {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 10px;
    padding: 14px;
}

.pedido-detail-card h3,
.pedido-detail-actions-card h3 {
    color: var(--app-text);
    font-size: 1rem;
    font-weight: 800;
    margin: 0;
}

.pedido-detail-card p,
.pedido-detail-actions-card p,
.pedido-section-head p {
    color: var(--app-muted);
    font-size: 0.86rem;
    margin: 3px 0 0;
}

.pedido-detail-actions-card {
    align-items: center;
    grid-template-columns: minmax(0, 1fr) auto;
}

.pedido-detail-actions-card .detail-actions {
    justify-content: flex-end;
}

.pedido-detail-main {
    overflow: hidden;
}

.pedido-section-head {
    align-items: center;
    display: flex;
    justify-content: space-between;
}

.pedido-detail-columns {
    display: grid;
    gap: 14px;
    grid-template-columns: minmax(0, 1fr);
}

.pedido-detail-loader {
    margin: 24px auto;
    min-width: 220px;
}

@media (max-width: 900px) {
    .app-modal {
        padding: 12px;
    }

    .app-modal-panel {
        max-height: calc(100vh - 24px);
        width: calc(100vw - 24px);
    }

    .pedido-detail-header,
    .pedido-detail-actions-card {
        align-items: stretch;
        flex-direction: column;
        grid-template-columns: 1fr;
    }

    .pedido-detail-summary,
    .pedido-detail-columns {
        grid-template-columns: 1fr;
    }
}
.reservations-active-panel[hidden] {
    display: none !important;
}

.reservations-active-toolbar {
    margin: 10px 0 12px;
}
.availability-panel .module-panel-header {
    align-items: flex-start;
    gap: 14px;
}

.availability-persons-filter {
    align-items: center;
    display: inline-flex;
    gap: 8px;
    margin: 0;
}

.availability-persons-filter span {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.availability-persons-filter .form-control {
    min-width: 92px;
    width: 92px;
}

.availability-status-line {
    margin: -2px 0 2px;
}

#pedidosActivosPanel {
    max-height: calc(100vh - 64px);
    overflow: auto;
    padding: 18px;
    width: min(1180px, calc(100vw - 48px));
}

#pedidosActivosPanel .module-panel-header {
    padding-right: 52px;
}

.pedidos-modal-close {
    position: absolute;
    right: 16px;
    top: 16px;
}

.modal-close {
    align-items: center;
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    color: var(--app-muted);
    cursor: pointer;
    display: inline-flex;
    font-size: 1.45rem;
    font-weight: 800;
    height: 40px;
    justify-content: center;
    line-height: 1;
    padding: 0;
    position: absolute;
    right: 16px;
    top: 16px;
    width: 40px;
    z-index: 4;
}

.modal-close:hover {
    background: var(--app-surface);
    color: var(--app-text);
}

@media (max-width: 900px) {
    .availability-panel .module-panel-header,
    .availability-controls {
        align-items: stretch;
        flex-direction: column;
    }

    .availability-persons-filter,
    .availability-persons-filter .form-control {
        width: 100%;
    }
}
/* Ciclo clientes ajuste visual POS */
.clients-module-shell,
.clients-table-panel {
    width: min(100%, 1760px);
    margin-left: auto;
    margin-right: auto;
}

.clients-metrics-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.clients-control-panel {
    padding: 14px;
}

.clients-toolbar {
    gap: 12px;
}

.clients-toolbar .search-control {
    flex: 0 1 520px;
    max-width: 520px;
}

.clients-table-panel {
    overflow: hidden;
}

.clients-table-panel .inline-status {
    margin: 0 0 8px;
}

.clients-table-panel .module-table {
    table-layout: fixed;
}

.clients-table-panel .module-table th,
.clients-table-panel .module-table td {
    white-space: nowrap;
}

.clients-table-panel .module-table th:nth-child(1),
.clients-table-panel .module-table td:nth-child(1) { width: 15%; }
.clients-table-panel .module-table th:nth-child(2),
.clients-table-panel .module-table td:nth-child(2) { width: 28%; }
.clients-table-panel .module-table th:nth-child(3),
.clients-table-panel .module-table td:nth-child(3) { width: 17%; }
.clients-table-panel .module-table th:nth-child(4),
.clients-table-panel .module-table td:nth-child(4) { width: 26%; }
.clients-table-panel .module-table th:nth-child(5),
.clients-table-panel .module-table td:nth-child(5) { width: 14%; text-align: right; }

.clients-table-panel .module-table td:nth-child(2),
.clients-table-panel .module-table td:nth-child(4) {
    overflow: hidden;
    text-overflow: ellipsis;
}

.clients-table-panel .row-actions,
.clientes-archivados-content .row-actions {
    display: inline-flex;
    justify-content: flex-end;
    gap: 7px;
    width: 100%;
}

.clients-table-panel .btn-small,
.clientes-archivados-content .btn-small {
    border-radius: 7px;
    min-height: 34px;
}

.clientes-archivados-content {
    display: grid;
    gap: 12px;
    text-align: left;
}

.clientes-archivados-content .archived-modal-toolbar {
    background: var(--app-soft);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 12px;
}

.clientes-archivados-content .archived-modal-toolbar .search-control {
    flex: 0 1 420px;
    max-width: 420px;
}

.clientes-archivados-content .table-responsive {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    overflow: hidden;
}

.clientes-archivados-content .module-table {
    table-layout: fixed;
}

.clientes-archivados-content .module-table th,
.clientes-archivados-content .module-table td {
    white-space: nowrap;
}

.clientes-archivados-content .module-table th:nth-child(1),
.clientes-archivados-content .module-table td:nth-child(1) { width: 16%; }
.clientes-archivados-content .module-table th:nth-child(2),
.clientes-archivados-content .module-table td:nth-child(2) { width: 30%; }
.clientes-archivados-content .module-table th:nth-child(3),
.clientes-archivados-content .module-table td:nth-child(3) { width: 18%; }
.clientes-archivados-content .module-table th:nth-child(4),
.clientes-archivados-content .module-table td:nth-child(4) { width: 22%; }
.clientes-archivados-content .module-table th:nth-child(5),
.clientes-archivados-content .module-table td:nth-child(5) { width: 14%; text-align: right; }

.clientes-archivados-content .module-table td:nth-child(2),
.clientes-archivados-content .module-table td:nth-child(4) {
    overflow: hidden;
    text-overflow: ellipsis;
}

.clientes-archivados-content .inline-status {
    margin: 0;
}

.client-fiscal-view .detail-summary-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    text-align: left;
}

.client-fiscal-view .detail-summary-item {
    min-width: 0;
}

.client-fiscal-view .detail-summary-item strong {
    overflow-wrap: anywhere;
}

@media (max-width: 900px) {
    .clients-metrics-grid,
    .client-fiscal-view .detail-summary-grid {
        grid-template-columns: 1fr;
    }

    .clients-toolbar,
    .clientes-archivados-content .archived-modal-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .clients-toolbar .search-control,
    .clientes-archivados-content .archived-modal-toolbar .search-control,
    .clients-toolbar .module-toolbar-actions,
    .clientes-archivados-content .module-toolbar-actions {
        max-width: none;
        width: 100%;
    }
}
/* Ciclo clientes acciones icono */
.clientes-archivados-content {
    position: relative;
}

.clientes-archivados-content .row-actions {
    min-width: 86px;
}

.clientes-archivados-content .btn-small[data-accion="restaurar"] {
    width: 42px;
    min-width: 42px;
    padding-left: 0;
    padding-right: 0;
}

/* Clientes sigue el molde visual de habitaciones */
.clients-module-shell.rooms-module-shell .clients-control-panel .rooms-filter-group {
    flex: 0 1 520px !important;
    max-width: 520px !important;
    min-width: 280px;
    width: 520px !important;
}

.clientes-archivados-content .archived-modal-toolbar .rooms-filter-group {
    flex: 0 1 520px !important;
    max-width: 520px !important;
    min-width: 260px;
    width: 520px !important;
}

.clientes-archivados-content .btn-small[data-accion="restaurar"] {
    min-width: 42px;
    width: 42px;
    padding-left: 0;
    padding-right: 0;
}

@media (max-width: 760px) {
    .clients-module-shell.rooms-module-shell .clients-control-panel .rooms-filter-group,
    .clientes-archivados-content .archived-modal-toolbar .rooms-filter-group {
        max-width: none !important;
        min-width: 0;
        width: 100% !important;
    }
}
/* Clientes formulario con molde de habitaciones */
.client-form-popup .swal2-html-container {
    overflow: visible;
}

.client-form-swal .room-form-head .module-icon,
.client-form-swal .room-form-head .module-icon i {
    color: var(--app-muted) !important;
}

.client-form-grid {
    grid-template-columns: minmax(0, 1fr);
}

.client-form-grid .room-field-wide {
    grid-column: 1 / -1;
}

.client-form-grid .form-control {
    width: 100%;
    max-width: 100%;
    min-width: 0;
}

.client-form-grid select.form-control {
    overflow: hidden;
    text-overflow: ellipsis;
}

@media (max-width: 640px) {
    .client-form-grid {
        grid-template-columns: 1fr;
    }
}
/* Clientes contenedores ordenados */
.clients-module-shell.rooms-module-shell .module-grid.clients-metrics-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.clients-table-panel {
    max-width: none !important;
    width: auto !important;
    margin: 0 26px 18px !important;
}

.clients-table-panel #clientesEstado[hidden] {
    display: none !important;
}

.clients-table-panel #clientesEstado.is-error {
    display: block;
    margin: 14px;
}

@media (max-width: 900px) {
    .clients-module-shell.rooms-module-shell .module-grid.clients-metrics-grid {
        grid-template-columns: 1fr !important;
    }
}

@media (max-width: 760px) {
    .clients-table-panel {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}
/* Clientes archivados paneles internos */
.clientes-archivados-content .archived-inner-overlay {
    align-items: center;
    background: rgba(12, 20, 33, 0.32);
    border-radius: 8px;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    padding: 12px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 5;
}

.clientes-archivados-content .archived-inner-overlay[hidden] {
    display: none !important;
}

.archived-inner-panel {
    background: var(--app-card);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: 0 18px 45px rgba(15, 32, 55, 0.22);
    max-width: 680px;
    overflow: hidden;
    width: min(100%, 680px);
}

.archived-inner-body {
    padding: 14px;
}

.archived-confirm {
    align-items: center;
    display: grid;
    gap: 8px;
    justify-items: center;
    min-height: 130px;
    text-align: center;
}

.archived-confirm i {
    color: var(--app-primary);
    font-size: 2rem;
}

.archived-confirm strong {
    color: var(--app-text);
    font-size: 1.05rem;
}

.archived-confirm span {
    color: var(--app-muted);
    font-weight: 700;
}
/* Empleados: catalogo basico con molde de clientes */
.employees-table-panel .module-table th:nth-child(1),
.employees-table-panel .module-table td:nth-child(1) { width: 10%; }
.employees-table-panel .module-table th:nth-child(2),
.employees-table-panel .module-table td:nth-child(2) { width: 26%; }
.employees-table-panel .module-table th:nth-child(3),
.employees-table-panel .module-table td:nth-child(3) { width: 20%; }
.employees-table-panel .module-table th:nth-child(4),
.employees-table-panel .module-table td:nth-child(4) { width: 16%; }
.employees-table-panel .module-table th:nth-child(5),
.employees-table-panel .module-table td:nth-child(5) { width: 20%; text-align: left; }
.employees-table-panel .module-table th:nth-child(6),
.employees-table-panel .module-table td:nth-child(6) { width: 8%; text-align: right; }
.employees-table-panel .module-table td:nth-child(2),
.employees-table-panel .module-table td:nth-child(3),
.employees-table-panel .module-table td:nth-child(5) {
    max-width: 1px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.empleados-archivados-content .module-table th:nth-child(1),
.empleados-archivados-content .module-table td:nth-child(1) { width: 12%; }
.empleados-archivados-content .module-table th:nth-child(2),
.empleados-archivados-content .module-table td:nth-child(2) { width: 32%; }
.empleados-archivados-content .module-table th:nth-child(3),
.empleados-archivados-content .module-table td:nth-child(3) { width: 24%; }
.empleados-archivados-content .module-table th:nth-child(4),
.empleados-archivados-content .module-table td:nth-child(4) { width: 18%; }
.empleados-archivados-content .module-table th:nth-child(5),
.empleados-archivados-content .module-table td:nth-child(5) { width: 14%; text-align: right; }

#pedidosActivosModal .availability-panel {
    width: min(1500px, calc(100vw - 48px));
}

#pedidosActivosModal .availability-grid {
    max-height: calc(100vh - 290px);
    overflow: auto;
    padding-bottom: 4px;
}

#pedidosActivosModal .availability-controls {
    flex-wrap: wrap;
}
.operation-board-panel {
    display: grid;
    gap: 12px;
}

.operation-room-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 12px;
}

.operation-room-card {
    display: grid;
    gap: 12px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    padding: 14px;
    box-shadow: var(--app-shadow-soft);
}

.operation-room-card header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.operation-room-card header span {
    display: block;
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
}

.operation-room-card header strong {
    display: block;
    color: var(--app-text);
    font-size: 30px;
    line-height: 1;
}

.operation-room-card header em {
    border-radius: 999px;
    background: #e8f1ff;
    color: #0057c8;
    font-size: 12px;
    font-style: normal;
    font-weight: 800;
    padding: 7px 10px;
    text-align: right;
}

.operation-room-card p {
    margin: 0;
    color: var(--app-text);
    font-weight: 700;
}

.operation-room-meta,
.operation-room-task {
    display: grid;
    gap: 7px;
    color: var(--app-muted);
    font-size: 13px;
}

.operation-room-meta span,
.operation-room-task span,
.operation-room-task small {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
}

.operation-room-task {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-2);
    padding: 10px;
}

.operation-room-task strong {
    color: var(--app-text);
    font-size: 14px;
}

.operation-room-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.operation-room-card.is-ready header em {
    background: #e8f8ef;
    color: #047857;
}

.operation-room-card.is-occupied header em {
    background: #eef4fb;
    color: #465a73;
}

.operation-room-card.is-pending header em,
.operation-room-card.is-working header em {
    background: #fff7ed;
    color: #b45309;
}

.operation-room-card.is-problem header em {
    background: #fff0f0;
    color: #dc2626;
}
/* Operacion: secciones alineadas */
.operation-module-shell,
.operation-board-panel,
.operation-status-panel {
    max-width: none !important;
    width: auto !important;
    margin-left: 26px !important;
    margin-right: 26px !important;
}

@media (max-width: 760px) {
    .operation-module-shell,
    .operation-board-panel,
    .operation-status-panel {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}

/* Operacion: pulido visual */
.operation-module-shell .module-header {
    min-height: 90px;
}

.operation-module-shell .module-title {
    gap: 14px;
}

.operation-module-shell .module-filters {
    grid-template-columns: minmax(220px, 1fr) minmax(220px, 1fr) auto auto;
    align-items: end;
    padding: 16px;
    margin-top: 18px;
}

.operation-module-shell .module-filters .btn {
    min-width: 128px;
}

.operation-board-panel {
    padding: 18px !important;
    gap: 18px !important;
}

.operation-board-panel .module-panel-header {
    padding-bottom: 4px;
    border-bottom: 0;
}

.operation-board-panel .module-panel-header h2 {
    margin: 0 0 4px;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--app-text);
}

.operation-board-panel .module-subtitle {
    margin: 0;
    color: var(--app-muted);
    line-height: 1.35;
}

.operation-room-grid {
    grid-template-columns: repeat(auto-fill, minmax(275px, 1fr));
    gap: 14px;
}

.operation-room-card {
    align-content: start;
    min-height: 300px;
    padding: 16px;
}

.operation-room-card p {
    min-height: 40px;
    line-height: 1.35;
}

.operation-room-meta {
    gap: 8px;
}

.operation-room-meta span i,
.operation-room-task span i,
.operation-room-task small i {
    flex: 0 0 16px;
    text-align: center;
    color: var(--app-muted);
}

.operation-room-actions {
    align-self: end;
    margin-top: 4px;
}

.operation-room-actions .btn {
    min-height: 40px;
}

.operation-status-panel {
    padding: 12px 14px !important;
}

@media (max-width: 900px) {
    .operation-module-shell .module-filters {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .operation-module-shell .module-filters {
        grid-template-columns: 1fr;
    }

    .operation-module-shell .module-filters .btn {
        width: 100%;
    }
}

/* Operacion: cargando centrado dentro del tablero */
.operation-room-grid > .spinner-local {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Operacion: busqueda directa por habitacion */
.operation-module-shell .operation-searchbar {
    display: flex;
    align-items: center;
    gap: 12px;
}

.operation-module-shell .operation-searchbar .rooms-filter-group {
    flex: 1 1 auto;
    min-width: 0;
}

.operation-module-shell .operation-searchbar .search-control {
    width: 100%;
    max-width: none;
}

.operation-module-shell .operation-searchbar .btn {
    flex: 0 0 auto;
}

@media (max-width: 720px) {
    .operation-module-shell .operation-searchbar {
        align-items: stretch;
        flex-direction: column;
    }

    .operation-module-shell .operation-searchbar .btn {
        width: 100%;
    }
}
/* Operacion: carriles de limpieza y problema */
.operation-room-lanes {
    display: grid;
    gap: 10px;
    margin-top: 12px;
}

.operation-room-lane {
    border: 1px solid var(--line, #d7e0ec);
    border-radius: 8px;
    background: rgba(248, 251, 255, 0.78);
    display: grid;
    gap: 5px;
    padding: 10px;
}

.operation-room-lane strong {
    color: #152033;
    font-size: 13px;
}

.operation-room-lane span,
.operation-room-lane small {
    color: #5f728d;
    font-size: 12px;
    line-height: 1.35;
}

.operation-room-lane .operation-room-actions {
    margin-top: 6px;
}

.operation-room-lane.problem-lane {
    border-color: #f1c6c6;
    background: #fff8f8;
}

.operation-room-card.is-detail header em {
    background: #fff4d8;
    color: #9a5b00;
}
/* Operacion: pulido de carriles y botones */
.operation-room-lanes {
    gap: 8px;
}

.operation-room-lane {
    border-radius: 7px;
    padding: 9px;
    background: #f8fbff;
}

.operation-room-lane > strong {
    display: block;
    font-size: 13px;
    line-height: 1.2;
}

.operation-room-lane > span,
.operation-room-lane > small {
    display: block;
    color: #5f728d;
    font-size: 12px;
}

.operation-room-lane .operation-room-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 7px;
}

.operation-room-lane .btn,
.operation-room-lane .btn span,
.operation-room-lane .btn i {
    font-size: 12px;
    font-weight: 800;
    line-height: 1;
}

.operation-room-lane .btn-primary,
.operation-room-lane .btn-primary span,
.operation-room-lane .btn-primary i {
    color: #ffffff !important;
}

.operation-room-lane .btn-light,
.operation-room-lane .btn-light span,
.operation-room-lane .btn-light i {
    color: #10243f !important;
}

.operation-room-lane .btn {
    min-height: 36px;
    padding: 0 12px;
}

.operation-room-lane.cleaning-lane {
    border-color: #cfe0f4;
}

.operation-room-lane.problem-lane {
    border-color: #f0d7d7;
    background: #fffafa;
}

.operation-room-lane:not(.problem-lane) .muted-text {
    color: #6c7f99;
    font-size: 12px;
}
/* Operacion: modal ordenado */
.operation-swal-popup .swal2-html-container {
    margin: 16px 28px 0 !important;
    overflow: visible !important;
}

.operation-swal-form {
    display: grid;
    gap: 16px;
    text-align: left;
}

.operation-swal-form label {
    color: #1f2937;
    display: grid;
    font-size: 14px;
    font-weight: 800;
    gap: 7px;
    margin: 0;
}

.operation-swal-form .swal2-input,
.operation-swal-form .swal2-textarea {
    box-sizing: border-box;
    margin: 0 !important;
    width: 100% !important;
}

.operation-swal-form .swal2-textarea {
    min-height: 128px;
    resize: vertical;
}

/* Habitaciones y Operacion: densidad uniforme de tarjetas */
.rooms-card-grid,
.operation-room-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
}

@media (max-width: 1500px) {
    .rooms-card-grid,
    .operation-room-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 1100px) {
    .rooms-card-grid,
    .operation-room-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 820px) {
    .rooms-card-grid,
    .operation-room-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 560px) {
    .rooms-card-grid,
    .operation-room-grid {
        grid-template-columns: 1fr !important;
    }
}

/* Reservaciones: ancho alineado con modulos principales */
.reservations-module-shell,
#pedidosActivosPanel {
    max-width: none !important;
    width: auto !important;
    margin-left: 26px !important;
    margin-right: 26px !important;
}

#pedidosActivosPanel {
    margin-bottom: 18px !important;
}

@media (max-width: 760px) {
    .reservations-module-shell,
    #pedidosActivosPanel {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}


/* Reservaciones: disponibilidad como selector de fechas */
#pedidosActivosModal .availability-panel {
    width: min(1620px, calc(100vw - 48px));
    max-height: calc(100vh - 44px);
    overflow: hidden;
    padding: 18px;
}

#pedidosActivosModal .availability-panel .module-panel-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding-bottom: 2px;
}

#pedidosActivosModal .availability-controls {
    align-items: end;
    display: grid;
    grid-template-columns: minmax(180px, 240px) minmax(260px, 380px) minmax(150px, 180px);
    gap: 8px;
    max-width: 820px;
}

#pedidosActivosModal .availability-controls .form-control {
    min-width: 0;
    width: 100%;
}

.availability-selection {
    align-items: center;
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 12px 14px;
}

.availability-selection-text {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.availability-selection-text strong {
    color: var(--app-text);
    font-size: 0.98rem;
}

.availability-selection-text span {
    color: var(--app-muted);
    font-size: 0.86rem;
    line-height: 1.35;
}

.availability-selection-actions {
    align-items: center;
    display: flex;
    flex: 0 0 auto;
    gap: 8px;
}

#pedidosActivosModal .availability-grid {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    max-height: calc(100vh - 360px);
    overflow: auto;
    padding: 10px;
}

#pedidosActivosModal .availability-cell.is-heading {
    position: sticky;
    top: 0;
    z-index: 4;
}

#pedidosActivosModal .availability-room {
    position: sticky;
    left: 0;
    z-index: 3;
}

#pedidosActivosModal .availability-room.is-heading {
    z-index: 5;
}

.availability-day.is-free.is-selected,
.availability-day.is-free.is-in-range {
    background: rgba(0, 86, 204, 0.13);
    border-color: var(--app-primary);
    box-shadow: inset 0 0 0 1px var(--app-primary);
    color: var(--app-primary-dark);
}

.availability-day.is-free.is-selected small,
.availability-day.is-free.is-in-range small {
    color: var(--app-primary);
    font-weight: 800;
}

.availability-day.is-range-start,
.availability-day.is-range-end {
    transform: translateY(-1px);
}

.availability-day.is-range-start::after,
.availability-day.is-range-end::after {
    color: var(--app-primary);
    font-size: 0.72rem;
    font-weight: 900;
}

.availability-day.is-range-start::after {
    content: "Entrada";
}

.availability-day.is-range-end::after {
    content: "Ultima noche";
}

@media (prefers-color-scheme: dark) {
    .availability-day.is-free {
        background: rgba(22, 101, 52, 0.18);
        color: #bbf7d0;
    }

    .availability-day.is-free small {
        color: #86efac;
    }

    .availability-day.is-busy {
        background: rgba(153, 27, 27, 0.18);
        color: #fecaca;
    }

    .availability-day.is-free.is-selected,
    .availability-day.is-free.is-in-range {
        background: rgba(37, 99, 235, 0.28);
        color: #dbeafe;
    }

    .availability-day.is-free.is-selected small,
    .availability-day.is-free.is-in-range small,
    .availability-day.is-range-start::after,
    .availability-day.is-range-end::after {
        color: #93c5fd;
    }
}

@media (max-width: 980px) {
    #pedidosActivosModal .availability-controls,
    .availability-selection {
        align-items: stretch;
        display: flex;
        flex-direction: column;
    }

    .availability-selection-actions {
        width: 100%;
    }

    .availability-selection-actions .btn {
        flex: 1 1 auto;
    }
}

/* Reservaciones: formulario de confirmacion desde calendario */
.booking-selection-summary {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.booking-selection-summary > div {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 4px;
    padding: 12px;
}

.booking-selection-summary span {
    color: var(--app-muted);
    font-size: 0.75rem;
    font-weight: 800;
    text-transform: uppercase;
}

.booking-selection-summary strong {
    color: var(--app-text);
    font-size: 1rem;
}

.visually-hidden-control {
    height: 1px !important;
    margin: 0 !important;
    opacity: 0 !important;
    overflow: hidden !important;
    padding: 0 !important;
    pointer-events: none !important;
    position: absolute !important;
    width: 1px !important;
}

@media (max-width: 760px) {
    .booking-selection-summary {
        grid-template-columns: 1fr;
    }
}




.compact-summary {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.reservation-lines-table {
    min-width: 1120px;
}

.reservation-lines-table td small {
    color: var(--app-muted);
    display: block;
    font-size: 0.78rem;
    margin-top: 3px;
}

.reservation-lines-table .actions-cell {
    gap: 6px;
    justify-content: flex-end;
    white-space: nowrap;
}

.is-balance-text {
    color: var(--app-danger);
    font-weight: 800;
}

@media (max-width: 900px) {
    .compact-summary {
        grid-template-columns: minmax(0, 1fr);
    }
}

.compact-reservation-lines {
    min-width: 860px;
}

.compact-reservation-lines th:nth-child(1),
.compact-reservation-lines td:nth-child(1) { width: 18%; }
.compact-reservation-lines th:nth-child(2),
.compact-reservation-lines td:nth-child(2) { width: 30%; }
.compact-reservation-lines th:nth-child(3),
.compact-reservation-lines td:nth-child(3) { width: 28%; }
.compact-reservation-lines th:nth-child(4),
.compact-reservation-lines td:nth-child(4) { width: 14%; }
.compact-reservation-lines th:nth-child(5),
.compact-reservation-lines td:nth-child(5) { width: 10%; }

.money-stack {
    display: grid;
    gap: 5px;
}

.money-stack span {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
}

.money-stack b {
    color: var(--app-muted);
    font-size: 0.74rem;
    font-weight: 800;
    text-transform: uppercase;
}

/* Ajuste visual del detalle de pedido en reservaciones */
.pedido-detail-main .detail-table-wrap {
    max-height: clamp(390px, 48vh, 620px);
    min-height: 380px;
    overflow: auto;
}

.pedido-detail-main .detail-table-wrap .module-table {
    margin-bottom: 0;
}

.compact-reservation-lines {
    min-width: 900px;
    table-layout: fixed;
}

.compact-reservation-lines th,
.compact-reservation-lines td {
    white-space: normal;
}

.compact-reservation-lines th:nth-child(1),
.compact-reservation-lines td:nth-child(1) { width: 17%; }
.compact-reservation-lines th:nth-child(2),
.compact-reservation-lines td:nth-child(2) { width: 28%; }
.compact-reservation-lines th:nth-child(3),
.compact-reservation-lines td:nth-child(3) { width: 27%; }
.compact-reservation-lines th:nth-child(4),
.compact-reservation-lines td:nth-child(4) { width: 16%; }
.compact-reservation-lines th:nth-child(5),
.compact-reservation-lines td:nth-child(5) { width: 12%; }

.compact-reservation-lines td {
    padding: 16px;
    vertical-align: top;
}

.compact-reservation-lines td:nth-child(4),
.compact-reservation-lines td:nth-child(5) {
    vertical-align: middle;
}

.compact-reservation-lines td.actions-cell {
    display: table-cell;
    text-align: right;
    white-space: nowrap;
}

.compact-reservation-lines td.actions-cell .btn {
    margin-left: 6px;
}

.compact-reservation-lines .status-pill {
    white-space: nowrap;
}

.money-stack {
    max-width: 240px;
    min-width: 190px;
}

.money-stack span {
    border-bottom: 1px dashed rgba(82, 99, 122, 0.25);
    min-height: 22px;
    padding-bottom: 4px;
}

.money-stack span:last-child {
    border-bottom: 0;
    border-top: 1px solid var(--app-border);
    margin-top: 2px;
    padding-top: 6px;
}

@media (max-width: 900px) {
    .pedido-detail-main .detail-table-wrap {
        max-height: 55vh;
        min-height: 320px;
    }
}

/* Reservaciones: consulta de fechas pasadas y reglas de cancelacion */
.availability-day.is-past {
    opacity: 0.72;
}

.availability-day.is-past.is-free {
    background: var(--app-soft-bg);
    border-color: var(--app-border);
    color: var(--app-muted);
}

.availability-day.is-past.is-free small {
    color: var(--app-muted);
}

.reservation-cancel-rule {
    background: var(--app-soft-bg);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    color: var(--app-text);
    display: grid;
    gap: 6px;
    line-height: 1.35;
    padding: 12px 14px;
    text-align: left;
}

.reservation-cancel-rule strong {
    color: var(--app-primary);
    font-size: 0.98rem;
    font-weight: 800;
}

.reservation-cancel-rule small {
    color: var(--app-muted);
    font-size: 0.82rem;
}

.cancel-reservation-summary {
    grid-template-columns: minmax(0, 1fr);
}

.cancel-reservation-summary .detail-summary-item:first-child {
    grid-column: 1 / -1;
}

@media (min-width: 720px) {
    .cancel-reservation-summary {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .cancel-reservation-summary .detail-summary-item:first-child {
        grid-column: auto;
    }
}

.cancel-reservation-hero {
    align-items: center;
    background: var(--app-soft-bg);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 4px;
    justify-items: center;
    margin: 0 auto 12px;
    max-width: 420px;
    padding: 14px 18px;
    text-align: center;
}

.cancel-reservation-hero span {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    text-transform: uppercase;
}

.cancel-reservation-hero strong {
    color: var(--app-text);
    font-size: 2rem;
    font-weight: 900;
    line-height: 1;
}

.cancel-reservation-hero small {
    color: var(--app-text);
    font-size: 0.98rem;
    font-weight: 700;
}

.cancel-reservation-summary {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0 auto;
    max-width: 520px;
}

.cancel-reservation-summary .detail-summary-item:first-child {
    grid-column: auto;
}

@media (max-width: 640px) {
    .cancel-reservation-summary {
        grid-template-columns: 1fr;
    }
}

/* Reservaciones: adeudo visible e importes bajo demanda */
.compact-reservation-lines th:nth-child(1),
.compact-reservation-lines td:nth-child(1) { width: 18%; }
.compact-reservation-lines th:nth-child(2),
.compact-reservation-lines td:nth-child(2) { width: 32%; }
.compact-reservation-lines th:nth-child(3),
.compact-reservation-lines td:nth-child(3) { width: 18%; }
.compact-reservation-lines th:nth-child(4),
.compact-reservation-lines td:nth-child(4) { width: 17%; }
.compact-reservation-lines th:nth-child(5),
.compact-reservation-lines td:nth-child(5) { width: 15%; }

.reservation-debt {
    display: block;
    font-size: 1rem;
    font-weight: 900;
    line-height: 1.1;
}

.is-clear-text {
    color: var(--app-success);
}

.reservation-amounts-summary {
    grid-template-columns: minmax(0, 1fr);
}

.reservation-amounts-summary .detail-summary-item:last-child {
    grid-column: 1 / -1;
}

/* Reservaciones: modal por encima de modales y formulario compacto */
.swal2-container {
    z-index: 5000 !important;
}

.reservation-form-popup {
    max-width: min(780px, calc(100vw - 32px)) !important;
}

.reservation-form-popup .swal2-title {
    font-size: 1.65rem;
    margin-bottom: 8px;
}

.reservation-booking-form {
    gap: 10px;
}

.reservation-booking-form .booking-section {
    padding: 12px 14px;
}

.reservation-booking-form .booking-section-head {
    gap: 10px;
    margin-bottom: 10px;
}

.reservation-booking-form .booking-section-head strong {
    font-size: 0.98rem;
}

.reservation-booking-form .booking-section-head small {
    font-size: 0.78rem;
}

.reservation-booking-form .booking-icon {
    height: 36px;
    min-width: 36px;
    width: 36px;
}

.reservation-booking-form .booking-selection-summary,
.reservation-booking-form .booking-grid,
.reservation-booking-form .booking-room-contract {
    gap: 10px;
}

.reservation-booking-form .booking-selection-summary label,
.reservation-booking-form .booking-selection-summary > div,
.reservation-booking-form .booking-field,
.reservation-booking-form .booking-room-contract > div,
.reservation-booking-form .booking-summary {
    padding: 10px 12px;
}

.reservation-booking-form .swal2-input {
    min-height: 42px;
}

.reservation-booking-form .booking-grid-room {
    grid-template-columns: minmax(0, 1fr) minmax(170px, 190px);
    align-items: stretch;
}

.reservation-booking-form .booking-total-row {
    padding: 6px 0;
}

.reservation-booking-form .booking-total-row strong {
    font-size: 1.02rem;
}

.reservation-booking-form .booking-field-hint {
    margin-top: 7px;
}

.reservation-amounts-modal .cancel-reservation-hero {
    margin-bottom: 10px;
    max-width: 330px;
    padding: 10px 14px;
}

.reservation-amounts-modal .cancel-reservation-hero strong {
    font-size: 1.65rem;
}

.reservation-amounts-summary {
    gap: 10px;
}

.reservation-amounts-summary .detail-summary-item {
    padding: 10px 12px;
}

.reservation-action-content .reservation-swal-form {
    display: grid;
    gap: 14px;
    margin: 0;
}

.reservation-action-content .reservation-amounts-modal {
    justify-items: stretch;
}

.reservation-action-content .reservation-amounts-modal .cancel-reservation-hero {
    justify-self: center;
    margin: 0 0 2px;
}

.reservation-action-content .reservation-amounts-summary {
    grid-template-columns: minmax(0, 1fr);
}

.reservation-action-content .reservation-amounts-summary .detail-summary-item.is-balance {
    grid-column: 1 / -1;
}

@media (max-width: 760px) {
    .reservation-booking-form .booking-selection-summary,
    .reservation-booking-form .booking-grid,
    .reservation-booking-form .booking-grid-room,
    .reservation-booking-form .booking-room-contract,
    .reservation-action-content .reservation-amounts-summary {
        grid-template-columns: 1fr;
    }
}

/* Reservaciones: paneles internos sobre detalle de pedido */
.pedido-detail-grid {
    position: relative;
}

.pedido-inner-overlay {
    align-items: center;
    background: rgba(12, 20, 33, 0.34);
    border-radius: 8px;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    padding: 18px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 12;
}

.pedido-inner-overlay[hidden] {
    display: none !important;
}

.pedido-inner-panel {
    max-width: 620px;
    width: min(100%, 620px);
}

.pedido-inner-panel .modal-export-panel-head {
    justify-content: center;
    min-height: 58px;
    position: relative;
}

.pedido-inner-panel .modal-export-panel-head strong {
    font-size: 1.65rem;
    font-weight: 700;
}

.pedido-inner-panel .modal-export-close {
    position: absolute;
    right: 14px;
    top: 12px;
}

.pedido-inner-panel .modal-export-footer {
    justify-content: center;
}

@media (max-width: 760px) {
    .pedido-inner-overlay {
        padding: 12px;
    }

    .pedido-inner-panel .modal-export-panel-head strong {
        font-size: 1.3rem;
    }
}
.pedido-inner-panel:has(.pedido-inner-services) {
    max-width: 820px;
    width: min(100%, 820px);
}

.pedido-inner-services .service-list {
    max-height: 260px;
    overflow: auto;
}
#pedidosActivosModal .availability-panel {
    position: relative;
}

.availability-inner-panel {
    max-width: 700px;
    width: min(100%, 700px);
}
/* Operacion: modal propio para acciones rapidas */
.operation-action-panel {
    max-width: 560px;
    width: min(100%, 560px);
    padding: 0;
}

.operation-action-header {
    align-items: center;
    border-bottom: 1px solid var(--border-color, #d5e0ec);
    display: flex;
    justify-content: flex-start;
    min-height: 64px;
    padding: 16px 64px 14px 28px;
    position: relative;
}

.operation-action-header h2 {
    color: var(--text-color, #1f2937);
    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    text-align: left;
}

.operation-action-header .icon-only {
    position: absolute;
    right: 16px;
    top: 14px;
}

.operation-action-content {
    padding: 20px 28px 12px;
}

.operation-modal-form {
    display: grid;
    gap: 16px;
}

.operation-modal-form label {
    color: var(--text-color, #1f2937);
    display: grid;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 7px;
    text-align: left;
}

.operation-modal-form .form-control {
    min-height: 46px;
}

.operation-modal-form textarea.form-control {
    min-height: 118px;
    resize: vertical;
}

.operation-action-modal .inline-status {
    margin: 0 28px 12px;
}

.operation-action-footer {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: center;
    padding: 14px 28px 26px;
}

body.dark-mode .operation-action-header,
body.theme-dark .operation-action-header,
[data-theme="dark"] .operation-action-header {
    border-bottom-color: rgba(148, 163, 184, 0.24);
}

body.dark-mode .operation-action-header h2,
body.dark-mode .operation-modal-form label,
body.theme-dark .operation-action-header h2,
body.theme-dark .operation-modal-form label,
[data-theme="dark"] .operation-action-header h2,
[data-theme="dark"] .operation-modal-form label {
    color: #e5edf7;
}

@media (max-width: 640px) {
    .operation-action-content,
    .operation-action-footer {
        padding-left: 18px;
        padding-right: 18px;
    }

    .operation-action-header h2 {
        font-size: 1.25rem;
    }
}
/* Servicios: modal propio de catalogo */
.service-action-panel {
    max-width: 620px;
    width: min(100%, 620px);
    padding: 0;
}

.service-action-header {
    align-items: center;
    border-bottom: 1px solid var(--border-color, #d5e0ec);
    display: flex;
    justify-content: flex-start;
    min-height: 64px;
    padding: 16px 64px 14px 28px;
    position: relative;
}

.service-action-header h2 {
    color: var(--text-color, #1f2937);
    font-size: 1.55rem;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    text-align: left;
}

.service-action-header .icon-only {
    position: absolute;
    right: 16px;
    top: 14px;
}

.service-action-content {
    padding: 20px 28px 12px;
}

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

.service-modal-form .span-2 {
    grid-column: 1 / -1;
}

.service-modal-form label {
    color: var(--text-color, #1f2937);
    display: grid;
    font-size: 0.92rem;
    font-weight: 700;
    gap: 7px;
    text-align: left;
}

.service-modal-form .form-control {
    min-height: 46px;
}

.service-confirm-card {
    align-items: center;
    background: var(--soft-bg, #f6f9fc);
    border: 1px solid var(--border-color, #d5e0ec);
    border-radius: 8px;
    display: grid;
    gap: 8px;
    justify-items: center;
    margin: 0 auto;
    max-width: 360px;
    padding: 18px;
    text-align: center;
}

.service-confirm-card i {
    color: var(--muted-color, #64748b);
    font-size: 1.8rem;
}

.service-confirm-card strong {
    color: var(--text-color, #1f2937);
    font-size: 1.1rem;
}

.service-confirm-card span {
    color: var(--muted-color, #64748b);
}

.service-action-modal .inline-status {
    margin: 0 28px 12px;
}

.service-action-footer {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: center;
    padding: 14px 28px 26px;
}

body.dark-mode .service-action-header,
body.theme-dark .service-action-header,
[data-theme="dark"] .service-action-header {
    border-bottom-color: rgba(148, 163, 184, 0.24);
}

body.dark-mode .service-action-header h2,
body.dark-mode .service-modal-form label,
body.dark-mode .service-confirm-card strong,
body.theme-dark .service-action-header h2,
body.theme-dark .service-modal-form label,
body.theme-dark .service-confirm-card strong,
[data-theme="dark"] .service-action-header h2,
[data-theme="dark"] .service-modal-form label,
[data-theme="dark"] .service-confirm-card strong {
    color: #e5edf7;
}

body.dark-mode .service-confirm-card,
body.theme-dark .service-confirm-card,
[data-theme="dark"] .service-confirm-card {
    background: rgba(15, 23, 42, 0.72);
    border-color: rgba(148, 163, 184, 0.24);
}

@media (max-width: 640px) {
    .service-action-content,
    .service-action-footer {
        padding-left: 18px;
        padding-right: 18px;
    }

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

    .service-action-header h2 {
        font-size: 1.25rem;
    }
}
/* Habitaciones: modal propio de acciones principales */
.room-action-panel {
    max-width: 760px;
    width: min(100%, 760px);
}

.room-action-panel .room-form-swal {
    margin: 0;
}

.room-action-panel .room-form-head {
    margin-bottom: 18px;
}

.room-action-panel .room-form-grid {
    gap: 14px;
}

.room-action-panel .room-disable-card small {
    color: var(--muted-color, #64748b);
    font-weight: 700;
}

.room-action-panel .room-export-form {
    margin: 0 auto;
    max-width: 520px;
}
/* Habitaciones: modal grande de deshabilitadas */
.disabled-rooms-app-panel {
    max-width: 980px;
    width: min(100%, 980px);
}

.disabled-rooms-app-content {
    padding: 18px 20px 22px;
}

.disabled-rooms-app-content .archived-modal-layout {
    padding: 0;
}

.disabled-rooms-app-content .modal-export-box,
.disabled-rooms-app-content .archived-modal-toolbar,
.disabled-rooms-app-content .archived-table-wrap,
.disabled-rooms-app-content .archived-modal-pager {
    max-width: none;
}

.disabled-rooms-app-content .archived-table-wrap {
    max-height: min(56vh, 520px);
    overflow: auto;
}
/* Clientes: modal propio de acciones principales */
.client-action-panel,
.employee-action-panel {
    max-width: 780px;
    width: min(100%, 780px);
}

.client-action-panel .client-form-swal,
.client-action-panel .client-fiscal-view,
.employee-action-panel .employee-form-swal {
    margin: 0;
}

.client-action-panel .room-form-head,
.employee-action-panel .room-form-head {
    margin-bottom: 18px;
}

.client-action-panel .client-form-grid,
.employee-action-panel .employee-form-grid {
    gap: 14px;
}

.client-action-panel .client-export-form,
.employee-action-panel .client-export-form {
    margin: 0 auto;
    max-width: 540px;
}

.client-action-panel .detail-summary-grid {
    grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 720px) {
    .client-action-panel .detail-summary-grid {
        grid-template-columns: 1fr;
    }
}
/* Clientes: modal grande de archivados */
.clientes-archivados-app-panel {
    max-width: 980px;
    width: min(100%, 980px);
}

.clientes-archivados-app-content {
    padding: 18px 20px 22px;
}

.clientes-archivados-app-content .archived-modal-content {
    padding: 0;
}

.clientes-archivados-app-content .modal-export-box,
.clientes-archivados-app-content .archived-modal-toolbar,
.clientes-archivados-app-content .table-responsive,
.clientes-archivados-app-content .archived-modal-pager {
    max-width: none;
}

.clientes-archivados-app-content .table-responsive {
    max-height: min(56vh, 520px);
    overflow: auto;
}
/* Reservaciones: modal propio de acciones */
.reservation-action-panel {
    display: grid;
    grid-template-rows: auto minmax(0, auto) auto auto;
    max-width: min(620px, calc(100vw - 48px));
    padding: 0;
    width: min(620px, calc(100vw - 48px));
}

.reservation-action-panel > h2 {
    border-bottom: 1px solid var(--app-border);
    color: var(--app-text);
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.2;
    margin: 0;
    min-height: 64px;
    padding: 18px 64px 16px 28px;
}

.reservation-action-content {
    padding: 20px 28px 14px;
}

.reservation-action-content > .archived-inner-body {
    display: grid;
    gap: 14px;
}

.reservation-action-panel > .inline-status {
    margin: 0 28px 12px;
}

.reservation-action-panel .modal-actions {
    align-items: center;
    border-top: 1px solid var(--app-border);
    display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding: 14px 28px 20px;
}

.reservation-action-modal.is-wide .reservation-action-panel {
    max-width: min(920px, calc(100vw - 48px));
    width: min(920px, calc(100vw - 48px));
}

.reservation-action-modal.is-wide .reservation-action-content {
    padding-bottom: 12px;
}

.reservation-action-panel .reservation-booking-form {
    max-height: min(72vh, 760px);
    overflow: auto;
    padding-right: 2px;
}

.reservation-action-panel .form-control {
    margin: 0;
}

@media (max-width: 720px) {
    .reservation-action-panel,
    .reservation-action-modal.is-wide .reservation-action-panel {
        max-width: calc(100vw - 24px);
        width: calc(100vw - 24px);
    }

    .reservation-action-panel > h2 {
        font-size: 1.3rem;
        padding: 16px 58px 14px 18px;
    }

    .reservation-action-content {
        padding-left: 18px;
        padding-right: 18px;
    }

    .reservation-action-panel > .inline-status {
        margin-left: 18px;
        margin-right: 18px;
    }

    .reservation-action-panel .modal-actions {
        padding-left: 18px;
        padding-right: 18px;
    }
}
/* Configuracion: modal propio de acciones */
.config-action-modal.is-wide .config-action-panel {
    max-width: min(860px, calc(100vw - 48px));
    width: min(860px, calc(100vw - 48px));
}

.config-action-panel .config-form-grid {
    max-height: min(72vh, 720px);
    overflow: auto;
    padding-right: 2px;
}

.config-action-panel .form-control {
    margin: 0;
}

@media (max-width: 720px) {
    .config-action-modal.is-wide .config-action-panel {
        max-width: calc(100vw - 24px);
        width: calc(100vw - 24px);
    }
}
/* Avisos globales sin librerias externas */
.app-alert-modal {
    z-index: 2200;
}

.app-alert-panel {
    display: grid;
    gap: 14px;
    justify-items: center;
    padding: 34px 38px 32px;
    text-align: center;
    width: min(520px, calc(100vw - 48px));
}

.app-alert-icon {
    align-items: center;
    border: 4px solid #8dbbff;
    border-radius: 999px;
    color: #0057c8;
    display: inline-flex;
    font-size: 2.1rem;
    height: 86px;
    justify-content: center;
    width: 86px;
}

.app-alert-modal[data-icon="success"] .app-alert-icon {
    border-color: #86efac;
    color: #16a34a;
}

.app-alert-modal[data-icon="error"] .app-alert-icon {
    border-color: #f87171;
    color: #ef4444;
}

.app-alert-modal[data-icon="warning"] .app-alert-icon {
    border-color: #fdba74;
    color: #f59e0b;
}

.app-alert-panel h2 {
    color: var(--app-text);
    font-size: 1.65rem;
    font-weight: 700;
    margin: 0;
}

.app-alert-panel p {
    color: var(--app-muted);
    font-size: 1rem;
    line-height: 1.45;
    margin: 0;
    max-width: 390px;
}

.app-alert-actions {
    display: flex;
    justify-content: center;
    padding-top: 8px;
}

.app-toast-stack {
    display: grid;
    gap: 10px;
    position: fixed;
    right: 22px;
    top: 22px;
    width: min(360px, calc(100vw - 44px));
    z-index: 2400;
}

.app-toast {
    align-items: center;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-left: 5px solid #0057c8;
    border-radius: 8px;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.18);
    color: var(--app-text);
    display: flex;
    gap: 10px;
    padding: 12px 14px;
    transition: opacity 0.18s ease, transform 0.18s ease;
}

.app-toast.is-hiding {
    opacity: 0;
    transform: translateY(-8px);
}

.app-toast-icon {
    align-items: center;
    background: #eaf2ff;
    border-radius: 8px;
    color: #0057c8;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    width: 32px;
}

.app-toast strong {
    font-size: 0.92rem;
    font-weight: 800;
}

.app-toast-success { border-left-color: #16a34a; }
.app-toast-success .app-toast-icon { background: #dcfce7; color: #16a34a; }
.app-toast-error { border-left-color: #ef4444; }
.app-toast-error .app-toast-icon { background: #fee2e2; color: #ef4444; }
.app-toast-warning { border-left-color: #f59e0b; }
.app-toast-warning .app-toast-icon { background: #fff7ed; color: #f59e0b; }
/* Reservaciones: calendario compacto con simbologia */
#pedidosActivosModal .availability-grid {
    grid-template-columns: minmax(178px, 220px) repeat(var(--availability-days), minmax(70px, 82px));
    gap: 5px;
}

.availability-legend.compact {
    align-items: center;
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: flex;
    gap: 10px 16px;
    justify-content: space-between;
    min-height: 42px;
    padding: 8px 10px;
}

.availability-legend-items {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 12px;
    min-width: 0;
}

.availability-selection-mini {
    align-items: center;
    display: grid;
    gap: 8px;
    grid-template-columns: minmax(250px, 420px) auto auto;
    justify-content: end;
    min-width: 0;
}

.availability-selection-mini .availability-selection-text {
    line-height: 1.25;
    max-width: 420px;
    min-width: 0;
    text-align: right;
}

.availability-selection-mini .availability-selection-text strong {
    display: block;
    font-size: 0.86rem;
}

.availability-selection-mini .availability-selection-text span {
    display: block;
    font-size: 0.74rem;
}

.availability-selection-mini .btn {
    border-radius: 8px;
    font-size: 0.86rem;
    font-weight: 800;
    min-height: 36px;
    padding: 8px 12px;
    white-space: nowrap;
}

.availability-selection-mini .btn.subtle {
    background: transparent;
    border-color: var(--app-border);
    color: var(--app-muted);
    opacity: 1;
}

.availability-selection-mini .btn.subtle:hover {
    background: var(--app-surface);
    color: var(--app-text);
}

.availability-selection-mini .btn:disabled {
    opacity: 0.58;
}

.availability-topbar {
    display: grid;
    gap: 10px 14px;
    grid-template-columns: minmax(0, 1fr) auto;
    margin: 10px 0 8px;
}

.availability-legend.compact span {
    align-items: center;
    color: var(--app-muted);
    display: inline-flex;
    font-size: 0.78rem;
    font-weight: 800;
    gap: 6px;
    line-height: 1;
}

.availability-legend.compact i {
    color: var(--app-primary);
    font-size: 0.86rem;
}

#pedidosActivosModal .availability-cell {
    border-radius: 7px;
    min-height: 46px;
    padding: 6px 8px;
}

#pedidosActivosModal .availability-cell.is-heading {
    min-height: 34px;
    padding: 7px 6px;
}

#pedidosActivosModal .availability-room:not(.is-heading) {
    align-content: start;
    gap: 3px;
    min-height: 64px;
}

.availability-room strong {
    color: var(--app-text);
    font-size: 1.02rem;
    line-height: 1.05;
}

.availability-room-desc {
    color: var(--app-text);
    display: -webkit-box;
    font-size: 0.78rem;
    font-weight: 800;
    line-height: 1.12;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.availability-room small {
    align-items: center;
    display: inline-flex;
    gap: 5px;
    line-height: 1.15;
}

.availability-day {
    align-items: center;
    justify-items: center;
    min-width: 0;
    text-align: center;
}

.availability-day > i {
    font-size: 0.92rem;
    line-height: 1;
}

.availability-day span {
    font-size: 0.76rem;
    font-weight: 900;
    line-height: 1;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.availability-day small {
    font-size: 0.66rem;
    font-weight: 800;
    line-height: 1;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.availability-day.is-free.is-selected > i,
.availability-day.is-free.is-in-range > i {
    color: var(--app-primary);
}

.availability-day.is-free.is-selected span,
.availability-day.is-free.is-in-range span {
    color: var(--app-primary-dark);
}

.availability-day.is-range-start::after,
.availability-day.is-range-end::after {
    font-size: 0.58rem;
    line-height: 1;
}

@media (max-width: 760px) {
    #pedidosActivosModal .availability-grid {
        grid-template-columns: minmax(152px, 172px) repeat(var(--availability-days), minmax(64px, 74px));
    }
}
/* Ajuste descripcion visible en disponibilidad */
#pedidosActivosModal .availability-room:not(.is-heading) {
    display: grid;
    grid-template-rows: auto auto auto auto;
    min-height: 86px;
}

#pedidosActivosModal .availability-room .availability-room-desc {
    color: var(--app-text);
    display: block;
    font-size: 0.75rem;
    font-weight: 900;
    line-height: 1.08;
    margin: 1px 0 2px;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Reservaciones: controles del calendario alineados como formulario */
#pedidosActivosModal .availability-controls.monthly-controls {
    align-items: end;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(190px, 240px) minmax(240px, 320px) minmax(150px, 180px) minmax(170px, 210px);
    max-width: 960px;
}

#pedidosActivosModal .availability-controls.monthly-controls label {
    align-items: stretch;
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
}

#pedidosActivosModal .availability-controls.monthly-controls label > span {
    color: var(--app-text);
    font-size: 0.82rem;
    font-weight: 800;
    line-height: 1.1;
    text-transform: none;
}

#pedidosActivosModal .availability-controls.monthly-controls .btn {
    min-height: 42px;
    white-space: nowrap;
}

#pedidosActivosModal .availability-controls.monthly-controls .btn.subtle {
    background: transparent;
    border-color: var(--app-border);
    color: var(--app-muted);
}

#pedidosActivosModal .availability-controls.monthly-controls .btn.subtle:hover {
    background: var(--app-surface-2);
    color: var(--app-text);
}

#pedidosActivosModal .availability-topbar {
    grid-template-columns: minmax(0, 1fr) minmax(220px, auto);
}

#pedidosActivosModal .availability-selection-mini {
    grid-template-columns: minmax(230px, 390px) auto;
}

@media (max-width: 980px) {
    #pedidosActivosModal .availability-controls.monthly-controls,
    #pedidosActivosModal .availability-topbar,
    #pedidosActivosModal .availability-selection-mini {
        grid-template-columns: 1fr;
    }

    #pedidosActivosModal .availability-selection-mini .availability-selection-text {
        text-align: left;
    }
}

/* Reservaciones: orden visual del encabezado de disponibilidad */
#pedidosActivosModal .availability-command-bar {
    align-items: stretch;
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 12px;
    grid-template-columns: minmax(0, 1fr) minmax(300px, 430px);
    margin-top: 2px;
    padding: 12px;
}

#pedidosActivosModal .availability-controls.monthly-controls {
    align-items: end;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(170px, 220px) minmax(150px, 210px) auto;
    max-width: none;
}

#pedidosActivosModal .availability-filter-actions {
    align-items: end;
    display: flex;
    gap: 8px;
    justify-content: flex-start;
    min-width: 0;
}

#pedidosActivosModal .availability-controls.monthly-controls .btn {
    min-height: 42px;
    padding-left: 14px;
    padding-right: 14px;
}

#pedidosActivosModal .availability-controls.monthly-controls .btn.subtle {
    background: var(--app-surface);
}

#pedidosActivosModal .availability-selection-mini {
    align-items: center;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr) auto;
    justify-content: stretch;
    padding: 10px;
}

#pedidosActivosModal .availability-selection-mini .availability-selection-text {
    max-width: none;
    text-align: left;
}

#pedidosActivosModal .availability-selection-mini .availability-selection-text strong {
    color: var(--app-text);
    font-size: 0.9rem;
}

#pedidosActivosModal .availability-selection-mini .availability-selection-text span {
    color: var(--app-muted);
    font-size: 0.76rem;
    line-height: 1.25;
}

#pedidosActivosModal .availability-selection-mini .btn {
    min-height: 42px;
    min-width: 112px;
}

#pedidosActivosModal .availability-legend.compact.availability-topbar {
    background: transparent;
    border: 0;
    justify-content: flex-start;
    margin: -2px 0 6px;
    min-height: auto;
    padding: 0 2px;
}

#pedidosActivosModal .availability-legend-items {
    gap: 8px 14px;
}

#pedidosActivosModal .availability-legend.compact span {
    font-size: 0.76rem;
    font-weight: 700;
}

@media (max-width: 1120px) {
    #pedidosActivosModal .availability-command-bar,
    #pedidosActivosModal .availability-controls.monthly-controls,
    #pedidosActivosModal .availability-selection-mini {
        grid-template-columns: 1fr;
    }

    #pedidosActivosModal .availability-filter-actions {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (max-width: 560px) {
    #pedidosActivosModal .availability-command-bar {
        padding: 10px;
    }

    #pedidosActivosModal .availability-filter-actions {
        grid-template-columns: 1fr;
    }

    #pedidosActivosModal .availability-selection-mini .btn {
        width: 100%;
    }
}

.pedido-picker-select {
    width: 100%;
    min-height: 168px;
    height: auto;
    padding: 8px;
    line-height: 1.4;
}

.pedido-picker-select option {
    padding: 8px 10px;
    border-radius: 6px;
}
/* Recepcion: formulario de servicios con presentacion final */
.pedido-inner-services {
    display: grid;
    gap: 14px;
}

.service-form-intro {
    align-items: center;
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: flex;
    gap: 12px;
    padding: 12px 14px;
}

.service-form-icon {
    align-items: center;
    background: rgba(0, 87, 200, 0.1);
    border-radius: 8px;
    color: var(--app-primary, #0057c8);
    display: inline-flex;
    flex: 0 0 38px;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.service-form-intro div,
.service-form-section-head,
.service-list-head {
    display: grid;
    gap: 3px;
}

.service-form-intro strong,
.service-form-section-head strong,
.service-list-head strong {
    color: var(--app-text);
    font-size: 0.92rem;
    font-weight: 800;
}

.service-form-intro span,
.service-form-section-head span,
.service-list-head span {
    color: var(--app-muted);
    font-size: 0.82rem;
    font-weight: 600;
}

.service-form-section {
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    padding: 14px;
}

.service-form-section-head {
    border-bottom: 1px solid var(--app-border);
    margin-bottom: 12px;
    padding-bottom: 10px;
}

.service-form-fields {
    gap: 12px;
    margin: 0;
}

.service-form-fields .service-field-wide {
    grid-column: 1 / -1;
}

.pedido-inner-services .room-field span {
    font-size: 0.76rem;
    letter-spacing: 0.01em;
    text-transform: none;
}

.pedido-inner-services .room-field .form-control {
    font-size: 0.94rem;
    font-weight: 700;
}

.service-records-section {
    padding-bottom: 10px;
}

.service-list-head {
    margin-bottom: 10px;
}

.pedido-inner-services .service-list {
    background: var(--app-surface-2);
    margin: 0;
    max-height: 220px;
    padding: 8px;
}

@media (max-width: 640px) {
    .service-form-intro {
        align-items: flex-start;
    }

    .service-form-fields .service-field-wide {
        grid-column: auto;
    }
}

/* Recepcion: etiquetas consistentes en formularios internos */
.reservation-swal-form .room-field span {
    text-transform: none;
}

.reservation-swal-form .room-field .form-control {
    border-radius: 7px;
}

.service-form-intro > .service-form-icon {
    color: var(--app-primary, #0057c8);
    font-size: 1rem;
    font-weight: 400;
}

/* Servicios: reservacion amplia y precio controlado por catalogo */
.pedido-inner-services .service-form-fields {
    grid-template-columns: minmax(270px, 1.35fr) minmax(150px, 0.65fr);
}

.pedido-inner-services #detalleServicioReservacion {
    min-width: 0;
    width: 100%;
}

.pedido-inner-services #detalleServicioCosto.is-catalog-price {
    background: var(--app-surface-2);
    color: var(--app-muted);
    cursor: not-allowed;
    opacity: 0.9;
}

@media (max-width: 640px) {
    .pedido-inner-services .service-form-fields {
        grid-template-columns: 1fr;
    }
}

.pedido-inner-services #detalleServicioDescripcion.is-catalog-description {
    background: var(--app-surface-2);
    color: var(--app-muted);
    cursor: not-allowed;
    opacity: 0.9;
}

.service-list-head > div {
    display: grid;
    gap: 4px;
}

.service-list-head strong {
    display: block;
    line-height: 1.25;
}






/* Reservaciones: separar operacion de historial */
.reservations-scope-filter {
    align-items: center;
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: inline-flex;
    gap: 2px;
    padding: 3px;
}

.reservations-scope-filter button {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--app-muted);
    cursor: pointer;
    font: inherit;
    font-size: 0.88rem;
    font-weight: 700;
    min-height: 34px;
    padding: 0 12px;
}

.reservations-scope-filter button.is-active {
    background: var(--app-surface);
    box-shadow: 0 1px 3px rgba(15, 23, 42, 0.12);
    color: var(--app-primary);
}

@media (max-width: 720px) {
    .reservations-scope-filter {
        width: 100%;
    }

    .reservations-scope-filter button {
        flex: 1;
        padding: 0 8px;
    }
}
/* Reservaciones: paginacion fuera del scroll de tabla */
#pedidosActivosPanel {
    max-height: none !important;
    overflow: visible !important;
}

#pedidosActivosPanel > .table-responsive {
    overflow-x: auto;
    overflow-y: visible;
}

#paginacionReservaciones {
    border-top: 1px solid var(--app-border);
    justify-content: flex-end;
    margin: 12px 0 0 auto;
    padding: 12px 0 0;
    position: relative;
    z-index: 1;
}
/* Recepcion: cargo seleccionado sin repetir campos del catalogo */
.pedido-inner-services .service-form-intro {
    align-items: center;
    grid-template-columns: auto minmax(0, 1fr) auto;
}

.pedido-inner-services .service-catalog-link {
    flex: 0 0 auto;
    margin-left: auto;
    white-space: nowrap;
}

.pedido-inner-services .service-form-fields {
    grid-template-columns: minmax(230px, 1.2fr) minmax(180px, 0.8fr) minmax(230px, 1fr);
}

.service-selected-summary-wrap {
    margin-top: 12px;
}

.service-selected-summary {
    align-items: center;
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 2px 12px;
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 58px;
    padding: 10px 12px;
}

.service-selected-summary span {
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    grid-column: 1 / -1;
}

.service-selected-summary strong {
    color: var(--app-text);
    font-size: 0.96rem;
    font-weight: 800;
    min-width: 0;
    overflow-wrap: anywhere;
}

.service-selected-summary em {
    color: var(--app-primary, #0057c8);
    font-size: 1rem;
    font-style: normal;
    font-weight: 900;
    white-space: nowrap;
}

.service-selected-summary.is-empty {
    grid-template-columns: 1fr;
}

.service-selected-summary.is-empty strong {
    color: var(--app-muted);
    font-size: 0.88rem;
    font-weight: 700;
}

@media (max-width: 720px) {
    .pedido-inner-services .service-form-intro {
        align-items: stretch;
        flex-direction: column;
    }

    .pedido-inner-services .service-catalog-link {
        justify-content: center;
        margin-left: 0;
        width: 100%;
    }

    .pedido-inner-services .service-form-fields,
    .service-selected-summary {
        grid-template-columns: 1fr;
    }

    .service-selected-summary em {
        white-space: normal;
    }
}
/* Recepcion: alta rapida del catalogo desde cargos */
.service-catalog-quick {
    background: var(--app-surface-2);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(220px, 1fr) minmax(180px, 0.75fr) minmax(120px, 0.5fr) auto;
    margin-top: 12px;
    padding: 12px;
}

.service-catalog-quick[hidden] {
    display: none !important;
}

.service-catalog-quick .btn {
    align-self: end;
    min-height: 42px;
    white-space: nowrap;
}

@media (max-width: 820px) {
    .service-catalog-quick {
        grid-template-columns: 1fr;
    }

    .service-catalog-quick .btn {
        width: 100%;
    }
}
/* Recepcion: aplicar cargo dentro del bloque de captura */
.service-apply-row {
    align-items: stretch;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr) auto;
    margin-top: 12px;
}

.service-apply-row .service-selected-summary-wrap {
    margin-top: 0;
}

.service-apply-button {
    align-self: stretch;
    min-width: 150px;
    white-space: nowrap;
}

@media (max-width: 720px) {
    .service-apply-row {
        grid-template-columns: 1fr;
    }

    .service-apply-button {
        width: 100%;
    }
}
/* Reservaciones: banderas de pre-reserva sin bloqueo */
.availability-day.is-preview-own {
    background: #eef6ff;
    border-color: rgba(0, 87, 200, 0.34);
    color: #07509f;
}

.availability-day.is-preview-own small {
    color: #2563eb;
}

.availability-day.is-preview-own:hover {
    background: #dbeafe;
    border-color: rgba(0, 87, 200, 0.52);
}

.availability-day.is-preview-other {
    background: #fffbeb;
    border-color: rgba(180, 83, 9, 0.34);
    color: #92400e;
}

.availability-day.is-preview-other small {
    color: #b45309;
}

.availability-day.is-preview-other:hover {
    background: #fef3c7;
    border-color: rgba(180, 83, 9, 0.52);
}

.availability-day.is-preview-own.is-selected,
.availability-day.is-preview-own.is-in-range,
.availability-day.is-preview-other.is-selected,
.availability-day.is-preview-other.is-in-range {
    background: rgba(0, 86, 204, 0.13);
    border-color: var(--app-primary);
    color: var(--app-primary-dark);
}

/* Configuracion: secciones en modal tipo acciones */
.config-section-panel {
    width: min(1080px, calc(100vw - 48px));
    max-width: min(1080px, calc(100vw - 48px));
}

.config-section-panel .service-action-header > div {
    min-width: 0;
}

.config-section-panel .service-action-header h2 {
    margin-bottom: 4px;
}

.config-section-content {
    max-height: min(72vh, 760px);
    overflow: auto;
    padding: 18px 24px 8px;
}

.config-section-content .module-panel {
    margin: 0;
    border: 0;
    box-shadow: none;
    padding: 0;
}

.config-section-content .module-toolbar {
    padding: 0 0 14px;
}

.config-section-content .table-responsive {
    margin-bottom: 0;
}

.config-section-content .config-form-grid,
.config-section-content .config-nav-grid {
    padding-left: 0;
    padding-right: 0;
}

.config-section-modal .service-action-footer {
    justify-content: flex-start;
}

@media (max-width: 720px) {
    .config-section-panel {
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
    }

    .config-section-content {
        max-height: 72vh;
        padding: 14px 16px 8px;
    }
}

/* Configuracion: portada estilo Punto de Venta */
.config-pos-shell {
    max-width: 1180px;
    margin-left: 40px;
    margin-right: auto;
}

.config-pos-shell .module-header {
    min-height: 90px;
}

.config-pos-launcher {
    max-width: 1180px;
    margin: 18px auto 0 40px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
}

.config-pos-launcher .config-nav-grid {
    grid-template-columns: repeat(5, minmax(180px, 1fr));
    gap: 14px;
    padding: 0;
}

.config-pos-launcher .config-nav-card {
    align-content: start;
    justify-items: start;
    min-height: 168px;
    padding: 18px;
    text-align: left;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    box-shadow: var(--app-shadow-soft);
}

.config-pos-launcher .config-nav-card i {
    display: inline-grid;
    place-items: center;
    width: 46px;
    height: 46px;
    margin-bottom: 10px;
    border-radius: 8px;
    background: rgba(0, 87, 200, 0.1);
    color: var(--app-primary);
    font-size: 1.2rem;
}

.config-pos-launcher .config-nav-card strong {
    margin-top: 0;
    color: var(--app-text);
    font-size: 1.04rem;
    line-height: 1.25;
}

.config-pos-launcher .config-nav-card span {
    max-width: 150px;
    color: var(--app-muted);
    font-size: .96rem;
    font-weight: 600;
    line-height: 1.45;
}

.config-pos-launcher .config-nav-card.is-active {
    border-color: var(--app-border);
    background: var(--app-surface);
}

.config-pos-launcher .config-nav-card:hover,
.config-pos-launcher .config-nav-card:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(0, 87, 200, 0.45);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

@media (max-width: 1280px) {
    .config-pos-shell,
    .config-pos-launcher {
        max-width: none;
        margin-left: 24px;
        margin-right: 24px;
    }

    .config-pos-launcher .config-nav-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
    }
}

@media (max-width: 720px) {
    .config-pos-shell,
    .config-pos-launcher {
        margin-left: 12px;
        margin-right: 12px;
    }

    .config-pos-launcher .config-nav-grid {
        grid-template-columns: 1fr;
    }

    .config-pos-launcher .config-nav-card {
        min-height: 138px;
    }
}

/* Configuracion: pulido final de portada POS */
.config-pos-shell .module-header {
    align-items: center;
    padding: 18px;
}

.config-pos-shell .module-title {
    gap: 16px;
}

.config-pos-shell .module-icon {
    width: 52px;
    height: 52px;
    border-radius: 8px;
}

.config-pos-launcher .config-nav-grid {
    grid-template-columns: repeat(5, 225px);
    justify-content: start;
    gap: 16px;
}

.config-pos-launcher .config-nav-card {
    width: 225px;
    min-height: 168px;
    gap: 9px;
}

.config-pos-launcher .config-nav-card strong {
    min-height: 24px;
}

.config-pos-launcher .config-nav-card span {
    max-width: 170px;
}

.config-pos-launcher .config-nav-card.is-active {
    box-shadow: var(--app-shadow-soft);
}

.config-section-panel {
    overflow: hidden;
}

.config-section-panel .service-action-header,
.config-section-panel .service-action-footer {
    flex-shrink: 0;
}

.config-section-content .module-toolbar-actions .btn {
    min-width: 118px;
}

@media (max-width: 900px) {
    .config-pos-launcher .config-nav-grid {
        grid-template-columns: repeat(auto-fit, minmax(210px, 225px));
    }

    .config-pos-launcher .config-nav-card {
        width: 225px;
    }
}

@media (max-width: 560px) {
    .config-pos-launcher .config-nav-grid {
        grid-template-columns: 1fr;
    }

    .config-pos-launcher .config-nav-card {
        width: auto;
    }
}



/* Perfil: ancho de modulo y sin scroll sobrante */
.profile-page-content {
    min-height: auto;
    padding-bottom: 16px;
}

.profile-page-content .container-fluid {
    padding-left: 0;
    padding-right: 0;
}

.profile-module-shell {
    max-width: none;
    width: auto;
    margin-left: 24px;
    margin-right: 24px;
    margin-bottom: 0;
}

.profile-module-shell .profile-header-panel {
    margin-bottom: 18px;
}

.profile-module-shell .profile-layout.profile-layout-pos {
    width: 100%;
    max-width: none;
    margin: 0;
    grid-template-columns: minmax(520px, 1.15fr) minmax(420px, .85fr);
    align-items: start;
}

.profile-module-shell .profile-layout.profile-layout-pos > .module-panel,
.profile-module-shell .profile-photo-panel,
.profile-module-shell .profile-password-panel {
    height: auto;
    min-height: 0;
}

.profile-module-shell .profile-summary-panel {
    min-height: 0;
    grid-row: span 2;
}

.profile-module-shell .profile-photo-panel .module-panel-body,
.profile-module-shell .profile-password-panel .module-panel-body,
.profile-module-shell .profile-password-panel form {
    min-height: 0;
    flex: initial;
}

.profile-module-shell .profile-password-panel form {
    justify-content: flex-start;
}

.profile-module-shell .profile-form-actions {
    margin-top: 18px;
}

@media (max-width: 1100px) {
    .profile-module-shell .profile-layout.profile-layout-pos {
        grid-template-columns: 1fr;
    }

    .profile-module-shell .profile-summary-panel {
        grid-row: auto;
    }
}

@media (max-width: 760px) {
    .profile-module-shell {
        margin-left: 12px;
        margin-right: 12px;
    }
}

/* Perfil: igualar alto visual de columna derecha con tarjeta izquierda */
.profile-module-shell .profile-layout.profile-layout-pos {
    align-items: stretch;
    grid-template-rows: repeat(2, minmax(0, 1fr));
}

.profile-module-shell .profile-summary-panel {
    grid-row: 1 / span 2;
    height: 100%;
}

.profile-module-shell .profile-photo-panel,
.profile-module-shell .profile-password-panel {
    height: 100%;
    min-height: 0;
}

.profile-module-shell .profile-photo-panel .module-panel-body,
.profile-module-shell .profile-password-panel .module-panel-body {
    flex: 1;
}

.profile-module-shell .profile-password-panel form {
    flex: 1;
    justify-content: space-between;
}

@media (max-width: 1100px) {
    .profile-module-shell .profile-layout.profile-layout-pos {
        grid-template-rows: auto;
    }

    .profile-module-shell .profile-summary-panel,
    .profile-module-shell .profile-photo-panel,
    .profile-module-shell .profile-password-panel {
        height: auto;
    }
}

/* Recepcion: caja integrada */
.recepcion-caja-panel {
    width: min(1120px, calc(100vw - 48px));
    max-height: calc(100vh - 52px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.recepcion-caja-tabs {
    display: flex;
    gap: 8px;
    padding: 14px 24px 0;
    border-top: 1px solid var(--app-border);
}

.recepcion-caja-tabs button {
    border: 1px solid var(--app-border);
    background: var(--app-surface-soft);
    color: var(--app-muted);
    font-weight: 800;
    padding: 10px 14px;
    border-radius: 8px;
    cursor: pointer;
}

.recepcion-caja-tabs button.is-active {
    background: var(--app-primary-soft);
    color: var(--app-primary);
    border-color: rgba(0, 87, 200, .28);
}

.recepcion-caja-panel > .inline-status {
    margin: 14px 24px 0;
}

.recepcion-caja-content {
    padding: 18px 24px 24px;
    overflow: auto;
}

.recepcion-caja-summary {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.recepcion-caja-summary div {
    border: 1px solid var(--app-border);
    background: var(--app-surface-soft);
    border-radius: 8px;
    padding: 13px 14px;
    min-height: 78px;
}

.recepcion-caja-summary span,
.recepcion-caja-section-title span,
.recepcion-caja-turnos small,
.recepcion-caja-turnos span {
    display: block;
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 700;
}

.recepcion-caja-summary strong {
    display: block;
    margin-top: 7px;
    color: var(--app-text);
    font-size: 18px;
}

.recepcion-caja-actions {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin: 12px 0 16px;
}

.recepcion-caja-section-title {
    border-top: 1px solid var(--app-border);
    padding-top: 16px;
    margin-top: 8px;
    margin-bottom: 10px;
}

.recepcion-caja-section-title strong {
    display: block;
    color: var(--app-text);
    font-size: 16px;
    margin-bottom: 4px;
}

.recepcion-caja-table-wrap {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    overflow: auto;
    max-height: 360px;
}

.recepcion-caja-table th,
.recepcion-caja-table td {
    white-space: nowrap;
}

.recepcion-caja-formbox {
    border: 1px solid var(--app-border);
    background: var(--app-surface-soft);
    border-radius: 8px;
    padding: 16px;
    display: grid;
    gap: 12px;
    max-width: 620px;
}

.recepcion-caja-formbox > strong {
    font-size: 18px;
    color: var(--app-text);
}

.recepcion-caja-formbox > span {
    color: var(--app-muted);
    font-weight: 700;
}

.recepcion-caja-formbox label span {
    display: block;
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 800;
    margin-bottom: 6px;
}

.recepcion-caja-turnos {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
}

.recepcion-caja-turnos button {
    text-align: left;
    border: 1px solid var(--app-border);
    background: var(--app-surface);
    border-radius: 8px;
    padding: 14px;
    cursor: pointer;
}

.recepcion-caja-turnos button:hover,
.recepcion-caja-turnos button:focus {
    border-color: rgba(0, 87, 200, .35);
    box-shadow: var(--app-shadow-soft);
}

.recepcion-caja-turnos strong {
    display: block;
    color: var(--app-text);
    margin-bottom: 5px;
}

@media (max-width: 700px) {
    .recepcion-caja-panel {
        width: calc(100vw - 20px);
    }

    .recepcion-caja-tabs {
        overflow-x: auto;
        padding-left: 14px;
        padding-right: 14px;
    }

    .recepcion-caja-content {
        padding-left: 14px;
        padding-right: 14px;
    }
}

/* Recepcion: resumen de caja en pantalla principal */
.recepcion-caja-main {
    max-width: none;
    width: auto;
    margin: -4px 24px 18px;
    padding: 16px 18px;
    display: grid;
    grid-template-columns: minmax(220px, 1fr) minmax(360px, 1.7fr) auto;
    align-items: center;
    gap: 16px;
}

.recepcion-caja-main-info {
    display: flex;
    align-items: center;
    gap: 14px;
    min-width: 0;
}

.recepcion-caja-main-info h2 {
    margin: 0 0 4px;
    color: var(--app-text);
    font-size: 20px;
}

.recepcion-caja-main-info p {
    margin: 0;
    color: var(--app-muted);
    font-size: 13px;
    line-height: 1.35;
}

.recepcion-caja-main-metrics {
    display: grid;
    grid-template-columns: repeat(5, minmax(96px, 1fr));
    gap: 8px;
}

.recepcion-caja-main-metrics div {
    border: 1px solid var(--app-border);
    background: var(--app-surface-soft);
    border-radius: 8px;
    padding: 10px 11px;
    min-height: 62px;
}

.recepcion-caja-main-metrics span {
    display: block;
    color: var(--app-muted);
    font-size: 11px;
    font-weight: 800;
    margin-bottom: 5px;
}

.recepcion-caja-main-metrics strong {
    display: block;
    color: var(--app-text);
    font-size: 15px;
    line-height: 1.15;
}

.recepcion-caja-main-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

@media (max-width: 1280px) {
    .recepcion-caja-main {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .recepcion-caja-main-actions {
        justify-content: flex-start;
    }
}

@media (max-width: 760px) {
    .recepcion-caja-main {
        margin-left: 12px;
        margin-right: 12px;
        padding: 14px;
    }

    .recepcion-caja-main-metrics {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Recepcion: caja completa en vista principal */
.recepcion-caja-main {
    align-items: start;
}

.recepcion-caja-main .recepcion-caja-main-content {
    grid-column: 1 / -1;
    padding: 0;
    overflow: visible;
}

.recepcion-caja-main-grid {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(280px, .8fr);
    gap: 16px;
    border-top: 1px solid var(--app-border);
    padding-top: 14px;
    margin-top: 4px;
}

.recepcion-caja-main-grid .recepcion-caja-section-title {
    border-top: 0;
    padding-top: 0;
    margin-top: 0;
}

.recepcion-caja-main-grid .recepcion-caja-table-wrap {
    max-height: 260px;
    background: var(--app-surface);
}

.recepcion-caja-turnos.is-compact {
    grid-template-columns: 1fr;
    max-height: 260px;
    overflow: auto;
    padding-right: 2px;
}

.recepcion-caja-main .recepcion-caja-formbox {
    max-width: none;
    margin-top: 4px;
}

@media (max-width: 980px) {
    .recepcion-caja-main-grid {
        grid-template-columns: 1fr;
    }
}

/* Recepcion: metricas generales de caja arriba del turno actual */
.recepcion-caja-metrics-panel {
    margin: -4px 24px 12px;
}

.recepcion-caja-metrics-panel .recepcion-caja-main-metrics {
    grid-template-columns: repeat(7, minmax(112px, 1fr));
}

.recepcion-caja-main {
    grid-template-columns: minmax(260px, 1fr) auto;
}

.recepcion-turno-required {
    display: flex;
    align-items: center;
    gap: 10px;
    background: #eef5ff;
    border-color: #cfe0f7;
    color: #0f4fa8;
    margin-bottom: 14px;
}

.recepcion-turno-required i {
    color: var(--app-primary);
}

.recepcion-turno-required strong,
.recepcion-turno-required span {
    display: inline-block;
}

#pedidosActivosPanel.is-caja-blocked .module-toolbar,
#pedidosActivosPanel.is-caja-blocked .table-responsive,
#pedidosActivosPanel.is-caja-blocked .module-pager,
#pedidosActivosPanel.is-caja-blocked #reservacionesEstado {
    opacity: .48;
    pointer-events: none;
}

.recepcion-caja-turnos-modal {
    display: grid;
    gap: 10px;
    text-align: left;
}

.recepcion-caja-turnos-modal button {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    width: 100%;
    border: 1px solid var(--app-border);
    background: var(--app-surface-soft);
    border-radius: 8px;
    padding: 13px 14px;
    cursor: pointer;
    text-align: left;
}

.recepcion-caja-turnos-modal button:hover,
.recepcion-caja-turnos-modal button:focus {
    border-color: rgba(0, 87, 200, .35);
    box-shadow: var(--app-shadow-soft);
}

.recepcion-caja-turnos-modal span,
.recepcion-caja-turnos-modal small {
    display: block;
}

.recepcion-caja-turnos-modal small {
    color: var(--app-muted);
    margin-top: 3px;
}

.recepcion-caja-swal .recepcion-caja-summary {
    margin-bottom: 14px;
}

.recepcion-caja-swal .recepcion-caja-table-wrap {
    max-height: 360px;
    overflow: auto;
}
.recepcion-caja-movimientos-modal {
    display: grid;
    gap: 18px;
    text-align: left;
}

.cash-move-hero {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.cash-move-stat {
    border: 1px solid #d6e2f0;
    background: #f7fbff;
    border-radius: 8px;
    min-height: 86px;
    padding: 16px 18px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.cash-move-stat span {
    color: var(--app-muted);
    font-size: 13px;
    font-weight: 700;
}

.cash-move-stat strong {
    color: var(--app-primary);
    font-size: 22px;
    line-height: 1.2;
    margin-top: 6px;
}

.cash-move-stat.is-out strong {
    color: #b42318;
}

.cash-move-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 0 0 4px;
}

.cash-move-terminal {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface-soft);
    color: var(--app-muted);
    font-weight: 800;
    min-height: 40px;
    padding: 0 12px;
}

.cash-move-terminal.is-online {
    border-color: #b7e2c7;
    background: #ecfdf3;
    color: #067647;
}

.cash-move-terminal.is-offline {
    border-color: #f4c7c7;
    background: #fff5f5;
    color: #b42318;
}

.recepcion-caja-terminal-warning {
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #f4c7c7;
    background: #fff5f5;
    color: #b42318;
    border-radius: 8px;
    padding: 11px 13px;
    font-weight: 800;
}

.recepcion-caja-movimientos-table {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    overflow: auto;
    max-height: 380px;
    background: var(--app-surface);
}

.recepcion-caja-movimientos-table .table {
    margin-bottom: 0;
}

.recepcion-caja-movimientos-table thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: var(--app-surface);
}

.recepcion-caja-movimientos-table td strong,
.recepcion-caja-movimientos-table td small {
    display: block;
}

.recepcion-caja-movimientos-table td small,
.recepcion-caja-movimientos-table .muted-cell {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 700;
}

.cash-move-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 78px;
    border-radius: 999px;
    padding: 5px 10px;
    font-size: 12px;
    font-weight: 900;
    background: #ecfdf3;
    color: #067647;
}

.cash-move-badge.is-out {
    background: #fff1f1;
    color: #b42318;
}

.cash-move-amount {
    font-weight: 900;
    color: #067647;
}

.cash-move-amount.is-out {
    color: #b42318;
}

.recepcion-caja-empty-movimientos {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    min-height: 230px;
    display: grid;
    place-items: center;
    align-content: center;
    gap: 8px;
    color: var(--app-muted);
    background: var(--app-surface);
}

.recepcion-caja-empty-movimientos span {
    width: 52px;
    height: 52px;
    border-radius: 12px;
    display: grid;
    place-items: center;
    background: #eaf3ff;
    color: var(--app-primary);
    font-size: 24px;
}

.recepcion-caja-empty-movimientos strong {
    color: var(--app-text);
    font-size: 17px;
}

.recepcion-caja-empty-movimientos p {
    margin: 0;
}

.cash-move-form {
    display: grid;
    gap: 16px;
    text-align: left;
}

.cash-move-form-note {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #d6e2f0;
    border-radius: 8px;
    background: #f7fbff;
    padding: 13px 14px;
}

.cash-move-form-note > span {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    display: grid;
    place-items: center;
    background: #e8f1ff;
    color: var(--app-primary);
    flex: 0 0 auto;
}

.cash-move-form-note strong,
.cash-move-form-note small {
    display: block;
}

.cash-move-form-note strong {
    color: var(--app-text);
    font-size: 15px;
}

.cash-move-form-note small {
    color: var(--app-muted);
    margin-top: 2px;
}

.cash-move-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}

.cash-move-form label {
    display: grid;
    gap: 6px;
    margin: 0;
}

.cash-move-form label > span {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 900;
    text-transform: none;
}

.cash-move-form .form-control {
    min-height: 42px;
    border-radius: 7px;
}

.cash-move-comment textarea.form-control {
    width: 100%;
    min-height: 108px;
    resize: vertical;
}

.recepcion-caja-fallback-panel .modal-actions {
    border-top: 1px solid var(--app-border);
    margin: 18px -18px -18px;
    padding: 14px 18px;
    justify-content: flex-end;
    background: #fbfdff;
}

.recepcion-caja-fallback-panel .app-modal-header h2 {
    font-size: 26px;
    line-height: 1.15;
}
@media (max-width: 760px) {
    .cash-move-hero {
        grid-template-columns: 1fr;
    }

    .cash-move-toolbar {
        align-items: stretch;
        flex-direction: column;
    }

    .cash-move-toolbar .btn,
    .cash-move-terminal {
        width: 100%;
        justify-content: center;
    }
}
/* Recepcion: replica visual de movimientos de caja de punto de venta */
.mini-metrics {
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(0, 1fr);
    margin-bottom: 12px;
}

.mini-metrics article {
    background: #eef6ff;
    border: 1px solid #d7e4f2;
    border-radius: 8px;
    padding: 10px 12px;
    text-align: center;
}

.mini-metrics span {
    color: #63748b;
    display: block;
}

.mini-metrics strong {
    color: #0057c8;
    display: block;
    font-size: 20px;
}

.caja-movimientos-actions {
    display: flex;
    justify-content: flex-end;
    margin: 0 0 12px;
}

.inline-status-error {
    border-color: #f4c7c7;
    background: #fff5f5;
    color: #b42318;
}
.caja-movimientos .table-responsive {
    border: 1px solid var(--app-border);
    border-radius: 8px;
    max-height: 360px;
    overflow: auto;
}

.caja-movimientos .module-table {
    margin-bottom: 0;
}

.caja-movimientos .module-table thead th {
    background: var(--app-surface);
    position: sticky;
    top: 0;
    z-index: 1;
}

.status-pill.is-success {
    background: #e8f8ef;
    color: #11844a;
}

.status-pill.is-danger {
    background: #fff0f0;
    color: #c12f2f;
}

.right {
    text-align: right;
}

.segmented-control {
    align-items: center;
    background: var(--app-bg);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: inline-flex;
    padding: 3px;
}

.segmented-control button {
    align-items: center;
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: var(--app-muted);
    cursor: pointer;
    display: inline-flex;
    gap: 7px;
    font-weight: 800;
    min-height: 36px;
    padding: 7px 10px;
}

.segmented-control button.is-active {
    background: var(--app-primary);
    color: #fff;
}

.swal-form {
    display: grid;
    gap: 10px;
    text-align: left;
}

.swal-form label {
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 900;
    margin: 0;
}

.swal-form .swal2-input {
    margin: 0;
    width: 100%;
}

.corte-movements-panel {
    width: min(960px, calc(100vw - 48px));
}

.compact-action-swal {
    border-radius: 10px !important;
}

.compact-action-swal .swal2-html-container {
    overflow: visible !important;
}

@media (max-width: 760px) {
    .mini-metrics {
        grid-template-columns: 1fr;
    }

    .caja-movimientos-actions .btn {
        width: 100%;
        justify-content: center;
    }

    .segmented-control {
        display: grid;
        width: 100%;
    }
}
@media (max-width: 1280px) {
    .recepcion-caja-metrics-panel .recepcion-caja-main-metrics {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .recepcion-caja-metrics-panel {
        margin-left: 12px;
        margin-right: 12px;
    }

    .recepcion-caja-metrics-panel .recepcion-caja-main-metrics,
    .recepcion-caja-main-metrics {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Recepcion: acciones principales alineadas en encabezados */
.reception-main-header,
#pedidosActivosPanel .module-panel-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.reception-main-header {
    margin-bottom: 0;
}

.reception-main-actions,
#pedidosActivosPanel .module-panel-header .module-toolbar-actions {
    flex: 0 0 auto;
    align-self: center;
}

#pedidosActivosPanel .module-panel-header {
    padding-right: 0;
}

#pedidosActivosPanel .module-panel-header h2 {
    margin: 0;
}

@media (max-width: 900px) {
    .reception-main-header,
    #pedidosActivosPanel .module-panel-header {
        align-items: stretch;
        flex-direction: column;
    }

    .reception-main-actions,
    #pedidosActivosPanel .module-panel-header .module-toolbar-actions {
        width: 100%;
    }

    .reception-main-actions .btn,
    #pedidosActivosPanel .module-panel-header .module-toolbar-actions .btn {
        justify-content: center;
    }
}

/* Recepcion: detalle de turno colapsado */
.recepcion-caja-detail-strip {
    align-items: center;
    background: var(--app-bg);
    border: 1px solid var(--app-border);
    border-radius: 8px;
    display: flex;
    gap: 14px;
    justify-content: space-between;
    padding: 12px 14px;
}

.recepcion-caja-detail-strip strong,
.recepcion-caja-detail-strip span {
    display: block;
}

.recepcion-caja-detail-strip strong {
    color: var(--app-text);
    font-weight: 900;
}

.recepcion-caja-detail-strip span {
    color: var(--app-muted);
    font-size: 13px;
    font-weight: 700;
    margin-top: 2px;
}

@media (max-width: 760px) {
    .recepcion-caja-detail-strip {
        align-items: stretch;
        flex-direction: column;
    }

    .recepcion-caja-detail-strip .btn {
        justify-content: center;
        width: 100%;
    }
}

/* Recepcion: bloqueo inicial mientras se valida turno */
.reception-loading-overlay {
    align-items: center;
    background: rgba(241, 246, 252, 0.78);
    backdrop-filter: blur(2px);
    display: flex;
    inset: 0;
    justify-content: center;
    position: fixed;
    z-index: 1400;
}

.reception-loading-overlay[hidden] {
    display: none !important;
}

.reception-loading-card {
    align-items: center;
    background: var(--app-surface);
    border: 1px solid var(--app-border);
    border-radius: 10px;
    box-shadow: var(--app-shadow);
    display: grid;
    gap: 8px;
    justify-items: center;
    max-width: 360px;
    padding: 24px;
    text-align: center;
}

.reception-loading-card strong {
    color: var(--app-text);
    font-size: 18px;
    font-weight: 900;
}

.reception-loading-card span:last-child {
    color: var(--app-muted);
    font-weight: 700;
    line-height: 1.35;
}

.reception-loading-card .loading-spinner {
    border: 4px solid #d8e7f9;
    border-top-color: var(--app-primary);
    border-radius: 999px;
    display: inline-block;
    height: 38px;
    width: 38px;
    animation: cdhotelSpin .8s linear infinite;
}

@keyframes cdhotelSpin {
    to { transform: rotate(360deg); }
}

/* Recepcion: detalle de turno compacto */
.recepcion-caja-swal .recepcion-caja-summary {
    grid-template-columns: repeat(7, minmax(104px, 1fr));
    gap: 10px;
    margin: 4px 0 12px;
}

.recepcion-caja-swal .recepcion-caja-summary div {
    min-height: 66px;
    padding: 10px 8px;
    text-align: center;
}

.recepcion-caja-swal .recepcion-caja-summary span {
    font-size: 11px;
    line-height: 1.2;
}

.recepcion-caja-swal .recepcion-caja-summary strong {
    font-size: 15px;
    line-height: 1.2;
    margin-top: 6px;
}

.recepcion-caja-table .cash-move-badge {
    justify-content: center;
    min-width: 74px;
}

.cash-move-badge.is-charge {
    background: #eef6ff;
    color: #0057c8;
}

.cash-move-badge.is-in {
    background: #e8f8ef;
    color: #11844a;
}

.cash-move-badge.is-out {
    background: #fff0f0;
    color: #c12f2f;
}

@media (max-width: 1180px) {
    .recepcion-caja-swal .recepcion-caja-summary {
        grid-template-columns: repeat(4, minmax(112px, 1fr));
    }
}

@media (max-width: 720px) {
    .recepcion-caja-swal .recepcion-caja-summary {
        grid-template-columns: minmax(0, 1fr);
    }
}

/* Configuracion: ancho completo y terminal */
.config-pos-shell,
.config-pos-launcher {
    width: calc(100% - 80px);
    max-width: none;
    margin-left: 40px;
    margin-right: 40px;
}

.config-pos-launcher .config-nav-grid {
    grid-template-columns: repeat(auto-fit, minmax(210px, 225px));
    justify-content: start;
}

.terminal-config-grid {
    display: grid;
    gap: 14px;
}

.terminal-config-card {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 92px;
    padding: 16px;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-sm);
    background: var(--app-surface-soft);
}

.terminal-config-icon {
    display: inline-grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: var(--app-radius-sm);
    background: rgba(0, 87, 200, 0.1);
    color: var(--app-primary);
}

.terminal-config-card strong {
    display: block;
    color: var(--app-text);
    font-weight: 800;
}

.terminal-config-card p {
    margin: 4px 0 0;
    color: var(--app-muted);
    line-height: 1.4;
}

.terminal-config-card .btn {
    min-width: 160px;
    justify-content: center;
}

.terminal-config-card .btn.is-disabled {
    opacity: .65;
    cursor: not-allowed;
    pointer-events: auto;
}

@media (max-width: 900px) {
    .config-pos-shell,
    .config-pos-launcher {
        width: calc(100% - 48px);
        margin-left: 24px;
        margin-right: 24px;
    }

    .terminal-config-card {
        grid-template-columns: 42px minmax(0, 1fr);
    }

    .terminal-config-card .btn {
        grid-column: 1 / -1;
        width: 100%;
    }
}

@media (max-width: 560px) {
    .config-pos-shell,
    .config-pos-launcher {
        width: calc(100% - 24px);
        margin-left: 12px;
        margin-right: 12px;
    }

    .config-pos-launcher .config-nav-grid {
        grid-template-columns: 1fr;
    }
}

/* Configuracion: modal de terminales estilo punto de venta */
.config-terminals-panel {
    width: min(1120px, calc(100vw - 48px));
    max-width: min(1120px, calc(100vw - 48px));
}

.config-terminals-panel .app-modal-body {
    padding: 18px 20px 20px;
}

.terminal-modal-toolbar {
    gap: 10px;
    align-items: center;
}

.terminal-modal-toolbar .search-control {
    min-width: min(360px, 100%);
}

.terminal-actions {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    flex-wrap: nowrap;
}

.terminal-action-btn {
    width: 34px;
    height: 34px;
    min-width: 34px;
    padding: 0 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.terminal-config-table-wrap {
    max-height: min(54vh, 520px);
    overflow: auto;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius-sm);
}

.config-terminal-form-swal {
    border-radius: 10px !important;
}

.config-terminal-form-swal .swal2-html-container {
    max-height: calc(100vh - 220px);
    overflow-y: auto !important;
    overflow-x: hidden !important;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
}

@media (max-width: 720px) {
    .config-terminals-panel {
        width: calc(100vw - 24px);
        max-width: calc(100vw - 24px);
    }

    .terminal-modal-toolbar .btn,
    .terminal-modal-toolbar .search-control {
        width: 100%;
    }
}

/* Login hotel visual */
.hotel-login-shell {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(0, 1.12fr) minmax(420px, 0.88fr);
    background: #f7f9f7;
    padding-top: 72px;
}

.hotel-login-story {
    position: relative;
    min-height: calc(100vh - 72px);
    padding: clamp(42px, 7vw, 86px) clamp(38px, 7vw, 92px);
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    background: #0d3d2e;
    color: #ffffff;
}

.hotel-login-story::before,
.hotel-login-story::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.06);
    border-radius: 50%;
    pointer-events: none;
}

.hotel-login-story::before {
    width: 560px;
    height: 560px;
    right: -180px;
    bottom: -210px;
    box-shadow: 0 0 0 70px rgba(255, 255, 255, 0.03), 0 0 0 140px rgba(255, 255, 255, 0.025);
}

.hotel-login-story::after {
    width: 280px;
    height: 280px;
    left: -110px;
    top: 24%;
    border-color: rgba(255, 255, 255, 0.045);
}

.hotel-login-brand,
.hotel-login-copy,
.hotel-login-stats {
    position: relative;
    z-index: 1;
}

.hotel-login-brand {
    display: inline-flex;
    align-items: center;
    gap: 16px;
    color: rgba(255, 255, 255, 0.88);
}

.hotel-login-brand-icon,
.hotel-login-card-head > span {
    width: 42px;
    height: 42px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #167653;
    color: #ffffff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.16);
}

.hotel-login-brand strong,
.hotel-login-brand span {
    display: block;
}

.hotel-login-brand strong {
    font-weight: 800;
    line-height: 1.1;
}

.hotel-login-brand span {
    color: rgba(255, 255, 255, 0.65);
    font-size: 13px;
}

.hotel-login-pill {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.08);
    color: #f7d17b;
    font-weight: 800;
    margin-bottom: 28px;
}

.hotel-login-copy h1 {
    max-width: 760px;
    margin: 0;
    color: #ffffff;
    font-size: clamp(44px, 5.6vw, 78px);
    line-height: 0.98;
    letter-spacing: 0;
    font-weight: 900;
}

.hotel-login-copy mark {
    padding: 0;
    background: transparent;
    color: #f5c861;
}

.hotel-login-copy p {
    max-width: 650px;
    margin: 28px 0 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 19px;
    line-height: 1.55;
}

.hotel-login-stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 150px));
    gap: 34px;
}

.hotel-login-stats strong,
.hotel-login-stats span {
    display: block;
}

.hotel-login-stats strong {
    color: #ffffff;
    font-size: 28px;
    font-weight: 900;
}

.hotel-login-stats span {
    margin-top: 5px;
    color: rgba(255, 255, 255, 0.78);
    font-size: 13px;
}

.hotel-login-access {
    min-height: calc(100vh - 72px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(28px, 5vw, 64px);
}

.hotel-login-card {
    width: min(430px, 100%);
    padding: 38px;
    border: 1px solid var(--app-border);
    border-radius: 18px;
    background: var(--app-surface);
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.1);
}

.hotel-login-card-head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 28px;
}

.hotel-login-card-head h2 {
    margin: 0;
    color: var(--app-text);
    font-size: 29px;
    font-weight: 900;
    line-height: 1.1;
}

.hotel-login-card-head p {
    margin: 6px 0 0;
    color: var(--app-muted);
}

.hotel-login-alert {
    padding: 13px 14px;
    margin-bottom: 20px;
    border-radius: 8px;
    background: #fdecec;
    color: #c2413a;
    font-weight: 800;
}

.hotel-login-field {
    display: block;
    margin: 0 0 18px;
}

.hotel-login-field > span {
    display: block;
    margin-bottom: 8px;
    color: var(--app-text);
    font-weight: 800;
}

.hotel-login-field > div {
    position: relative;
    display: flex;
    align-items: center;
}

.hotel-login-field i {
    position: absolute;
    left: 15px;
    z-index: 1;
    color: #6b7c93;
}

.hotel-login-field .form-control {
    min-height: 48px;
    padding-left: 42px;
    padding-right: 44px;
    border-radius: 10px;
    background: var(--app-surface-2);
}

.hotel-login-eye {
    position: absolute;
    right: 8px;
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: #64748b;
    cursor: pointer;
}

.hotel-login-eye i {
    position: static;
}

.hotel-login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    color: var(--app-muted);
    font-size: 13px;
    margin: 2px 0 22px;
}

.hotel-login-options label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: var(--app-muted);
    font-weight: 700;
}

.hotel-login-submit {
    width: 100%;
    min-height: 48px;
    border-radius: 9px;
}

.hotel-login-card small {
    display: flex;
    justify-content: center;
    gap: 5px;
    margin-top: 18px;
    color: var(--app-muted);
    text-align: center;
}

@media (max-width: 1020px) {
    .hotel-login-shell {
        grid-template-columns: 1fr;
    }

    .hotel-login-story {
        min-height: auto;
        padding: 38px 28px;
    }

    .hotel-login-copy {
        margin: 64px 0;
    }

    .hotel-login-copy h1 {
        font-size: clamp(38px, 10vw, 58px);
    }

    .hotel-login-access {
        min-height: auto;
        padding: 32px 20px 84px;
    }
}

@media (max-width: 620px) {
    .hotel-login-story {
        padding: 28px 20px;
    }

    .hotel-login-stats {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .hotel-login-card {
        padding: 28px 22px;
        border-radius: 14px;
    }

    .hotel-login-options {
        align-items: flex-start;
        flex-direction: column;
    }
}

/* Login hotel POS polish */
.hotel-login-shell {
    grid-template-columns: minmax(0, 54%) minmax(430px, 46%);
    background: #f4f7fb;
}

.hotel-login-story {
    background: #0b4f86;
    padding: 28px clamp(48px, 6vw, 86px) 82px;
}

.hotel-login-brand {
    margin-top: 0;
}

.hotel-login-brand-icon,
.hotel-login-card-head > span {
    width: 42px;
    height: 42px;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
    box-shadow: none;
}

.hotel-login-card-head > span {
    background: var(--app-primary);
    box-shadow: 0 14px 26px rgba(0, 87, 200, 0.18);
}

.hotel-login-brand strong {
    font-size: 17px;
}

.hotel-login-brand span {
    color: #b8dcff;
    font-weight: 800;
}

.hotel-login-pill {
    border-color: rgba(255, 255, 255, 0.22);
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

.hotel-login-copy h1 {
    max-width: 780px;
    font-size: clamp(54px, 5.25vw, 82px);
    line-height: 1.02;
    text-wrap: balance;
}

.hotel-login-copy p {
    max-width: 760px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 18px;
}

.hotel-login-story::before {
    width: 440px;
    height: 440px;
    right: -110px;
    bottom: -170px;
    border-color: rgba(255, 255, 255, 0.12);
    box-shadow: 0 0 0 96px rgba(255, 255, 255, 0.055);
}

.hotel-login-story::after {
    width: 330px;
    height: 330px;
    left: auto;
    right: 7%;
    top: 46%;
    border-color: rgba(255, 255, 255, 0.13);
}

.hotel-login-stats {
    grid-template-columns: repeat(3, minmax(0, 150px));
    gap: clamp(34px, 7vw, 74px);
}

.hotel-login-stats strong {
    font-size: 27px;
}

.hotel-login-stats span {
    color: #c9e4ff;
    font-weight: 800;
}

.hotel-login-access {
    background: var(--app-bg);
}

.hotel-login-card {
    width: min(430px, calc(100% - 28px));
    padding: 38px;
    border-radius: 7px;
    box-shadow: 0 28px 70px rgba(15, 23, 42, 0.08);
}

.hotel-login-card-head h2 {
    font-size: 28px;
}

.hotel-login-card-head p {
    font-size: 13px;
    font-weight: 700;
}

.hotel-login-alert {
    border-radius: 7px;
}

.hotel-login-field {
    margin-bottom: 20px;
}

.hotel-login-field > span {
    font-size: 15px;
}

.hotel-login-field .form-control {
    min-height: 48px;
    border-radius: 7px;
    background: #ffffff;
}

.hotel-login-options {
    margin-top: 0;
    font-weight: 800;
}

.hotel-login-options span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.hotel-login-submit {
    border-radius: 7px;
}

.hotel-login-card small {
    max-width: 310px;
    margin-left: auto;
    margin-right: auto;
    font-weight: 800;
    line-height: 1.35;
}

.hotel-login-footer {
    left: 16px;
    bottom: 16px;
    z-index: 4;
    padding: 9px 12px;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.88);
    color: #64748b;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

@media (max-width: 1020px) {
    .hotel-login-shell {
        grid-template-columns: 1fr;
    }

    .hotel-login-story {
        padding-bottom: 44px;
    }

    .hotel-login-copy h1 {
        font-size: clamp(42px, 9vw, 64px);
    }

    .hotel-login-footer {
        position: static;
        display: inline-flex;
        margin: 0 0 18px 20px;
    }
}

@media (max-width: 620px) {
    .hotel-login-shell {
        padding-top: 72px;
    }

    .hotel-login-copy {
        margin: 52px 0;
    }

    .hotel-login-copy h1 {
        font-size: 40px;
    }

    .hotel-login-card {
        width: 100%;
        padding: 28px 22px;
    }
}

/* Login hotel final type rhythm */
.hotel-login-card {
    font-size: 14px;
}

.hotel-login-card-head {
    margin-bottom: 30px;
}

.hotel-login-card-head h2 {
    font-size: 27px;
    line-height: 1.12;
}

.hotel-login-card-head p,
.hotel-login-options,
.hotel-login-card small {
    font-size: 13px;
}

.hotel-login-field > span {
    font-size: 14px;
    line-height: 1.25;
}

.hotel-login-field .form-control {
    min-height: 48px;
    font-size: 14px;
    font-weight: 700;
}

.hotel-login-submit {
    min-height: 48px;
    font-size: 15px;
    font-weight: 800;
}

.hotel-login-options {
    margin: 0 0 22px;
}

/* Login hotel aligned with POS exact scale */
.hotel-login-shell {
    grid-template-columns: minmax(0, 54%) minmax(430px, 46%);
    padding-top: 72px;
    background: var(--app-surface-2);
}

.hotel-login-story {
    min-height: calc(100vh - 72px);
    padding: 44px clamp(28px, 6vw, 88px);
    justify-content: center;
    background: linear-gradient(150deg, #052a54 0%, #064887 48%, #0a6cc8 100%);
}

.hotel-login-brand {
    position: absolute;
    top: 96px;
    left: clamp(28px, 6vw, 88px);
    gap: 12px;
}

.hotel-login-brand-icon,
.hotel-login-card-head > span {
    width: 42px;
    height: 42px;
    border-radius: 8px;
}

.hotel-login-brand-icon {
    background: rgba(255, 255, 255, 0.14);
}

.hotel-login-brand strong {
    font-size: 1rem;
    line-height: 1.1;
    font-weight: 800;
}

.hotel-login-brand span {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.83rem;
    font-weight: 700;
}

.hotel-login-copy {
    max-width: 760px;
}

.hotel-login-pill {
    margin-bottom: 0;
    padding: 8px 14px;
    border-radius: 999px;
    font-size: 0.95rem;
    font-weight: 800;
}

.hotel-login-copy h1 {
    max-width: 720px;
    margin: 28px 0 18px;
    font-size: clamp(2.65rem, 5vw, 4.9rem);
    line-height: 1.02;
    font-weight: 900;
}

.hotel-login-copy p {
    max-width: 660px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.12rem;
    line-height: 1.65;
}

.hotel-login-stats {
    display: flex;
    flex-wrap: wrap;
    grid-template-columns: none;
    gap: 28px 52px;
    margin-top: 58px;
}

.hotel-login-stats div {
    min-width: 120px;
}

.hotel-login-stats strong {
    font-size: 1.55rem;
    line-height: 1.1;
}

.hotel-login-stats span {
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.86rem;
    font-weight: 700;
}

.hotel-login-access {
    min-height: calc(100vh - 72px);
    padding: 104px 28px 76px;
    background: var(--app-surface-2);
}

.hotel-login-card {
    width: min(430px, 100%);
    padding: 34px 38px 32px;
    border-radius: 8px;
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
    font-size: 1rem;
}

.hotel-login-card-head {
    gap: 14px;
    margin-bottom: 28px;
}

.hotel-login-card-head > span {
    flex: 0 0 auto;
    background: var(--app-primary);
    box-shadow: 0 12px 22px rgba(0, 87, 200, 0.24);
}

.hotel-login-card-head h2 {
    margin: 0;
    font-size: 1.6rem;
    line-height: 1.1;
    font-weight: 900;
}

.hotel-login-card-head p {
    margin-top: 6px;
    font-size: 0.86rem;
    font-weight: 700;
}

.hotel-login-field {
    margin-bottom: 18px;
}

.hotel-login-field > span {
    margin-bottom: 8px;
    font-size: 0.93rem;
    line-height: 1.2;
    font-weight: 800;
}

.hotel-login-field .form-control {
    min-height: 48px;
    padding-left: 42px;
    padding-right: 42px;
    border-radius: 7px;
    font-size: 0.96rem;
    font-weight: 600;
}

.hotel-login-field i {
    left: 15px;
    color: var(--app-muted);
}

.hotel-login-options {
    margin: 3px 0 22px;
    font-size: 0.86rem;
    font-weight: 800;
}

.hotel-login-submit {
    min-height: 48px;
    border-radius: 7px;
    font-size: 1rem;
    font-weight: 800;
}

@media (max-width: 1020px) {
    .hotel-login-shell {
        grid-template-columns: 1fr;
    }

    .hotel-login-story {
        min-height: auto;
        padding: 118px 24px 42px;
    }

    .hotel-login-brand {
        top: 96px;
        left: 24px;
    }

    .hotel-login-copy h1 {
        font-size: clamp(2.15rem, 10vw, 3.4rem);
    }

    .hotel-login-stats {
        margin-top: 32px;
        gap: 18px 26px;
    }

    .hotel-login-access {
        min-height: auto;
        padding: 34px 18px 82px;
    }
}

@media (max-width: 560px) {
    .hotel-login-story {
        padding-left: 18px;
        padding-right: 18px;
    }

    .hotel-login-copy p {
        font-size: 1rem;
    }

    .hotel-login-stats div {
        min-width: 96px;
    }

    .hotel-login-card {
        padding: 26px 22px 24px;
    }

    .hotel-login-card-head h2 {
        font-size: 1.35rem;
    }
}

/* Login hotel final parity with sibling systems */
.hotel-login-shell {
    grid-template-columns: minmax(0, 54.2%) minmax(430px, 45.8%);
    min-height: 100vh;
    padding-top: 72px;
    border-top: 0;
    background: var(--app-surface-2);
}

.hotel-login-story {
    position: relative;
    min-height: calc(100vh - 72px);
    padding: 44px clamp(28px, 6vw, 88px);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    background: linear-gradient(150deg, #052a54 0%, #064887 48%, #0a6cc8 100%);
}

.hotel-login-story::before,
.hotel-login-story::after {
    content: "";
    position: absolute;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 50%;
    pointer-events: none;
}

.hotel-login-story::before {
    width: 520px;
    height: 520px;
    right: -170px;
    bottom: -220px;
    background: rgba(255, 255, 255, 0.04);
    box-shadow: none;
}

.hotel-login-story::after {
    width: 330px;
    height: 330px;
    right: 70px;
    bottom: 110px;
    left: auto;
    top: auto;
    border-color: rgba(255, 255, 255, 0.12);
}

.hotel-login-brand {
    position: absolute;
    z-index: 1;
    top: 96px;
    left: clamp(28px, 6vw, 88px);
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    color: rgba(255, 255, 255, 0.86);
}

.hotel-login-brand-icon,
.hotel-login-card-head > span {
    width: 42px;
    height: 42px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.hotel-login-brand-icon {
    background: rgba(255, 255, 255, 0.14);
    color: #ffffff;
}

.hotel-login-brand strong,
.hotel-login-brand span,
.hotel-login-card-head h2,
.hotel-login-card-head p {
    display: block;
}

.hotel-login-brand strong {
    color: #ffffff;
    font-size: 1rem;
    line-height: 1.1;
    font-weight: 800;
}

.hotel-login-brand span {
    margin-top: 3px;
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.83rem;
    font-weight: 700;
}

.hotel-login-copy {
    position: relative;
    z-index: 1;
    max-width: 760px;
    margin: 0;
}

.hotel-login-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 8px 14px;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.12);
    color: #ffffff;
    font-size: 0.95rem;
    font-weight: 800;
}

.hotel-login-copy h1 {
    max-width: 720px;
    margin: 28px 0 18px;
    color: #ffffff;
    font-size: clamp(2.65rem, 5vw, 4.9rem);
    line-height: 1.02;
    letter-spacing: 0;
    font-weight: 900;
}

.hotel-login-copy p {
    max-width: 660px;
    margin: 0;
    color: rgba(255, 255, 255, 0.82);
    font-size: 1.12rem;
    line-height: 1.65;
}

.hotel-login-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 28px 52px;
    margin-top: 58px;
}

.hotel-login-stats div {
    min-width: 120px;
}

.hotel-login-stats strong {
    display: block;
    color: #ffffff;
    font-size: 1.55rem;
    line-height: 1.1;
    font-weight: 900;
}

.hotel-login-stats span {
    display: block;
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 0.86rem;
    font-weight: 700;
}

.hotel-login-access {
    min-height: calc(100vh - 72px);
    padding: 104px 28px 76px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--app-surface-2);
}

.hotel-login-card {
    width: min(430px, 100%);
    padding: 34px 38px 32px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    box-shadow: 0 24px 60px rgba(15, 23, 42, 0.12);
    font-size: 1rem;
}

.hotel-login-card-head {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 28px;
}

.hotel-login-card-head > span {
    flex: 0 0 auto;
    background: var(--app-primary);
    color: #ffffff;
    box-shadow: 0 12px 22px rgba(0, 87, 200, 0.24);
}

.hotel-login-card-head h2 {
    margin: 0;
    color: var(--app-text);
    font-size: 1.6rem;
    line-height: 1.1;
    font-weight: 900;
}

.hotel-login-card-head p {
    margin: 6px 0 0;
    color: var(--app-muted);
    font-size: 0.86rem;
    line-height: 1.35;
    font-weight: 700;
}

.hotel-login-field {
    display: block;
    margin: 0 0 18px;
}

.hotel-login-field > span {
    display: block;
    margin: 0 0 8px;
    color: var(--app-text);
    font-size: 0.93rem;
    line-height: 1.2;
    font-weight: 800;
}

.hotel-login-field > div {
    position: relative;
}

.hotel-login-field i {
    position: absolute;
    left: 15px;
    top: 50%;
    z-index: 2;
    color: var(--app-muted);
    transform: translateY(-50%);
}

.hotel-login-field .form-control {
    width: 100%;
    min-height: 48px;
    padding: 0 42px;
    border-radius: 7px;
    background: #ffffff;
    font-size: 0.96rem;
    font-weight: 600;
}

.hotel-login-eye {
    position: absolute;
    right: 8px;
    top: 50%;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    color: var(--app-muted);
    transform: translateY(-50%);
}

.hotel-login-eye i {
    position: static;
    transform: none;
}

.hotel-login-options {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 3px 0 22px;
    color: var(--app-muted);
    font-size: 0.86rem;
    font-weight: 800;
}

.hotel-login-options span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.hotel-login-submit {
    width: 100%;
    min-height: 48px;
    border-radius: 7px;
    font-size: 1rem;
    font-weight: 800;
}

.hotel-login-footer {
    left: 28px;
    bottom: 16px;
    z-index: 4;
    padding: 9px 12px;
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.88);
    color: #64748b;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(15, 23, 42, 0.08);
}

@media (max-width: 1020px) {
    .hotel-login-shell {
        grid-template-columns: 1fr;
    }

    .hotel-login-story {
        min-height: auto;
        padding: 118px 24px 42px;
    }

    .hotel-login-brand {
        top: 96px;
        left: 24px;
    }

    .hotel-login-copy h1 {
        font-size: clamp(2.15rem, 10vw, 3.4rem);
    }

    .hotel-login-stats {
        margin-top: 32px;
        gap: 18px 26px;
    }

    .hotel-login-access {
        min-height: auto;
        padding: 34px 18px 82px;
    }

    .hotel-login-footer {
        position: static;
        display: inline-flex;
        margin: 0 0 18px 20px;
    }
}

@media (max-width: 560px) {
    .hotel-login-story {
        padding-left: 18px;
        padding-right: 18px;
    }

    .hotel-login-copy p {
        font-size: 1rem;
    }

    .hotel-login-stats div {
        min-width: 96px;
    }

    .hotel-login-card {
        padding: 26px 22px 24px;
    }

    .hotel-login-card-head h2 {
        font-size: 1.35rem;
    }
}

/* Login hotel compact parity with Gestor de Ingresos */
.hotel-login-shell {
    grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);
    padding-top: 72px;
}

.hotel-login-story,
.hotel-login-access {
    min-height: calc(100vh - 72px);
}

.hotel-login-story {
    padding-left: clamp(52px, 5.4vw, 88px);
    padding-right: clamp(52px, 5.4vw, 88px);
}

.hotel-login-brand {
    left: clamp(52px, 5.4vw, 88px);
}

.hotel-login-brand-icon {
    font-size: 16px;
}

.hotel-login-brand strong {
    font-size: 1.08rem;
}

.hotel-login-brand span {
    font-size: .82rem;
    margin-top: 2px;
}

.hotel-login-copy {
    max-width: 680px;
}

.hotel-login-pill {
    font-size: 1rem;
}

.hotel-login-copy h1 {
    max-width: 650px;
    margin: 28px 0 18px;
    font-size: clamp(2.65rem, 5vw, 4.9rem);
    line-height: 1.02;
    font-weight: 900;
    letter-spacing: 0;
}

.hotel-login-copy p {
    max-width: 660px;
    font-size: 1.18rem;
    line-height: 1.65;
}

.hotel-login-stats strong {
    font-size: 1.65rem;
}

.hotel-login-stats span {
    font-size: .93rem;
}

.hotel-login-access {
    padding: 40px;
}

.hotel-login-card {
    width: min(430px, 100%);
    padding: 30px 32px;
    border-radius: 8px;
    box-shadow: 0 22px 55px rgba(16, 42, 67, .12);
}

.hotel-login-card-head {
    gap: 13px;
    margin-bottom: 27px;
}

.hotel-login-card-head h2 {
    font-size: 22px;
    letter-spacing: -.5px;
    font-weight: 900;
}

.hotel-login-card-head p {
    margin-top: 3px;
    font-size: 9px;
    line-height: 1.35;
    font-weight: 700;
}

.hotel-login-field {
    margin: 17px 0 0;
}

.hotel-login-field > span {
    margin: 0 0 7px;
    font-size: 11px;
    font-weight: 800;
}

.hotel-login-field > div {
    height: 48px;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 13px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: var(--app-surface);
    transition: .2s;
}

.hotel-login-field > div:focus-within {
    border-color: var(--app-primary);
    box-shadow: 0 0 0 3px rgba(31, 122, 224, .11);
}

.hotel-login-field i {
    position: static;
    width: 17px;
    color: #6d8294;
    text-align: center;
    transform: none;
}

.hotel-login-field .form-control {
    height: 100%;
    min-height: 0;
    width: 100%;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-size: inherit;
    font-weight: 600;
}

.hotel-login-field .form-control:focus {
    border: 0;
    box-shadow: none;
}

.hotel-login-eye {
    position: static;
    width: auto;
    height: auto;
    padding: 5px;
    border: 0;
    background: transparent;
    transform: none;
}

.hotel-login-eye i {
    width: auto;
}

.hotel-login-options {
    margin: 15px 0;
    font-size: 10px;
    font-weight: 700;
}

.hotel-login-options i {
    color: var(--app-primary);
}

.hotel-login-submit {
    min-height: 48px;
    border-radius: 8px;
    font-weight: 900;
}

.hotel-login-footer {
    position: fixed !important;
    left: 18px !important;
    right: auto !important;
    bottom: 0 !important;
    z-index: 35;
    width: auto !important;
    min-height: 48px;
    padding: 10px 0 14px;
    display: flex;
    align-items: center;
    color: #687b8c;
    font-size: 15px;
    font-weight: 800;
    pointer-events: none;
    background: transparent !important;
    box-shadow: none !important;
}

.hotel-login-footer p {
    display: inline-flex;
    width: auto;
    margin: 0;
    padding: 6px 10px;
    border-radius: 8px;
    line-height: 1.2;
    background: rgba(255, 255, 255, .86);
    border: 1px solid rgba(219, 230, 239, .8);
    box-shadow: 0 7px 18px rgba(16, 42, 67, .08);
}

@media (max-width: 900px) {
    .hotel-login-shell {
        grid-template-columns: 1fr;
        padding-top: 72px;
    }

    .hotel-login-story {
        min-height: auto;
        padding: 35px 28px 40px;
        justify-content: flex-start;
    }

    .hotel-login-brand {
        position: relative;
        top: auto;
        left: auto;
    }

    .hotel-login-copy {
        padding: 42px 0 20px;
    }

    .hotel-login-copy h1 {
        font-size: 42px;
        max-width: 600px;
    }

    .hotel-login-access {
        min-height: auto;
        padding: 45px 22px 80px;
    }

    .hotel-login-footer {
        position: absolute !important;
        left: 14px !important;
        right: auto !important;
        bottom: auto !important;
        top: calc(100% - 48px);
    }
}

@media (max-width: 560px) {
    .hotel-login-story {
        padding: 25px 21px 34px;
    }

    .hotel-login-copy h1 {
        font-size: 34px;
        letter-spacing: -1.3px;
    }

    .hotel-login-pill {
        font-size: .9rem;
    }

    .hotel-login-copy p {
        font-size: 1.05rem;
    }

    .hotel-login-stats {
        gap: 13px;
    }

    .hotel-login-stats strong {
        font-size: 1.4rem;
    }

    .hotel-login-stats span {
        font-size: .82rem;
    }

    .hotel-login-access {
        padding: 34px 16px 72px;
    }

    .hotel-login-card {
        padding: 25px 21px;
    }

    .hotel-login-footer {
        left: 14px !important;
        font-size: 14px;
    }
}

/* Login hotel cleanup: compact card and no stacked artifacts */
.hotel-login-copy {
    max-width: 760px !important;
}

.hotel-login-copy h1 {
    max-width: 720px !important;
}

.hotel-login-access .hotel-login-card {
    width: min(392px, 100%) !important;
    padding: 30px 32px !important;
    border-radius: 8px !important;
}

.hotel-login-card-head {
    display: grid !important;
    grid-template-columns: 42px 1fr !important;
    align-items: center !important;
    gap: 13px !important;
    margin-bottom: 27px !important;
}

.hotel-login-card-head > span {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    border-radius: 8px !important;
    display: grid !important;
    place-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
}

.hotel-login-card-head > div {
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.hotel-login-card-head h2 {
    margin: 0 !important;
    font-size: 22px !important;
    line-height: 1.1 !important;
}

.hotel-login-card-head p {
    margin: 3px 0 0 !important;
    font-size: 9px !important;
    line-height: 1.35 !important;
}

.hotel-login-field > div {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 17px 1fr auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    height: 48px !important;
    padding: 0 13px !important;
    overflow: hidden !important;
}

.hotel-login-field i,
.hotel-login-eye i {
    position: static !important;
    inset: auto !important;
    width: 17px !important;
    transform: none !important;
    text-align: center !important;
}

.hotel-login-field .form-control {
    min-width: 0 !important;
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.hotel-login-eye {
    position: static !important;
    width: 28px !important;
    height: 28px !important;
    padding: 0 !important;
    display: grid !important;
    place-items: center !important;
    transform: none !important;
}

.hotel-login-submit {
    width: 100% !important;
}

@media (max-width: 560px) {
    .hotel-login-access .hotel-login-card {
        width: 100% !important;
        padding: 25px 21px !important;
    }
}

/* Login hotel order fix: brand, pill, title without overlap */
.hotel-login-story {
    display: block !important;
    padding-top: 28px !important;
}

.hotel-login-brand {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    z-index: 3 !important;
    margin: 0 0 72px !important;
}

.hotel-login-copy {
    position: relative !important;
    z-index: 2 !important;
    margin: 0 !important;
    padding: 0 0 54px !important;
    max-width: 760px !important;
}

.hotel-login-pill {
    position: relative !important;
    z-index: 2 !important;
    margin: 0 0 0 !important;
}

.hotel-login-copy h1 {
    position: relative !important;
    z-index: 1 !important;
    margin-top: 28px !important;
}

.hotel-login-stats {
    margin-top: 40px !important;
}

@media (max-width: 900px) {
    .hotel-login-brand {
        margin-bottom: 42px !important;
    }

    .hotel-login-copy {
        padding-bottom: 20px !important;
    }
}

/* Login hotel: match POS form typography and brand icon */
.hotel-login-brand-icon {
    display: grid !important;
    place-items: center !important;
    width: 42px !important;
    height: 42px !important;
    min-width: 42px !important;
    padding: 0 !important;
}

.hotel-login-brand-icon i {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    height: auto !important;
    font-size: 17px !important;
    line-height: 1 !important;
    transform: none !important;
    color: #ffffff !important;
}

.hotel-login-card-head h2 {
    font-size: 1.6rem !important;
    line-height: 1.1 !important;
}

.hotel-login-card-head p {
    font-size: .86rem !important;
    line-height: 1.35 !important;
}

.hotel-login-field > span {
    font-size: .93rem !important;
    line-height: 1.2 !important;
}

.hotel-login-field .form-control {
    font-size: .96rem !important;
}

.hotel-login-options {
    font-size: .86rem !important;
}

.hotel-login-submit {
    font-size: 1rem !important;
}

/* Navbar user identity aligned with Punto de Venta */
.user-dropdown {
    display: flex;
    align-items: center;
}

.user-dropdown .profile-button {
    width: auto;
    height: auto;
    min-height: 46px;
    border: 0;
    border-radius: 8px;
    background: transparent;
    padding: 4px 0;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--app-text);
    cursor: pointer;
}

.user-dropdown .profile-button:hover,
.user-dropdown .profile-button:focus {
    color: var(--app-primary);
    outline: none;
}

.profile-meta {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    min-width: 0;
    max-width: 220px;
    line-height: 1.15;
}

.profile-meta strong {
    max-width: 220px;
    color: var(--app-text);
    font-size: 0.88rem;
    font-weight: 900;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-meta small {
    max-width: 220px;
    margin-top: 3px;
    color: var(--app-muted);
    font-size: 0.76rem;
    font-weight: 800;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.profile-avatar-box {
    width: 42px;
    height: 42px;
    border: 1px solid rgba(0, 87, 200, 0.12);
    border-radius: 8px;
    background: rgba(0, 87, 200, 0.08);
    color: var(--app-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex: 0 0 auto;
}

.profile-avatar-box img,
.profile-avatar-box .perfil-avatar-iniciales {
    width: 100%;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
}

.profile-avatar-box img {
    object-fit: cover;
}

.profile-avatar-box .perfil-avatar-iniciales {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(0, 87, 200, 0.09);
    color: var(--app-primary);
    font-size: 0.86rem;
    font-weight: 900;
}

.profile-chevron {
    color: var(--app-muted);
    font-size: 0.72rem;
    transition: transform 0.16s ease, color 0.16s ease;
}

.user-dropdown .profile-button[aria-expanded="true"] .profile-chevron {
    transform: rotate(180deg);
    color: var(--app-primary);
}

.user-dropdown .profile-button::after {
    display: none;
}

@media (max-width: 720px) {
    .profile-meta {
        display: none;
    }
}

/* Login: colchón superior compacto para no invadir la barra. */
.hotel-login-shell {
    padding-top: 48px !important;
}

/* Login: compactar alto para evitar scroll vertical en escritorio. */
@media (min-width: 901px) {
    body:has(.hotel-login-shell) {
        overflow-y: hidden;
    }

    .hotel-login-shell {
        height: calc(100vh - 48px);
        min-height: calc(100vh - 48px);
        padding-top: 48px !important;
        box-sizing: border-box;
        overflow: hidden;
    }

    .hotel-login-story {
        min-height: 0;
        padding-top: clamp(20px, 3vh, 40px) !important;
        padding-bottom: 76px !important;
    }

    .hotel-login-copy h1 {
        font-size: clamp(3.2rem, min(6.1vw, 7.5vh), 5.9rem);
    }

    .hotel-login-copy p {
        margin-top: clamp(14px, 2vh, 24px) !important;
    }

    .hotel-login-stats {
        margin-top: clamp(22px, 3.4vh, 38px) !important;
    }

    .hotel-login-access .hotel-login-card,
    .hotel-login-card {
        padding-top: clamp(28px, 3.4vh, 38px);
        padding-bottom: clamp(28px, 3.4vh, 38px);
    }

    .hotel-login-footer {
        bottom: 14px !important;
    }
}

@media (max-width: 900px) {
    body:has(.hotel-login-shell) {
        overflow-y: auto;
    }
}

/* Login: extender paneles hasta el borde inferior visible. */
@media (min-width: 901px) {
    .hotel-login-shell {
        height: calc(100vh - 18px) !important;
        min-height: calc(100vh - 18px) !important;
    }
}

/* Login: compactar metricas en pantallas bajas para evitar choque con footer. */
@media (min-width: 901px) and (max-height: 820px) {
    .hotel-login-stats {
        margin-top: 18px !important;
        gap: 36px !important;
    }

    .hotel-login-stats strong {
        font-size: 1.5rem !important;
        line-height: 1.05 !important;
    }

    .hotel-login-stats span {
        font-size: .8rem !important;
        line-height: 1.2 !important;
    }

    .hotel-login-copy p {
        margin-top: 12px !important;
        line-height: 1.42 !important;
    }
}

@media (min-width: 901px) and (max-height: 720px) {
    .hotel-login-stats {
        margin-top: 10px !important;
        gap: 28px !important;
    }

    .hotel-login-footer {
        bottom: 10px !important;
    }
}

/* Configuracion: portada unificada segun Punto de Venta */
.config-pos-shell {
    width: calc(100% - 80px);
    max-width: 1480px;
    margin: 0 40px;
}
.config-pos-shell .module-header {
    min-height: auto;
    margin-bottom: 20px;
    padding: 0 0 18px;
    border-bottom: 1px solid var(--app-border);
}
.config-pos-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}
.config-pos-grid .config-nav-card {
    width: auto;
    min-height: 150px;
    padding: 18px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 8px;
    text-align: left;
    cursor: pointer;
    border: 1px solid var(--app-border);
    border-radius: var(--app-radius);
    background: var(--app-surface);
    color: var(--app-text);
    box-shadow: 0 6px 16px rgba(15, 23, 42, 0.05);
}
.config-pos-grid .config-nav-card:hover,
.config-pos-grid .config-nav-card:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(0, 87, 200, 0.35);
    box-shadow: 0 12px 26px rgba(0, 87, 200, 0.1);
    outline: none;
}
.config-pos-grid .config-nav-card i {
    width: 46px;
    height: 46px;
    margin: 0;
    border-radius: 8px;
    background: rgba(0, 87, 200, 0.1);
    color: var(--app-primary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
}
.config-pos-grid .config-nav-card strong {
    min-height: 0;
    margin: 0;
    font-size: 1.05rem;
    font-weight: 800;
}
.config-pos-grid .config-nav-card span {
    max-width: none;
    color: var(--app-muted);
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.35;
}
.config-pos-grid .config-nav-card.is-active {
    background: var(--app-surface);
    border-color: var(--app-primary);
    box-shadow: 0 0 0 3px rgba(0, 87, 200, 0.1);
}
@media (max-width: 900px) {
    .config-pos-shell { width: calc(100% - 48px); margin: 0 24px; }
}
@media (max-width: 560px) {
    .config-pos-shell { width: calc(100% - 24px); margin: 0 12px; }
    .config-pos-grid { grid-template-columns: 1fr; }
    .config-pos-grid .config-nav-card { min-height: 118px; }
}

/* Configuracion: acciones de catalogo */
.config-catalog-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}
.config-catalog-actions .segmented-control {
    margin-right: 4px;
}
.config-section-content .module-panel {
    border-radius: 0;
}
.config-section-content .module-toolbar {
    align-items: center;
}
@media (max-width: 760px) {
    .config-catalog-actions {
        width: 100%;
        justify-content: flex-start;
    }
    .config-catalog-actions .segmented-control {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .config-catalog-actions .segmented-control button {
        justify-content: center;
    }
    .config-catalog-actions > .btn {
        flex: 1 1 140px;
        justify-content: center;
    }
}

/* Check-in: busqueda e historial del huesped */
.guest-checkin-flow .guest-search-row{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(220px,1.4fr) auto;gap:12px;align-items:end;margin-top:14px}
.guest-search-button{min-height:42px}.guest-search-result{margin:12px 0;padding:12px 14px;border:1px solid #d7e3f0;border-radius:10px;background:#f7faff;color:#52637a}
.guest-found-card,.guest-new-card{display:flex;gap:12px;align-items:center}.guest-found-card>i,.guest-new-card>i{display:grid;place-items:center;width:38px;height:38px;border-radius:10px;background:#e6f6ed;color:#15803d}.guest-new-card>i{background:#eaf2ff;color:#075bc7}
.guest-found-card strong,.guest-new-card strong,.guest-found-card span,.guest-new-card span{display:block}.guest-found-card span,.guest-new-card span{margin-top:3px;font-size:12px;color:#62748b}
.guest-alert-card{margin-top:12px;padding:12px;border:1px solid #f2c66d;border-radius:9px;background:#fff8e8;color:#744b00}.guest-alert-card.is-danger{border-color:#ef9a9a;background:#fff0f0;color:#9f1d1d}.guest-alert-card p{margin:7px 0;font-size:13px}.guest-alert-card label{display:flex;gap:8px;align-items:center;margin-top:10px;font-weight:700}
@media(max-width:760px){.guest-checkin-flow .guest-search-row{grid-template-columns:1fr}.guest-search-button{width:100%}}
/* Estadisticas operativas: tarjetas y tendencia del modelo de reservaciones por habitacion */
.stats-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.stats-card {
    --stats-accent: var(--app-primary);
    position: relative;
    align-content: start;
    min-height: 148px;
    padding: 18px;
    overflow: hidden;
    border-radius: 14px;
    border-top: 4px solid var(--stats-accent);
    box-shadow: 0 8px 24px rgba(15, 35, 60, .06);
}

.stats-card::after {
    content: "";
    position: absolute;
    top: -34px;
    right: -30px;
    width: 100px;
    height: 100px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--stats-accent) 10%, transparent);
}

.stats-card.is-success { --stats-accent: #14966f; }
.stats-card.is-warning { --stats-accent: #d88714; }
.stats-card.is-info { --stats-accent: #3578c8; }
.stats-card.is-neutral { --stats-accent: #6b7b90; }

.stats-card-head {
    display: flex;
    align-items: center;
    gap: 9px;
}

.stats-card-head i {
    display: grid;
    place-items: center;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    color: var(--stats-accent);
    background: color-mix(in srgb, var(--stats-accent) 12%, white);
}

.stats-card strong {
    position: relative;
    z-index: 1;
    color: var(--app-text);
    font-size: 28px;
}

.stats-card small {
    line-height: 1.4;
}

.stats-trend-row {
    grid-template-columns: 112px repeat(5, minmax(90px, 1fr));
    padding: 13px 14px;
    border-radius: 10px;
}

.stats-panels .module-panel {
    border-radius: 14px;
    box-shadow: 0 8px 24px rgba(15, 35, 60, .05);
}

@media (max-width: 1180px) {
    .stats-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 700px) {
    .stats-grid { grid-template-columns: 1fr; }
    .stats-card { min-height: 126px; }
}
/* Estadisticas: carga limpia y paneles inferiores compactos */
body.estadisticas-is-loading {
    overflow: hidden;
}

.stats-status {
    display: inline-flex;
    width: auto;
    min-height: 0;
    margin-top: 10px;
    padding: 7px 11px;
    border: 1px solid #cfe0f4;
    border-radius: 999px;
    background: #edf5ff;
    color: #285780;
    font-size: 12px;
    font-weight: 800;
}

.stats-trend-panel {
    overflow: hidden;
    border-radius: 14px;
}

.stats-trend-panel .module-panel-header,
.stats-panels .module-panel-header {
    align-items: flex-start;
    min-height: auto;
    padding: 18px 20px 14px;
    border-bottom: 1px solid var(--app-border);
    background: var(--app-surface);
}

.stats-trend-panel .module-panel-header h2,
.stats-panels .module-panel-header h2 {
    margin: 0 0 5px;
    color: var(--app-text);
    font-size: 19px !important;
    font-weight: 900;
    line-height: 1.2;
}

.stats-trend-panel .module-subtitle,
.stats-panels .module-subtitle {
    margin: 0;
    color: var(--app-muted);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.4;
}

.stats-trend-list {
    gap: 9px;
    padding: 14px;
}

.stats-trend-list .stats-empty {
    display: grid;
    min-height: 110px;
    place-items: center;
    text-align: center;
}

.stats-panels {
    align-items: stretch;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.stats-panels > .module-panel {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    margin: 0;
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--app-border);
    background: var(--app-surface);
}

.stats-panels .stats-list {
    flex: 1;
    align-content: start;
    gap: 9px;
    padding: 14px;
}

.stats-panels .stats-row {
    min-height: 62px;
    padding: 12px;
    border-radius: 9px;
    background: #f8fbff;
}

.stats-panels .stats-row strong {
    color: var(--app-text);
    font-size: 14px;
}

.stats-panels .stats-row b {
    font-size: 15px;
}

.stats-panels .stats-empty {
    display: grid;
    min-height: 120px;
    place-items: center;
    padding: 20px;
    text-align: center;
}

@media (max-width: 900px) {
    .stats-trend-row {
        grid-template-columns: 1fr 1fr;
    }
}

/* Estadisticas: columnas inferiores responsivas */
@media (max-width: 1180px) {
    .stats-panels { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 700px) {
    .stats-panels { grid-template-columns: 1fr; }
    .stats-panels > .module-panel { height: auto; }
}


/* Configuracion: evitar encabezado duplicado dentro de los modales */
.config-section-content [data-config-section] > .module-toolbar:first-child > div:first-child:not(.module-toolbar-actions) {
    display: none;
}

.config-section-content [data-config-section] > .module-toolbar:first-child {
    justify-content: flex-end;
}


/* Configuracion: buscador y paginacion de usuarios */
.config-users-searchbar {
    display: flex;
    padding: 0 0 12px !important;
}

.config-users-searchbar .search-control {
    width: min(520px, 100%);
}

.config-users-pager {
    justify-content: flex-end;
    margin: 0;
    padding: 12px 0 0;
    border-top: 1px solid var(--app-border);
}

.config-users-pager[hidden] {
    display: none !important;
}

/* Configuracion: usuarios alineados al punto de venta */
.config-users-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 420px) auto auto;
    align-items: center;
    gap: 18px;
    padding: 4px 0 14px !important;
    border-bottom: 1px solid var(--app-border);
}

.config-users-toolbar .search-control { width: 100%; }
.config-users-toolbar > .btn { justify-self: end; }
.config-users-pager { justify-content: center; }
.config-users-table th:last-child,
.config-users-table td:last-child { width: 150px; white-space: nowrap; }
.config-users-table .actions-cell { justify-content: flex-start; }
.status-badge { display: inline-flex; align-items: center; padding: 5px 9px; border-radius: 999px; font-size: 12px; font-weight: 800; }
.status-badge.is-active { background: #dcfce7; color: #16734a; }
.status-badge.is-archived { background: #edf1f6; color: #66758a; }

@media (max-width: 820px) {
    .config-users-toolbar { grid-template-columns: 1fr; }
    .config-users-toolbar > .btn { justify-self: stretch; }
}
/* Configuracion: formulario directo de Mi negocio */
.business-settings-form {
    display: grid;
    gap: 14px;
    text-align: left;
}
.business-settings-section {
    border: 1px solid var(--app-border);
    border-radius: 12px;
    background: #fff;
    padding: 18px;
}
.business-settings-heading {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 16px;
    color: var(--app-text);
}
.business-settings-heading > i {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 10px;
    background: #eaf2ff;
    color: var(--app-primary);
}
.business-settings-heading strong,
.business-settings-heading span { display: block; }
.business-settings-heading strong { font-size: 16px; }
.business-settings-heading span { margin-top: 3px; color: var(--app-muted); font-size: 13px; font-weight: 500; }
.business-settings-grid { gap: 15px 18px; }
.business-settings-grid label,
.business-color-field { color: #243247; font-size: 13px; font-weight: 750; }
.business-settings-grid input,
.business-settings-grid textarea { margin-top: 7px; }
.business-settings-grid textarea { min-height: 82px; resize: vertical; }
.business-settings-appearance { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(220px, .65fr); gap: 22px; align-items: center; }
.business-settings-appearance .business-settings-heading { margin-bottom: 0; }
.business-color-field > div { display: grid; grid-template-columns: 52px 1fr; gap: 10px; margin-top: 7px; }
.business-color-field input[type="color"] { width: 52px; height: 42px; padding: 3px; border: 1px solid var(--app-border); border-radius: 9px; background: #fff; cursor: pointer; }
@media (max-width: 720px) {
    .business-settings-section { padding: 14px; }
    .business-settings-appearance { grid-template-columns: 1fr; }
}
.business-settings-grid.is-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.business-settings-grid .span-3 { grid-column: 1 / -1; }
.business-logo-editor {
    display: grid;
    grid-template-columns: 120px minmax(260px, 1fr);
    align-items: center;
    gap: 20px;
    padding: 14px;
    border: 1px solid var(--app-border);
    border-radius: 11px;
    background: #f8fafc;
}
.business-logo-preview {
    display: grid;
    place-items: center;
    width: 120px;
    height: 86px;
    overflow: hidden;
    border: 1px solid var(--app-border);
    border-radius: 10px;
    background: #fff;
    color: var(--app-muted);
    font-size: 28px;
}
.business-logo-preview img { width: 100%; height: 100%; object-fit: contain; }
.business-file-field { margin: 0; color: #243247; font-size: 13px; font-weight: 750; }
.business-file-field > span { display: block; margin-bottom: 7px; }
@media (max-width: 900px) {
    .business-settings-grid.is-three { grid-template-columns: minmax(0, 1fr); }
    .business-settings-grid.is-three .span-3 { grid-column: 1 / -1; }
}
@media (max-width: 620px) {
    .business-settings-grid.is-three { grid-template-columns: 1fr; }
    .business-settings-grid.is-three .span-3 { grid-column: auto; }
    .business-logo-editor { grid-template-columns: 1fr; }
}
/* Configuracion: metodos de pago alineados al punto de venta */
.config-metodos-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 420px) auto auto;
    align-items: center;
    gap: 18px;
    padding: 4px 0 14px !important;
    border-bottom: 1px solid var(--app-border);
}
.config-metodos-toolbar .search-control { width: 100%; }
.config-metodos-toolbar > .btn { justify-self: end; }
.config-metodos-table th:first-child,
.config-metodos-table td:first-child { width: 180px; }
.config-metodos-table th:last-child,
.config-metodos-table td:last-child { width: 250px; }
.config-metodos-table .actions-cell { justify-content: flex-start; gap: 7px; }
.config-catalog-pager { justify-content: center; margin-top: 10px; }
.btn-small.warning { border-color: #f0c27b; background: #fff9ed; color: #b56a00; }
@media (max-width: 820px) {
    .config-metodos-toolbar { grid-template-columns: 1fr; }
    .config-metodos-toolbar > .btn { justify-self: stretch; }
}
/* Configuracion: reglas del lugar */
.config-rules-toolbar { display:grid; grid-template-columns:minmax(280px, 440px) auto; align-items:center; gap:18px; padding:4px 0 14px !important; border-bottom:1px solid var(--app-border); }
.config-rules-toolbar .search-control { width:100%; }
.config-rules-toolbar > .btn { justify-self:end; }
.config-rules-table th:first-child, .config-rules-table td:first-child { width:180px; }
.config-rules-table th:last-child, .config-rules-table td:last-child { width:250px; }
.config-rules-table .actions-cell { justify-content:flex-start; gap:7px; }
@media (max-width:720px) { .config-rules-toolbar { grid-template-columns:1fr; } .config-rules-toolbar > .btn { justify-self:stretch; } }
/* Configuracion: servicios y cargos como lista de precios */
.config-services-toolbar {
    display: grid;
    grid-template-columns: minmax(280px, 420px) auto auto;
    align-items: center;
    gap: 18px;
    padding: 4px 0 14px !important;
    border-bottom: 1px solid var(--app-border);
}
.config-services-toolbar .search-control { width: 100%; }
.config-services-toolbar > .btn { justify-self: end; }
.config-services-table th:first-child,
.config-services-table td:first-child { width: 150px; }
.config-services-table th:nth-child(4),
.config-services-table td:nth-child(4) { width: 170px; }
.config-services-table th:last-child,
.config-services-table td:last-child { width: 180px; }
.config-services-table .actions-cell { justify-content: flex-start; gap: 7px; }
@media (max-width: 820px) {
    .config-services-toolbar { grid-template-columns: 1fr; }
    .config-services-toolbar > .btn { justify-self: stretch; }
}
/* Ajuste final: modal de terminales alineado al POS */
.config-terminals-panel {
    width: min(1120px, calc(100vw - 40px));
    max-width: min(1120px, calc(100vw - 40px));
    overflow: hidden;
}
.config-terminals-header {
    min-height: 78px;
    padding: 18px 20px;
    border-bottom: 1px solid var(--app-border);
}
.config-terminals-header h2 {
    margin: 0;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 800;
}
.config-terminals-body {
    padding: 18px 20px 20px !important;
}
.config-terminals-body .stats-modal-shell { padding: 0; }
.terminal-modal-toolbar {
    display: grid !important;
    grid-template-columns: minmax(280px, 420px) auto auto;
    align-items: center;
    gap: 18px;
    padding: 14px !important;
    margin: 0;
    border-bottom: 1px solid var(--app-border);
    background: #f8fafc;
}
.terminal-modal-toolbar .search-control { width: 100%; min-width: 0; }
.terminal-modal-toolbar > :nth-child(2) { justify-self: center; }
.terminal-modal-toolbar > :last-child { justify-self: end; }
.config-terminals-body #configTerminalesResultado > .inline-status {
    margin: 0;
    padding: 12px 13px;
    border: 1px solid var(--app-border);
    border-radius: 8px;
    background: #fff;
    color: var(--app-text);
}
.terminal-config-table-wrap {
    max-height: min(54vh, 520px);
    margin-top: 14px !important;
    overflow: auto;
    border: 0;
    border-radius: 0;
}
.terminal-config-table-wrap .module-table { margin: 0; }
@media (max-width: 760px) {
    .config-terminals-panel { width: calc(100vw - 20px); max-width: calc(100vw - 20px); }
    .terminal-modal-toolbar { grid-template-columns: 1fr; }
    .terminal-modal-toolbar > :nth-child(2),
    .terminal-modal-toolbar > :last-child { justify-self: stretch; width: 100%; }
}
/* Formulario de terminal en una columna */
.config-terminal-form-swal {
    width: min(720px, calc(100vw - 32px)) !important;
    padding: 0 28px 24px !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
}
.config-terminal-form-swal .swal2-title {
    padding: 20px 54px 14px !important;
    font-size: 27px !important;
}
.config-terminal-form-swal .swal2-html-container {
    margin: 0 !important;
    padding: 0 !important;
}
.config-terminal-form-swal .config-form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 22px 26px;
    padding: 0 14px;
}
.config-terminal-form-swal .config-form-grid label {
    display: grid;
    gap: 8px;
    margin: 0;
    min-width: 0;
    font-weight: 700;
}
.config-terminal-form-swal .config-form-grid .swal2-input {
    width: 100% !important;
    min-width: 0;
    height: 53px;
    margin: 0 !important;
    box-sizing: border-box;
}
.config-terminal-form-swal .modal-export-footer {
    margin: 26px 14px 0;
    padding-top: 12px;
}
@media (max-width: 620px) {
    .config-terminal-form-swal .config-form-grid { grid-template-columns: 1fr; }
}
/* Cargos adicionales y administrador de categorias */
.config-services-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 1fr) auto auto auto;
    align-items: center;
    gap: 12px;
}
.config-services-category-filter {
    width: 100%;
    min-width: 0;
    height: 42px;
}
.config-services-toolbar > .btn { justify-self: auto; white-space: nowrap; }
.config-categories-panel { width: min(820px, calc(100vw - 36px)); max-width: min(820px, calc(100vw - 36px)); }
.config-categories-toolbar {
    display: grid;
    grid-template-columns: minmax(260px, 420px) auto;
    align-items: center;
    gap: 18px;
    padding: 4px 0 14px !important;
    border-bottom: 1px solid var(--app-border);
}
.config-categories-toolbar .search-control { width: 100%; }
.config-categories-toolbar > .btn { justify-self: end; }
.config-categories-table th:first-child,
.config-categories-table td:first-child { width: 110px; }
.config-categories-table th:nth-child(3),
.config-categories-table td:nth-child(3) { width: 130px; text-align: center; }
.config-categories-table th:last-child,
.config-categories-table td:last-child { width: 150px; }
.config-categories-table .actions-cell { justify-content: flex-start; gap: 7px; }
.category-base-label { display: block; margin-top: 3px; color: var(--app-primary); font-size: 11px; font-weight: 700; }
.btn-small:disabled { opacity: .45; cursor: not-allowed; }
@media (max-width: 980px) {
    .config-services-toolbar { grid-template-columns: 1fr 1fr; }
    .config-services-toolbar > .segmented-control { justify-self: start; }
}
@media (max-width: 650px) {
    .config-services-toolbar,
    .config-categories-toolbar { grid-template-columns: 1fr; }
    .config-services-toolbar > .btn,
    .config-categories-toolbar > .btn { width: 100%; justify-self: stretch; }
}
.category-protected-label { display:inline-flex; align-items:center; gap:6px; color:#66758a; font-size:12px; font-weight:700; }
/* Estadisticas: ancho completo alineado con los modulos principales */
.stats-module-shell,
.stats-grid,
.stats-trend-panel,
.stats-panels {
    box-sizing: border-box;
    width: auto !important;
    max-width: none !important;
    margin-left: 26px !important;
    margin-right: 26px !important;
}

@media (max-width: 760px) {
    .stats-module-shell,
    .stats-grid,
    .stats-trend-panel,
    .stats-panels {
        margin-left: 12px !important;
        margin-right: 12px !important;
    }
}
/* Caja: confirmacion de apertura y cierre calculados */
.turno-calculated-confirmation {
    display: grid;
    gap: 14px;
    text-align: center;
}

.turno-calculated-confirmation > span {
    color: var(--app-text);
    font-size: 0.9rem;
    font-weight: 800;
    text-align: left;
}

.turno-calculated-confirmation > strong {
    display: block;
    padding: 14px 16px;
    border: 1px solid #cbdcf0;
    border-radius: 8px;
    background: #eaf3ff;
    color: var(--app-primary, #0057c8);
    font-size: 1.35rem;
    font-weight: 900;
}

.turno-calculated-confirmation > p {
    margin: 2px 0 0;
    color: var(--app-muted);
    font-size: 0.92rem;
    line-height: 1.55;
}

.turno-calculated-swal .swal2-actions {
    margin-top: 1.25rem;
}
/* Perfil responsive: tableta conserva densidad; telefono prioriza tacto y lectura. */
@media (max-width: 920px) and (min-width: 641px) {
    .profile-page-content .profile-layout-pos {
        gap: 14px;
    }

    .profile-page-content .profile-info-grid,
    .profile-page-content .password-change-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-page-content .profile-info-item-wide {
        grid-column: 1 / -1;
    }
}

@media (max-width: 640px) {
    .profile-page-content .container-fluid {
        padding-left: 0;
        padding-right: 0;
    }

    .profile-page-content .profile-module-shell,
    .profile-page-content .profile-layout-pos {
        width: 100%;
        min-width: 0;
    }

    .profile-page-content .profile-header-panel {
        padding: 14px;
    }

    .profile-page-content .profile-header-panel .module-title {
        align-items: center;
        gap: 12px;
    }

    .profile-page-content .profile-header-panel .module-icon {
        width: 44px;
        height: 44px;
        font-size: 1.1rem;
    }

    .profile-page-content .profile-header-panel h1 {
        font-size: 1.35rem;
    }

    .profile-page-content .profile-header-panel p {
        line-height: 1.35;
    }

    .profile-page-content .profile-layout-pos {
        gap: 12px;
    }

    .profile-page-content .profile-summary-panel {
        padding: 16px;
    }

    .profile-page-content .profile-summary-main {
        align-items: center;
        flex-direction: column;
        gap: 12px;
        text-align: center;
    }

    .profile-page-content .profile-summary-avatar {
        width: 112px;
        height: 112px;
    }

    .profile-page-content .profile-summary-copy,
    .profile-page-content .profile-summary-copy h2,
    .profile-page-content .profile-summary-copy p {
        max-width: 100%;
        overflow-wrap: anywhere;
    }

    .profile-page-content .profile-summary-copy h2 {
        font-size: 1.3rem;
    }

    .profile-page-content .profile-info-grid,
    .profile-page-content .password-change-grid {
        grid-template-columns: 1fr;
    }

    .profile-page-content .profile-info-item {
        align-items: flex-start;
        padding: 12px;
    }

    .profile-page-content .profile-photo-panel .module-toolbar,
    .profile-page-content .profile-password-panel .module-toolbar,
    .profile-page-content .profile-photo-panel .module-panel-body,
    .profile-page-content .profile-password-panel .module-panel-body {
        padding-left: 14px;
        padding-right: 14px;
    }

    .profile-page-content .profile-upload-box {
        align-items: flex-start;
        padding: 12px;
    }

    .profile-page-content .profile-file-input,
    .profile-page-content .profile-file-input .custom-file-input,
    .profile-page-content .profile-file-input .custom-file-label {
        width: 100%;
    }

    .profile-page-content .profile-file-input .custom-file-label {
        overflow: hidden;
        padding-right: 104px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .profile-page-content .password-change-grid .form-control {
        min-height: 44px;
        width: 100%;
    }

    .profile-page-content .profile-form-actions,
    .profile-page-content .profile-form-actions .btn {
        width: 100%;
    }

    .profile-page-content .profile-form-actions .btn {
        justify-content: center;
        min-height: 44px;
    }
}
/* Clientes responsive: tabla en tableta y cards en telefono. */
@media (max-width: 900px) and (min-width: 641px) {
    .clients-module-shell.rooms-module-shell .module-grid.clients-metrics-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .clients-table-panel .table-responsive,
    .clientes-archivados-content .table-responsive {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }

    .clients-table-panel .module-table,
    .clientes-archivados-content .module-table {
        min-width: 760px;
    }
}

@media (max-width: 640px) {
    .clients-module-shell.rooms-module-shell .module-grid.clients-metrics-grid {
        grid-template-columns: 1fr !important;
        gap: 10px;
    }

    .clients-module-shell .clients-control-panel,
    .clients-table-panel {
        min-width: 0;
    }

    .clients-toolbar .module-toolbar-actions,
    .clientes-archivados-content .module-toolbar-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .clients-toolbar .module-toolbar-actions .btn,
    .clientes-archivados-content .module-toolbar-actions .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }

    .clients-table-panel .table-responsive,
    .clientes-archivados-content .table-responsive {
        border: 0;
        overflow: visible;
    }

    .clients-table-panel .module-table:has(td[data-label]),
    .clientes-archivados-content .module-table:has(td[data-label]) {
        border-collapse: separate;
        border-spacing: 0;
        display: block;
        min-width: 0;
        table-layout: auto;
        width: 100%;
    }

    .clients-table-panel .module-table:has(td[data-label]) thead,
    .clientes-archivados-content .module-table:has(td[data-label]) thead {
        display: none;
    }

    .clients-table-panel .module-table:has(td[data-label]) tbody,
    .clientes-archivados-content .module-table:has(td[data-label]) tbody {
        display: grid;
        gap: 10px;
        width: 100%;
    }

    .clients-table-panel .module-table:has(td[data-label]) tr:has(td[data-label]),
    .clientes-archivados-content .module-table:has(td[data-label]) tr:has(td[data-label]) {
        background: var(--app-surface);
        border: 1px solid var(--app-border);
        border-radius: 10px;
        box-shadow: 0 8px 20px rgba(15, 23, 42, 0.05);
        display: block;
        overflow: hidden;
        padding: 8px 12px;
        width: 100%;
    }

    .clients-table-panel .module-table td[data-label],
    .clientes-archivados-content .module-table td[data-label] {
        align-items: start;
        border: 0;
        display: grid;
        gap: 10px;
        grid-template-columns: minmax(86px, 32%) minmax(0, 1fr);
        min-height: 38px;
        overflow: visible;
        padding: 9px 0;
        text-align: left !important;
        white-space: normal;
        width: 100% !important;
        word-break: break-word;
    }

    .clients-table-panel .module-table td[data-label]::before,
    .clientes-archivados-content .module-table td[data-label]::before {
        color: var(--app-muted);
        content: attr(data-label);
        font-size: 0.72rem;
        font-weight: 800;
        letter-spacing: 0.02em;
        text-transform: uppercase;
    }

    .clients-table-panel .module-table td[data-label="Acciones"],
    .clientes-archivados-content .module-table td[data-label="Acciones"] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding-top: 12px;
    }

    .clients-table-panel .module-table td[data-label="Acciones"]::before,
    .clientes-archivados-content .module-table td[data-label="Acciones"]::before {
        flex: 0 0 100%;
    }

    .clients-table-panel .row-actions,
    .clientes-archivados-content .row-actions {
        justify-content: flex-start;
        min-width: 0;
        width: auto;
    }

    .clients-table-panel .btn-small,
    .clientes-archivados-content .btn-small {
        min-height: 40px;
        min-width: 40px;
    }

    .clients-table-panel .module-pager,
    .clientes-archivados-content .module-pager {
        justify-content: center;
        text-align: center;
    }

    .clientes-archivados-app-panel {
        width: min(96vw, 680px);
    }

    .clientes-archivados-app-header .pedido-detail-title {
        min-width: 0;
    }

    .clientes-archivados-app-header .pedido-detail-title p {
        line-height: 1.35;
    }

    .client-action-panel .service-action-footer {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
    }

    .client-action-panel .service-action-footer .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
}
/* Correccion movil Perfil y Clientes: evita bases flex verticales y ordena acciones. */
@media (max-width: 640px) {
    .profile-page-content .profile-layout.profile-layout-pos .profile-summary-avatar {
        aspect-ratio: 1 / 1;
        flex: 0 0 112px;
        height: 112px;
        max-height: 112px;
        min-height: 112px;
        width: 112px;
    }

    .profile-page-content .profile-summary-panel,
    .profile-page-content .profile-photo-panel,
    .profile-page-content .profile-password-panel {
        height: auto;
        min-height: 0;
    }

    .profile-page-content .profile-photo-panel .module-panel-body,
    .profile-page-content .profile-password-panel .module-panel-body,
    .profile-page-content .profile-password-panel form {
        flex: 0 0 auto;
        min-height: 0;
    }

    .clients-module-shell > .module-header .module-actions {
        align-items: stretch;
        display: grid;
        gap: 8px;
        grid-template-columns: 1fr;
        width: 100%;
    }

    .clients-module-shell > .module-header .module-actions .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }

    .clients-module-shell.rooms-module-shell .clients-control-panel .rooms-filter-group,
    .clientes-archivados-content .archived-modal-toolbar .rooms-filter-group {
        flex: 0 0 auto !important;
        height: 44px;
        max-height: 44px;
        min-height: 44px;
    }

    .clients-module-shell .clients-toolbar,
    .clientes-archivados-content .archived-modal-toolbar {
        min-height: 0;
    }

    .clients-module-shell .clients-toolbar .search-control,
    .clientes-archivados-content .archived-modal-toolbar .search-control,
    .clients-module-shell .clients-toolbar .search-control input,
    .clientes-archivados-content .archived-modal-toolbar .search-control input {
        height: 42px;
        max-height: 42px;
        min-height: 42px;
    }

    .clients-module-shell .clients-toolbar .search-control,
    .clientes-archivados-content .archived-modal-toolbar .search-control {
        flex: 0 0 42px;
        min-width: 0;
    }
}
/* Clientes tableta: separacion uniforme entre acciones del encabezado. */
@media (max-width: 900px) and (min-width: 641px) {
    .clients-module-shell > .module-header .module-actions {
        display: grid;
        gap: 10px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        width: 100%;
    }

    .clients-module-shell > .module-header .module-actions .btn {
        justify-content: center;
        margin: 0;
        min-height: 42px;
        width: 100%;
    }
}
/* Clientes tableta real (incluye iPad Pro): botones compactos con aire al envolver. */
@media (max-width: 1100px) and (min-width: 641px) {
    .clients-module-shell > .module-header .module-actions {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: flex-end;
        width: auto;
    }

    .clients-module-shell > .module-header .module-actions .btn {
        flex: 0 0 auto;
        margin: 0 0 8px;
        min-height: 40px;
        width: auto;
    }
}
/* Menu movil superpuesto: cerrado en 64px y abierto en 220px, sin empujar contenido. */
@media (max-width: 768px) {
    :root {
        --sidebar-open: 220px;
        --sidebar-closed: 64px;
    }

    .dashboard-layout .sidebar.collapsed {
        width: var(--sidebar-closed);
    }

    .dashboard-layout .sidebar:not(.collapsed) {
        box-shadow: 14px 0 28px rgba(15, 23, 42, 0.18);
        width: var(--sidebar-open);
        z-index: 1200;
    }

    .dashboard-layout .sidebar:not(.collapsed) .sidebar-nav span,
    .dashboard-layout .sidebar:not(.collapsed) .sidebar-help span,
    .dashboard-layout .sidebar:not(.collapsed) .sidebar-actions span {
        display: inline;
    }

    .dashboard-layout .sidebar:not(.collapsed) .sidebar-brand-name {
        display: none;
    }

    .dashboard-layout .sidebar:not(.collapsed) .sidebar-nav a,
    .dashboard-layout .sidebar:not(.collapsed) .sidebar-help a,
    .dashboard-layout .sidebar:not(.collapsed) .sidebar-actions a,
    .dashboard-layout .sidebar:not(.collapsed) .sidebar-actions button {
        justify-content: flex-start;
    }

    .dashboard-layout .navbar,
    .dashboard-layout .navbar.collapsed {
        left: var(--sidebar-closed);
    }

    .content,
    .content.collapsed {
        margin-left: var(--sidebar-closed);
    }
}
/* Empleados responsive: completa modal y encabezado de archivados en telefono. */
@media (max-width: 640px) {
    .empleados-archivados-app-panel {
        width: min(96vw, 680px);
    }

    .empleados-archivados-app-header .pedido-detail-title {
        min-width: 0;
    }

    .empleados-archivados-app-header .pedido-detail-title p {
        line-height: 1.35;
    }

    .employee-action-panel .service-action-footer {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
    }

    .employee-action-panel .service-action-footer .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
}
/* Empleados movil: cancela limites de columnas usados solo en escritorio. */
@media (max-width: 640px) {
    .employees-table-panel .module-table td[data-label],
    .empleados-archivados-content .module-table td[data-label] {
        max-width: none !important;
        min-width: 0 !important;
        overflow: visible !important;
        text-overflow: clip !important;
        white-space: normal !important;
        word-break: normal;
        overflow-wrap: anywhere;
    }

    .employees-table-panel .module-table td[data-label] > *,
    .empleados-archivados-content .module-table td[data-label] > * {
        min-width: 0;
        max-width: 100%;
    }
}
/* Estadisticas responsive: escritorio, tableta y telefono. */
@media (max-width: 1180px) and (min-width: 701px) {
    .stats-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stats-panels { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stats-panels > .module-panel:last-child { grid-column: 1 / -1; }
}

@media (max-width: 920px) {
    .stats-module-shell .module-header { align-items: flex-start; gap: 14px; }
    .stats-module-shell .module-toolbar-actions { flex: 0 0 auto; }
    .stats-module-shell .module-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .stats-range-presets {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        width: 100%;
    }
    .stats-range-presets .btn { justify-content: center; width: 100%; }
    .stats-trend-row {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 9px 14px;
    }
    .stats-trend-row > strong {
        grid-column: 1 / -1;
        padding-bottom: 7px;
        border-bottom: 1px solid var(--app-border);
    }
    .stats-trend-row span { display: grid; gap: 3px; }
}

@media (max-width: 640px) {
    .stats-module-shell,
    .stats-grid,
    .stats-trend-panel,
    .stats-panels {
        min-width: 0;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
    .stats-module-shell .module-header {
        display: grid;
        grid-template-columns: 1fr;
    }
    .stats-module-shell .module-title { min-width: 0; }
    .stats-module-shell .module-toolbar-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        width: 100%;
    }
    .stats-module-shell .module-toolbar-actions .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .stats-module-shell .module-toolbar-actions .btn:last-child { grid-column: 1 / -1; }
    .stats-module-shell .module-filters {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 12px;
    }
    .stats-module-shell .module-filters label,
    .stats-module-shell .module-filters input {
        min-width: 0;
        width: 100%;
    }
    .stats-range-presets {
        grid-column: auto;
        grid-template-columns: 1fr;
    }
    .stats-status {
        justify-content: center;
        width: 100%;
        text-align: center;
    }
    .stats-grid,
    .stats-panels {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .stats-card { min-height: 0; padding: 15px; }
    .stats-card strong { font-size: 24px; overflow-wrap: anywhere; }
    .stats-trend-panel .module-panel-header,
    .stats-panels .module-panel-header { padding: 15px; }
    .stats-trend-list,
    .stats-panels .stats-list { padding: 10px; }
    .stats-trend-row {
        grid-template-columns: 1fr 1fr;
        gap: 10px;
        padding: 12px;
    }
    .stats-trend-row > strong { grid-column: 1 / -1; }
    .stats-trend-row span {
        min-width: 0;
        padding: 7px;
        border-radius: 7px;
        background: var(--app-surface);
    }
    .stats-trend-row span:last-of-type { grid-column: 1 / -1; }
    .stats-panels > .module-panel:last-child { grid-column: auto; }
    .stats-panels .stats-row { grid-template-columns: minmax(0, 1fr) auto; }
}
/* Habitaciones responsive: tarjetas principales y deshabilitadas. */
@media (max-width: 1100px) and (min-width: 641px) {
    .rooms-module-shell > .module-header .module-actions {
        align-items: center;
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: flex-end;
        width: auto;
    }
    .rooms-module-shell > .module-header .module-actions .btn {
        flex: 0 0 auto;
        margin-bottom: 8px;
        min-height: 40px;
        width: auto;
    }
    .rooms-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .disabled-rooms-table-wrap {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }
    .disabled-rooms-table { min-width: 760px; }
}

@media (max-width: 640px) {
    .rooms-module-shell,
    .rooms-board-panel,
    .rooms-status-panel {
        min-width: 0;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
    .rooms-module-shell > .module-header {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
    }
    .rooms-module-shell > .module-header .module-title { min-width: 0; }
    .rooms-module-shell > .module-header .module-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 7px;
        width: 100%;
    }
    .rooms-module-shell > .module-header .module-actions .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .rooms-module-shell .module-grid.rooms-metrics-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .rooms-module-shell .rooms-toolbar {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        gap: 9px;
    }
    .rooms-module-shell .rooms-toolbar .rooms-filter-group,
    .rooms-module-shell .rooms-toolbar .search-control {
        flex: 0 0 auto !important;
        height: 44px;
        min-width: 0;
        width: 100% !important;
    }
    .rooms-module-shell .rooms-toolbar .module-toolbar-actions,
    .rooms-module-shell .rooms-toolbar .module-toolbar-actions .btn {
        justify-content: center;
        width: 100%;
    }
    .rooms-board-panel { padding: 14px; }
    .section-heading-inline { align-items: flex-start; }
    .rooms-card-grid { grid-template-columns: 1fr; }
    .room-card { min-height: 0; padding: 13px; }
    .room-card-type { min-height: 0; }
    .room-card-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }
    .room-card-action { min-height: 42px; width: 100%; }
    .rooms-status-panel { padding: 10px; }
    .module-pager { flex-wrap: wrap; }

    .disabled-rooms-app-panel { width: min(96vw, 680px); }
    .disabled-rooms-app-content { min-width: 0; }
    .disabled-rooms-toolbar {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
    }
    .disabled-rooms-toolbar .search-control,
    .disabled-rooms-toolbar .modal-export-actions,
    .disabled-rooms-toolbar > .btn {
        max-width: none;
        width: 100%;
    }
    .disabled-rooms-toolbar .modal-export-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
    .disabled-rooms-toolbar .modal-export-btn,
    .disabled-rooms-toolbar > .btn { justify-content: center; min-height: 42px; }
    .disabled-rooms-table-wrap { border: 0; overflow: visible; }
    .disabled-rooms-table:has(td[data-label]) {
        border-collapse: separate;
        border-spacing: 0 10px;
        display: block;
        min-width: 0;
        width: 100%;
    }
    .disabled-rooms-table:has(td[data-label]) thead { display: none; }
    .disabled-rooms-table:has(td[data-label]) tbody,
    .disabled-rooms-table:has(td[data-label]) tr,
    .disabled-rooms-table:has(td[data-label]) td { display: block; width: 100%; }
    .disabled-rooms-table:has(td[data-label]) tr {
        padding: 12px;
        border: 1px solid var(--app-border);
        border-radius: 10px;
        background: var(--app-surface);
        box-shadow: var(--app-shadow-soft);
    }
    .disabled-rooms-table:has(td[data-label]) td[data-label] {
        align-items: start;
        display: grid;
        grid-template-columns: minmax(88px, .8fr) minmax(0, 1.2fr);
        gap: 10px;
        min-width: 0;
        padding: 8px 0;
        border: 0;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .disabled-rooms-table:has(td[data-label]) td[data-label]::before {
        content: attr(data-label);
        color: var(--app-muted);
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
    }
    .disabled-rooms-table:has(td[data-label]) td[data-label="Acciones"] {
        grid-template-columns: 1fr;
        padding-top: 12px;
        border-top: 1px solid var(--app-border);
    }
    .disabled-rooms-table:has(td[data-label]) td[data-label="Acciones"]::before { display: none; }
    .disabled-rooms-table:has(td[data-label]) td[data-label="Acciones"] .btn {
        justify-content: center;
        min-height: 42px;
        width: 100%;
    }
    .room-action-panel .service-action-footer {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
    }
    .room-action-panel .service-action-footer .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
}
/* Operacion responsive: seguimiento tactil por habitacion. */
@media (max-width: 1100px) and (min-width: 641px) {
    .operation-room-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .operation-room-card { min-width: 0; }
    .operation-room-actions .btn { flex: 1 1 auto; }
}

@media (max-width: 640px) {
    .operation-module-shell,
    .operation-board-panel,
    .operation-status-panel {
        min-width: 0;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
    .operation-module-shell .module-header {
        min-height: 0;
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .operation-module-shell .module-title { min-width: 0; }
    .operation-module-shell .operation-searchbar {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        gap: 9px;
        padding: 12px;
    }
    .operation-module-shell .operation-searchbar .rooms-filter-group,
    .operation-module-shell .operation-searchbar .search-control {
        flex: 0 0 auto !important;
        height: 44px;
        max-width: none !important;
        min-width: 0;
        width: 100% !important;
    }
    .operation-module-shell .operation-searchbar .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .operation-board-panel {
        gap: 12px !important;
        padding: 14px !important;
    }
    .operation-board-panel .module-panel-header { padding: 0 0 4px; }
    .operation-room-grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .operation-room-card {
        gap: 10px;
        min-height: 0;
        min-width: 0;
        padding: 13px;
    }
    .operation-room-card header { align-items: flex-start; }
    .operation-room-card header strong { font-size: 26px; }
    .operation-room-card header em {
        max-width: 58%;
        overflow-wrap: anywhere;
    }
    .operation-room-card p {
        min-height: 0;
        overflow-wrap: anywhere;
    }
    .operation-room-meta span {
        align-items: flex-start;
        overflow-wrap: anywhere;
    }
    .operation-room-lanes { margin-top: 4px; }
    .operation-room-lane { min-width: 0; }
    .operation-room-lane > span,
    .operation-room-lane > small { overflow-wrap: anywhere; }
    .operation-room-lane .operation-room-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }
    .operation-room-lane .operation-room-actions .btn {
        justify-content: center;
        min-height: 42px;
        width: 100%;
    }
    .operation-status-panel { padding: 10px !important; }
    .operation-status-panel .module-pager { flex-wrap: wrap; }

    .operation-action-panel { width: min(96vw, 560px); }
    .operation-action-header { padding: 15px 60px 14px 18px; }
    .operation-action-content { padding: 16px 18px 10px; }
    .operation-action-modal .inline-status { margin-left: 18px; margin-right: 18px; }
    .operation-action-footer {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 12px 18px 18px;
    }
    .operation-action-footer .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .operation-modal-form { gap: 13px; }
    .operation-modal-form .form-control { min-width: 0; width: 100%; }
}
/* Recepcion responsive: caja, pedidos y disponibilidad. */
@media (max-width: 1100px) and (min-width: 641px) {
    .reception-main-actions,
    #pedidosActivosPanel .module-panel-header .module-toolbar-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
    .reception-main-actions .btn,
    #pedidosActivosPanel .module-panel-header .module-toolbar-actions .btn {
        flex: 0 0 auto;
        margin-bottom: 8px;
        width: auto;
    }
    .recepcion-caja-metrics-panel .recepcion-caja-main-metrics,
    .recepcion-caja-main-metrics {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    #pedidosActivosPanel > .table-responsive {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }
    #pedidosActivosPanel > .table-responsive > .module-table { min-width: 820px; }
}

@media (max-width: 640px) {
    .reservations-module-shell,
    .recepcion-caja-metrics-panel,
    .recepcion-caja-main,
    #pedidosActivosPanel {
        min-width: 0;
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
    .reception-main-header {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        padding-top: 15px;
        padding-bottom: 15px;
    }
    .reception-main-header .module-title { min-width: 0; }
    .reception-main-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 7px;
        width: 100%;
    }
    .reception-main-actions .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .recepcion-caja-metrics-panel .recepcion-caja-main-metrics,
    .recepcion-caja-main-metrics { grid-template-columns: 1fr; gap: 8px; }
    .recepcion-caja-main {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 14px;
    }
    .recepcion-caja-main-info { align-items: flex-start; }
    .recepcion-caja-main-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }
    .recepcion-caja-main-actions .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .recepcion-caja-main-grid { grid-template-columns: 1fr; gap: 12px; }
    .recepcion-caja-formbox { min-width: 0; padding: 13px; }

    #pedidosActivosPanel { padding: 14px; }
    #pedidosActivosPanel .module-panel-header {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        padding-right: 0;
    }
    #pedidosActivosPanel .module-panel-header .module-toolbar-actions {
        display: grid;
        grid-template-columns: 1fr;
        gap: 7px;
        width: 100%;
    }
    #pedidosActivosPanel .module-panel-header .module-toolbar-actions .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .reservations-active-toolbar {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        gap: 9px;
        padding: 10px 0;
    }
    .reservations-active-toolbar .search-control {
        flex: 0 0 auto;
        height: 44px;
        max-width: none;
        min-width: 0;
        width: 100%;
    }
    .reservations-active-toolbar > .module-toolbar-actions {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        width: 100%;
    }
    .reservations-active-toolbar .reservations-scope-filter { width: 100%; }
    .reservations-active-toolbar #btnRecargarReservaciones {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    #reservacionesEstado { text-align: center; }

    #pedidosActivosPanel > .table-responsive { border: 0; overflow: visible; }
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) {
        border-collapse: separate;
        border-spacing: 0 10px;
        display: block;
        min-width: 0;
        width: 100%;
    }
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) thead { display: none; }
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) tbody,
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) tr,
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) td {
        display: block;
        width: 100%;
    }
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) tr {
        padding: 12px;
        border: 1px solid var(--app-border);
        border-radius: 10px;
        background: var(--app-surface);
        box-shadow: var(--app-shadow-soft);
    }
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) td[data-label] {
        align-items: start;
        display: grid;
        grid-template-columns: minmax(105px, .9fr) minmax(0, 1.1fr);
        gap: 10px;
        min-width: 0;
        padding: 8px 0;
        border: 0;
        text-align: left !important;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    #pedidosActivosPanel > .table-responsive > .module-table:has(td[data-label]) td[data-label]::before {
        content: attr(data-label);
        color: var(--app-muted);
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
    }
    #pedidosActivosPanel td[data-label="Acciones"] {
        grid-template-columns: 1fr !important;
        padding-top: 12px !important;
        border-top: 1px solid var(--app-border) !important;
    }
    #pedidosActivosPanel td[data-label="Acciones"]::before { display: none; }
    #pedidosActivosPanel td[data-label="Acciones"] .btn-small {
        min-height: 42px;
        min-width: 46px;
    }
    #paginacionReservaciones { flex-wrap: wrap; justify-content: center; }

    .recepcion-caja-table-wrap,
    .recepcion-caja-movimientos-table { border: 0; max-height: none; overflow: visible; }
    .recepcion-caja-table:has(td[data-label]),
    .caja-movimientos .module-table:has(td[data-label]) {
        border-collapse: separate;
        border-spacing: 0 10px;
        display: block;
        min-width: 0;
        width: 100%;
    }
    .recepcion-caja-table:has(td[data-label]) thead,
    .caja-movimientos .module-table:has(td[data-label]) thead { display: none; }
    .recepcion-caja-table:has(td[data-label]) tbody,
    .recepcion-caja-table:has(td[data-label]) tr,
    .recepcion-caja-table:has(td[data-label]) td,
    .caja-movimientos .module-table:has(td[data-label]) tbody,
    .caja-movimientos .module-table:has(td[data-label]) tr,
    .caja-movimientos .module-table:has(td[data-label]) td { display: block; width: 100%; }
    .recepcion-caja-table:has(td[data-label]) tr,
    .caja-movimientos .module-table:has(td[data-label]) tr {
        padding: 11px;
        border: 1px solid var(--app-border);
        border-radius: 9px;
        background: var(--app-surface);
    }
    .recepcion-caja-table td[data-label],
    .caja-movimientos .module-table td[data-label] {
        align-items: start;
        display: grid;
        grid-template-columns: minmax(90px, .8fr) minmax(0, 1.2fr);
        gap: 9px;
        padding: 7px 0;
        border: 0;
        text-align: left !important;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .recepcion-caja-table td[data-label]::before,
    .caja-movimientos .module-table td[data-label]::before {
        content: attr(data-label);
        color: var(--app-muted);
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
    }

    #pedidosActivosModal .availability-panel {
        width: calc(100vw - 16px);
        max-height: calc(100vh - 16px);
        padding: 10px;
    }
    #pedidosActivosModal .availability-panel .module-panel-header {
        align-items: flex-start;
        padding: 4px 0 8px;
    }
    #pedidosActivosModal .availability-command-bar,
    #pedidosActivosModal .availability-controls.monthly-controls,
    #pedidosActivosModal .availability-selection-mini {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        width: 100%;
    }
    #pedidosActivosModal .availability-filter-actions {
        display: grid;
        grid-template-columns: 1fr;
        width: 100%;
    }
    #pedidosActivosModal .availability-filter-actions .btn,
    #pedidosActivosModal .availability-selection-mini .btn {
        justify-content: center;
        min-height: 42px;
        width: 100%;
    }
    #pedidosActivosModal .availability-legend.compact.availability-topbar {
        overflow-x: auto;
        padding-bottom: 6px;
    }
    #pedidosActivosModal .availability-legend-items {
        flex-wrap: nowrap;
        min-width: max-content;
    }
    #pedidosActivosModal .availability-grid {
        max-height: calc(100vh - 430px);
        min-height: 190px;
        overflow: auto;
        padding: 6px;
    }

    .pedido-detail-panel { width: calc(100vw - 16px); }
    .pedido-detail-header { padding: 14px 58px 14px 14px; }
    .pedido-detail-title { min-width: 0; }
    .pedido-detail-title h2,
    .pedido-detail-title p { overflow-wrap: anywhere; }
    .pedido-detail-content { padding: 12px; }
    .pedido-detail-summary { grid-template-columns: 1fr; }
    .pedido-detail-main .detail-table-wrap {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }
    .pedido-detail-main .detail-table-wrap .module-table { min-width: 760px; }

    .reservation-action-panel { width: calc(100vw - 16px); }
    .reservation-action-content { min-width: 0; }
    .reservation-action-panel .modal-actions,
    .reservation-action-panel .modal-actions .btn {
        justify-content: center;
        width: 100%;
    }
}
/* Configuracion responsive: catalogos, negocio y terminales. */
@media (max-width: 1100px) and (min-width: 641px) {
    .config-section-content .table-responsive,
    .config-categories-panel .table-responsive,
    .config-terminals-body .table-responsive {
        overflow-x: auto;
        overscroll-behavior-inline: contain;
    }
    .config-users-table { min-width: 780px; }
    .config-metodos-table,
    .config-rules-table { min-width: 640px; }
    .config-services-table { min-width: 760px; }
    .config-categories-table { min-width: 650px; }
    .terminal-config-table-wrap .module-table { min-width: 760px; }
}

@media (max-width: 640px) {
    .config-pos-shell {
        min-width: 0;
        margin-left: 10px !important;
        margin-right: 10px !important;
        width: auto !important;
    }
    .config-pos-shell .module-header { padding-top: 15px; padding-bottom: 15px; }
    .config-pos-shell .module-title { min-width: 0; }
    .config-pos-grid { gap: 10px; grid-template-columns: 1fr; }
    .config-pos-grid .config-nav-card { min-height: 96px; padding: 14px; }

    .config-section-panel,
    .config-categories-panel,
    .config-terminals-panel {
        max-width: calc(100vw - 16px);
        width: calc(100vw - 16px);
    }
    .config-section-panel .service-action-header,
    .config-categories-panel .service-action-header {
        align-items: flex-start;
        padding: 14px 58px 13px 16px;
    }
    .config-section-panel .service-action-header h2,
    .config-section-panel .service-action-header p,
    .config-categories-panel .service-action-header h2,
    .config-categories-panel .service-action-header p { overflow-wrap: anywhere; }
    .config-section-content {
        max-height: calc(100vh - 155px);
        min-width: 0;
        padding: 12px 12px 6px;
    }
    .config-section-content .module-panel { min-width: 0; }

    .config-users-toolbar,
    .config-metodos-toolbar,
    .config-rules-toolbar,
    .config-services-toolbar,
    .config-categories-toolbar,
    .terminal-modal-toolbar {
        align-items: stretch;
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px;
        width: 100%;
    }
    .config-users-toolbar .search-control,
    .config-metodos-toolbar .search-control,
    .config-rules-toolbar .search-control,
    .config-services-toolbar .search-control,
    .config-categories-toolbar .search-control,
    .terminal-modal-toolbar .search-control {
        flex: 0 0 auto;
        height: 44px;
        max-width: none;
        min-width: 0;
        width: 100%;
    }
    .config-users-toolbar > .btn,
    .config-metodos-toolbar > .btn,
    .config-rules-toolbar > .btn,
    .config-services-toolbar > .btn,
    .config-categories-toolbar > .btn,
    .terminal-modal-toolbar > .btn,
    .terminal-modal-toolbar > :nth-child(2),
    .terminal-modal-toolbar > :last-child {
        justify-content: center;
        justify-self: stretch;
        min-height: 44px;
        width: 100%;
    }
    .config-users-toolbar .segmented-control,
    .config-metodos-toolbar .segmented-control,
    .config-services-toolbar .segmented-control { width: 100%; }
    .config-users-toolbar .segmented-control button,
    .config-metodos-toolbar .segmented-control button,
    .config-services-toolbar .segmented-control button { flex: 1 1 0; }

    .config-section-content .table-responsive,
    .config-categories-panel .table-responsive,
    .config-terminals-body .table-responsive {
        border: 0;
        overflow: visible;
    }
    .config-section-content .module-table:has(td[data-label]),
    .config-categories-panel .module-table:has(td[data-label]),
    .config-terminals-body .module-table:has(td[data-label]) {
        border-collapse: separate;
        border-spacing: 0 10px;
        display: block;
        min-width: 0;
        width: 100%;
    }
    .config-section-content .module-table:has(td[data-label]) thead,
    .config-categories-panel .module-table:has(td[data-label]) thead,
    .config-terminals-body .module-table:has(td[data-label]) thead { display: none; }
    .config-section-content .module-table:has(td[data-label]) tbody,
    .config-section-content .module-table:has(td[data-label]) tr,
    .config-section-content .module-table:has(td[data-label]) td,
    .config-categories-panel .module-table:has(td[data-label]) tbody,
    .config-categories-panel .module-table:has(td[data-label]) tr,
    .config-categories-panel .module-table:has(td[data-label]) td,
    .config-terminals-body .module-table:has(td[data-label]) tbody,
    .config-terminals-body .module-table:has(td[data-label]) tr,
    .config-terminals-body .module-table:has(td[data-label]) td {
        display: block;
        width: 100%;
    }
    .config-section-content .module-table:has(td[data-label]) tr,
    .config-categories-panel .module-table:has(td[data-label]) tr,
    .config-terminals-body .module-table:has(td[data-label]) tr {
        padding: 12px;
        border: 1px solid var(--app-border);
        border-radius: 10px;
        background: var(--app-surface);
        box-shadow: var(--app-shadow-soft);
    }
    .config-section-content .module-table td[data-label],
    .config-categories-panel .module-table td[data-label],
    .config-terminals-body .module-table td[data-label] {
        align-items: start;
        display: grid;
        grid-template-columns: minmax(90px, .8fr) minmax(0, 1.2fr);
        gap: 9px;
        min-width: 0;
        max-width: none !important;
        padding: 8px 0;
        border: 0;
        text-align: left !important;
        white-space: normal !important;
        overflow: visible;
        overflow-wrap: anywhere;
    }
    .config-section-content .module-table td[data-label]::before,
    .config-categories-panel .module-table td[data-label]::before,
    .config-terminals-body .module-table td[data-label]::before {
        content: attr(data-label);
        color: var(--app-muted);
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
    }
    .config-section-content .module-table td[data-label="Acciones"],
    .config-categories-panel .module-table td[data-label="Acciones"],
    .config-terminals-body .module-table td[data-label="Acciones"] {
        grid-template-columns: 1fr;
        padding-top: 12px;
        border-top: 1px solid var(--app-border);
    }
    .config-section-content .module-table td[data-label="Acciones"]::before,
    .config-categories-panel .module-table td[data-label="Acciones"]::before,
    .config-terminals-body .module-table td[data-label="Acciones"]::before { display: none; }
    .config-section-content .actions-cell,
    .config-categories-panel .actions-cell,
    .config-terminals-body .terminal-actions {
        display: flex !important;
        flex-wrap: wrap;
        gap: 8px;
        justify-content: flex-start;
        width: 100% !important;
    }
    .config-section-content .actions-cell .btn-small,
    .config-categories-panel .actions-cell .btn-small,
    .config-terminals-body .terminal-action-btn {
        min-height: 42px;
        min-width: 44px;
    }

    .config-users-pager,
    .config-catalog-pager {
        flex-wrap: wrap;
        gap: 7px;
        justify-content: center;
        text-align: center;
    }
    .config-users-pager .btn,
    .config-catalog-pager .btn { min-height: 40px; }

    .business-settings-section { min-width: 0; padding: 12px; }
    .business-settings-grid.is-three,
    .business-settings-appearance,
    .business-logo-editor { grid-template-columns: 1fr; }
    .business-settings-grid.is-three .span-3 { grid-column: auto; }
    .business-logo-preview { width: 100%; }
    .business-file-field,
    .business-file-field input[type="file"] { min-width: 0; max-width: 100%; width: 100%; }

    .config-terminals-header { min-height: 64px; padding: 14px 58px 14px 16px; }
    .config-terminals-header h2 { font-size: 21px; }
    .config-terminals-body { min-width: 0; padding: 10px !important; }
    .terminal-config-table-wrap { max-height: none; overflow: visible; }

    .config-section-modal .service-action-footer,
    .config-action-modal .service-action-footer,
    .config-categories-panel .service-action-footer,
    #servicioCatalogoModal .service-action-footer {
        align-items: stretch;
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        padding: 12px 16px 18px;
    }
    .config-section-modal .service-action-footer .btn,
    .config-action-modal .service-action-footer .btn,
    .config-categories-panel .service-action-footer .btn,
    #servicioCatalogoModal .service-action-footer .btn {
        justify-content: center;
        min-height: 44px;
        width: 100%;
    }
    .config-action-panel,
    #servicioCatalogoModal .service-action-panel { width: calc(100vw - 16px); }
    .config-action-panel .service-action-content,
    #servicioCatalogoModal .service-action-content { min-width: 0; padding: 14px 16px 8px; }
    .config-action-panel input,
    .config-action-panel select,
    .config-action-panel textarea,
    #servicioCatalogoModal input,
    #servicioCatalogoModal select,
    #servicioCatalogoModal textarea { min-width: 0; width: 100%; }
}
/* Perfil movil: centra el modulo sin sumar el ancho a sus margenes. */
@media (max-width: 640px) {
    .profile-page-content .profile-module-shell {
        box-sizing: border-box;
        width: auto;
        max-width: none;
        margin-left: 10px;
        margin-right: 10px;
    }
    .profile-page-content .profile-header-panel,
    .profile-page-content .profile-layout.profile-layout-pos,
    .profile-page-content .profile-layout.profile-layout-pos > .module-panel {
        box-sizing: border-box;
        width: 100%;
        max-width: 100%;
        margin-left: 0;
        margin-right: 0;
    }
}
/* Clientes movil: paginador completo en un solo renglon. */
@media (max-width: 640px) {
    .clients-table-panel .module-pager,
    .clientes-archivados-content .module-pager {
        flex-wrap: nowrap;
        gap: 4px;
        justify-content: center;
        width: 100%;
    }
    .clients-table-panel .module-pager span,
    .clientes-archivados-content .module-pager span {
        flex: 0 1 auto;
        font-size: 0.76rem;
        line-height: 1;
        white-space: nowrap;
    }
    .clients-table-panel .module-pager .btn,
    .clientes-archivados-content .module-pager .btn {
        flex: 0 0 36px;
        min-height: 36px;
        min-width: 36px;
        padding: 0;
    }
}
/* Habitaciones movil: paginador compacto en un solo renglon. */
@media (max-width: 640px) {
    .rooms-status-panel .module-pager {
        flex-wrap: nowrap;
        gap: 4px;
        justify-content: center;
        width: 100%;
    }
    .rooms-status-panel .module-pager span {
        flex: 0 1 auto;
        font-size: 0.76rem;
        line-height: 1;
        white-space: nowrap;
    }
    .rooms-status-panel .module-pager .btn {
        flex: 0 0 36px;
        min-height: 36px;
        min-width: 36px;
        padding: 0;
    }
}
/* Recepcion movil: cargador centrado contra la ventana real. */
@media (max-width: 640px) {
    body > .reception-loading-overlay {
        align-items: center;
        display: flex;
        inset: 0;
        justify-content: center;
        padding: 16px;
    }
    body > .reception-loading-overlay .reception-loading-card {
        box-sizing: border-box;
        margin: 0;
        max-width: 320px;
        width: 100%;
    }
}
/* Recepcion movil: pedidos como tarjetas explicitas. */
@media (max-width: 640px) {
    #pedidosActivosPanel > .table-responsive {
        border: 0;
        overflow: visible;
    }
    .reservations-orders-table {
        border-collapse: separate;
        border-spacing: 0 10px;
        display: block;
        min-width: 0 !important;
        table-layout: auto;
        width: 100%;
    }
    .reservations-orders-table thead { display: none; }
    .reservations-orders-table tbody,
    .reservations-orders-table tr,
    .reservations-orders-table td {
        display: block;
        width: 100%;
    }
    .reservations-orders-table tbody { min-width: 0; }
    .reservations-orders-table tr {
        box-sizing: border-box;
        margin-bottom: 10px;
        padding: 12px;
        border: 1px solid var(--app-border);
        border-radius: 10px;
        background: var(--app-surface);
        box-shadow: var(--app-shadow-soft);
    }
    .reservations-orders-table td[data-label] {
        align-items: start;
        box-sizing: border-box;
        display: grid;
        grid-template-columns: minmax(105px, .9fr) minmax(0, 1.1fr);
        gap: 10px;
        min-width: 0;
        padding: 8px 0;
        border: 0;
        text-align: left !important;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .reservations-orders-table td[data-label]::before {
        content: attr(data-label);
        color: var(--app-muted);
        font-size: 11px;
        font-weight: 900;
        text-transform: uppercase;
    }
    .reservations-orders-table td[data-label="Acciones"] {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        padding-top: 12px;
        border-top: 1px solid var(--app-border);
    }
    .reservations-orders-table td[data-label="Acciones"]::before { display: none; }
    .reservations-orders-table td[data-label="Acciones"] .btn-small {
        align-items: center;
        display: inline-flex;
        flex: 1 1 44px;
        justify-content: center;
        min-height: 42px;
    }
    .reservations-orders-table tr:has(td[colspan]) {
        padding: 0;
        border: 0;
        box-shadow: none;
    }
}
/* Recepcion movil: mensaje vacio de pedidos legible y centrado. */
@media (max-width: 640px) {
    .reservations-orders-table td[colspan] {
        box-sizing: border-box;
        padding: 0;
        border: 0;
        white-space: normal;
        overflow: hidden;
    }
    .reservations-orders-table td[colspan] .empty-state {
        align-items: center;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        gap: 6px;
        justify-content: center;
        min-height: 110px;
        padding: 16px 12px;
        text-align: center;
        white-space: normal;
        width: 100%;
    }
    .reservations-orders-table td[colspan] .empty-state i,
    .reservations-orders-table td[colspan] .empty-state strong,
    .reservations-orders-table td[colspan] .empty-state span {
        display: block;
        max-width: 100%;
        white-space: normal;
        overflow-wrap: anywhere;
    }
    .reservations-orders-table td[colspan] .empty-state strong {
        color: var(--app-text);
        line-height: 1.25;
    }
    .reservations-orders-table td[colspan] .empty-state span {
        color: var(--app-muted);
        font-size: 0.82rem;
        line-height: 1.4;
    }
}
/* Clientes archivados: mantener el cierre compacto en movil y tableta. */
@media (max-width: 900px) {
    .clientes-archivados-app-header,
    .disabled-rooms-app-header {
        display: block;
        position: relative;
        padding: 14px 62px 14px 14px;
    }

    .clientes-archivados-app-header > [data-clientes-archivados-close],
    .empleados-archivados-app-header > [data-empleados-archivados-close],
    .disabled-rooms-app-header > [data-deshabilitadas-modal-close] {
        align-items: center;
        display: inline-flex;
        height: 40px;
        justify-content: center;
        margin: 0;
        min-height: 40px;
        min-width: 40px;
        padding: 0;
        position: absolute;
        right: 14px;
        top: 14px;
        width: 40px;
    }
}
/* Estandar global de botones de cierre para modales y SweetAlert. */
.app-modal-panel .pedido-detail-header > button.icon-only,
.app-modal-panel .service-action-header > button.icon-only,
.app-modal-panel .operation-action-header > button.icon-only,
.modal-close,
.swal2-popup .swal2-close {
    align-items: center;
    background: var(--app-surface-2, #f4f7fa);
    border: 1px solid var(--app-border, #d7e0ea);
    border-radius: 8px;
    color: var(--app-text, #1f2937);
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 1.05rem;
    font-weight: 800;
    height: 40px;
    justify-content: center;
    line-height: 1;
    margin: 0;
    min-height: 40px;
    min-width: 40px;
    padding: 0;
    position: absolute;
    right: 16px;
    top: 14px;
    width: 40px;
    z-index: 5;
}

.app-modal-panel .pedido-detail-header > button.icon-only:hover,
.app-modal-panel .service-action-header > button.icon-only:hover,
.app-modal-panel .operation-action-header > button.icon-only:hover,
.modal-close:hover,
.swal2-popup .swal2-close:hover {
    background: var(--app-surface, #ffffff);
    border-color: var(--primary-color, #0057c8);
    color: var(--primary-color, #0057c8);
}

.swal2-popup {
    position: relative;
}

.swal2-popup .swal2-close {
    box-shadow: none;
}

@media (max-width: 900px) {
    .app-modal-panel .pedido-detail-header,
    .app-modal-panel .service-action-header,
    .app-modal-panel .operation-action-header {
        min-height: 68px;
        padding-right: 64px;
        position: relative;
    }
}
/* Estandar global de paginacion compacta en un solo renglon. */
.module-pager,
.archived-modal-pager,
.config-users-pager,
.config-catalog-pager,
#paginacionReservaciones,
#paginacionOperacion,
#paginacionClientes,
#paginacionEmpleados,
#paginacionHabitaciones {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
    justify-content: center;
    min-width: 0;
    text-align: center;
    width: 100%;
}

.module-pager > span,
.archived-modal-pager > span,
.config-users-pager > span,
.config-catalog-pager > span {
    flex: 0 1 auto;
    line-height: 1;
    min-width: 0;
    white-space: nowrap;
}

.module-pager > .btn,
.archived-modal-pager > .btn,
.config-users-pager > .btn,
.config-catalog-pager > .btn {
    flex: 0 0 40px;
    justify-content: center;
    min-width: 40px;
    padding-inline: 0;
}

@media (max-width: 640px) {
    .module-pager,
    .archived-modal-pager,
    .config-users-pager,
    .config-catalog-pager,
    #paginacionReservaciones,
    #paginacionOperacion,
    #paginacionClientes,
    #paginacionEmpleados,
    #paginacionHabitaciones {
        flex-wrap: nowrap;
        gap: 4px;
        overflow: hidden;
    }

    .module-pager > span,
    .archived-modal-pager > span,
    .config-users-pager > span,
    .config-catalog-pager > span {
        font-size: clamp(0.66rem, 2.7vw, 0.76rem);
        line-height: 1;
        white-space: nowrap;
    }

    .module-pager > .btn,
    .archived-modal-pager > .btn,
    .config-users-pager > .btn,
    .config-catalog-pager > .btn {
        flex-basis: 36px;
        height: 36px;
        min-height: 36px;
        min-width: 36px;
        width: 36px;
    }
}
/* Perfil escritorio: columnas equilibradas y seguridad compacta. */
@media (min-width: 1101px) {
    .profile-module-shell .profile-layout.profile-layout-pos {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: auto auto;
    }

    .profile-module-shell .profile-password-panel form {
        justify-content: flex-start;
    }

    .profile-module-shell .password-change-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-module-shell .profile-form-actions {
        margin-top: 18px;
    }
}

/* Paginacion: al final de las tablas en escritorio; centrada en movil. */
@media (min-width: 641px) {
    .module-pager,
    .archived-modal-pager,
    .config-users-pager,
    .config-catalog-pager,
    #paginacionReservaciones,
    #paginacionOperacion,
    #paginacionClientes,
    #paginacionEmpleados,
    #paginacionHabitaciones {
        justify-content: flex-end;
    }
}

/* Detalle de pedido: en escritorio la tabla cabe completa sin scroll horizontal. */
@media (min-width: 901px) {
    .pedido-detail-main .detail-table-wrap {
        overflow-x: hidden;
        overflow-y: auto;
    }

    .pedido-detail-main .compact-reservation-lines {
        min-width: 0;
        width: 100%;
    }

    .pedido-detail-main .compact-reservation-lines th:nth-child(1),
    .pedido-detail-main .compact-reservation-lines td:nth-child(1) { width: 16%; }
    .pedido-detail-main .compact-reservation-lines th:nth-child(2),
    .pedido-detail-main .compact-reservation-lines td:nth-child(2) { width: 27%; }
    .pedido-detail-main .compact-reservation-lines th:nth-child(3),
    .pedido-detail-main .compact-reservation-lines td:nth-child(3) { width: 15%; }
    .pedido-detail-main .compact-reservation-lines th:nth-child(4),
    .pedido-detail-main .compact-reservation-lines td:nth-child(4) { width: 15%; }
    .pedido-detail-main .compact-reservation-lines th:nth-child(5),
    .pedido-detail-main .compact-reservation-lines td:nth-child(5) { width: 27%; }

    .pedido-detail-main .compact-reservation-lines td.actions-cell {
        line-height: 48px;
        white-space: normal;
    }
}

/* Historial y resolucion de alertas de huesped */
.guest-alert-management{display:grid;gap:14px}
.guest-alert-new-section{margin:0}
.guest-alert-new-actions{display:flex;justify-content:flex-end;margin-top:12px}
.guest-alert-history-section{border:1px solid #d9e2ef;border-radius:10px;background:#fff;overflow:hidden}
.guest-alert-history-title{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:#f6f9fd;border-bottom:1px solid #d9e2ef}
.guest-alert-history-title span{display:inline-flex;min-width:28px;height:24px;padding:0 8px;align-items:center;justify-content:center;border-radius:999px;background:#e3edfb;color:#0757c8;font-weight:800;font-size:12px}
.guest-alert-history-list{display:grid;gap:10px;padding:12px}
.guest-alert-history-item{padding:12px;border:1px solid #f2c66d;border-radius:9px;background:#fff8e8;color:#744b00}
.guest-alert-history-item.is-danger{border-color:#ef9a9a;background:#fff0f0;color:#9f1d1d}
.guest-alert-history-item.is-resolved{border-color:#b9ddc8;background:#f2fbf6;color:#285d3d}
.guest-alert-history-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.guest-alert-history-head strong{display:flex;align-items:center;gap:7px}
.guest-alert-history-head>span{font-size:11px;font-weight:800;text-transform:uppercase}
.guest-alert-history-item p{margin:8px 0;line-height:1.45}
.guest-alert-history-item small{display:block;color:inherit;opacity:.78;line-height:1.45}
.guest-alert-resolve-button{margin-top:12px}
.guest-alert-resolution-form{margin-top:12px;padding-top:12px;border-top:1px solid currentColor}
.guest-alert-resolution-form[hidden]{display:none!important}
.guest-alert-resolution-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:10px}
.guest-alert-resolution-note{margin-top:9px;padding:9px;border-radius:7px;background:rgba(255,255,255,.72);line-height:1.45}
.guest-alert-empty{display:flex;align-items:center;gap:8px;padding:12px;color:#5e7088}
.guest-alert-resolved-details{margin-top:12px;padding-top:10px;border-top:1px solid currentColor}
.guest-alert-resolved-details summary{cursor:pointer;font-weight:800}
.guest-alert-resolved-details div{display:grid;gap:3px;margin-top:9px;padding:9px;border-radius:7px;background:rgba(255,255,255,.66)}
.guest-alert-resolved-details span{font-size:12px;line-height:1.4}
@media (max-width:720px){.guest-alert-new-actions .btn,.guest-alert-resolution-actions .btn{width:100%}.guest-alert-resolution-actions{flex-direction:column}.guest-alert-history-head{align-items:flex-start}}