:root {
    color-scheme: light;

    --sn-color-canvas: #f3f7fb;
    --sn-color-canvas-alt: #eaf4ff;
    --sn-color-surface: #ffffff;
    --sn-color-surface-subtle: #f8fbfd;
    --sn-color-text: #17324d;
    --sn-color-text-muted: #61758a;
    --sn-color-border: #dbe5ee;
    --sn-color-brand: #17324d;
    --sn-color-brand-strong: #10283e;
    --sn-color-brand-soft: #e5f3ff;
    --sn-color-accent: #2b6b9d;
    --sn-color-success: #18794e;
    --sn-color-success-soft: #edf9f2;
    --sn-color-warning: #866616;
    --sn-color-warning-soft: #fff9e8;
    --sn-color-danger: #a33b25;
    --sn-color-danger-soft: #fff1ed;
    --sn-color-focus: #3b82f6;

    --sn-font-sans: Arial, Helvetica, sans-serif;
    --sn-text-xs: 0.75rem;
    --sn-text-sm: 0.875rem;
    --sn-text-md: 1rem;
    --sn-text-lg: 1.125rem;
    --sn-text-xl: 1.5rem;

    --sn-space-1: 0.25rem;
    --sn-space-2: 0.5rem;
    --sn-space-3: 0.75rem;
    --sn-space-4: 1rem;
    --sn-space-5: 1.25rem;
    --sn-space-6: 1.5rem;
    --sn-space-8: 2rem;
    --sn-space-10: 2.5rem;
    --sn-space-12: 3rem;

    --sn-radius-sm: 0.5rem;
    --sn-radius-md: 0.875rem;
    --sn-radius-lg: 1.25rem;
    --sn-radius-xl: 1.75rem;
    --sn-radius-pill: 999px;

    --sn-shadow-sm: 0 4px 14px rgba(23, 50, 77, 0.08);
    --sn-shadow-md: 0 12px 35px rgba(23, 50, 77, 0.14);
    --sn-shadow-lg: 0 26px 70px rgba(23, 50, 77, 0.16);

    --sn-control-height: 3rem;
    --sn-content-narrow: 45rem;
    --sn-content-wide: 75rem;
}

body {
    margin: 0;
    font-family: var(--sn-font-sans);
    background: var(--sn-color-canvas);
    color: var(--sn-color-text);
}

:focus-visible {
    outline: 3px solid rgba(59, 130, 246, 0.36);
    outline: 3px solid color-mix(in srgb, var(--sn-color-focus) 36%, transparent);
    outline-offset: 3px;
}

.skip-link {
    position: fixed;
    top: var(--sn-space-3);
    left: var(--sn-space-3);
    z-index: 10000;
    padding: var(--sn-space-3) var(--sn-space-4);
    border-radius: var(--sn-radius-sm);
    background: var(--sn-color-brand);
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    transform: translateY(calc(-100% - var(--sn-space-8)));
    transition: transform 160ms ease;
}

.skip-link:focus {
    color: #fff;
    transform: translateY(0);
}

.app-shell {
    min-height: 100vh;
    background: var(--sn-color-canvas);
    color: var(--sn-color-text);
}

.app-shell--system {
    background: linear-gradient(145deg, var(--sn-color-canvas-alt), #f8fbff 48%, #edf7f2);
}

.app-shell--public {
    background: var(--sn-color-surface);
}

.app-shell__content {
    width: min(var(--sn-content-wide), calc(100% - 2rem));
    margin-inline: auto;
    padding-block: var(--sn-space-8) var(--sn-space-12);
}

.app-shell__content--narrow {
    max-width: var(--sn-content-narrow);
}

.app-page-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--sn-space-6);
    margin-bottom: var(--sn-space-6);
}

.app-page-header__eyebrow {
    margin: 0 0 var(--sn-space-2);
    color: var(--sn-color-accent);
    font-size: var(--sn-text-xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.app-page-header h1 {
    margin: 0;
    color: var(--sn-color-text);
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    letter-spacing: -0.03em;
}

.app-page-header__summary {
    max-width: 42rem;
    margin: var(--sn-space-2) 0 0;
    color: var(--sn-color-text-muted);
    line-height: 1.55;
}

.app-panel {
    padding: var(--sn-space-6);
    border: 1px solid var(--sn-color-border);
    border-radius: var(--sn-radius-lg);
    background: var(--sn-color-surface);
    box-shadow: var(--sn-shadow-sm);
}

.app-button {
    min-height: var(--sn-control-height);
    width: auto;
    padding: 0 var(--sn-space-5);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--sn-space-2);
    border: 1px solid transparent;
    border-radius: var(--sn-radius-md);
    font: inherit;
    font-weight: 800;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
}

.app-button--primary {
    background: var(--sn-color-brand);
    color: #fff;
    box-shadow: var(--sn-shadow-sm);
}

.app-button--primary:hover {
    background: var(--sn-color-brand-strong);
    color: #fff;
}

.app-button--secondary {
    border-color: var(--sn-color-border);
    background: var(--sn-color-surface);
    color: var(--sn-color-text);
}

.app-button--danger {
    background: var(--sn-color-danger);
    color: #fff;
}

.app-field {
    display: grid;
    gap: var(--sn-space-2);
}

.app-field__label {
    color: var(--sn-color-text);
    font-size: var(--sn-text-sm);
    font-weight: 800;
}

.app-field__help {
    color: var(--sn-color-text-muted);
    font-size: var(--sn-text-xs);
    line-height: 1.45;
}

.app-input {
    min-height: var(--sn-control-height);
    width: 100%;
    margin: 0;
    padding: 0 var(--sn-space-4);
    border: 1px solid var(--sn-color-border);
    border-radius: var(--sn-radius-md);
    background: var(--sn-color-surface);
    color: var(--sn-color-text);
    font: inherit;
    box-sizing: border-box;
}

.app-input:focus {
    border-color: var(--sn-color-accent);
}

.app-notice {
    padding: var(--sn-space-4);
    border: 1px solid var(--sn-color-border);
    border-radius: var(--sn-radius-md);
    background: var(--sn-color-surface-subtle);
    color: var(--sn-color-text);
    line-height: 1.5;
}

.app-notice--success {
    border-color: #bfe4cf;
    background: var(--sn-color-success-soft);
    color: var(--sn-color-success);
}

.app-notice--warning {
    border-color: #e1d5b3;
    background: var(--sn-color-warning-soft);
    color: var(--sn-color-warning);
}

.app-notice--danger {
    border-color: #f1c5ba;
    background: var(--sn-color-danger-soft);
    color: var(--sn-color-danger);
}

.app-status {
    width: fit-content;
    padding: var(--sn-space-1) var(--sn-space-3);
    display: inline-flex;
    align-items: center;
    gap: var(--sn-space-2);
    border-radius: var(--sn-radius-pill);
    background: var(--sn-color-surface-subtle);
    color: var(--sn-color-text-muted);
    font-size: var(--sn-text-xs);
    font-weight: 800;
}

.app-status--success {
    background: var(--sn-color-success-soft);
    color: var(--sn-color-success);
}

.app-status--warning {
    background: var(--sn-color-warning-soft);
    color: var(--sn-color-warning);
}

.app-status--danger {
    background: var(--sn-color-danger-soft);
    color: var(--sn-color-danger);
}

@media (max-width: 700px) {
    .app-page-header {
        flex-direction: column;
    }

    .app-panel {
        padding: var(--sn-space-5);
    }
}

.system-page {
    min-height: 100vh;
    background:
        radial-gradient(circle at 18% 16%, rgba(65, 146, 208, 0.18), transparent 32%),
        radial-gradient(circle at 84% 82%, rgba(45, 116, 89, 0.12), transparent 30%),
        linear-gradient(145deg, var(--sn-color-canvas-alt) 0%, #f8fbff 48%, #edf7f2 100%);
}

.system-page-shell {
    min-height: 100vh;
    padding: 32px 20px;
    display: grid;
    place-items: center;
    box-sizing: border-box;
}

.system-card {
    width: min(100%, 620px);
    padding: 42px;
    border: 1px solid rgba(202, 218, 231, 0.9);
    border-radius: var(--sn-radius-xl);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: var(--sn-shadow-lg);
    text-align: center;
    box-sizing: border-box;
}

.system-card-illustration {
    position: relative;
    width: 126px;
    height: 126px;
    margin: 0 auto 26px;
    display: grid;
    place-items: center;
    border-radius: 38px;
    transform: rotate(-3deg);
}

.system-card-illustration-404 {
    background: linear-gradient(145deg, #e5f3ff, #dcecff);
    box-shadow: inset 0 0 0 1px rgba(58, 119, 168, 0.12);
}

.system-card-illustration-error {
    background: linear-gradient(145deg, #fff1e8, #ffe4da);
    box-shadow: inset 0 0 0 1px rgba(183, 87, 50, 0.12);
}

.system-card-bird {
    font-size: 62px;
    filter: drop-shadow(0 8px 8px rgba(23, 50, 77, 0.16));
    transform: rotate(3deg);
}

.system-card-map,
.system-card-signal {
    position: absolute;
    top: -10px;
    right: -10px;
    width: 42px;
    height: 42px;
    display: grid;
    place-items: center;
    border: 4px solid #fff;
    border-radius: 50%;
    background: #17324d;
    color: #fff;
    font-size: 22px;
    font-weight: 800;
    box-shadow: 0 8px 20px rgba(23, 50, 77, 0.2);
}

.system-card-signal {
    background: #b94f2e;
}

.system-eyebrow {
    margin: 0 0 8px;
    color: var(--sn-color-accent);
    font-size: 13px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.system-card h1 {
    margin: 0;
    color: var(--sn-color-text);
    font-size: clamp(30px, 6vw, 44px);
    line-height: 1.08;
    letter-spacing: -0.03em;
}

.system-copy {
    max-width: 500px;
    margin: 18px auto 28px;
    color: var(--sn-color-text-muted);
    font-size: 17px;
    line-height: 1.6;
}

.system-primary-action,
.system-secondary-action {
    min-height: 52px;
    padding: 0 22px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 15px;
    font-family: inherit;
    font-size: 16px;
    font-weight: 800;
    text-decoration: none;
    box-sizing: border-box;
    cursor: pointer;
}

.system-primary-action {
    width: auto;
    background: linear-gradient(135deg, var(--sn-color-brand), #2b5f8a);
    color: #fff;
    box-shadow: 0 10px 24px rgba(23, 50, 77, 0.2);
}

.system-primary-action:hover {
    color: #fff;
    transform: translateY(-1px);
}

.system-secondary-action {
    margin-top: 12px;
    color: #365a78;
    background: transparent;
}

.system-report-form {
    margin: 26px 0 2px;
    padding: 24px;
    border: 1px solid #dbe6ef;
    border-radius: 20px;
    background: #f8fbfd;
    text-align: left;
}

.system-report-form label {
    display: block;
    margin-bottom: 10px;
    color: #17324d;
    font-size: 15px;
    font-weight: 800;
}

.system-report-form label span {
    color: #7a8b9c;
    font-weight: 400;
}

.system-report-form textarea {
    width: 100%;
    min-height: 122px;
    padding: 14px;
    resize: vertical;
    border: 1px solid #cbd9e5;
    border-radius: 14px;
    background: #fff;
    color: #17324d;
    font: inherit;
    line-height: 1.5;
    box-sizing: border-box;
}

.system-report-form textarea:focus {
    outline: 3px solid rgba(43, 95, 138, 0.16);
    border-color: #5a88ad;
}

.system-report-form .system-primary-action {
    width: 100%;
}

.system-privacy-note {
    margin: 10px 2px 18px;
    color: #718396;
    font-size: 12px;
    line-height: 1.5;
}

.system-notice {
    margin: 20px 0;
    padding: 13px 15px;
    border-radius: 13px;
    font-size: 14px;
    line-height: 1.5;
    text-align: left;
}

.system-notice-error {
    border: 1px solid #f1c5ba;
    background: #fff1ed;
    color: #8d321d;
}

.system-reference {
    margin: 24px 0 0;
    color: #8797a7;
    font-size: 12px;
    line-height: 1.5;
}

@media (max-width: 600px) {
    .system-page-shell {
        padding: 18px 12px;
    }

    .system-card {
        padding: 30px 20px;
        border-radius: 22px;
    }

    .system-card-illustration {
        width: 104px;
        height: 104px;
        border-radius: 30px;
    }

    .system-card-bird {
        font-size: 52px;
    }

    .system-report-form {
        padding: 18px;
    }
}

.app-footer {
    max-width: 1200px;
    margin: 24px auto 18px;
    padding: 0 20px;
    color: #6f8193;
    font-size: 11px;
    line-height: 1.4;
    text-align: center;
}

.app-footer-updated {
    margin-bottom: 2px;
}

/* Guest check-in application */
.checkout-page {
    --checkout-navy: #17324d;
    --checkout-blue: #2b6b9d;
    --checkout-line: #dbe5ee;
    --checkout-muted: #6f8193;
    --checkout-canvas: #f3f7fb;
    background: var(--checkout-canvas);
}

.checkout-topbar {
    padding-block: 27px;
}

.checkout-eyebrow {
    margin-bottom: 6px;
    color: #bcd8ec;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.checkout-shell {
    width: min(1480px, calc(100% - 40px));
    margin: 30px auto 60px;
}

.checkout-heading,
.checkout-title-line,
.checkout-heading-meta,
.checkout-toolbar,
.checkout-table-summary {
    display: flex;
    align-items: center;
}

.checkout-heading {
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 24px;
}

.checkout-heading h2 {
    margin: 0;
    color: var(--checkout-navy);
    font-size: 30px;
    letter-spacing: -.02em;
}

.checkout-heading p {
    margin: 7px 0 0;
    color: var(--checkout-muted);
}

.checkout-title-line {
    gap: 12px;
}

.checkout-source-badge {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 6px 10px;
    border: 1px solid #e1d5b3;
    border-radius: 999px;
    background: #fff9e8;
    color: #866616;
    font-size: 11px;
    font-weight: 800;
}

.checkout-source-badge span {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #d7a719;
}

.checkout-source-badge.is-live {
    border-color: #bfe4cf;
    background: #edf9f2;
    color: #18794e;
}

.checkout-source-badge.is-live span {
    background: #1f9d63;
}

.checkout-heading-meta {
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    color: var(--checkout-muted);
    font-size: 12px;
}

.checkout-heading-meta i {
    margin-right: 5px;
}

.checkout-heading-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 18px;
}

.checkout-identity-cta {
    min-width: 280px;
    padding: 11px 13px;
    display: flex;
    align-items: center;
    gap: 11px;
    border: 1px solid #cbdce8;
    border-radius: 14px;
    background: #fff;
    color: var(--checkout-navy);
    box-shadow: 0 7px 22px rgba(23, 50, 77, .06);
    text-decoration: none;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.checkout-identity-cta:hover {
    border-color: #8fb6d2;
    box-shadow: 0 10px 26px rgba(23, 50, 77, .11);
    transform: translateY(-1px);
}

.checkout-identity-cta.has-pending {
    border-color: #e3c46d;
    background: #fffdf6;
}
.checkout-identity-cta.has-error {
    border-color: #e2aaa6;
    background: #fff7f6;
}

.checkout-identity-cta-icon {
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #eaf2f8;
    color: var(--checkout-blue);
}

.checkout-identity-cta.has-pending .checkout-identity-cta-icon {
    background: #fff0bf;
    color: #886510;
}
.checkout-identity-cta.has-error .checkout-identity-cta-icon {
    background: #ffe4e1;
    color: #ad4038;
}
.checkout-identity-cta.has-error .checkout-identity-cta-count {
    background: #b84b43;
}

.checkout-identity-cta-copy {
    min-width: 0;
    flex: 1;
}

.checkout-identity-cta-copy strong,
.checkout-identity-cta-copy small {
    display: block;
}

.checkout-identity-cta-copy strong {
    font-size: 13px;
}

.checkout-identity-cta-copy small {
    margin-top: 3px;
    color: var(--checkout-muted);
    font-size: 10px;
}

.checkout-identity-cta-count {
    min-width: 24px;
    height: 24px;
    padding: 0 7px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: #c88612;
    color: #fff;
    box-sizing: border-box;
    font-size: 11px;
    font-weight: 900;
}

.checkout-identity-cta-arrow {
    color: #91a3b1;
    font-size: 10px;
}

.checkout-alert {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 15px;
    padding: 13px 16px;
    border: 1px solid #cbdbe8;
    border-radius: 14px;
    background: #eef6fc;
    color: #285a7e;
    font-size: 14px;
}

.checkout-alert.is-success { border-color: #bfe4cf; background: #edf9f2; color: #18794e; }
.checkout-alert.is-error { border-color: #efc5c5; background: #fff2f2; color: #a23030; }
.checkout-alert.is-demo { border-color: #eadcae; background: #fffae9; color: #755a12; }
.checkout-alert[hidden] { display: none; }

.checkout-toolbar {
    position: relative;
    gap: 12px;
    margin-bottom: 16px;
}

.checkout-button,
.checkout-filter-panel button {
    width: auto;
    min-height: 48px;
    padding: 0 18px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    border: 1px solid #cbd8e4;
    border-radius: 13px;
    background: #fff;
    color: var(--checkout-navy);
    font-size: 14px;
    font-weight: 800;
    box-shadow: 0 3px 10px rgba(23, 50, 77, .04);
}

.checkout-filter-button strong {
    display: grid;
    width: 20px;
    height: 20px;
    place-items: center;
    border-radius: 50%;
    background: var(--checkout-navy);
    color: #fff;
    font-size: 11px;
}

.checkout-filter-wrap { position: relative; }

.checkout-filter-panel {
    position: absolute;
    top: calc(100% + 9px);
    left: 0;
    z-index: 50;
    width: min(380px, calc(100vw - 40px));
    max-height: min(680px, calc(100vh - 210px));
    overflow-y: auto;
    display: none;
    border: 1px solid var(--checkout-line);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 20px 48px rgba(23, 50, 77, .18);
}

.checkout-filter-panel.is-open { display: block; }

.checkout-filter-section {
    padding: 20px 22px;
    border-bottom: 1px solid #edf1f5;
}

.checkout-filter-label {
    display: block;
    margin-bottom: 10px;
    color: #94a1af;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .055em;
    text-transform: uppercase;
}

.checkout-filter-section > label {
    min-height: 42px;
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--checkout-navy);
    font-size: 15px;
    cursor: pointer;
}

.checkout-filter-section > label input { position: absolute; opacity: 0; pointer-events: none; }
.checkout-filter-section > label span { flex: 1; }
.checkout-filter-section > label:has(input:checked) { font-weight: 800; }
.checkout-filter-section > label .checkout-filter-indicator { flex: 0 0 18px; width: 18px; height: 18px; }

.checkout-custom-dates {
    display: none;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 8px;
}

.checkout-custom-dates.is-visible { display: grid; }
.checkout-custom-dates label { color: var(--checkout-muted); font-size: 11px; font-weight: 700; }
.checkout-custom-dates input { margin: 6px 0 0; padding: 10px; border-radius: 10px; font-size: 13px; }

.checkout-filter-actions {
    padding: 14px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.checkout-filter-actions a { color: var(--checkout-muted); font-size: 13px; font-weight: 700; text-decoration: none; }
.checkout-filter-actions button { min-height: 40px; border: 0; background: var(--checkout-navy); color: #fff; }
.checkout-filter-section-compact { padding-block: 15px; }
.checkout-filter-section > .checkout-checkbox-option { min-height: 30px; gap: 10px; font-size: 13px; font-weight: 700; }
.checkout-filter-section > .checkout-checkbox-option input { position: static; width: 18px; height: 18px; margin: 0; opacity: 1; pointer-events: auto; accent-color: var(--checkout-navy); }

.checkout-search {
    position: relative;
    min-width: 260px;
    flex: 1;
}

.checkout-search > i {
    position: absolute;
    top: 50%;
    left: 17px;
    color: #8ea0b1;
    transform: translateY(-50%);
}

.checkout-search input[type="search"] {
    height: 48px;
    margin: 0;
    padding: 0 48px 0 45px;
    border-color: #d2dde7;
    border-radius: 13px;
    background: #fff;
    color: var(--checkout-navy);
    font-size: 14px;
}

.checkout-search a {
    position: absolute;
    top: 50%;
    right: 15px;
    color: #8ea0b1;
    transform: translateY(-50%);
}

.checkout-sync-form { margin: 0; }
.checkout-sync-form > input { display: none; }
.checkout-sync-button { color: #fff; border-color: var(--checkout-navy); background: var(--checkout-navy); }
.checkout-page.is-syncing { overflow: hidden; }
.checkout-page .loading-overlay { backdrop-filter: blur(3px); }
.checkout-page .loading-box { width: min(340px, calc(100% - 48px)); box-sizing: border-box; }

.checkout-table-card {
    overflow: hidden;
    border: 1px solid var(--checkout-line);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(23, 50, 77, .06);
}

.checkout-table-summary {
    justify-content: space-between;
    padding: 16px 20px;
    border-bottom: 1px solid var(--checkout-line);
    color: var(--checkout-muted);
    font-size: 13px;
}

.checkout-table-summary strong { color: var(--checkout-navy); }
.checkout-result-range { color: #91a0ae; }
.checkout-page-size { display: flex; align-items: center; gap: 7px; }
.checkout-page-size label, .checkout-page-size span { color: var(--checkout-muted); font-size: 12px; }
.checkout-page-size select { width: auto; min-width: 62px; height: 34px; padding: 0 27px 0 10px; border: 1px solid #cfdae4; border-radius: 9px; background-color: #fff; color: var(--checkout-navy); font: inherit; font-weight: 800; }
.checkout-table-scroll { overflow-x: auto; }
.checkout-table { width: 100%; border-collapse: collapse; color: var(--checkout-navy); }
.checkout-table th {
    padding: 15px 18px;
    border-bottom: 1px solid var(--checkout-line);
    background: #edf3f8;
    color: #667b8f;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .035em;
    text-align: left;
    text-transform: uppercase;
    white-space: nowrap;
}

.checkout-table td {
    padding: 18px;
    border-bottom: 1px solid #e8eef3;
    font-size: 14px;
    vertical-align: middle;
}

.checkout-table tbody tr:last-child td { border-bottom: 0; }
.checkout-table tbody tr:hover { background: #f8fbfd; }
.checkout-table td strong { display: block; font-size: 14px; }
.checkout-table td small { display: block; margin-top: 5px; color: #8494a4; font-size: 11px; }
.checkout-guests { display: inline-flex; align-items: center; gap: 7px; font-weight: 700; }

.checkout-pms-status,
.checkout-workflow {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-weight: 800;
    white-space: nowrap;
}

.checkout-pms-status::before {
    content: '';
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #3b82b6;
}

.checkout-pms-status.is-canceled::before { background: #c65d5d; }
.checkout-pms-status.is-checked_out::before { background: #6f8193; }
.checkout-guest-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #667b8f;
    font-size: 12px;
    font-weight: 800;
    white-space: nowrap;
}
.checkout-guest-status i { font-size: 7px; }
.checkout-guest-status.is-complete { color: #168052; }
.checkout-guest-status.is-warning { color: #9a650d; }
.checkout-guest-status.is-error { color: #ac443a; }
.checkout-guest-status.is-info { color: #245ea8; }
.checkout-guest-status.is-muted { color: #718394; }
.checkout-workflow { color: #596e82; }
.checkout-workflow.is-completed { color: #168052; }
.checkout-workflow.is-booking_unpaid,
.checkout-workflow.is-keys_error,
.checkout-workflow.is-stats_error,
.checkout-workflow.is-id_verification_failed,
.checkout-workflow.is-police_checkin_error,
.checkout-workflow.is-police_checkout_error,
.checkout-workflow.is-authority_reporting_error { color: #ac443a; }
.checkout-workflow.is-keys_generated { color: #216b9d; }
.checkout-authority-status { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.checkout-authority-status i { font-size: 7px; }
.checkout-authority-status.is-pending { color: #876612; }
.checkout-authority-status.is-complete { color: #168052; }
.checkout-authority-status.is-error { color: #ac443a; }
.checkout-rate { color: #785c16 !important; }
.checkout-rate i { margin-right: 5px; }
.checkout-eligibility.is-ready { color: #168052 !important; }

.checkout-row-action button,
.checkout-row-action a {
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 10px;
    background: #edf3f8;
    color: #8da0b2;
    display: grid;
    place-items: center;
    text-decoration: none;
}

.checkout-booking-row { cursor: pointer; }
.checkout-booking-row:focus { outline: 3px solid rgba(43, 107, 157, .18); outline-offset: -3px; }
.checkout-booking-primary-link { color: inherit; text-decoration: none; }

.checkout-empty { padding: 70px 20px; color: var(--checkout-muted); text-align: center; }
.checkout-empty > span { width: 58px; height: 58px; margin: 0 auto 15px; display: grid; place-items: center; border-radius: 18px; background: #eaf2f8; color: var(--checkout-blue); font-size: 24px; }
.checkout-empty h3 { margin: 0; color: var(--checkout-navy); }
.checkout-empty p { margin: 8px 0 0; }
.checkout-pagination { padding: 14px 18px; display: flex; align-items: center; justify-content: flex-end; gap: 12px; border-top: 1px solid var(--checkout-line); background: #fbfdff; color: var(--checkout-muted); font-size: 12px; }
.checkout-pagination strong { color: var(--checkout-navy); }
.checkout-pagination-arrow { width: 34px; height: 34px; display: grid; place-items: center; border: 1px solid #d2dde7; border-radius: 9px; background: #fff; color: var(--checkout-navy); text-decoration: none; }
.checkout-pagination-arrow.is-disabled { opacity: .4; pointer-events: none; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

@media (max-width: 900px) {
    .checkout-heading { align-items: flex-start; }
    .checkout-heading-actions { align-items: flex-end; flex-direction: column; }
    .checkout-heading-meta { align-items: flex-start; }
    .checkout-toolbar { flex-wrap: wrap; }
    .checkout-search { order: 3; flex-basis: 100%; }
    .checkout-sync-form { margin-left: auto; }
}

@media (max-width: 680px) {
    .checkout-shell { width: min(100% - 24px, 1480px); margin-top: 20px; }
    .checkout-heading { flex-direction: column; gap: 12px; }
    .checkout-heading-actions { width: 100%; align-items: stretch; gap: 10px; }
    .checkout-identity-cta { min-width: 0; }
    .checkout-heading h2 { font-size: 26px; }
    .checkout-button { padding-inline: 14px; }
    .checkout-table-summary { padding: 14px 16px; }
    .checkout-table-summary { align-items: flex-start; flex-direction: column; gap: 10px; }
    .checkout-table thead { display: none; }
    .checkout-table, .checkout-table tbody, .checkout-table tr, .checkout-table td { display: block; width: 100%; box-sizing: border-box; }
    .checkout-table tr { padding: 10px 16px; border-bottom: 1px solid var(--checkout-line); }
    .checkout-table tr:last-child { border-bottom: 0; }
    .checkout-table td { padding: 9px 0 9px 42%; border: 0; position: relative; }
    .checkout-table td::before { content: attr(data-label); position: absolute; left: 0; top: 10px; width: 38%; color: #8091a1; font-size: 10px; font-weight: 800; letter-spacing: .035em; text-transform: uppercase; }
    .checkout-row-action { display: none !important; }
    .checkout-pagination { justify-content: center; }
}

/* PMS room housekeeping */
.room-housekeeping-panel {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    margin-bottom: 18px;
    padding: 17px 18px;
    border: 1px solid #dce6ed;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 7px 22px rgba(23, 50, 77, .06);
    color: #65758b;
}

.room-housekeeping-panel.is-complete {
    border-color: #bfe4cf;
    background: #f4fbf7;
    color: #18794e;
}

.room-housekeeping-panel.is-warning {
    border-color: #ead39b;
    background: #fffbef;
    color: #92600e;
}

.room-housekeeping-panel.is-error {
    border-color: #efc5c5;
    background: #fff7f7;
    color: #a23030;
}

.room-housekeeping-panel-icon {
    display: grid;
    width: 46px;
    height: 46px;
    place-items: center;
    border-radius: 14px;
    background: rgba(255, 255, 255, .82);
    box-shadow: inset 0 0 0 1px rgba(23, 50, 77, .08);
    font-size: 18px;
}

.room-housekeeping-panel-copy {
    display: grid;
    min-width: 0;
}

.room-housekeeping-panel-copy small {
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.room-housekeeping-panel-copy strong {
    margin-top: 2px;
    color: #17324d;
    font-size: 17px;
}

.room-housekeeping-panel-copy span {
    margin-top: 2px;
    font-size: 12px;
    font-weight: 700;
}

.room-housekeeping-action {
    min-height: 46px;
    margin: 0;
    padding: 0 16px;
    border: 0;
    border-radius: 12px;
    background: #18794e;
    color: #fff;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

.room-housekeeping-action i { margin-right: 7px; }

.room-housekeeping-feedback {
    grid-column: 2 / -1;
    margin: -3px 0 0;
    color: #18794e;
    font-size: 12px;
    font-weight: 700;
}

.room-cleaning-open { overflow: hidden; }
.room-cleaning-modal[hidden] { display: none; }

.room-cleaning-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: center;
    padding: 20px;
}

.room-cleaning-backdrop {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: rgba(12, 29, 44, .58);
    backdrop-filter: blur(3px);
}

.room-cleaning-dialog {
    position: relative;
    z-index: 1;
    width: min(520px, 100%);
    max-height: min(720px, calc(100vh - 40px));
    overflow: hidden;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 30px 75px rgba(5, 20, 33, .28);
}

.room-cleaning-handle { display: none; }

.room-cleaning-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    padding: 23px 24px 17px;
    border-bottom: 1px solid #e9eef2;
}

.room-cleaning-heading small {
    color: #18794e;
    font-size: 10px;
    font-weight: 900;
    letter-spacing: .065em;
    text-transform: uppercase;
}

.room-cleaning-heading h2 {
    margin: 4px 0 0;
    color: #17324d;
    font-size: 22px;
    line-height: 1.2;
}

.room-cleaning-heading p {
    margin: 8px 0 0;
    color: #687b8c;
    font-size: 13px;
    line-height: 1.45;
}

.room-cleaning-close {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    margin: 0;
    padding: 0;
    place-items: center;
    border: 1px solid #d7e0e7;
    border-radius: 11px;
    background: #fff;
    color: #647789;
    cursor: pointer;
}

.room-cleaner-options {
    display: grid;
    gap: 9px;
    max-height: 360px;
    overflow-y: auto;
    padding: 17px 24px;
}

.room-cleaner-loading {
    padding: 28px 12px;
    color: #718394;
    text-align: center;
}

.room-cleaner-option {
    position: relative;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    min-height: 60px;
    padding: 8px 12px;
    border: 1px solid #dce5ec;
    border-radius: 14px;
    background: #fff;
    color: #17324d;
    cursor: pointer;
}

.room-cleaner-option:has(input:checked) {
    border-color: #54a67f;
    background: #eff9f4;
    box-shadow: inset 0 0 0 1px #54a67f;
}

.room-cleaner-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.room-cleaner-avatar {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 12px;
    background: #e8f3ed;
    color: #18794e;
    font-size: 15px;
    font-weight: 900;
}

.room-cleaner-option strong {
    min-width: 0;
    overflow: hidden;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.room-cleaner-indicator {
    width: 20px;
    height: 20px;
    border: 2px solid #b9c7d2;
    border-radius: 50%;
    box-sizing: border-box;
}

.room-cleaner-option:has(input:checked) .room-cleaner-indicator {
    border: 6px solid #18794e;
}

.room-cleaning-error {
    margin: 0 24px 12px;
    padding: 11px 13px;
    border: 1px solid #efc5c5;
    border-radius: 11px;
    background: #fff2f2;
    color: #a23030;
    font-size: 12px;
    font-weight: 700;
}

.room-cleaning-actions {
    display: grid;
    grid-template-columns: minmax(100px, .65fr) minmax(180px, 1fr);
    gap: 10px;
    padding: 15px 24px calc(17px + env(safe-area-inset-bottom));
    border-top: 1px solid #e9eef2;
    background: #fbfcfd;
}

.room-cleaning-actions button {
    min-height: 48px;
    margin: 0;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
}

.room-cleaning-cancel {
    border: 1px solid #ccd8e1;
    background: #fff;
    color: #5f7283;
}

.room-cleaning-submit {
    border: 0;
    background: #18794e;
    color: #fff;
}

.room-cleaning-submit i { margin-right: 7px; }
.room-cleaning-submit:disabled { cursor: not-allowed; opacity: .45; }
.room-cleaning-submit.is-loading i { animation: fa-spin 1s infinite linear; }

@media (max-width: 680px) {
    .room-housekeeping-panel {
        grid-template-columns: auto minmax(0, 1fr);
        gap: 10px 12px;
        margin-bottom: 14px;
        padding: 14px;
        border-radius: 16px;
    }

    .room-housekeeping-panel-icon {
        width: 40px;
        height: 40px;
        border-radius: 12px;
        font-size: 16px;
    }

    .room-housekeeping-panel-copy strong { font-size: 15px; }

    .room-housekeeping-action {
        grid-column: 1 / -1;
        width: 100%;
        min-height: 48px;
    }

    .room-housekeeping-feedback {
        grid-column: 1 / -1;
        margin-top: 0;
    }

    .room-cleaning-modal {
        align-items: end;
        padding: 0;
    }

    .room-cleaning-dialog {
        width: 100%;
        max-height: min(88vh, 760px);
        border-radius: 22px 22px 0 0;
    }

    .room-cleaning-handle {
        display: block;
        width: 42px;
        height: 5px;
        margin: 9px auto 0;
        border-radius: 999px;
        background: #c8d2da;
    }

    .room-cleaning-heading { padding: 14px 18px 13px; }
    .room-cleaning-heading h2 { font-size: 19px; }
    .room-cleaning-heading p { font-size: 12px; }
    .room-cleaner-options { max-height: 42vh; padding: 13px 16px; }
    .room-cleaner-option { min-height: 58px; }
    .room-cleaning-error { margin-inline: 16px; }
    .room-cleaning-actions {
        grid-template-columns: 1fr 1.45fr;
        padding: 12px 16px calc(12px + env(safe-area-inset-bottom));
    }
}

/* Guest check-in settings */
.checkout-settings-shell {
    width: min(1120px, calc(100% - 40px));
    margin: 30px auto 70px;
}

.checkout-settings-heading {
    margin-bottom: 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.checkout-settings-heading h2 { margin: 0; color: var(--checkout-navy); font-size: 30px; letter-spacing: -.02em; }
.checkout-settings-heading p { margin: 7px 0 0; color: var(--checkout-muted); }
.checkout-settings-tabs { margin-bottom: 22px; padding: 5px; display: inline-flex; gap: 4px; border: 1px solid var(--checkout-line); border-radius: 14px; background: #eef3f7; }
.checkout-settings-tabs a { padding: 10px 14px; display: inline-flex; align-items: center; gap: 8px; border-radius: 10px; color: #65788a; font-size: 12px; font-weight: 800; text-decoration: none; }
.checkout-settings-tabs a.is-active { background: #fff; color: var(--checkout-navy); box-shadow: 0 3px 10px rgba(23, 50, 77, .1); }
.checkout-settings-security { display: inline-flex; align-items: center; gap: 8px; padding: 9px 12px; border-radius: 999px; background: #eaf6ef; color: #18794e; font-size: 12px; font-weight: 800; white-space: nowrap; }
.checkout-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.checkout-authority-toggle-card { margin-bottom: 18px; }
.checkout-authority-settings[hidden] { display: none; }
.checkout-settings-card { padding: 24px; border: 1px solid var(--checkout-line); border-radius: 19px; background: #fff; box-shadow: 0 7px 24px rgba(23, 50, 77, .055); }
.checkout-settings-card-wide { grid-column: 1 / -1; }
.checkout-settings-card-header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 22px; }
.checkout-settings-card-header > span:first-child { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 13px; background: #eaf2f8; color: var(--checkout-blue); }
.checkout-settings-card-header h3 { margin: 1px 0 4px; color: var(--checkout-navy); font-size: 18px; }
.checkout-settings-card-header p { margin: 0; color: var(--checkout-muted); font-size: 13px; line-height: 1.45; }
.checkout-provider-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.checkout-provider-option { position: relative; min-height: 76px; padding: 15px; display: flex; align-items: center; gap: 12px; border: 1px solid #d6e1ea; border-radius: 15px; background: #fbfdff; cursor: pointer; box-sizing: border-box; }
.checkout-provider-option > input { position: absolute; opacity: 0; pointer-events: none; }
.checkout-provider-option:has(input:checked) { border-color: #3c769f; background: #f0f7fc; box-shadow: inset 0 0 0 1px #3c769f; }
.checkout-provider-option:has(input:focus-visible), .checkout-filter-section > label:has(input:focus-visible) { outline: 3px solid rgba(43, 107, 157, .24); outline-offset: 2px; }
.checkout-provider-mark { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 12px; background: #e7f2fa; color: #2b6b9d; font-size: 18px; }
.checkout-provider-mark.is-demo { background: #fff7dc; color: #907018; }
.checkout-provider-mark.is-future { background: #edf0f3; color: #8796a5; }
.checkout-provider-option strong, .checkout-provider-option small { display: block; }
.checkout-provider-option strong { color: var(--checkout-navy); font-size: 14px; }
.checkout-provider-option small { margin-top: 4px; color: var(--checkout-muted); font-size: 11px; }
.checkout-option-indicator { position: relative; flex: 0 0 20px; width: 20px; height: 20px; margin-left: auto; border: 2px solid #9eb2c3; border-radius: 50%; background: #fff; box-sizing: border-box; transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease; }
label:has(input:checked) > .checkout-option-indicator { border-color: #2b6b9d; background: #2b6b9d; box-shadow: 0 0 0 3px rgba(43, 107, 157, .1); }
label:has(input:checked) > .checkout-option-indicator::after { content: "✓"; position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font: 800 12px/1 system-ui, sans-serif; }
.checkout-provider-option.is-disabled { cursor: default; opacity: .7; }
.checkout-identity-toggle-options, .checkout-identity-mode-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.checkout-identity-mode-options { min-width: 0; padding: 0; margin: 0; border: 0; }
.checkout-provider-mark.is-off { background: #eef1f4; color: #65788a; }
.checkout-provider-mark.is-manual { background: #fff3df; color: #a96100; }
.checkout-identity-disabled-note { margin-top: 18px; }
.checkout-coming-badge { margin-left: auto; padding: 5px 7px; border-radius: 999px; background: #edf0f3; color: #6f8193; font-size: 9px; font-weight: 800; text-transform: uppercase; }
.checkout-cloudbeds-settings { transition: opacity .18s ease; }
.checkout-cloudbeds-settings.is-inactive { opacity: .48; }
.checkout-settings-field { display: block; margin-bottom: 18px; }
.checkout-settings-field > span { display: block; margin-bottom: 8px; color: var(--checkout-navy); font-size: 13px; font-weight: 800; }
.checkout-settings-field > span em { color: #8b99a7; font-size: 10px; font-style: normal; font-weight: 700; text-transform: uppercase; }
.checkout-settings-field input { margin: 0; padding: 13px 14px; border-radius: 12px; font-size: 14px; }
.checkout-settings-field > small { display: block; margin-top: 7px; color: var(--checkout-muted); font-size: 11px; line-height: 1.4; }
.checkout-secret-field { position: relative; }
.checkout-secret-field input { padding-right: 48px; }
.checkout-secret-field button { position: absolute; top: 50%; right: 6px; width: 38px; height: 38px; padding: 0; border: 0; border-radius: 10px; background: #edf3f8; color: var(--checkout-navy); transform: translateY(-50%); }
.checkout-remove-secret { margin: -7px 0 18px; display: flex; align-items: center; gap: 8px; color: #a13c36; font-size: 12px; font-weight: 700; }
.checkout-remove-secret input { width: auto; margin: 0; }
.checkout-auth-note { margin: 4px 0 15px; padding: 13px; display: flex; align-items: flex-start; gap: 10px; border: 1px solid #cfe0ec; border-radius: 13px; background: #f1f7fb; color: #3f6078; }
.checkout-auth-note i { margin-top: 2px; color: #2b6b9d; }
.checkout-auth-note p { margin: 0; font-size: 11px; line-height: 1.5; }
.checkout-doc-link { display: inline-flex; align-items: center; gap: 7px; color: #2b6b9d; font-size: 12px; font-weight: 800; text-decoration: none; }
.checkout-connection-status { padding: 16px; display: flex; align-items: center; gap: 13px; border: 1px solid #dbe4eb; border-radius: 14px; background: #f7f9fb; }
.checkout-connection-status > span { color: #8091a1; font-size: 24px; }
.checkout-connection-status strong, .checkout-connection-status small { display: block; }
.checkout-connection-status strong { color: var(--checkout-navy); font-size: 14px; }
.checkout-connection-status small { margin-top: 5px; color: var(--checkout-muted); font-size: 11px; line-height: 1.4; }
.checkout-connection-status.is-connected { border-color: #bee1cc; background: #f0faf4; }
.checkout-connection-status.is-connected > span { color: #188252; }
.checkout-connection-status.is-error { border-color: #ebc6c4; background: #fff5f4; }
.checkout-connection-status.is-error > span { color: #b1433c; }
.checkout-last-tested { margin: 10px 2px 0; color: var(--checkout-muted); font-size: 11px; }
.checkout-settings-fields-row { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.checkout-number-field { display: flex; align-items: center; border: 1px solid #d9e2ec; border-radius: 12px; overflow: hidden; }
.checkout-number-field input { min-width: 0; border: 0; border-radius: 0; }
.checkout-number-field b { padding: 0 13px; color: #748596; font-size: 11px; white-space: nowrap; }
.checkout-inline-check { margin-top: 9px; display: flex; align-items: center; gap: 8px; color: var(--checkout-muted); font-size: 11px; font-weight: 700; }
.checkout-inline-check input { width: auto; margin: 0; }
.checkout-branding-layout { display: grid; grid-template-columns: minmax(240px, .8fr) minmax(0, 1.2fr); gap: 22px; align-items: stretch; }
.checkout-branding-fields { padding: 18px; border: 1px solid #dbe4eb; border-radius: 15px; background: #f8fbfd; }
.checkout-branding-fields .checkout-settings-field:last-child { margin-bottom: 0; }
.checkout-branding-assets { min-width: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.checkout-brand-upload { min-width: 0; padding: 13px; display: flex; flex-direction: column; gap: 7px; border: 1px solid #dbe4eb; border-radius: 15px; background: #fff; color: var(--checkout-navy); cursor: pointer; }
.checkout-brand-upload strong { font-size: 13px; }
.checkout-brand-upload small { color: var(--checkout-muted); font-size: 10px; line-height: 1.4; }
.checkout-brand-upload input { width: 100%; min-width: 0; margin: auto 0 0; padding: 9px; border-radius: 10px; font-size: 11px; }
.checkout-brand-preview { width: 100%; min-height: 126px; display: grid; place-items: center; border-radius: 11px; background: linear-gradient(135deg, #eaf2f8, #d9e6ef); background-position: center; background-repeat: no-repeat; background-size: cover; color: #7890a4; font-size: 24px; }
.checkout-brand-preview.is-logo { background-size: contain; }
.checkout-brand-preview.has-image i { visibility: hidden; }
.checkout-dev-settings { border-color: #d8c7ee; background: linear-gradient(135deg, #fff, #faf7ff); }
.checkout-dev-settings .checkout-settings-card-header > span:first-child { background: #eee5f8; color: #7045a0; }
.checkout-settings-actions { position: sticky; bottom: 12px; z-index: 20; margin-top: 20px; padding: 15px 18px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border: 1px solid #cfdae4; border-radius: 16px; background: rgba(255, 255, 255, .96); box-shadow: 0 14px 36px rgba(23, 50, 77, .14); backdrop-filter: blur(8px); }
.checkout-settings-actions > span { color: var(--checkout-muted); font-size: 12px; }
.checkout-settings-actions > div { display: flex; gap: 9px; }
.checkout-settings-actions button { width: auto; min-height: 44px; padding: 0 16px; border-radius: 11px; font-size: 13px; }
.checkout-settings-secondary { border: 1px solid #ccd8e2; background: #fff; color: var(--checkout-navy); }
.checkout-settings-primary { background: var(--checkout-navy); color: #fff; }
.payments-master-form { margin-bottom: 18px; }
.payments-master-card .checkout-settings-card-header { align-items: center; }
.payments-master-state {
    width: auto !important;
    height: auto !important;
    margin-left: auto;
    padding: 7px 10px;
    display: inline-flex !important;
    border-radius: 999px !important;
    background: #edf1f4 !important;
    color: #65788a !important;
    font-size: 10px;
    font-weight: 900;
    text-transform: uppercase;
}
.payments-master-state.is-enabled { background: #e6f6ed !important; color: #19754e !important; }
.payments-card-actions, .payments-connection-actions, .payments-order-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}
.payments-card-actions > span, .payments-connection-actions > span, .payments-order-heading span {
    color: var(--checkout-muted);
    font-size: 11px;
    line-height: 1.45;
}
.payments-card-actions button, .payments-connection-actions button, .payments-order-heading button { width: auto; }
.payments-cutover-action {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
}
.payments-cutover-action .checkout-inline-check { margin: 0; }
.payments-inline-warning {
    margin: 0 0 15px;
    padding: 12px 14px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px solid #ead7a1;
    border-radius: 12px;
    background: #fff9e8;
    color: #856315;
    font-size: 12px;
    font-weight: 750;
}
.payments-inline-warning.is-error { border-color: #ebc6c4; background: #fff5f4; color: #a13c36; }
.payments-key-status {
    margin-bottom: 18px;
    padding: 14px 17px;
    display: flex;
    align-items: center;
    gap: 13px;
    border: 1px solid #d8e2ea;
    border-radius: 15px;
    background: #f8fafc;
}
.payments-key-status > i { color: #718397; font-size: 20px; }
.payments-key-status strong, .payments-key-status span { display: block; }
.payments-key-status strong { color: var(--checkout-navy); font-size: 13px; }
.payments-key-status span { margin-top: 3px; color: var(--checkout-muted); font-size: 11px; }
.payments-key-status.is-ready { border-color: #bee1cc; background: #f0faf4; }
.payments-key-status.is-ready > i { color: #188252; }
.payments-key-status.is-pending { border-color: #cbddeb; background: #f1f7fb; }
.payments-key-status.is-pending > i { color: #2b6b9d; }
.payments-key-status.is-required { border-color: #ebc6c4; background: #fff5f4; }
.payments-key-status.is-required > i { color: #b1433c; }
.payments-settings-layout { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(310px, .85fr); gap: 18px; align-items: start; }
.payments-connections-card, .payments-add-card { min-width: 0; }
.payments-empty-state {
    min-height: 180px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 7px;
    border: 1px dashed #cbd8e3;
    border-radius: 15px;
    background: #f9fbfc;
    text-align: center;
}
.payments-empty-state i { margin-bottom: 4px; color: #7c91a4; font-size: 28px; }
.payments-empty-state strong { color: var(--checkout-navy); font-size: 14px; }
.payments-empty-state span { max-width: 380px; color: var(--checkout-muted); font-size: 11px; }
.payments-order-form { margin-bottom: 18px; padding: 15px; border: 1px solid #d9e4ec; border-radius: 15px; background: #f7fafc; }
.payments-order-heading { margin-bottom: 12px; }
.payments-order-heading strong, .payments-order-heading span { display: block; }
.payments-order-heading strong { color: var(--checkout-navy); font-size: 13px; }
.payments-order-list { margin: 0; padding: 0; display: grid; gap: 8px; list-style: none; }
.payments-order-list li {
    padding: 10px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #dce5ec;
    border-radius: 12px;
    background: #fff;
}
.payments-order-list li > span:nth-of-type(3) { min-width: 0; }
.payments-order-list strong, .payments-order-list small { display: block; }
.payments-order-list strong { overflow: hidden; color: var(--checkout-navy); font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.payments-order-list small { margin-top: 2px; color: var(--checkout-muted); font-size: 9px; }
.payments-order-position { flex: 0 0 24px; color: #6d8193; font-size: 11px; font-weight: 900; text-align: center; }
.payments-provider-logo { flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #eaf2f8; color: #2b6b9d; }
.payments-order-controls { margin-left: auto; display: flex; gap: 5px; }
.payments-order-controls button { width: 31px; height: 31px; padding: 0; border: 1px solid #d6e1e9; border-radius: 8px; background: #fff; color: #506a7e; }
.payments-order-controls button:disabled { opacity: .35; cursor: default; }
.payments-connection-list { display: grid; gap: 10px; }
.payments-connection { border: 1px solid #d9e3eb; border-radius: 14px; background: #fff; overflow: hidden; }
.payments-connection > summary { padding: 13px; display: flex; align-items: center; gap: 11px; cursor: pointer; list-style: none; }
.payments-connection > summary::-webkit-details-marker { display: none; }
.payments-connection[open] > summary { border-bottom: 1px solid #e1e8ee; background: #f9fbfc; }
.payments-connection-summary { min-width: 0; margin-right: auto; }
.payments-connection-summary strong, .payments-connection-summary small { display: block; }
.payments-connection-summary strong { overflow: hidden; color: var(--checkout-navy); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.payments-connection-summary small { margin-top: 3px; color: var(--checkout-muted); font-size: 10px; }
.payments-badge, .payments-health { padding: 5px 7px; border-radius: 999px; background: #edf1f4; color: #66798a; font-size: 8px; font-weight: 900; text-transform: uppercase; white-space: nowrap; }
.payments-badge.is-enabled, .payments-health.is-healthy { background: #e6f6ed; color: #19754e; }
.payments-health.is-unhealthy { background: #fdeaea; color: #a13c36; }
.payments-details-chevron { color: #8799a8; font-size: 11px; transition: transform .15s ease; }
.payments-connection[open] .payments-details-chevron { transform: rotate(180deg); }
.payments-connection-form { padding: 17px; }
.payments-readonly-context { margin-bottom: 16px; padding: 10px 12px; display: flex; flex-wrap: wrap; gap: 16px; border-radius: 11px; background: #f2f6f9; }
.payments-readonly-context span { color: #6c7f90; font-size: 10px; }
.payments-readonly-context b { margin-right: 5px; color: #40596d; }
.payments-secret-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 14px; }
.payments-secret-grid .checkout-settings-field:last-child { grid-column: 1 / -1; }
.payments-webhook-url input { color: #3d566b; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 10px; }
.payments-removal-options { margin: -4px 0 14px; display: flex; flex-wrap: wrap; gap: 8px 14px; }
.payments-removal-options label { display: flex; align-items: center; gap: 6px; color: #a13c36; font-size: 10px; font-weight: 750; }
.payments-removal-options input { width: auto; margin: 0; }
.payments-connection-toggle { margin-top: 4px; }
.payments-connection-actions > div { display: flex; gap: 8px; }
.payments-danger-button { width: auto; border: 1px solid #e5bdb9; background: #fff5f4; color: #a13c36; }
.payments-add-card select { width: 100%; padding: 13px 14px; border: 1px solid #d9e2ec; border-radius: 12px; background: #fff; color: var(--checkout-navy); }
.payments-add-button { width: 100%; }
.payments-provider-roadmap { margin-top: 18px; padding-top: 15px; display: grid; gap: 7px; border-top: 1px solid #e0e7ed; }
.payments-provider-roadmap strong { margin-bottom: 2px; color: var(--checkout-navy); font-size: 11px; text-transform: uppercase; }
.payments-provider-roadmap span { display: flex; align-items: center; gap: 7px; color: var(--checkout-muted); font-size: 10px; }
.payments-provider-roadmap i { width: 12px; color: #2b6b9d; text-align: center; }
.deposit-settings-heading { margin-top: 42px; }
.deposit-property-selector { margin-bottom: 18px; padding: 15px 18px; display: flex; align-items: end; gap: 12px; border: 1px solid #d5e0e8; border-radius: 16px; background: #f5f8fa; }
.deposit-property-selector .checkout-settings-field { min-width: 280px; margin: 0; }
.deposit-property-selector select { width: 100%; height: 44px; padding: 0 38px 0 13px; border: 1px solid #d3dee7; border-radius: 11px; background: #fff; color: var(--checkout-navy); font: inherit; font-size: 13px; }
.deposit-policy-master-card .checkout-settings-card-header { align-items: center; }
.deposit-policy-version { width: auto !important; height: auto !important; margin-left: auto; padding: 6px 9px; border-radius: 999px !important; background: #edf2f6 !important; color: #62778a !important; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.deposit-choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.deposit-choice-grid.is-stacked { grid-template-columns: 1fr; }
.deposit-choice { position: relative; min-height: 72px; padding: 12px; display: flex; align-items: flex-start; gap: 9px; border: 1px solid #d8e2ea; border-radius: 12px; background: #fbfdff; cursor: pointer; box-sizing: border-box; }
.deposit-choice:has(input:checked) { border-color: #6d9cbb; background: #f0f7fc; box-shadow: inset 0 0 0 1px rgba(43,107,157,.15); }
.deposit-choice input { flex: 0 0 auto; width: 16px; height: 16px; margin: 2px 0 0; accent-color: #2b6b9d; }
.deposit-choice strong, .deposit-choice small { display: block; }
.deposit-choice strong { color: var(--checkout-navy); font-size: 12px; }
.deposit-choice small { margin-top: 4px; color: var(--checkout-muted); font-size: 9px; line-height: 1.4; }
.deposit-release-days { margin: 16px 0 0; }
.deposit-release-days[hidden] { display: none; }
.deposit-portfolio-order { margin-top: 15px; padding: 12px; border: 1px solid #dce5ec; border-radius: 12px; background: #f7fafc; }
.deposit-portfolio-order > strong { display: block; margin-bottom: 8px; color: var(--checkout-navy); font-size: 10px; text-transform: uppercase; }
.deposit-portfolio-order > span { color: var(--checkout-muted); font-size: 10px; }
.deposit-portfolio-order ol { margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; counter-reset: deposit-provider; }
.deposit-portfolio-order li { padding: 7px 9px; display: flex; align-items: center; gap: 5px; border-radius: 9px; background: #fff; color: var(--checkout-navy); font-size: 10px; counter-increment: deposit-provider; }
.deposit-portfolio-order li::before { content: counter(deposit-provider); color: #71879a; font-size: 9px; font-weight: 900; }
.deposit-portfolio-order li small { color: var(--checkout-muted); font-size: 8px; }
.deposit-custom-provider-order { min-width: 0; margin: 15px 0 0; padding: 12px; border: 1px solid #dce5ec; border-radius: 12px; }
.deposit-custom-provider-order[disabled] { display: none; }
.deposit-custom-provider-order legend { padding: 0 6px; color: var(--checkout-navy); font-size: 10px; font-weight: 900; text-transform: uppercase; }
.deposit-provider-order-list li { padding: 8px; }
.deposit-provider-check { min-width: 0; display: flex; align-items: center; gap: 8px; cursor: pointer; }
.deposit-provider-check > input { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; accent-color: #2b6b9d; }
.deposit-provider-check > span:last-child { min-width: 0; }
.deposit-provider-help { display: block; margin-top: 10px; color: var(--checkout-muted); font-size: 9px; line-height: 1.45; }
.deposit-copy-card { margin-top: 18px; }
.deposit-copy-heading, .deposit-copy-actions { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.deposit-copy-heading { margin-bottom: 11px; }
.deposit-copy-heading .checkout-inline-check { margin: 0; }
.deposit-copy-heading > span, .deposit-copy-actions > span { color: var(--checkout-muted); font-size: 10px; }
.deposit-copy-targets { max-height: 330px; padding: 8px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px; overflow-y: auto; border: 1px solid #dce5ec; border-radius: 13px; background: #f8fafc; }
.deposit-copy-targets > label { min-width: 0; padding: 10px; display: flex; align-items: center; gap: 9px; border: 1px solid #dce5ec; border-radius: 10px; background: #fff; cursor: pointer; }
.deposit-copy-targets > label:has(input:checked) { border-color: #76a5c4; background: #eef7fc; }
.deposit-copy-targets input { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; accent-color: #2b6b9d; }
.deposit-copy-targets span { min-width: 0; }
.deposit-copy-targets strong, .deposit-copy-targets small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.deposit-copy-targets strong { color: var(--checkout-navy); font-size: 11px; }
.deposit-copy-targets small { margin-top: 3px; color: var(--checkout-muted); font-size: 8px; }
.deposit-copy-actions { margin-top: 13px; }
.deposit-copy-actions button { width: auto; min-height: 42px; padding: 0 14px; border-radius: 10px; }
.checkout-room-types-list { display: grid; gap: 12px; }
.checkout-room-type-row { padding: 17px; display: grid; grid-template-columns: minmax(240px, .9fr) minmax(320px, 1.1fr); gap: 24px; align-items: center; border: 1px solid #dce5ec; border-radius: 15px; background: #fbfdff; }
.checkout-room-type-row .checkout-settings-field { margin: 0; }
.checkout-room-type-source > span, .checkout-room-type-source > strong, .checkout-room-type-source > small { display: block; }
.checkout-room-type-source > span { margin-bottom: 6px; color: #81909e; font-size: 9px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.checkout-room-type-source > strong { color: var(--checkout-navy); font-size: 13px; line-height: 1.45; }
.checkout-room-type-source > small { margin-top: 5px; color: #93a0ac; font-size: 9px; }
.checkout-translation-state { width: fit-content; margin-top: 12px; padding: 6px 8px; display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; font-size: 9px; font-weight: 900; }
.checkout-translation-state.is-complete { background: #e6f6ed; color: #19754e; }
.checkout-translation-state.is-missing { background: #fff0e7; color: #a35225; }
.checkout-room-translations { min-width: 0; display: grid; gap: 9px; }
.checkout-room-translation-row { min-width: 0; padding: 8px; display: grid; grid-template-columns: minmax(145px, .65fr) minmax(210px, 1.35fr) 86px; align-items: center; gap: 8px; border: 1px solid #dbe5ec; border-radius: 12px; background: #fff; transition: border-color .15s ease, background-color .15s ease; }
.checkout-room-translation-row.is-missing { border-color: #efc8b1; background: #fff9f5; }
.checkout-room-translation-row label { min-width: 0; }
.checkout-room-translation-row select, .checkout-room-translation-row input { width: 100%; min-width: 0; height: 40px; margin: 0; padding: 0 10px; border: 1px solid #d6e0e8; border-radius: 9px; background: #fff; color: var(--checkout-navy); font: inherit; font-size: 11px; box-sizing: border-box; }
.checkout-room-translation-row input:focus, .checkout-room-translation-row select:focus { border-color: #3c769f; outline: 3px solid rgba(43, 107, 157, .12); }
.checkout-translation-row-state { color: #668093; font-size: 9px; font-weight: 900; text-align: right; }
.checkout-room-translation-row.is-missing .checkout-translation-row-state { color: #b45c2b; }
.checkout-room-types-empty { padding: 22px; display: flex; align-items: center; gap: 15px; border: 1px dashed #c7d4df; border-radius: 15px; background: #f8fafc; color: #6d7f90; }
.checkout-room-types-empty > i { font-size: 22px; }
.checkout-room-types-empty strong { color: var(--checkout-navy); font-size: 13px; }
.checkout-room-types-empty p { margin: 5px 0 0; font-size: 11px; }
.checkout-language-overview { margin-bottom: 16px; padding: 16px 18px; display: grid; grid-template-columns: 120px 1fr; align-items: center; gap: 18px; border: 1px solid #d5e3ec; border-radius: 15px; background: #f4f9fc; }
.checkout-language-overview > div { text-align: center; }
.checkout-language-overview strong, .checkout-language-overview span { display: block; }
.checkout-language-overview strong { color: var(--checkout-blue); font-size: 30px; line-height: 1; }
.checkout-language-overview span { margin-top: 5px; color: #6d7f90; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.checkout-language-overview p { margin: 0; color: var(--checkout-muted); font-size: 11px; line-height: 1.55; }
.checkout-language-search { position: relative; margin-bottom: 12px; display: block; }
.checkout-language-search i { position: absolute; top: 50%; left: 14px; color: #8092a1; transform: translateY(-50%); }
.checkout-language-search input { width: 100%; height: 44px; margin: 0; padding: 0 14px 0 40px; border: 1px solid #d5e0e8; border-radius: 12px; background: #fff; font: inherit; font-size: 12px; box-sizing: border-box; }
.checkout-language-search input:focus { border-color: #3c769f; outline: 3px solid rgba(43, 107, 157, .12); }
.checkout-language-list { max-height: 560px; padding: 8px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; overflow-y: auto; border: 1px solid #dce5ec; border-radius: 15px; background: #f8fafc; }
.checkout-language-option { min-width: 0; min-height: 58px; padding: 9px 10px; display: grid; grid-template-columns: 20px 28px minmax(0, 1fr) auto; align-items: center; gap: 8px; border: 1px solid #dce5ec; border-radius: 11px; background: #fff; cursor: pointer; }
.checkout-language-option:has(input:checked) { border-color: #76a5c4; background: #eef7fc; box-shadow: inset 0 0 0 1px rgba(43,107,157,.12); }
.checkout-language-option input { width: 17px; height: 17px; margin: 0; accent-color: #2b6b9d; }
.checkout-language-option .guest-language-flag { font-size: 19px; }
.checkout-language-name { min-width: 0; }
.checkout-language-name strong, .checkout-language-name small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.checkout-language-name strong { color: var(--checkout-navy); font-size: 11px; }
.checkout-language-name small { margin-top: 3px; color: #8796a3; font-size: 8px; }
.checkout-language-coverage { padding: 5px 6px; border-radius: 999px; background: #edf0f3; color: #778795; font-size: 8px; font-weight: 900; white-space: nowrap; }
.checkout-language-coverage.is-translated { background: #e4f5eb; color: #19754e; }
.checkout-language-empty { margin-top: 12px; }
.checkout-guest-section-actions { position: static; box-shadow: 0 8px 24px rgba(23, 50, 77, .08); }
.checkout-property-selector-card { margin-top: 22px; }
.checkout-property-overview { margin-bottom: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; }
.checkout-property-overview > div { min-height: 72px; padding: 12px; display: grid; place-content: center; border: 1px solid #dce6ed; border-radius: 12px; background: #f6fafc; text-align: center; box-sizing: border-box; }
.checkout-property-overview strong { color: var(--checkout-blue); font-size: 22px; line-height: 1; }
.checkout-property-overview span { margin-top: 6px; color: #758796; font-size: 9px; font-weight: 900; text-transform: uppercase; }
.checkout-property-picker { display: grid; gap: 7px; }
.checkout-property-picker > label { color: var(--checkout-navy); font-size: 11px; font-weight: 900; }
.checkout-property-picker > div { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; }
.checkout-property-picker select { width: 100%; height: 44px; padding: 0 38px 0 12px; border: 1px solid #cfdce5; border-radius: 11px; background: #fff; color: var(--checkout-navy); font: inherit; font-size: 12px; font-weight: 800; box-sizing: border-box; }
.checkout-property-picker select:focus { border-color: #3c769f; outline: 3px solid rgba(43, 107, 157, .12); }
.checkout-property-picker button { min-height: 44px; padding: 0 15px; border-radius: 11px; }
.checkout-property-picker > small { color: var(--checkout-muted); font-size: 9px; }
.checkout-guest-properties-form { margin-top: 14px; }
.checkout-property-default-submit { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; border: 0; opacity: 0; pointer-events: none; }
.checkout-property-editor-heading { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.checkout-property-editor-heading > div { min-width: 0; }
.checkout-property-editor-heading h3, .checkout-property-editor-heading p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.checkout-guest-property-status { padding: 6px 8px; display: inline-flex; align-items: center; gap: 5px; border-radius: 999px; background: #edf1f4; color: #71818e; font-size: 9px; font-weight: 900; white-space: nowrap; }
.checkout-guest-property-status.is-configured { background: #e4f5eb; color: #19754e; }
.checkout-property-editor-body { display: grid; gap: 14px; }
.checkout-property-module { padding: 16px; border: 1px solid #dfe7ed; border-radius: 13px; background: #fff; }
.checkout-property-module-heading { margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.checkout-property-module-heading > span { width: 34px; height: 34px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; background: #edf5fa; color: var(--checkout-blue); }
.checkout-property-module-heading h4 { margin: 0; color: var(--checkout-navy); font-size: 12px; }
.checkout-property-module-heading p { margin: 4px 0 0; color: var(--checkout-muted); font-size: 10px; line-height: 1.4; }
.checkout-property-module .checkout-settings-field { margin-bottom: 0; }
.checkout-property-bulk-action { margin-top: 13px; padding: 12px 13px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border: 1px solid #d8e5ed; border-radius: 11px; background: #f4f9fc; }
.checkout-property-bulk-action > div { min-width: 0; flex: 1 1 auto; }
.checkout-property-bulk-action strong, .checkout-property-bulk-action small { display: block; }
.checkout-property-bulk-action strong { color: var(--checkout-navy); font-size: 10px; }
.checkout-property-bulk-action small { margin-top: 4px; color: var(--checkout-muted); font-size: 9px; line-height: 1.4; }
.checkout-property-bulk-action button { width: auto; max-width: 100%; min-width: 0; min-height: 38px; padding: 9px 12px; flex: 0 1 auto; border-radius: 10px; font-size: 10px; line-height: 1.25; white-space: normal; box-sizing: border-box; }
.checkout-property-gallery { margin-bottom: 13px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; }
.checkout-property-gallery-image { position: relative; min-width: 0; padding: 6px; display: grid; gap: 6px; border: 1px solid #dce5ec; border-radius: 11px; background: #f9fbfc; }
.checkout-property-gallery-image img { width: 100%; aspect-ratio: 4 / 3; display: block; border-radius: 8px; object-fit: cover; background: #e8eef2; }
.checkout-property-gallery-image > span:last-child { display: flex; align-items: center; gap: 6px; color: #8b4d4d; font-size: 9px; font-weight: 800; }
.checkout-property-gallery-image .checkout-property-gallery-scope { position: absolute; top: 11px; left: 11px; z-index: 1; padding: 4px 6px; border-radius: 999px; background: rgba(23, 50, 77, .86); color: #fff; font-size: 8px; font-weight: 900; line-height: 1; }
.checkout-property-gallery-image input { width: 15px; height: 15px; margin: 0; accent-color: #a64d4d; }
.checkout-property-gallery-empty { margin-bottom: 13px; min-height: 58px; padding: 12px; display: flex; align-items: center; justify-content: center; gap: 8px; border: 1px dashed #cedae3; border-radius: 11px; background: #f9fbfc; color: #7e909e; font-size: 10px; }
.checkout-property-gallery-upload { min-height: 66px; padding: 12px 14px; display: flex; align-items: center; gap: 12px; border: 1px dashed #b9cbd8; border-radius: 12px; background: #f7fbfd; color: var(--checkout-blue); cursor: pointer; }
.checkout-property-gallery-upload > i { font-size: 20px; }
.checkout-property-gallery-upload > span { min-width: 0; flex: 1; }
.checkout-property-gallery-upload strong, .checkout-property-gallery-upload small { display: block; }
.checkout-property-gallery-upload strong { color: var(--checkout-navy); font-size: 11px; }
.checkout-property-gallery-upload small { margin-top: 4px; color: var(--checkout-muted); font-size: 9px; }
.checkout-property-gallery-upload input { max-width: 250px; margin: 0; font-size: 10px; }
.checkout-property-file-selection { margin-top: 8px; color: var(--checkout-muted); font-size: 9px; }
.checkout-property-scope { margin: 13px 0 0; padding: 0; border: 0; }
.checkout-property-scope legend { margin-bottom: 8px; color: var(--checkout-navy); font-size: 10px; font-weight: 900; }
.checkout-property-scope-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.checkout-property-scope-options label { min-width: 0; padding: 11px; display: flex; align-items: flex-start; gap: 9px; border: 1px solid #d9e3ea; border-radius: 11px; background: #fff; cursor: pointer; }
.checkout-property-scope-options label:has(input:checked) { border-color: #76a5c4; background: #eef7fc; box-shadow: inset 0 0 0 1px rgba(43,107,157,.1); }
.checkout-property-scope-options input { width: 16px; height: 16px; margin: 1px 0 0; flex: 0 0 auto; accent-color: #2b6b9d; }
.checkout-property-scope-options strong, .checkout-property-scope-options small { display: block; }
.checkout-property-scope-options strong { color: var(--checkout-navy); font-size: 10px; }
.checkout-property-scope-options small { margin-top: 4px; color: var(--checkout-muted); font-size: 9px; line-height: 1.35; }
.checkout-property-extension-note { padding: 11px 13px; display: flex; align-items: center; gap: 9px; border: 1px dashed #d2dce4; border-radius: 11px; color: #718493; font-size: 9px; line-height: 1.4; }
.checkout-property-extension-note i { color: #8ca0ae; }
.checkout-room-visibility-form { margin-top: 18px; }
.checkout-pms-room-visibility { padding: 24px; }
.checkout-room-visibility-summary { margin-bottom: 12px; display: flex; align-items: center; justify-content: space-between; gap: 16px; color: var(--checkout-muted); font-size: 11px; }
.checkout-room-visibility-summary strong { color: var(--checkout-navy); font-size: 13px; }
.checkout-room-visibility-list { max-height: 480px; display: grid; overflow-y: auto; border: 1px solid #dce5ec; border-radius: 15px; background: #fbfdff; }
.checkout-room-visibility-row { min-height: 68px; padding: 12px 15px; display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid #e3eaf0; box-sizing: border-box; }
.checkout-room-visibility-row:last-child { border-bottom: 0; }
.checkout-room-visibility-copy { min-width: 0; }
.checkout-room-visibility-copy strong, .checkout-room-visibility-copy small { display: block; }
.checkout-room-visibility-copy strong { color: var(--checkout-navy); font-size: 14px; }
.checkout-room-visibility-copy small { margin-top: 4px; overflow: hidden; color: #8a99a7; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.checkout-room-visibility-toggle { flex: 0 0 auto; display: flex; align-items: center; gap: 10px; color: #5d7183; font-size: 11px; font-weight: 800; cursor: pointer; }
.checkout-room-visibility-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.checkout-room-visibility-toggle i { position: relative; width: 42px; height: 24px; display: block; border-radius: 999px; background: #b9c5cf; box-shadow: inset 0 0 0 1px rgba(23, 50, 77, .08); transition: background-color .16s ease, box-shadow .16s ease; }
.checkout-room-visibility-toggle i::after { content: ""; position: absolute; top: 3px; left: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgba(23, 50, 77, .22); transition: transform .16s ease; }
.checkout-room-visibility-toggle input:checked + i { background: #2b6b9d; }
.checkout-room-visibility-toggle input:checked + i::after { transform: translateX(18px); }
.checkout-room-visibility-toggle input:focus-visible + i { outline: 3px solid rgba(43, 107, 157, .24); outline-offset: 2px; }
.checkout-room-visibility-actions { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.checkout-room-visibility-actions > span { color: var(--checkout-muted); font-size: 11px; }
.checkout-room-visibility-actions button { width: auto; min-height: 42px; padding: 0 15px; border-radius: 11px; font-size: 12px; }

@media (max-width: 820px) {
    .checkout-settings-grid { grid-template-columns: 1fr; }
    .checkout-settings-card-wide { grid-column: auto; }
    .checkout-provider-options, .checkout-settings-fields-row, .checkout-branding-layout { grid-template-columns: 1fr; }
    .payments-settings-layout, .payments-secret-grid { grid-template-columns: 1fr; }
    .payments-secret-grid .checkout-settings-field:last-child { grid-column: auto; }
    .checkout-room-type-row { grid-template-columns: 1fr; gap: 15px; }
    .checkout-language-list { grid-template-columns: 1fr; }
    .checkout-property-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .checkout-property-scope-options { grid-template-columns: 1fr; }
    .checkout-settings-actions { align-items: stretch; flex-direction: column; }
    .checkout-settings-actions > div { display: grid; grid-template-columns: 1fr 1fr; }
    .checkout-settings-actions button { width: 100%; }
    .deposit-copy-targets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .checkout-room-visibility-summary, .checkout-room-visibility-actions { align-items: stretch; flex-direction: column; }
    .checkout-room-visibility-actions button { width: 100%; }
}

@media (max-width: 560px) {
    .checkout-settings-shell { width: calc(100% - 24px); margin-top: 20px; }
    .checkout-settings-heading { align-items: flex-start; flex-direction: column; }
    .checkout-settings-card { padding: 19px; }
    .checkout-settings-tabs { width: 100%; overflow-x: auto; box-sizing: border-box; }
    .checkout-settings-tabs a { flex: 0 0 auto; justify-content: center; text-align: center; white-space: nowrap; }
    .checkout-settings-actions > div { grid-template-columns: 1fr; }
    .payments-card-actions, .payments-connection-actions, .payments-order-heading { align-items: stretch; flex-direction: column; }
    .payments-card-actions button, .payments-connection-actions button, .payments-order-heading button { width: 100%; }
    .payments-cutover-action { align-items: stretch; flex-direction: column; }
    .payments-connection-actions > div { display: grid; grid-template-columns: 1fr; width: 100%; }
    .payments-connection > summary { align-items: flex-start; flex-wrap: wrap; }
    .payments-connection-summary { flex: 1 1 calc(100% - 54px); }
    .payments-badge { margin-left: 49px; }
    .deposit-property-selector { align-items: stretch; flex-direction: column; }
    .deposit-property-selector .checkout-settings-field { width: 100%; min-width: 0; }
    .deposit-choice-grid, .deposit-copy-targets { grid-template-columns: 1fr; }
    .deposit-provider-order-list li { align-items: flex-start; }
    .deposit-copy-actions { align-items: stretch; flex-direction: column; }
    .deposit-copy-actions button { width: 100%; }
    .checkout-room-translation-row { grid-template-columns: 1fr; }
    .checkout-translation-row-state { text-align: left; }
    .checkout-language-overview { grid-template-columns: 1fr; }
    .checkout-language-option { grid-template-columns: 20px 28px minmax(0, 1fr); }
    .checkout-language-coverage { grid-column: 3; width: fit-content; }
    .checkout-property-overview { grid-template-columns: 1fr; }
    .checkout-property-overview > div { min-height: 58px; }
    .checkout-property-picker > div { grid-template-columns: 1fr; }
    .checkout-property-editor-heading, .checkout-property-bulk-action { align-items: stretch; flex-direction: column; }
    .checkout-property-editor-heading h3, .checkout-property-editor-heading p { white-space: normal; }
    .checkout-property-bulk-action button { width: 100%; }
    .checkout-property-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .checkout-property-gallery-upload { align-items: flex-start; flex-wrap: wrap; }
    .checkout-property-gallery-upload input { max-width: 100%; }
    .checkout-branding-assets { grid-template-columns: 1fr; }
    .checkout-room-visibility-row { align-items: flex-start; flex-direction: column; gap: 11px; }
    .checkout-room-visibility-toggle { width: 100%; justify-content: space-between; }
}

/* Reservation detail */
.checkout-reservation-shell { width: min(1180px, calc(100% - 40px)); margin: 26px auto 70px; }
.checkout-detail-breadcrumb { margin-bottom: 18px; display: flex; align-items: center; gap: 9px; color: #8a99a7; font-size: 12px; }
.checkout-detail-breadcrumb a { display: inline-flex; align-items: center; gap: 7px; color: var(--checkout-blue); font-weight: 800; text-decoration: none; }
.checkout-detail-hero { margin-bottom: 18px; padding: 23px 26px; display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid var(--checkout-line); border-radius: 19px; background: linear-gradient(135deg, #fff, #f5f9fc); box-shadow: 0 8px 26px rgba(23, 50, 77, .055); }
.checkout-reservation-hero { align-items: stretch; }
.checkout-reservation-hero-main { flex: 1 1 auto; min-width: 0; }
.checkout-reservation-eyebrow { display: inline-flex; align-items: center; gap: 7px; margin-bottom: 8px; color: #6f8192; font-size: 10px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.checkout-reservation-eyebrow i { color: var(--checkout-blue); }
.checkout-detail-title-row { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.checkout-detail-title-row h1 { margin: 0; color: var(--checkout-navy); font-size: 30px; letter-spacing: -.025em; }
.checkout-detail-hero p { margin: 8px 0 0; color: var(--checkout-muted); font-size: 14px; }
.checkout-detail-hero p span { padding: 0 5px; color: #b0bcc7; }
.checkout-detail-status, .checkout-detail-pill { display: inline-flex; align-items: center; width: fit-content; padding: 6px 9px; border-radius: 999px; background: #edf3f7; color: #627587; font-size: 11px; font-weight: 800; }
.checkout-detail-status.is-success, .checkout-detail-pill.is-success { background: #e9f7ef; color: #167a4e; }
.checkout-detail-status.is-pending, .checkout-detail-pill.is-pending { background: #fff5d9; color: #876612; }
.checkout-detail-status.is-error, .checkout-detail-pill.is-error { background: #fff0ef; color: #a93f37; }
.checkout-detail-status.is-muted, .checkout-detail-pill.is-muted { background: #edf0f3; color: #718191; }
.checkout-detail-reference { min-width: 180px; padding-left: 24px; border-left: 1px solid var(--checkout-line); text-align: right; }
.checkout-detail-reference span, .checkout-detail-reference small { display: block; color: var(--checkout-muted); font-size: 10px; }
.checkout-detail-reference strong { display: block; margin: 5px 0; color: var(--checkout-navy); font-size: 15px; }
.checkout-detail-reference a { margin-top: 9px; display: inline-flex; align-items: center; gap: 6px; color: var(--checkout-blue); font-size: 11px; font-weight: 800; text-decoration: none; }
.checkout-reservation-property-links { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 18px; }
.checkout-reservation-property-links > a,
.checkout-reservation-property-links > div { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 10px; min-width: 210px; padding: 10px 12px; border: 1px solid #d5e1e9; border-radius: 13px; background: rgba(255, 255, 255, .8); color: var(--checkout-navy); text-decoration: none; }
.checkout-reservation-property-links > a { transition: border-color .18s ease, box-shadow .18s ease; }
.checkout-reservation-property-links > a:hover { border-color: #9bbcd3; box-shadow: 0 7px 18px rgba(23, 50, 77, .08); }
.checkout-reservation-property-links > a > span,
.checkout-reservation-property-links > div > span { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #e7f0f7; color: var(--checkout-blue); }
.checkout-reservation-property-links small,
.checkout-reservation-property-links strong,
.checkout-reservation-property-links em { display: block; }
.checkout-reservation-property-links small { color: #7f8f9e; font-size: 8px; font-weight: 900; letter-spacing: .05em; text-transform: uppercase; }
.checkout-reservation-property-links strong { margin-top: 2px; font-size: 13px; }
.checkout-reservation-property-links em { margin-top: 2px; color: var(--checkout-muted); font-size: 9px; font-style: normal; }
.checkout-reservation-property-links > a > i { color: #8ba0b1; font-size: 10px; }
.checkout-reservation-contact-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 12px; }
.checkout-reservation-contact-actions a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid #dbe5ec; border-radius: 9px; background: #fff; color: #48657d; font-size: 10px; font-weight: 800; text-decoration: none; }
.checkout-reservation-contact-actions a:hover { border-color: #9bbcd3; color: var(--checkout-blue); }
.checkout-reservation-contact-actions a.is-whatsapp { border-color: #cce5d5; background: #f2faf5; color: #25774b; }
.checkout-reservation-reference { flex: 0 0 205px; display: flex; align-items: flex-end; flex-direction: column; justify-content: center; }
.checkout-reservation-readiness { margin-top: 12px; display: flex; align-items: flex-end; flex-direction: column; gap: 5px; }
.checkout-reservation-readiness .checkout-detail-pill { display: inline-flex; }
.checkout-reservation-reference > button { margin-top: 7px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; border: 1px solid #d5e1e9; border-radius: 9px; background: #fff; color: #536d82; font: inherit; font-size: 10px; font-weight: 800; cursor: pointer; }
.checkout-reservation-reference > button:hover,
.checkout-reservation-reference > button.is-copied { border-color: #9bbcd3; color: var(--checkout-blue); }
.checkout-detail-hero .checkout-reservation-link-pending { margin-top: 12px; display: flex; align-items: center; gap: 6px; color: #98711a; font-size: 10px; font-weight: 800; }
.checkout-detail-section { margin-bottom: 18px; padding: 25px 26px; border: 1px solid var(--checkout-line); border-radius: 19px; background: #fff; box-shadow: 0 7px 24px rgba(23, 50, 77, .05); }
.checkout-detail-section-heading { margin-bottom: 20px; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.checkout-detail-section-heading h2 { margin: 0; color: var(--checkout-navy); font-size: 18px; }
.checkout-detail-section-heading p { margin: 5px 0 0; color: var(--checkout-muted); font-size: 12px; line-height: 1.45; }
.checkout-readonly-badge, .checkout-detail-count { padding: 6px 9px; border-radius: 999px; background: #edf3f7; color: #667b8f; font-size: 10px; font-weight: 800; white-space: nowrap; }
.checkout-readonly-badge i { margin-right: 5px; }
.checkout-status-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.checkout-status-card { min-height: 120px; padding: 17px; display: flex; align-items: flex-start; gap: 12px; border: 1px solid #dbe5ed; border-radius: 15px; background: #fbfdff; box-sizing: border-box; }
button.checkout-status-card { width: 100%; color: inherit; font: inherit; text-align: left; cursor: pointer; }
.checkout-status-card > span { flex: 0 0 38px; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: #edf3f7; color: #687e91; }
.checkout-status-card small { display: block; margin: 1px 0 8px; color: #8291a0; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.checkout-status-card strong { display: block; color: var(--checkout-navy); font-size: 17px; }
.checkout-status-card p { margin: 5px 0 0; color: var(--checkout-muted); font-size: 10px; line-height: 1.35; }
.checkout-status-card.is-success { border-color: #c8e5d4; background: #f4fbf7; }
.checkout-status-card.is-success > span { background: #def3e7; color: #168052; }
.checkout-status-card.is-info { border-color: #cbdcf4; background: #f5f8ff; }
.checkout-status-card.is-info > span { background: #e3edfc; color: #245ea8; }
.checkout-status-card.is-pending { border-color: #eadfbf; background: #fffdf6; }
.checkout-status-card.is-pending > span { background: #fff2c8; color: #8b6911; }
.checkout-status-card.is-error { border-color: #ebcbc8; background: #fff7f6; }
.checkout-status-card.is-error > span { background: #ffe4e1; color: #ad4038; }
.checkout-status-card-link { position: relative; padding-right: 30px; color: inherit; text-decoration: none; transition: border-color .18s ease, box-shadow .18s ease; }
.checkout-status-card-link:hover { border-color: #8fb6d2; box-shadow: 0 9px 22px rgba(23, 50, 77, .09); }
.checkout-status-card-arrow { position: absolute; top: 20px; right: 14px; color: #91a3b1; font-size: 9px; }
.checkout-detail-table-wrap { overflow-x: auto; border: 1px solid #e0e7ed; border-radius: 14px; }
.checkout-detail-table { width: 100%; border-collapse: collapse; }
.checkout-detail-table th { padding: 13px 15px; background: #f2f6f9; color: #748596; font-size: 10px; font-weight: 800; text-align: left; text-transform: uppercase; white-space: nowrap; }
.checkout-detail-table td { padding: 15px; border-top: 1px solid #e4ebf0; color: var(--checkout-navy); font-size: 12px; vertical-align: middle; }
.checkout-detail-table td > strong, .checkout-detail-table td > small { display: block; }
.checkout-detail-table td > small { margin-top: 5px; color: var(--checkout-muted); font-size: 10px; }
.checkout-identity-cell { display: flex; align-items: flex-start; flex-direction: column; gap: 5px; }
.checkout-identity-cell > small { color: var(--checkout-muted); font-size: 9px; }
.checkout-detail-pill-link { gap: 6px; text-decoration: none; }
.checkout-detail-pill-link i { font-size: 8px; }
.checkout-guest-cell { display: flex; align-items: center; gap: 10px; min-width: 165px; }
.checkout-guest-cell > span { flex: 0 0 36px; width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: #eaf2f8; color: var(--checkout-blue); font-size: 11px; font-weight: 900; }
.checkout-detail-table tr.is-placeholder td { background: #fbfcfd; color: #718191; }
.checkout-detail-table tr.is-placeholder .checkout-guest-cell > span { background: #edf0f3; color: #8a98a5; }
.checkout-guest-cell strong, .checkout-guest-cell small { display: block; }
.checkout-guest-cell small { margin-top: 3px; color: var(--checkout-muted); font-size: 9px; }
.checkout-detail-columns { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.checkout-detail-columns .checkout-detail-section { min-width: 0; }
.checkout-detail-list { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.checkout-detail-list > div { padding: 12px 0; border-bottom: 1px solid #e8eef2; }
.checkout-detail-list > div:nth-last-child(-n+2) { border-bottom: 0; }
.checkout-detail-list > div:nth-child(odd) { padding-right: 15px; }
.checkout-detail-list > div:nth-child(even) { padding-left: 15px; border-left: 1px solid #edf1f4; }
.checkout-detail-list dt { margin-bottom: 6px; color: #81909e; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.checkout-detail-list dd { margin: 0; color: var(--checkout-navy); font-size: 13px; font-weight: 800; line-height: 1.4; }
.checkout-detail-list dd small { display: block; margin-top: 3px; color: var(--checkout-muted); font-size: 9px; font-weight: 400; }
.checkout-detail-list.is-compact { grid-template-columns: 1fr; }
.checkout-detail-list.is-compact > div { padding: 11px 0; border-bottom: 1px solid #e8eef2; border-left: 0; }
.checkout-detail-list.is-compact > div:last-child { border-bottom: 0; }
.checkout-detail-feature-status { margin-bottom: 8px; padding: 15px; display: flex; align-items: center; gap: 12px; border: 1px solid #dbe5ed; border-radius: 14px; background: #f8fafc; }
.checkout-detail-feature-status > span { flex: 0 0 40px; width: 40px; height: 40px; display: grid; place-items: center; border-radius: 12px; background: #eaf1f6; color: #60798d; }
.checkout-detail-feature-status strong, .checkout-detail-feature-status small { display: block; }
.checkout-detail-feature-status strong { color: var(--checkout-navy); font-size: 14px; }
.checkout-detail-feature-status small { margin-top: 4px; color: var(--checkout-muted); font-size: 10px; line-height: 1.4; }
.checkout-detail-feature-status.is-success { border-color: #c8e5d4; background: #f3fbf6; }
.checkout-detail-feature-status.is-success > span { background: #ddf2e6; color: #168052; }
.checkout-detail-feature-status.is-pending { border-color: #e9dfc1; background: #fffdf7; }
.checkout-detail-feature-status.is-pending > span { background: #fff1c7; color: #876612; }
.checkout-detail-feature-status.is-error { border-color: #eccbc8; background: #fff7f6; }
.checkout-detail-feature-status.is-error > span { background: #ffe4e1; color: #aa4038; }
.smart-access-shadow-notice, .smart-access-override-alert { margin: 13px 0; padding: 12px 13px; display: flex; align-items: flex-start; gap: 10px; border-radius: 12px; font-size: 11px; line-height: 1.5; }
.smart-access-shadow-notice { border: 1px solid #cfe0ee; background: #f3f8fc; color: #36566f; }
.smart-access-shadow-notice i { margin-top: 2px; color: #28739f; }
.smart-access-override-alert { border: 1px solid #ead59d; background: #fff9e9; color: #715510; }
.smart-access-override-alert i { margin-top: 2px; color: #a47a12; }
.smart-access-schedule-grid { margin-top: 14px; }
.smart-access-reservation-targets { margin: 14px 0; display: grid; gap: 8px; }
.smart-access-reservation-targets article { padding: 11px 12px; display: flex; align-items: center; gap: 10px; border: 1px solid #dfe8ef; border-radius: 12px; background: #fbfcfd; }
.smart-access-reservation-targets article > span { flex: 0 0 34px; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; background: #e9f2f8; color: #26739e; }
.smart-access-reservation-targets article div { min-width: 0; flex: 1; }
.smart-access-reservation-targets strong, .smart-access-reservation-targets small { display: block; }
.smart-access-reservation-targets strong { color: var(--checkout-navy); font-size: 12px; }
.smart-access-reservation-targets small { margin-top: 3px; color: var(--checkout-muted); font-size: 10px; }
.smart-access-reservation-targets b { padding: 4px 7px; border-radius: 8px; background: #edf6ec; color: #347540; font-size: 10px; white-space: nowrap; }
.smart-access-schedule-editor { margin-top: 15px; border: 1px solid #dce6ed; border-radius: 13px; background: #fbfcfd; overflow: hidden; }
.smart-access-schedule-editor > summary { padding: 12px 13px; color: var(--checkout-navy); cursor: pointer; font-size: 12px; font-weight: 750; list-style: none; }
.smart-access-schedule-editor > summary::-webkit-details-marker { display: none; }
.smart-access-schedule-editor > summary i { margin-right: 7px; color: #28739f; }
.smart-access-schedule-editor form { padding: 13px; display: grid; gap: 11px; border-top: 1px solid #e2eaf0; }
.smart-access-schedule-editor form > label, .smart-access-schedule-fields label { display: grid; gap: 5px; color: #365064; font-size: 10px; font-weight: 700; }
.smart-access-schedule-editor input[type="datetime-local"], .smart-access-schedule-editor input[type="text"], .smart-access-schedule-editor textarea { width: 100%; box-sizing: border-box; padding: 10px 11px; border: 1px solid #cfdce6; border-radius: 10px; background: #fff; color: var(--checkout-navy); font: inherit; font-size: 12px; }
.smart-access-schedule-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.smart-access-override-confirm { grid-template-columns: auto 1fr !important; align-items: flex-start; gap: 8px !important; font-weight: 500 !important; line-height: 1.45; }
.smart-access-override-confirm input { margin-top: 2px; }
.smart-access-schedule-editor button { justify-self: start; padding: 9px 12px; border: 0; border-radius: 10px; background: var(--checkout-navy); color: #fff; cursor: pointer; font-size: 11px; font-weight: 750; }
.smart-access-schedule-editor button i { margin-right: 5px; }
.smart-access-clear-override { background: #fff9f8; }
.smart-access-clear-override button { background: #91463f; }
.checkout-police-summary { display: grid; gap: 9px; }
.checkout-police-summary > div { padding: 13px 14px; display: flex; align-items: center; justify-content: space-between; gap: 15px; border: 1px solid #e1e8ee; border-radius: 12px; }
.checkout-police-summary span { color: var(--checkout-muted); font-size: 11px; }
.checkout-police-summary strong { color: var(--checkout-navy); font-size: 12px; }
.checkout-police-summary strong i { margin-right: 6px; font-size: 7px; }
.checkout-police-summary strong.is-success { color: #168052; }
.checkout-police-summary strong.is-pending { color: #876612; }
.checkout-police-summary strong.is-error { color: #a93f37; }
.checkout-authority-report-list { display: grid; gap: 12px; }
.checkout-authority-report { padding: 15px; border: 1px solid #e1e8ee; border-radius: 14px; background: #fbfdff; }
.checkout-authority-report.is-complete { border-color: #c8e5d4; background: #f5fbf7; }
.checkout-authority-report.is-error { border-color: #ebcbc8; background: #fff8f7; }
.checkout-authority-report-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.checkout-authority-report-heading small, .checkout-authority-report-heading strong { display: block; }
.checkout-authority-report-heading small { margin-bottom: 4px; color: #81909e; font-size: 9px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.checkout-authority-report-heading strong { color: var(--checkout-navy); font-size: 12px; }
.checkout-authority-report dl { margin: 13px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.checkout-authority-report dl > div { min-width: 0; padding: 9px; border-radius: 9px; background: rgba(234, 241, 246, .62); }
.checkout-authority-report dt { margin-bottom: 4px; color: #81909e; font-size: 8px; font-weight: 800; text-transform: uppercase; }
.checkout-authority-report dd { margin: 0; overflow-wrap: anywhere; color: var(--checkout-navy); font-size: 10px; font-weight: 800; }
.checkout-authority-response { margin: 10px 1px 0; color: var(--checkout-muted); font-size: 10px; line-height: 1.45; }
.checkout-authority-error { margin-top: 11px; padding: 10px; display: flex; align-items: flex-start; gap: 8px; border-radius: 10px; background: #ffe9e7; color: #a43c35; font-size: 10px; line-height: 1.45; }
.checkout-authority-error i { margin-top: 2px; }
.checkout-authority-retry { margin-top: 10px; }
.checkout-authority-retry button { padding: 9px 11px; border: 0; border-radius: 9px; background: #a7433c; color: #fff; font-size: 10px; font-weight: 800; }
.checkout-authority-retry button i { margin-right: 5px; }
.checkout-detail-muted { margin: 13px 2px 0; color: var(--checkout-muted); font-size: 11px; line-height: 1.5; }
.checkout-payment-summary { margin: 0; }
.checkout-payment-summary > div { padding: 12px 2px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid #e6edf2; }
.checkout-payment-summary > div:last-child { border-bottom: 0; }
.checkout-payment-summary dt { color: var(--checkout-muted); font-size: 12px; }
.checkout-payment-summary dd { margin: 0; color: var(--checkout-navy); font-size: 14px; font-weight: 800; }
.checkout-payment-summary .is-total { margin-top: 5px; padding-top: 16px; border-top: 2px solid #dce5ec; }
.checkout-payment-summary .is-total dt, .checkout-payment-summary .is-total dd { color: var(--checkout-navy); font-weight: 900; }
.checkout-deposit-operations { margin-top: 18px; display: grid; gap: 12px; }
.checkout-deposit-operation { padding: 15px; border: 1px solid #dce6ed; border-radius: 14px; background: #fbfdff; }
.checkout-deposit-operation.is-success { border-color: #c8e5d4; background: #f6fbf8; }
.checkout-deposit-operation.is-error { border-color: #eccbc8; background: #fff8f7; }
.checkout-deposit-operation > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.checkout-deposit-operation > header small, .checkout-deposit-operation > header strong { display: block; }
.checkout-deposit-operation > header small { margin-bottom: 4px; color: var(--checkout-muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.checkout-deposit-operation > header strong { color: var(--checkout-navy); font-size: 13px; }
.checkout-deposit-operation > header > span { padding: 5px 8px; border-radius: 999px; background: #eaf1f6; color: #60798d; font-size: 9px; font-weight: 900; white-space: nowrap; }
.checkout-deposit-operation > dl { margin: 13px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px 14px; }
.checkout-deposit-operation > dl > div { padding: 9px 0; border-bottom: 1px solid #e4ebf0; }
.checkout-deposit-operation dt { margin-bottom: 4px; color: var(--checkout-muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.checkout-deposit-operation dd { margin: 0; color: var(--checkout-navy); font-size: 11px; font-weight: 800; }
.checkout-payment-operation-button { width: 100%; margin-top: 12px; padding: 11px 13px; border: 0; border-radius: 10px; background: var(--checkout-navy); color: #fff; font: inherit; font-size: 10px; font-weight: 900; cursor: pointer; }
.checkout-payment-operation-button i { margin-right: 6px; }
.checkout-payment-warning { margin-top: 11px; padding: 10px; display: flex; align-items: flex-start; gap: 8px; border-radius: 10px; background: #ffe9e7; color: #a43c35; font-size: 10px; line-height: 1.45; }
.checkout-payment-warning i { margin-top: 2px; }
.checkout-payment-source-empty { margin-top: 16px; padding: 14px; display: flex; align-items: flex-start; gap: 11px; border: 1px solid #dce6ed; border-radius: 12px; background: #f7fafc; }
.checkout-payment-source-empty > i { margin-top: 2px; color: #60798d; }
.checkout-payment-source-empty strong, .checkout-payment-source-empty span { display: block; }
.checkout-payment-source-empty strong { color: var(--checkout-navy); font-size: 11px; }
.checkout-payment-source-empty span { margin-top: 4px; color: var(--checkout-muted); font-size: 9px; line-height: 1.45; }
.checkout-payment-timeline { margin-top: 11px; border-top: 1px solid #e1e8ee; }
.checkout-payment-timeline summary { padding-top: 11px; color: var(--checkout-blue); font-size: 9px; font-weight: 900; cursor: pointer; }
.checkout-payment-timeline summary span { margin-left: 4px; padding: 2px 5px; border-radius: 999px; background: #eaf1f6; }
.checkout-payment-timeline ol { margin: 12px 0 0; padding: 0; list-style: none; }
.checkout-payment-timeline li { padding: 0 0 12px; display: flex; align-items: flex-start; gap: 9px; }
.checkout-payment-timeline li > i { margin-top: 5px; color: #8bb8d1; font-size: 5px; }
.checkout-payment-timeline li strong, .checkout-payment-timeline li span { display: block; }
.checkout-payment-timeline li strong { color: var(--checkout-navy); font-size: 9px; line-height: 1.4; }
.checkout-payment-timeline li span { margin-top: 3px; color: var(--checkout-muted); font-size: 8px; }
.checkout-payment-link-workspace { margin-top: 18px; padding-top: 18px; border-top: 1px solid #dce6ed; }
.checkout-payment-link-workspace > .checkout-detail-section-heading { align-items: flex-start; }
.checkout-payment-link-create form { margin-top: 12px; }
.checkout-payment-link-actions { padding: 12px 0 0; }
.checkout-payment-link-workspace .smart-access-clear-override { margin-top: 10px; }
body.checkout-payment-modal-open { overflow: hidden; }
.checkout-payment-modal[hidden] { display: none; }
.checkout-payment-modal { position: fixed; z-index: 1100; inset: 0; padding: 20px; display: grid; place-items: center; }
.checkout-payment-modal-backdrop { position: absolute; inset: 0; width: 100%; border: 0; background: rgba(10, 29, 48, .68); backdrop-filter: blur(7px); cursor: pointer; }
.checkout-payment-dialog { position: relative; width: min(570px, 100%); max-height: calc(100vh - 40px); overflow-y: auto; border: 1px solid rgba(255,255,255,.42); border-radius: 20px; background: #fff; box-shadow: 0 28px 80px rgba(7,25,42,.38); }
.checkout-payment-dialog > header { padding: 20px 22px; display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; background: linear-gradient(125deg, #17324d, #276883); color: #fff; }
.checkout-payment-dialog > header span { color: #8ed3df; font-size: 9px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.checkout-payment-dialog > header h2 { margin: 5px 0; font-size: 23px; }
.checkout-payment-dialog > header p { margin: 0; color: rgba(255,255,255,.72); font-size: 10px; }
.checkout-payment-dialog > header > button { flex: 0 0 36px; width: 36px; height: 36px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.24); border-radius: 10px; background: rgba(255,255,255,.1); color: #fff; cursor: pointer; }
.checkout-payment-dialog form { padding: 20px 22px 22px; }
.checkout-payment-choice { margin: 0 0 17px; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; border: 0; }
.checkout-payment-choice legend { margin-bottom: 8px; color: var(--checkout-muted); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.checkout-payment-choice label { position: relative; }
.checkout-payment-choice input { position: absolute; opacity: 0; pointer-events: none; }
.checkout-payment-choice label > span { min-height: 78px; padding: 13px; display: block; border: 1px solid #dbe5ed; border-radius: 11px; cursor: pointer; }
.checkout-payment-choice input:checked + span { border-color: #4b8fb1; background: #eff8fb; box-shadow: 0 0 0 2px rgba(75,143,177,.13); }
.checkout-payment-choice strong, .checkout-payment-choice small { display: block; }
.checkout-payment-choice strong { color: var(--checkout-navy); font-size: 11px; }
.checkout-payment-choice small { margin-top: 5px; color: var(--checkout-muted); font-size: 8px; line-height: 1.45; }
.checkout-payment-field { margin-bottom: 14px; display: block; }
.checkout-payment-field > span { margin-bottom: 6px; display: block; color: var(--checkout-navy); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.checkout-payment-field > span b { color: var(--checkout-muted); font-weight: 700; text-transform: none; }
.checkout-payment-field input, .checkout-payment-field textarea { width: 100%; padding: 11px 12px; border: 1px solid #d3dfe7; border-radius: 10px; background: #fff; color: var(--checkout-navy); font: inherit; font-size: 11px; box-sizing: border-box; }
.checkout-payment-field textarea { resize: vertical; }
.checkout-payment-field > div { display: flex; align-items: stretch; }
.checkout-payment-field > div input { border-radius: 10px 0 0 10px; }
.checkout-payment-field > div strong { padding: 0 12px; display: grid; place-items: center; border: 1px solid #d3dfe7; border-left: 0; border-radius: 0 10px 10px 0; background: #f2f6f9; color: var(--checkout-muted); font-size: 10px; }
.checkout-payment-field > small { margin-top: 5px; display: block; color: var(--checkout-muted); font-size: 8px; }
.checkout-payment-confirm { padding: 11px; display: flex; align-items: flex-start; gap: 9px; border-radius: 10px; background: #fff8e7; color: #735712; font-size: 9px; line-height: 1.45; }
.checkout-payment-confirm input { margin-top: 1px; }
.checkout-payment-dialog form > footer { margin-top: 17px; display: flex; justify-content: flex-end; gap: 8px; }
.checkout-payment-dialog form > footer button { padding: 10px 13px; border: 0; border-radius: 9px; font: inherit; font-size: 9px; font-weight: 900; cursor: pointer; }
.checkout-payment-dialog form > footer button:first-child { background: #eaf1f4; color: var(--checkout-navy); }
.checkout-payment-dialog form > footer button:last-child { background: var(--checkout-navy); color: #fff; }
.checkout-booking-notes { margin: 0; color: #4e6375; font-size: 13px; line-height: 1.65; }
.checkout-cloudbeds-source-note { padding: 16px 19px; display: flex; align-items: center; gap: 13px; border: 1px solid #d1dfe9; border-radius: 15px; background: #f2f7fa; color: #477087; }
.checkout-cloudbeds-source-note > i { font-size: 20px; }
.checkout-cloudbeds-source-note strong, .checkout-cloudbeds-source-note span { display: block; }
.checkout-cloudbeds-source-note strong { color: var(--checkout-navy); font-size: 12px; }
.checkout-cloudbeds-source-note span { margin-top: 4px; color: var(--checkout-muted); font-size: 10px; }
.checkout-detail-empty { padding: 80px 20px; border: 1px solid var(--checkout-line); border-radius: 19px; background: #fff; text-align: center; }
.checkout-detail-empty > span { width: 58px; height: 58px; margin: 0 auto 15px; display: grid; place-items: center; border-radius: 18px; background: #eaf2f8; color: var(--checkout-blue); font-size: 22px; }
.checkout-detail-empty h1 { margin: 0; color: var(--checkout-navy); }
.checkout-detail-empty p { color: var(--checkout-muted); }
.checkout-detail-empty a { display: inline-flex; align-items: center; gap: 8px; color: var(--checkout-blue); font-size: 13px; font-weight: 800; text-decoration: none; }

@media (max-width: 940px) {
    .checkout-status-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .checkout-detail-columns { grid-template-columns: 1fr; gap: 0; }
}

@media (max-width: 650px) {
    .checkout-reservation-shell { width: calc(100% - 24px); margin-top: 18px; }
    .checkout-detail-hero { align-items: flex-start; flex-direction: column; padding: 20px; }
    .checkout-detail-reference { width: 100%; padding: 14px 0 0; border-top: 1px solid var(--checkout-line); border-left: 0; text-align: left; }
    .checkout-reservation-property-links { display: grid; }
    .checkout-reservation-property-links > a,
    .checkout-reservation-property-links > div { min-width: 0; width: 100%; box-sizing: border-box; }
    .checkout-reservation-contact-actions { display: grid; grid-template-columns: 1fr; }
    .checkout-reservation-contact-actions a { min-width: 0; overflow-wrap: anywhere; }
    .checkout-reservation-reference { align-items: flex-start; box-sizing: border-box; }
    .checkout-reservation-readiness { align-items: flex-start; }
    .checkout-detail-section { padding: 20px 17px; }
    .checkout-detail-section-heading { flex-direction: column; gap: 10px; }
    .smart-access-schedule-fields { grid-template-columns: 1fr; }
    .checkout-status-grid { grid-template-columns: 1fr; }
    .checkout-detail-list { grid-template-columns: 1fr; }
    .checkout-detail-list > div, .checkout-detail-list > div:nth-child(odd), .checkout-detail-list > div:nth-child(even) { padding: 11px 0; border-right: 0; border-bottom: 1px solid #e8eef2; border-left: 0; }
    .checkout-detail-list > div:last-child { border-bottom: 0; }
    .checkout-detail-table thead { display: none; }
    .checkout-detail-table, .checkout-detail-table tbody, .checkout-detail-table tr, .checkout-detail-table td { display: block; width: 100%; box-sizing: border-box; }
    .checkout-detail-table tr { padding: 9px 13px; border-bottom: 1px solid #e4ebf0; }
    .checkout-detail-table tr:last-child { border-bottom: 0; }
    .checkout-detail-table td { padding: 9px 0 9px 39%; border: 0; position: relative; }
    .checkout-detail-table td::before { content: attr(data-label); position: absolute; left: 0; top: 10px; width: 35%; color: #8291a0; font-size: 9px; font-weight: 800; text-transform: uppercase; }
    .checkout-payment-modal { padding: 0; align-items: end; }
    .checkout-payment-dialog { width: 100%; max-height: calc(100vh - 12px); border-radius: 20px 20px 0 0; }
    .checkout-payment-choice { grid-template-columns: 1fr; }
    .checkout-payment-dialog form > footer { align-items: stretch; flex-direction: column-reverse; }
    .checkout-payment-dialog form > footer button { width: 100%; }
}

.login-page {
    min-height: 100vh;
    background: linear-gradient(135deg, #eaf4ff, #f8fbff);
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-box {
    width: 100%;
    max-width: 390px;
    background: white;
    padding: 36px;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
    text-align: center;
}

.login-box h1 {
    margin-top: 0;
    color: #17324d;
    font-size: 34px;
}

.login-eyebrow {
    margin: 0 0 var(--sn-space-2);
    color: var(--sn-color-accent);
    font-size: var(--sn-text-xs);
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.login-subtitle {
    margin: calc(-1 * var(--sn-space-2)) 0 var(--sn-space-5);
    color: var(--sn-color-text-muted);
    font-size: var(--sn-text-sm);
    line-height: 1.5;
}

.app-locale-switcher {
    margin-top: var(--sn-space-6);
    padding-top: var(--sn-space-4);
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--sn-space-2);
    border-top: 1px solid var(--sn-color-border);
}

.app-locale-switcher a {
    padding: var(--sn-space-2) var(--sn-space-3);
    border-radius: var(--sn-radius-pill);
    color: var(--sn-color-text-muted);
    font-size: var(--sn-text-xs);
    font-weight: 800;
    text-decoration: none;
}

.app-locale-switcher a:hover,
.app-locale-switcher a[aria-current="true"] {
    background: var(--sn-color-brand-soft);
    color: var(--sn-color-brand);
}

.login-box form {
    display: grid;
    gap: var(--sn-space-4);
    text-align: left;
}

.login-box form .app-button {
    width: 100%;
}

input {
    width: 100%;
    padding: 15px;
    border: 1px solid #d9e2ec;
    border-radius: 14px;
    font-size: 16px;
    box-sizing: border-box;
    margin-bottom: 15px;
}

button {
    width: 100%;
    padding: 15px;
    border: none;
    border-radius: 14px;
    background: #17324d;
    color: white;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
}

.error {
    color: #b00020;
    margin-bottom: 15px;
}

.topbar {
    background: linear-gradient(135deg, #17324d, #2b5f8a);
    color: white;
    padding: 34px 28px;
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
    box-shadow: 0 12px 35px rgba(0,0,0,0.16);
}

.app-topbar {
    background: linear-gradient(135deg, var(--sn-color-brand), #2b5f8a);
    box-shadow: var(--sn-shadow-md);
}

.app-topbar__identity {
    min-width: 0;
}

.app-topbar__identity h1 {
    overflow-wrap: anywhere;
}

.app-topbar .topbar-actions {
    flex-wrap: nowrap;
}

.app-topbar .topbar-actions .logout {
    flex: 0 0 46px;
    width: 46px;
    min-width: 46px;
    height: 46px;
    min-height: 46px;
    padding: 0;
    border: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    box-sizing: border-box;
    cursor: pointer;
    line-height: 1;
}

.app-topbar .topbar-actions .app-topbar-action--labelled {
    flex: 0 1 auto;
    width: auto;
    min-width: max-content;
    padding-inline: 16px;
    gap: 8px;
    white-space: nowrap;
}

.app-topbar .topbar-actions .logout.is-active {
    background: rgba(255, 255, 255, 0.3);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.22);
}

.app-topbar .notification-wrapper {
    flex: 0 0 46px;
    width: 46px;
}

.app-topbar .notification-wrapper .notification-bell {
    width: 46px;
}

.notification-badge {
    position: absolute;
    top: -7px;
    right: -7px;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 2px solid #2b5f8a;
    border-radius: var(--sn-radius-pill);
    background: #dc2626;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    box-sizing: border-box;
}

@media (max-width: 1050px) {
    .app-topbar .topbar-inner {
        align-items: flex-start;
        flex-direction: column;
    }

    .app-topbar .topbar-actions {
        width: 100%;
        flex-wrap: wrap;
    }
}

@media (max-width: 650px) {
    .app-topbar .topbar-actions .logout,
    .app-topbar .topbar-actions .logout:first-child {
        flex: 0 0 42px;
        width: 42px;
        min-width: 42px;
        height: 42px;
        min-height: 42px;
        padding: 0;
    }

    .app-topbar .topbar-actions .app-topbar-action--labelled,
    .app-topbar .topbar-actions .logout:first-child.app-topbar-action--labelled {
        flex: 0 1 auto;
        width: auto;
        min-width: max-content;
        height: 42px;
        min-height: 42px;
        padding-inline: 13px;
    }

    .app-topbar .topbar-actions .app-topbar-action--labelled .action-text {
        display: inline;
    }

    .app-topbar .notification-wrapper,
    .app-topbar .notification-wrapper .notification-bell {
        width: 42px;
    }

    .app-topbar .notification-wrapper {
        flex: 0 0 42px;
    }
}

.topbar-inner {
    max-width: 1200px;
    margin: auto;
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
}

.topbar-actions {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}

body.modal-open {
    overflow: hidden;
}

.apps-modal {
    position: fixed;
    inset: 0;
    z-index: 3000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.apps-modal.is-open {
    display: flex;
}

.apps-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(11, 29, 46, 0.62);
    backdrop-filter: blur(3px);
}

.apps-modal-dialog {
    position: relative;
    width: min(100%, 620px);
    max-height: calc(100vh - 48px);
    overflow-y: auto;
    padding: 28px;
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 28px 70px rgba(11, 29, 46, 0.3);
}

.apps-modal-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.apps-modal-header h2 {
    margin: 0;
    color: #17324d;
    font-size: 28px;
}

.apps-modal-header p {
    margin: 6px 0 0;
    color: #667085;
    line-height: 1.45;
}

.apps-modal-close {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    padding: 0;
    border: 0;
    border-radius: 12px;
    background: #edf3f8;
    color: #17324d;
    font-size: 18px;
}

.apps-grid {
    display: grid;
    gap: 16px;
}

.app-card {
    display: flex;
    align-items: center;
    gap: 18px;
    min-height: 92px;
    padding: 18px;
    border: 1px solid #dbe5ee;
    border-radius: 18px;
    background: #fbfdff;
    color: #17324d;
    text-decoration: none;
    transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

a.app-card:hover {
    transform: translateY(-2px);
    border-color: #a9bfd3;
    box-shadow: 0 10px 24px rgba(23, 50, 77, 0.1);
}

.app-card-icon {
    display: inline-flex;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    font-size: 24px;
}

.app-card-icon-messages {
    background: #e8f1ff;
    color: #2563a6;
}

.app-card-icon-payments {
    background: #e8f8ee;
    color: #18794e;
}

.app-card-icon-checkin {
    background: #f3edff;
    color: #7251b5;
}

.app-card-icon-guest-portal {
    background: #e6f6f7;
    color: #24798a;
}

.app-card-icon-maintenance {
    background: #fff3df;
    color: #a96100;
}

.app-card-content {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
    gap: 6px;
    color: #667085;
    font-size: 14px;
    line-height: 1.4;
}

.app-card-content strong {
    color: #17324d;
    font-size: 18px;
}

.app-card-title-row {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.app-card-badge {
    padding: 4px 8px;
    border-radius: 999px;
    background: #f0eaff;
    color: #6941c6;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.app-card-arrow {
    color: #8da0b2;
    font-size: 14px;
}

.app-card-disabled {
    background: #f7f8fa;
    opacity: 0.78;
}

@media (max-width: 650px) {
    .apps-modal {
        align-items: flex-end;
        padding: 8px;
    }

    .apps-modal-dialog {
        width: 100%;
        max-height: calc(100vh - 16px);
        max-height: calc(100dvh - 16px);
        padding: 16px 14px;
        border-radius: 18px;
    }

    .apps-modal-header {
        gap: 12px;
        margin-bottom: 14px;
    }

    .apps-modal-header h2 {
        font-size: 21px;
        line-height: 1.15;
    }

    .apps-modal-header p {
        margin-top: 3px;
        font-size: 12px;
        line-height: 1.3;
    }

    .apps-modal-close {
        flex-basis: 36px;
        width: 36px;
        height: 36px;
        border-radius: 10px;
        font-size: 15px;
    }

    .apps-grid {
        gap: 8px;
    }

    .app-card {
        gap: 10px;
        min-height: 58px;
        padding: 9px 11px;
        border-radius: 13px;
    }

    .app-card-icon {
        flex-basis: 38px;
        width: 38px;
        height: 38px;
        border-radius: 11px;
        font-size: 17px;
    }

    .app-card-content {
        gap: 0;
        font-size: 11px;
        line-height: 1.25;
    }

    .app-card-content strong {
        font-size: 15px;
        line-height: 1.15;
    }

    .app-card-content > span:not(.app-card-title-row) {
        display: none;
    }

    .app-card-arrow {
        font-size: 12px;
    }
}

h1 {
    margin: 0;
    font-size: 38px;
}

.date {
    margin-top: 8px;
    opacity: 0.9;
    font-size: 15px;
}

.logout {
    color: white;
    text-decoration: none;
    background: rgba(255,255,255,0.18);
    padding: 11px 16px;
    border-radius: 14px;
    font-weight: bold;
}

.logout:hover,
.logout:visited,
.logout:active {
    color: white;
    text-decoration: none;
}

.container {
    max-width: 1200px;
    margin: 30px auto;
    padding: 0 20px;
}

.stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    gap: 16px;
    margin-bottom: 26px;
}

.stat {
    background: white;
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
}

.stat-number {
    font-size: 34px;
    font-weight: bold;
}

.stat-label {
    color: #65758b;
    margin-top: 5px;
}

.stat-link {
    display: block;
    color: inherit;
    text-decoration: none;
    transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.stat-link:hover,
.stat-link:visited,
.stat-link:active,
.stat-link:focus {
    color: inherit;
    text-decoration: none;
}

.stat-link:hover {
    transform: translateY(-2px);
}

.active-stat {
    outline: 2px solid rgba(23, 50, 77, 0.18);
}

.movement-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: -12px;
    margin-bottom: 22px;
}

.movement-stat {
    min-height: 74px;
    padding: 14px 18px;
    border-radius: 16px;
}

.movement-stat .stat-number {
    font-size: 26px;
}

.movement-stat .stat-label {
    font-size: 14px;
}

.stat-link.is-disabled {
    cursor: default;
    opacity: 0.45;
    pointer-events: none;
    box-shadow: none;
}

.stat-link.is-disabled:hover {
    transform: none;
}

.grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 18px;
}

.room-card {
    background: white;
    border-radius: 22px;
    padding: 22px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
    border: 1px solid #e6edf5;
    overflow: hidden;
}

.room-card-link,
.room-card-link:hover,
.room-card-link:visited,
.room-card-link:active,
.room-card-link:focus {
    color: inherit;
    text-decoration: none;
    display: flex;
}

.room-card-link {
    transition:
        background-color 0.15s ease,
        box-shadow 0.15s ease;
}

@media (hover: hover) and (pointer: fine) {
    .room-card-link:hover {
        background: #f7f8fa;
    }
}

.room-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.room-heading {
    min-width: 0;
    flex: 1;
}

.room-title-row {
    display: flex;
    align-items: center;
    gap: 7px;
    min-width: 0;
    flex-wrap: wrap;
}

.room-name {
    font-size: 20px;
    font-weight: bold;
}

.room-booking-source {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
    max-width: 145px;
    padding: 4px 7px;
    border: 1px solid #c9dcf1;
    border-radius: 999px;
    background: #edf5ff;
    color: #245f99;
    font-size: 9px;
    font-weight: 850;
    line-height: 1.1;
}

.room-booking-source i {
    flex: 0 0 auto;
    font-size: 7px;
}

.room-booking-source span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.light {
    flex: 0 0 auto;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    box-shadow: inset 0 0 0 3px rgba(255,255,255,0.45), 0 0 0 5px rgba(0,0,0,0.05);
}

.red,
.light.occupied {
    background: #d93025;
}

.green,
.light.available {
    background: #188038;
}

.light.checkin {
    background: #f29900;
}

.light.checkout {
    background: #1a73e8;
}

.status {
    margin-top: 18px;
    display: inline-block;
    padding: 8px 13px;
    border-radius: 999px;
    font-size: 14px;
    font-weight: bold;
}

.status-red,
.status-occupied {
    background: #fdecea;
    color: #a50e0e;
}

.status-green,
.status-available {
    background: #e6f4ea;
    color: #137333;
}

.status-checkin {
    background: #fff4e0;
    color: #b06000;
}

.status,
.maintenance-badge {
    max-width: 100%;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    line-height: 1.25;
}

.status-checkout {
    background: #e8f0fe;
    color: #174ea6;
}

.operational-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin-top: -6px;
    margin-bottom: 22px;
}

.operational-stat {
    display: flex;
    align-items: center;
    gap: 14px;
    min-height: 88px;
    padding: 17px 19px;
    border: 1px solid #e6edf5;
    border-radius: 18px;
}

.operational-stat .stat-number {
    font-size: 27px;
    line-height: 1;
}

.operational-stat .stat-label {
    margin-top: 5px;
    font-size: 13px;
    line-height: 1.25;
}

.stat-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    font-size: 18px;
}

.stat-icon-occupancy {
    background: #e8f0fe;
    color: #174ea6;
}

.stat-icon-verification {
    background: #f3e8ff;
    color: #7e22ce;
}

.stat-icon-checkin {
    background: #fff4e0;
    color: #b06000;
}

.mobile-checkin-filter {
    display: none;
}

.dashboard-summary {
    display: grid;
    grid-template-columns: minmax(430px, 0.95fr) minmax(0, 1.35fr);
    gap: 12px;
    margin-bottom: 14px;
}

.dashboard-occupancy-tabs,
.dashboard-quick-stats {
    display: grid;
    gap: 8px;
    min-width: 0;
}

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

.dashboard-quick-stats {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.dashboard-occupancy-tab,
.dashboard-quick-stat {
    color: #17324d;
    text-decoration: none;
    transition:
        border-color 0.15s ease,
        box-shadow 0.15s ease,
        transform 0.15s ease;
}

.dashboard-occupancy-tab:hover,
.dashboard-occupancy-tab:visited,
.dashboard-occupancy-tab:active,
.dashboard-quick-stat:hover,
.dashboard-quick-stat:visited,
.dashboard-quick-stat:active {
    color: #17324d;
    text-decoration: none;
}

.dashboard-occupancy-tab {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    min-height: 88px;
    padding: 13px 15px;
    border: 1px solid #dbe5ee;
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(23, 50, 77, 0.055);
}

.dashboard-occupancy-tab > span {
    color: #65758b;
    font-size: 12px;
    font-weight: 800;
    line-height: 1.2;
}

.dashboard-occupancy-tab strong {
    display: flex;
    align-items: baseline;
    gap: 7px;
    margin-top: 5px;
    font-size: 30px;
    line-height: 1;
}

.dashboard-occupancy-tab strong small {
    padding: 3px 6px;
    border-radius: 999px;
    background: #fdecea;
    color: #a50e0e;
    font-size: 11px;
    font-weight: 900;
}

.dashboard-occupancy-tab--occupied {
    border-color: #f0cfca;
    background: #fffafa;
}

.dashboard-occupancy-tab--available {
    border-color: #c7e2cf;
    background: #f7fcf8;
}

.dashboard-occupancy-tab--available > span,
.dashboard-occupancy-tab--available strong {
    color: #137333;
}

.dashboard-occupancy-tab.is-active,
.dashboard-quick-stat.is-active {
    border-color: #5c7895;
    box-shadow: inset 0 0 0 1px #5c7895, 0 7px 18px rgba(23, 50, 77, 0.09);
}

.dashboard-quick-stat {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 0;
    min-height: 88px;
    padding: 10px 8px;
    border: 1px solid #e1e8ef;
    border-radius: 15px;
    background: #fff;
    box-shadow: 0 4px 14px rgba(23, 50, 77, 0.045);
}

.dashboard-quick-stat > i {
    flex: 0 0 auto;
    color: #657d95;
    font-size: 15px;
}

.dashboard-quick-stat > span {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.dashboard-quick-stat strong {
    color: #17324d;
    font-size: 22px;
    line-height: 1;
}

.dashboard-quick-stat small {
    color: #68798b;
    font-size: 10px;
    font-weight: 800;
    line-height: 1.15;
}

.dashboard-quick-stat.is-disabled {
    opacity: 0.46;
    pointer-events: none;
}

.dashboard-room-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 0.7fr) minmax(620px, 2fr);
    gap: 14px;
    align-items: end;
    margin-bottom: 14px;
    padding: 12px;
    border: 1px solid #e2eaf2;
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(23, 50, 77, 0.05);
}

.dashboard-toolbar-overview {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.search-box.dashboard-search-box {
    margin: 0;
}

.dashboard-search-box input {
    width: 100%;
    max-width: none;
    height: 44px;
    box-shadow: none;
}

.dashboard-filter-panel {
    min-width: 0;
}

.dashboard-filter-panel > summary {
    display: none;
}

.dashboard-filter-panel:not([open]) > .dashboard-controls {
    display: grid;
}

.dashboard-controls {
    display: grid;
    grid-template-columns: minmax(170px, 1fr) minmax(170px, 1fr) auto auto;
    gap: 10px;
    align-items: end;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}

.dashboard-control {
    display: grid;
    gap: 7px;
    min-width: 0;
}

.dashboard-control > span {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #53657a;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.02em;
}

.dashboard-control select {
    width: 100%;
    min-width: 0;
    height: 44px;
    margin: 0;
    padding: 0 38px 0 13px;
    border: 1px solid #cad6e2;
    border-radius: 12px;
    background-color: #f8fafc;
    color: #17324d;
    font-size: 14px;
    font-weight: 700;
}

.dashboard-controls-apply,
.dashboard-controls-reset {
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-width: 0;
    max-width: 100%;
    min-height: 44px;
    margin: 0;
    padding: 0 17px;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.dashboard-controls-apply {
    border: 0;
    background: #17324d;
    color: #fff;
    cursor: pointer;
}

.dashboard-controls-reset {
    border: 1px solid #cad6e2;
    background: #fff;
    color: #465a70;
}

.dashboard-controls-reset:hover,
.dashboard-controls-reset:visited,
.dashboard-controls-reset:active {
    color: #465a70;
    text-decoration: none;
}

.dashboard-results-summary {
    margin: 0 2px;
    color: #65758b;
    font-size: 12px;
    font-weight: 700;
}

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

.room-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.room-card.has-checkin-attention {
    border-color: #f2c879;
    box-shadow: 0 8px 25px rgba(178, 102, 0, 0.09);
}

.room-type {
    margin-top: 3px;
    color: #7a8999;
    font-size: 11px;
    font-weight: 700;
    line-height: 1.2;
}

.room-operational-statuses {
    display: grid;
    gap: 7px;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #edf2f7;
}

.room-operational-item {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 8px 9px;
    border-radius: 11px;
    background: #f5f7fa;
    color: #53657a;
}

.room-operational-item > span:last-child {
    display: grid;
    min-width: 0;
}

.room-operational-item small {
    overflow: hidden;
    color: #748398;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 0.055em;
    line-height: 1.25;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.room-operational-item strong {
    margin-top: 1px;
    overflow-wrap: anywhere;
    font-size: 12px;
    line-height: 1.25;
}

.room-operational-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 30px;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    background: rgba(255, 255, 255, 0.78);
    font-size: 12px;
}

.room-operational-item.is-complete {
    background: #e8f5ec;
    color: #137333;
}

.room-operational-item.is-warning {
    background: #fff4df;
    color: #9a5b00;
}

.room-operational-item.is-error {
    background: #fdecea;
    color: #a50e0e;
}

.room-operational-item.is-info {
    background: #eaf2ff;
    color: #245ea8;
}

.room-operational-item.is-muted {
    background: #f1f4f7;
    color: #65758b;
}

.dashboard-empty-state {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 16px;
    padding: 22px;
    background: #fff;
    border: 1px dashed #bdcad7;
    border-radius: 18px;
    color: #53657a;
}

.dashboard-empty-state > span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border-radius: 14px;
    background: #eef3f7;
    color: #17324d;
    font-size: 19px;
}

.dashboard-empty-state strong {
    color: #17324d;
}

.dashboard-empty-state p {
    margin: 4px 0 0;
    font-size: 13px;
}

.dashboard-empty-state a {
    margin-left: auto;
    padding: 9px 13px;
    border-radius: 10px;
    background: #17324d;
    color: #fff;
    font-size: 12px;
    font-weight: 800;
    text-decoration: none;
}

.room-id {
    margin-top: 12px;
    color: #7b8a9b;
    font-size: 12px;
    word-break: break-all;
}

.error-box {
    background: #fff3f3;
    color: #a50e0e;
    border: 1px solid #ffd0d0;
    padding: 18px;
    border-radius: 16px;
    margin-bottom: 20px;
}

.dashboard-error-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.dashboard-error-box[hidden] {
    display: none;
}

.dashboard-error-box a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    padding: 10px 14px;
    border-radius: 10px;
    background: #a50e0e;
    color: #fff;
    text-decoration: none;
    font-weight: 700;
}

@media (max-width: 1000px) {
    .dashboard-summary,
    .dashboard-room-toolbar {
        grid-template-columns: 1fr;
    }

    .dashboard-quick-stat {
        min-height: 70px;
    }
}

@media (hover: hover) and (pointer: fine) {
    .dashboard-occupancy-tab:hover,
    .dashboard-quick-stat:hover {
        transform: translateY(-1px);
    }
}

@media (max-width: 650px) {
    .dashboard-page .container {
        margin-top: 16px;
        padding-inline: 12px;
    }

    .dashboard-summary {
        gap: 8px;
        margin-bottom: 10px;
    }

    .dashboard-occupancy-tabs,
    .dashboard-quick-stats {
        gap: 6px;
    }

    .dashboard-occupancy-tab {
        min-height: 68px;
        padding: 9px 8px;
        border-radius: 14px;
    }

    .dashboard-occupancy-tab > span {
        font-size: 10px;
    }

    .dashboard-occupancy-tab strong {
        gap: 4px;
        margin-top: 4px;
        font-size: 23px;
    }

    .dashboard-occupancy-tab strong small {
        padding: 2px 4px;
        font-size: 9px;
    }

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

    .dashboard-quick-stat {
        min-height: 52px;
        padding: 7px 6px;
        border-radius: 13px;
    }

    .dashboard-quick-stat > i {
        font-size: 12px;
    }

    .dashboard-quick-stat strong {
        font-size: 18px;
    }

    .dashboard-quick-stat small {
        font-size: 8px;
    }

    .dashboard-quick-stat--desktop {
        display: none;
    }

    .dashboard-room-toolbar {
        gap: 9px;
        margin-bottom: 10px;
        padding: 10px;
        border-radius: 15px;
    }

    .dashboard-toolbar-overview {
        gap: 6px;
    }

    .dashboard-search-box input {
        height: 42px;
        font-size: 13px;
    }

    .dashboard-search-box {
        display: none;
    }

    .dashboard-filter-panel > summary {
        display: flex;
        align-items: center;
        gap: 8px;
        min-height: 44px;
        padding: 0 12px;
        border: 1px solid #cad6e2;
        border-radius: 12px;
        background: #f8fafc;
        color: #17324d;
        cursor: pointer;
        font-size: 13px;
        font-weight: 850;
        list-style: none;
    }

    .dashboard-filter-panel > summary::-webkit-details-marker {
        display: none;
    }

    .dashboard-filter-panel > summary > span {
        display: inline-flex;
        align-items: center;
        gap: 7px;
    }

    .dashboard-filter-panel > summary b {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        min-width: 22px;
        height: 22px;
        padding: 0 6px;
        border-radius: 999px;
        background: #17324d;
        color: #fff;
        font-size: 11px;
    }

    .dashboard-filter-chevron {
        margin-left: auto;
        transition: transform 0.15s ease;
    }

    .dashboard-filter-panel[open] .dashboard-filter-chevron {
        transform: rotate(180deg);
    }

    .dashboard-filter-panel:not([open]) > .dashboard-controls {
        display: none;
    }

    .dashboard-controls {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-top: 8px;
        padding: 12px;
        border: 1px solid #e2eaf2;
        border-radius: 16px;
        background: #fff;
    }

    .dashboard-control > span {
        font-size: 10px;
    }

    .dashboard-control select {
        height: 42px;
        padding-right: 29px;
        padding-left: 10px;
        font-size: 12px;
    }

    .dashboard-controls-apply,
    .dashboard-controls-reset {
        min-height: 40px;
        padding: 0 12px;
        font-size: 12px;
    }

    .dashboard-results-summary {
        font-size: 11px;
    }

    .dashboard-page--maintenance .room-operational-item--checkin,
    .dashboard-page--maintenance .room-operational-item--authority,
    .dashboard-page--maintenance .room-operational-item--deposit {
        display: none;
    }

    .dashboard-page--maintenance .room-operational-statuses {
        margin-top: 9px;
        padding-top: 8px;
    }

    .dashboard-error-box {
        align-items: flex-start;
        flex-direction: column;
    }
}

.debug-box {
    background: #111;
    color: #00ff7f;
    padding: 20px;
    border-radius: 16px;
    overflow: auto;
    margin-bottom: 25px;
    font-size: 12px;
    line-height: 1.5;
}

.guest-panel {
    background: white;
    border-radius: 22px;
    padding: 24px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
    border: 1px solid #e6edf5;
    margin-bottom: 26px;
}

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

.guest-panel h2,
.guest-panel h3 {
    margin-top: 0;
}

.guest-detail-card {
    border-top: 1px solid #e6edf5;
    padding-top: 18px;
    margin-top: 18px;
}

.copy-row {
    display: grid;
    grid-template-columns: 120px 1fr auto;
    gap: 10px;
    align-items: center;
    margin-bottom: 10px;
}

.copy-row input {
    margin: 0;
    padding: 10px;
    font-size: 13px;
}

.copy-button {
    width: auto;
    padding: 10px 14px;
}

.loading-overlay {
    position: fixed;
    inset: 0;
    background: rgba(243, 247, 251, 0.92);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.loading-overlay.show {
    display: flex;
}

.loading-box {
    background: white;
    padding: 34px;
    border-radius: 24px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.12);
    text-align: center;
    max-width: 340px;
}

.loading-box h2 {
    margin: 16px 0 8px;
    color: #17324d;
}

.loading-box p {
    margin: 0;
    color: #65758b;
}

.spinner {
    width: 42px;
    height: 42px;
    border: 4px solid #d9e2ec;
    border-top-color: #17324d;
    border-radius: 50%;
    margin: auto;
    animation: spin 0.9s linear infinite;
}

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

@media (max-width: 650px) {
    .topbar-inner {
        flex-direction: column;
        align-items: flex-start;
    }

    h1 {
        font-size: 32px;
    }

    .stats {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }

    .movement-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
        margin-top: -12px;
    }

    .stat {
        padding: 16px;
    }

    .movement-stat {
        min-height: 62px;
        padding: 11px 14px;
    }

    .stat-number {
        font-size: 28px;
    }

    .movement-stat .stat-number {
        font-size: 24px;
    }

    .stat-label {
        font-size: 14px;
    }

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

    .room-card {
        padding: 14px;
        border-radius: 18px;
    }

    .room-name {
        font-size: 16px;
    }

    .room-title-row {
        gap: 5px;
    }

    .room-booking-source {
        max-width: 110px;
        padding: 3px 6px;
        font-size: 8px;
    }

    .light {
        width: 18px;
        height: 18px;
    }

    .status {
        font-size: 12px;
        padding: 7px 10px;
    }

    .room-type {
        font-size: 9px;
    }

    .room-operational-statuses {
        gap: 6px;
        margin-top: 11px;
        padding-top: 9px;
    }

    .room-operational-item {
        gap: 7px;
        padding: 7px;
        border-radius: 9px;
    }

    .room-operational-icon {
        flex-basis: 25px;
        width: 25px;
        height: 25px;
        border-radius: 7px;
        font-size: 10px;
    }

    .room-operational-item small {
        font-size: 7px;
        letter-spacing: 0.035em;
    }

    .room-operational-item strong {
        font-size: 10px;
    }

    .dashboard-empty-state {
        align-items: flex-start;
        padding: 16px;
    }

    .dashboard-empty-state a {
        display: none;
    }

    .copy-row {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 480px) {
    .dashboard-controls {
        grid-template-columns: 1fr;
    }

    .dashboard-controls-apply {
        width: 100%;
    }

    .dashboard-controls-reset {
        width: auto;
        justify-self: start;
    }
}

.apartment-detail-page {
    display: grid;
    gap: 18px;
}

.detail-title-card,
.detail-card {
    background: white;
    margin-bottom: 0;
    border-radius: 22px;
    padding: 24px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
    border: 1px solid #e6edf5;
}

.maintenance-container {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.maintenance-container .detail-card {
    margin-bottom: 0;
}

.detail-title-card h2,
.detail-card h3 {
    margin: 0 0 14px;
}

.detail-title-card p {
    margin: 0;
    color: #65758b;
}

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

.detail-row,
.link-row {
    display: grid;
    grid-template-columns: 140px 1fr auto;
    gap: 12px;
    align-items: center;
    padding: 12px 0;
    border-top: 1px solid #eef3f8;
}

.detail-row:first-of-type,
.link-row:first-of-type {
    border-top: none;
}

.detail-row span,
.link-row span {
    color: #65758b;
    font-weight: bold;
}

.detail-row a,
.link-row a {
    color: #17324d;
    font-weight: bold;
    text-decoration: none;
    word-break: break-all;
}

.detail-row a:hover,
.link-row a:hover {
    text-decoration: underline;
}

.copy-value {
    width: auto;
    text-align: left;
    background: #f3f7fb;
    color: #17324d;
    border: 1px solid #d9e2ec;
    padding: 10px 12px;
    border-radius: 12px;
}

.mini-copy,
.mini-link {
    width: auto;
    display: inline-block;
    background: #17324d;
    color: white;
    border: none;
    text-decoration: none;
    padding: 10px 12px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
}

.button-pair {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
}

@media (max-width: 750px) {
    .detail-grid {
        grid-template-columns: 1fr;
    }

    .detail-row,
    .link-row {
        grid-template-columns: 1fr;
        gap: 8px;
    }

    .button-pair {
        justify-content: flex-start;
    }
}

.detail-title-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.detail-title-header .status {
    margin-top: 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.detail-title-header .light {
    width: 14px;
    height: 14px;
    box-shadow: none;
}

@media (max-width: 650px) {
    .detail-title-header {
        flex-direction: column;
        align-items: flex-start;
    }
}
.whatsapp-link {
    text-align: center;
    min-width: 96px;
}

.whatsapp-link:hover,
.whatsapp-link:visited,
.whatsapp-link:active {
    color: white;
    text-decoration: none;
}

.internet-status {
    margin-top: 12px;
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 8px;
    align-items: center;
    padding: 9px 11px;
    border-radius: 14px;
    font-size: 13px;
    font-weight: bold;
}

.internet-enabled {
    background: #e6f4ea;
    color: #137333;
}

.status-card-internet-disabled {
    background: #ffe5e5;
    border: 1px solid #ffb3b3;
}

.status-card-internet-disabled .status-icon {
    color: #d90429;
}

.internet-toggle {
    grid-column: 1 / -1;
    margin-top: 8px;
    text-align: center;
    background: #17324d;
    color: white;
    text-decoration: none;
    border-radius: 12px;
    padding: 8px 10px;
}

.internet-toggle:hover,
.internet-toggle:visited,
.internet-toggle:active {
    color: white;
    text-decoration: none;
}

.internet-toggle-card {
    text-decoration: none;
}

.status-card-internet-disabled strong,
.status-card-internet-disabled span {
    color: #b00020;
}

.detail-row a.whatsapp-link,
.detail-row a.whatsapp-link:hover,
.detail-row a.whatsapp-link:visited,
.detail-row a.whatsapp-link:active,
.detail-row a.whatsapp-link:focus {
    color: white;
    text-decoration: none;
}

.whatsapp-link {
    text-align: center;
    min-width: 96px;
    color: white;
}

.detail-cta-row {
    margin-top: 20px;
}

.refresh-mobile-icon {
    display: none;
}

@media (max-width: 650px) {
    .refresh-desktop-text {
        display: none;
    }

    .refresh-mobile-icon {
        display: inline;
        font-size: 18px;
        line-height: 1;
    }
}

@media (max-width: 650px) {
    .topbar-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: flex-start;
        gap: 8px;
        width: 100%;
        align-items: center;
    }

    .topbar-actions .logout {
        text-align: center;
        padding: 10px 12px;
        font-size: 14px;
        white-space: nowrap;
        flex: 0 0 auto;
    }

    .topbar-actions .logout:first-child {
        flex: 1 1 auto;
    }

    .refresh-link {
        width: 44px;
        min-width: 44px;
        padding-left: 0;
        padding-right: 0;
    }
}

.logout {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: white;
}

.logout i {
    color: white;
    font-size: 15px;
}

@media (max-width: 650px) {

    .action-text {
        display: none;
    }

    .logout {
        min-width: 42px;
        justify-content: center;
        padding: 10px;
    }

    .logout i {
        font-size: 18px;
    }
}

.search-box {
    margin-bottom: 20px;
}

.search-box input {
    margin: 0;
    max-width: 350px;
    background: white;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.back-button {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

@media (max-width: 650px) {
    .status {
        display: inline-block;
        max-width: 100%;
        padding: 10px 14px;
        font-size: 15px;
        text-align: left;
    }

    .maintenance-badge {
        max-width: 100%;
        white-space: normal;
    }
}

.status {
    font-size: 13px;
}

.fa-spin-custom {
    animation: fa-spin 1s linear infinite;
}

@keyframes fa-spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

.maintenance-badge {
    margin-top: 8px;
    display: inline-block;
    padding: 5px 9px;
    border-radius: 999px;
    background: #fff3cd;
    color: #7a5a00;
    font-size: 12px;
    font-weight: 700;
}

.maintenance-stats {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.maintenance-dashboard-user-filter {
    display: flex;
    gap: 10px;
    align-items: end;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.maintenance-dashboard-user-filter label {
    display: block;
    width: 100%;
    color: #17324d;
    font-size: 13px;
    font-weight: 800;
}

.maintenance-dashboard-user-filter select {
    width: min(320px, 100%);
    height: 48px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #cfd8e3;
    border-radius: 12px;
    background: #fff;
    color: #17324d;
    font-size: 15px;
}

.maintenance-dashboard-user-filter-button {
    width: auto;
    min-width: 110px;
    height: 48px;
    margin: 0;
    padding: 0 18px;
    border-radius: 12px;
}

.maintenance-layout {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.dashboard-section.hidden {
    display: none;
}

.maintenance-task-card {
    border: 1px solid #ddd;
    border-radius: 12px;
    padding: 12px;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
    gap: 12px;
    background: #fafafa;
}

.maintenance-apartment {
    font-weight: 700;
    margin-bottom: 4px;
}

.maintenance-apartment a,
.maintenance-task-title {
    color: #1f6feb;
    text-decoration: none;
}

.maintenance-task-title {
    display: block;
    font-weight: 700;
    color: #111;
    margin-bottom: 5px;
}

.maintenance-apartment a:hover,
.maintenance-task-title:hover {
    text-decoration: underline;
}

.maintenance-availability {
    display: inline-block;
    margin-bottom: 6px;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
}

.availability-free {
    background: #e6ffed;
    color: #0b6b2b;
}

.availability-occupied {
    background: #ffe0e0;
    color: #9d0000;
}

.availability-unknown {
    background: #eeeeee;
    color: #555;
}

.maintenance-due-date,
.maintenance-task-meta {
    color: #666;
    font-size: 13px;
}

.maintenance-due-date {
    margin-bottom: 5px;
    font-weight: 700;
}

.maintenance-task-badges {
    min-width: 110px;
    text-align: right;
}

.maintenance-badge {
    display: inline-block;
    padding: 5px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 5px;
}

.priority-high,
.status-blocked {
    background: #ffe0e0;
    color: #9d0000;
}

.priority-medium,
.status-in_progress {
    background: #fff3cd;
    color: #7a5a00;
}

.priority-low,
.status-open {
    background: #e7f3ff;
    color: #004c8c;
}

.status-scheduled {
    background: #eee5ff;
    color: #4b218a;
}

.status-completed {
    background: #e6ffed;
    color: #0b6b2b;
}

.status-cancelled {
    background: #eeeeee;
    color: #555;
}

@media (max-width: 850px) {
    .maintenance-stats {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .maintenance-layout {
        grid-template-columns: 1fr;
    }

    .maintenance-task-card {
        display: block;
    }

    .maintenance-task-badges {
        text-align: left;
        margin-top: 8px;
    }
}

@media (max-width: 600px) {
    .maintenance-dashboard-user-filter {
        display: grid;
        grid-template-columns: 1fr;
    }

    .maintenance-dashboard-user-filter select,
    .maintenance-dashboard-user-filter-button {
        width: 100%;
        box-sizing: border-box;
    }
}

.stat-filter {
    text-decoration: none;
    color: inherit;
}

.stat-filter:hover {
    text-decoration: none;
}

.stat-filter.is-disabled {
    cursor: default;
    opacity: 0.45;
    box-shadow: none;
}

.stat-filter.is-disabled:hover {
    transform: none;
}

.stat-filter .stat-number,
.stat-filter .stat-label {
    color: inherit;
    text-decoration: none;
}

.success-box {
    background: #e6ffed;
    padding: 10px;
    border: 1px solid #8fd19e;
    margin-bottom: 15px;
    border-radius: 8px;
}

.maintenance-detail-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.maintenance-field {
    background: #fafafa;
    padding: 10px;
    border-radius: 8px;
}

.maintenance-field strong {
    display: block;
    margin-bottom: 4px;
    color: #333;
}

.quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 18px;
}

.quick-actions form {
    margin: 0;
}

.quick-action-btn {
    display: inline-block;
    padding: 10px 14px;
    border-radius: 8px;
    border: none;
    background: #666;
    color: #fff;
    font-weight: 700;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
}

.quick-action-btn.warning {
    background: #b7791f;
}

.quick-action-btn.success {
    background: #198754;
}

.quick-action-btn.edit {
    background: #1f6feb;
}

.maintenance-note {
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
}

.maintenance-note:last-child {
    border-bottom: none;
}

.maintenance-form {
    margin-top: 15px;
}

.maintenance-form textarea,
.maintenance-form input,
.maintenance-form select {
    width: 100%;
    padding: 10px;
    margin-top: 6px;
    box-sizing: border-box;
}

.maintenance-form textarea {
    min-height: 90px;
}

.maintenance-photo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 10px;
}

.maintenance-photo-item img {
    width: 100%;
    height: 130px;
    object-fit: cover;
    border-radius: 8px;
    border: 1px solid #ddd;
}

.delete-photo {
    display: block;
    margin-top: 6px;
    text-align: center;
    color: #c62828;
    font-size: 13px;
    text-decoration: none;
    font-weight: 700;
}

.delete-photo:hover {
    text-decoration: underline;
}

.maintenance-table {
    width: 100%;
    border-collapse: collapse;
}

.maintenance-table th,
.maintenance-table td {
    padding: 9px;
    border-bottom: 1px solid #ddd;
    text-align: left;
    vertical-align: top;
}

.maintenance-table th {
    background: #fafafa;
}

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

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

    .quick-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .quick-action-btn {
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
}
.maintenance-title-card h2 {
    margin-bottom: 8px;
}

.maintenance-title-card p {
    margin: 0;
    color: #555;
    font-weight: 600;
}

.maintenance-apartment-link {
    color: #1f6feb;
    text-decoration: none;
    font-weight: 700;
}

.maintenance-apartment-link:hover {
    text-decoration: underline;
}

.quick-action-btn.delete {
    background: #c62828;
}

.maintenance-filters {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    align-items: end;
}

.maintenance-filters label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 4px;
}

.maintenance-filters select {
    padding: 8px;
    min-width: 150px;
}

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

.maintenance-list-table tr:hover {
    background: #f9f9f9;
}

@media (max-width: 800px) {
    .maintenance-table,
    .maintenance-table thead,
    .maintenance-table tbody,
    .maintenance-table th,
    .maintenance-table td,
    .maintenance-table tr {
        display: block;
    }

    .maintenance-table thead {
        display: none;
    }

    .maintenance-table tr {
        margin-bottom: 12px;
        border: 1px solid #ddd;
        border-radius: 10px;
        padding: 10px;
    }

    .maintenance-table td {
        border-bottom: none;
        padding: 6px 0;
    }

    .maintenance-table td::before {
        content: attr(data-label);
        font-weight: 700;
        display: block;
        margin-bottom: 2px;
    }

    .maintenance-filter-actions {
        width: 100%;
        display: grid;
        grid-template-columns: 1fr;
    }
}
.maintenance-filter-card {
    padding-bottom: 22px;
}

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

.maintenance-filter-header h3 {
    margin: 0;
}

.maintenance-reset-link {
    color: #1f6feb;
    font-weight: 700;
    text-decoration: none;
}

.maintenance-reset-link:hover {
    text-decoration: underline;
}

.maintenance-filters {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: end;
}

.maintenance-filter-field label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 6px;
}

.maintenance-filter-field select {
    width: 100%;
    height: 48px;
    padding: 0 12px;
    border: 1px solid #d5dde7;
    border-radius: 12px;
    background: #fff;
    font-size: 15px;
}

.maintenance-filter-button {
    width: 100%;
    height: 48px;
    border-radius: 12px;
}

@media (max-width: 900px) {
    .maintenance-filters {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .maintenance-filter-header {
        display: block;
    }

    .maintenance-reset-link {
        display: inline-block;
        margin-top: 8px;
    }

    .maintenance-filters {
        grid-template-columns: 1fr;
    }
}
.maintenance-filter-header-actions {
    display: flex;
    gap: 12px;
    align-items: center;
}

.maintenance-filter-toggle {
    display: none;
    border: none;
    background: #1f6feb;
    color: #fff;
    font-weight: 700;
    border-radius: 10px;
    padding: 9px 12px;
    cursor: pointer;
}

@media (max-width: 600px) {
    .maintenance-filter-toggle {
        display: inline-block;
    }

    .maintenance-filters {
        display: none;
        margin-top: 14px;
    }

    .maintenance-filters.is-open {
        display: grid;
    }
}

@media (max-width: 800px) {
    .maintenance-list-table td[data-label="Categoría"],
    .maintenance-list-table td[data-label="Ubicación"],
    .maintenance-list-table td[data-label="Estimado"],
    .maintenance-list-table td[data-label="Asignado"],
    .maintenance-list-table td[data-label="Creada"] {
        display: none;
    }

    .maintenance-list-table small {
        display: none;
    }

    .maintenance-list-table tr {
        padding: 14px;
    }

    .maintenance-list-table td[data-label="Apartamento"],
    .maintenance-list-table td[data-label="Tarea"] {
        padding-bottom: 10px;
    }
}

.task-row {
    transition: background-color .15s ease;
}

.task-row:hover {
    background: #f7fafc;
}

@media (max-width: 800px) {

    .task-row {
        cursor: pointer;
        transition: transform .15s ease;
    }

    .task-row:active {
        transform: scale(0.98);
    }

    .task-link {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 1rem;
        font-weight: 700;
        color: #18395b;
        text-decoration: none;
    }
    
    .task-link:hover {
        text-decoration: underline;
    }

    .task-link::after {
        content: "›";
        font-size: 1.2rem;
        font-weight: bold;
    }
}

@media (max-width: 800px) {
    .maintenance-list-table .maintenance-task-title {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        font-size: 1.05rem;
        font-weight: 800;
        color: #18395b;
        text-decoration: none;
    }

    .maintenance-list-table .maintenance-task-title::after {
        content: "›";
        font-size: 1.4rem;
        line-height: 1;
        font-weight: 800;
    }

    .maintenance-list-table td[data-label="Tarea"] {
        background: #f7fafc;
        border-radius: 10px;
        padding: 10px 12px;
        margin-top: 8px;
    }
}

.maintenance-add-form {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

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

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

.maintenance-form-field label {
    display: block;
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 6px;
}

.maintenance-form-field input,
.maintenance-form-field select,
.maintenance-form-field textarea {
    width: 100%;
    min-height: 48px;
    padding: 10px 12px;
    border: 1px solid #d5dde7;
    border-radius: 12px;
    background: #fff;
    font-size: 15px;
    box-sizing: border-box;
}

.maintenance-form-field textarea {
    min-height: 120px;
    resize: vertical;
}

.maintenance-form-actions-card {
    display: flex;
    gap: 10px;
    align-items: center;
}

.maintenance-primary-button {
    min-width: 180px;
}

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

    .maintenance-form-actions-card {
        display: grid;
        grid-template-columns: 1fr;
    }

    .maintenance-primary-button,
    .maintenance-form-actions-card .button {
        width: 100%;
        text-align: center;
        box-sizing: border-box;
    }
}

.maintenance-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 14px;
}

.maintenance-card-header h3 {
    margin: 0;
}

.maintenance-card-add,
.maintenance-card-view-all {
    font-weight: 700;
    color: #1f6feb;
    text-decoration: none;
}

.maintenance-card-add:hover,
.maintenance-card-view-all:hover {
    text-decoration: underline;
}

.apartment-maintenance-list {
    display: grid;
    gap: 10px;
}

.apartment-maintenance-item {
    display: block;
    padding: 12px 12px 12px 14px;
    background: #fafafa;
    border: 1px solid #dde3ea;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
}

.apartment-maintenance-item:hover {
    background: #f5f8fb;
}

.priority-border-high {
    border-left: 5px solid #c62828;
}

.priority-border-medium {
    border-left: 5px solid #b7791f;
}

.priority-border-low {
    border-left: 5px solid #1f6feb;
}

.apartment-maintenance-title {
    font-weight: 800;
    color: #18395b;
    margin-bottom: 4px;
}

.apartment-maintenance-meta,
.apartment-maintenance-due {
    color: #666;
    font-size: 13px;
}

.apartment-maintenance-due {
    margin-top: 4px;
    font-weight: 700;
}

.maintenance-card-view-all {
    display: inline-block;
    margin-top: 14px;
}

@media (max-width: 700px) {
    .maintenance-card-header {
        display: block;
    }

    .maintenance-card-add {
        display: inline-block;
        margin-top: 8px;
    }
}

.maintenance-description-box {
    margin-top: 22px;
    padding: 18px;
    background: #f7fafc;
    border: 1px solid #dde3ea;
    border-radius: 14px;
}

.maintenance-description-box h3 {
    margin-top: 0;
    margin-bottom: 10px;
}

.maintenance-description-box p {
    margin: 0;
    line-height: 1.5;
}

.maintenance-form-actions-card {
    display: flex;
    gap: 12px;
    justify-content: flex-start;
    align-items: center;
}

.maintenance-form-actions-card .button {
    margin: 0;
    min-width: 180px;
    text-align: center;
    box-sizing: border-box;
    text-decoration: none;
}

.maintenance-cancel-button {
    background: #666;
    color: #fff;
    border: none;
}

@media (max-width: 768px) {
    .maintenance-form-actions-card {
        display: grid;
        grid-template-columns: 1fr;
    }

    .maintenance-form-actions-card .button {
        width: 100%;
    }
}


.maintenance-form-actions-card {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 240px));
    gap: 12px;
    justify-content: start;
}

.maintenance-form-actions-card .button {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 52px;
    margin: 0 !important;
    padding: 0 18px !important;
    border-radius: 12px !important;
    font-weight: 800;
    text-decoration: none !important;
    box-sizing: border-box;
}

.maintenance-form-actions-card .button-secondary {
    background: #6b7280 !important;
    color: #fff !important;
}

@media (max-width: 700px) {
    .maintenance-form-actions-card {
        grid-template-columns: 1fr;
    }
}

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

.maintenance-section-header h3 {
    margin: 0;
}

.maintenance-section-header span {
    font-size: 13px;
    font-weight: 700;
    color: #6b7280;
    background: #f3f6f9;
    border-radius: 999px;
    padding: 5px 10px;
}

.maintenance-timeline {
    display: grid;
    gap: 14px;
}

.maintenance-timeline-item {
    display: grid;
    grid-template-columns: 42px 1fr;
    gap: 12px;
}

.maintenance-timeline-avatar {
    width: 42px;
    height: 42px;
    border-radius: 999px;
    background: #18395b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
}

.maintenance-timeline-content {
    background: #f7fafc;
    border: 1px solid #dde3ea;
    border-radius: 14px;
    padding: 12px 14px;
}

.maintenance-timeline-meta {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
    color: #6b7280;
    font-size: 13px;
}

.maintenance-timeline-meta strong {
    color: #18395b;
}

.maintenance-timeline-note {
    line-height: 1.5;
}

.maintenance-note-form {
    margin-top: 18px;
}

@media (max-width: 600px) {
    .maintenance-timeline-item {
        grid-template-columns: 34px 1fr;
        gap: 10px;
    }

    .maintenance-timeline-avatar {
        width: 34px;
        height: 34px;
        font-size: 13px;
    }

    .maintenance-timeline-meta {
        display: block;
    }

    .maintenance-timeline-meta span {
        display: block;
        margin-top: 2px;
    }
}

.improved-photo-grid {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

.maintenance-photo-item {
    background: #f7fafc;
    border: 1px solid #dde3ea;
    border-radius: 14px;
    padding: 10px;
}

.maintenance-photo-item img {
    transition: transform .15s ease, box-shadow .15s ease;
}

.maintenance-photo-item img:hover {
    transform: scale(1.02);
    box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}

.maintenance-collapsible {
    width: 100%;
    border: none;
    background: #f7fafc;
    border: 1px solid #dde3ea;
    border-radius: 12px;
    padding: 14px 18px;
    cursor: pointer;

    display: flex;
    justify-content: space-between;
    align-items: center;

    font-size: 16px;
    font-weight: 700;
    color: #18395b;
}

.maintenance-collapsible:hover {
    background: #eef4f8;
}

.maintenance-overview-card {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.overview-pill {
    background: #f3f6f9;
    border: 1px solid #dde3ea;
    border-radius: 999px;
    padding: 10px 14px;
    font-weight: 600;
    color: #18395b;
}

.overview-pill.priority-high {
    background: #ffe0e0;
    border-color: #f3b1b1;
    color: #9d0000;
}

.overview-pill.priority-medium {
    background: #fff3cd;
    border-color: #f0dd8c;
    color: #7a5a00;
}

.overview-pill.priority-low {
    background: #e7f3ff;
    border-color: #b8d7f3;
    color: #004c8c;
}

.maintenance-last-viewed {
    margin-top: 6px;
    font-size: 13px;
    color: #6b7280;
}

.maintenance-lightbox {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0,0,0,0.88);
    align-items: center;
    justify-content: center;
    padding: 24px;
}

.maintenance-lightbox.is-open {
    display: flex;
}

.maintenance-lightbox img {
    max-width: 95vw;
    max-height: 90vh;
    border-radius: 12px;
    box-shadow: 0 20px 50px rgba(0,0,0,0.4);
}

.maintenance-lightbox-close {
    position: fixed;
    top: 18px;
    right: 22px;
    border: none;
    background: rgba(255,255,255,0.15);
    color: #fff;
    font-size: 36px;
    line-height: 1;
    width: 48px;
    height: 48px;
    border-radius: 999px;
    cursor: pointer;
}

.maintenance-lightbox-close:hover {
    background: rgba(255,255,255,0.25);
}

@media (max-width: 700px) {
    input,
    select,
    textarea {
        font-size: 16px !important;
    }
}

.maintenance-checkbox {
    display: flex !important;
    align-items: center;
    gap: 8px;
    margin-top: 10px !important;
    font-weight: 600;
}

.maintenance-checkbox input {
    width: auto !important;
    min-height: auto !important;
    margin: 0 !important;
}

.account-action-grid {
    margin-top: 15px;
}

.account-action-card {
    text-decoration: none;
    cursor: pointer;
    transition: all .2s ease;
}

.account-action-card:hover {
    transform: translateY(-2px);
}

.settings-divider {
    border: none;
    border-top: 1px solid #dde3ea;
    margin: 18px 0;
}

.quiet-hours-grid {
    margin-top: 12px;
    max-width: 420px;
}

.notification-list {
    display: grid;
    gap: 10px;
}

.notification-item {
    display: grid;
    grid-template-columns: 14px 1fr;
    gap: 10px;
    padding: 14px;
    border: 1px solid #dde3ea;
    border-radius: 14px;
    background: #fff;
    color: inherit;
    text-decoration: none;
}

.notification-item:hover {
    background: #f7fafc;
}

.notification-unread {
    background: #eef5ff;
    border-color: #b8d7f3;
}

.notification-dot {
    width: 10px;
    height: 10px;
    border-radius: 999px;
    margin-top: 5px;
    background: transparent;
}

.notification-unread .notification-dot {
    background: #1f6feb;
}

.notification-title {
    font-weight: 800;
    color: #18395b;
    margin-bottom: 4px;
}

.notification-message {
    color: #475569;
    font-size: 14px;
    line-height: 1.4;
}

.notification-time {
    margin-top: 6px;
    color: #6b7280;
    font-size: 12px;
    font-weight: 600;
}

.notification-bell {
    position: relative;
}

.notification-counter {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 999px;
    background: #e53935;
    color: white;
    font-size: 11px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notification-toast {
    position: fixed;
    right: 18px;
    bottom: 18px;
    z-index: 10000;

    max-width: 360px;
    width: calc(100% - 36px);

    display: flex;
    gap: 12px;
    align-items: flex-start;

    padding: 14px 16px;

    background: #18395b;
    color: #fff;

    border-radius: 16px;
    box-shadow: 0 16px 40px rgba(0,0,0,0.25);

    cursor: pointer;

    opacity: 0;
    transform: translateY(12px);
    transition: opacity .25s ease, transform .25s ease;
}

.notification-toast.show {
    opacity: 1;
    transform: translateY(0);
}

.notification-toast-icon {
    font-size: 22px;
    line-height: 1;
}

.notification-toast-content strong {
    display: block;
    margin-bottom: 4px;
}

.notification-toast-content span {
    display: block;
    font-size: 14px;
    line-height: 1.35;
    opacity: .9;
}

@media (max-width: 700px) {
    .notification-toast {
        left: 12px;
        right: 12px;
        bottom: 12px;
        width: auto;
        max-width: none;
    }
}

.notification-wrapper {
    position: relative;
    display: inline-block;
}

.notification-bell {
    position: relative;
}

.notification-dropdown {
    display: none;
    position: absolute;
    right: 0;
    top: calc(100% + 10px);
    width: 340px;
    max-width: calc(100vw - 24px);
    background: #fff;
    border: 1px solid #dde3ea;
    border-radius: 14px;
    box-shadow: 0 18px 45px rgba(0,0,0,0.18);
    z-index: 9999;
    overflow: hidden;
}

.notification-dropdown.show {
    display: block;
}

.notification-dropdown-header {
    padding: 12px 14px;
    border-bottom: 1px solid #dde3ea;
    display: flex;
    justify-content: space-between;
    gap: 10px;
}

.notification-dropdown-header a {
    font-size: 13px;
    font-weight: 700;
    color: #1f6feb;
    text-decoration: none;
}

.notification-dropdown-item {
    display: block;
    padding: 12px 14px;
    border-bottom: 1px solid #eef2f6;
    text-decoration: none;
    color: inherit;
}

.notification-dropdown-item:hover {
    background: #f7fafc;
}

.notification-dropdown-title {
    font-weight: 800;
    color: #18395b;
    margin-bottom: 4px;
}

.notification-dropdown-message {
    font-size: 13px;
    color: #475569;
}

.notification-dropdown-empty {
    padding: 14px;
    color: #6b7280;
}

.chat-thread {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 16px;
}

.chat-message {
    display: flex;
    gap: 10px;
    max-width: 78%;
}

.chat-message.mine {
    align-self: flex-end;
    flex-direction: row-reverse;
}

.chat-message.theirs {
    align-self: flex-start;
}

.chat-avatar {
    width: 38px;
    height: 38px;
    border-radius: 999px;
    background: #18395b;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    flex: 0 0 auto;
}

.chat-bubble {
    background: #f3f6f9;
    border: 1px solid #dde3ea;
    border-radius: 18px;
    padding: 12px 14px;
}

.chat-message.mine .chat-bubble {
    background: #18395b;
    color: #fff;
    border-color: #18395b;
}

.chat-meta {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    font-size: 12px;
    margin-bottom: 6px;
    opacity: .8;
}

.chat-text {
    font-size: 16px;
    line-height: 1.45;
}

.chat-form {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    margin-top: 18px;
}

.chat-form textarea {
    min-height: 52px;
    resize: vertical;
    font-size: 16px;
}

@media (max-width: 700px) {
    .chat-message {
        max-width: 92%;
    }

    .chat-form {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 700px) {
    .notification-wrapper {
        position: static;
    }

    .notification-dropdown {
        position: fixed;
        top: 230px;
        left: 12px;
        right: 12px;
        width: auto;
        max-width: none;
        max-height: 55vh;
        overflow-y: auto;
        border-radius: 18px;
        z-index: 99999;
    }

    .notification-dropdown-item {
        padding: 14px 16px;
    }

    .notification-dropdown-title,
    .notification-dropdown-message {
        white-space: normal;
        overflow-wrap: anywhere;
    }
}

.status-pair {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.status-pair .status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.status-pair .status strong {
    font-size: 0.9em;
    opacity: 0.85;
}

.detail-title-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
}

.status-pair {
    display: flex;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
}

.status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
}

.status strong {
    font-size: 0.9em;
    opacity: 0.85;
}

/* ==========================================
   SYSTEM SETTINGS
========================================== */

.settings-page {
    max-width: 1180px;
}

.settings-intro {
    margin-bottom: 18px;
    color: #64748b;
    font-size: 14px;
}

.settings-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

.settings-card .settings-field {
    width: 100%;
}

.settings-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    border: 1px solid rgba(148, 163, 184, 0.25);
}

.settings-card-wide {
    grid-column: 1 / -1;
}

.settings-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 18px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e5e7eb;
}

.settings-icon {
    width: 38px;
    height: 38px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #eff6ff;
    color: #1d4ed8;
    flex: 0 0 auto;
}

.settings-card h3 {
    margin: 0;
    font-size: 18px;
}

.settings-card p {
    margin: 3px 0 0;
    color: #64748b;
    font-size: 13px;
}

.settings-field {
    margin-bottom: 16px;
}

.settings-field:last-child {
    margin-bottom: 0;
}

.settings-field label {
    display: block;
    margin-bottom: 7px;
    font-weight: 600;
    color: #334155;
    font-size: 14px;
}

.settings-field input[type="text"],
.settings-field input[type="password"],
.settings-field input[type="number"],
.settings-field input[type="url"],
.settings-field input[type="date"],
.settings-field input[type="time"] {
    width: 100%;
    box-sizing: border-box;
}

.settings-help {
    margin-top: 6px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.4;
}

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

.settings-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
    margin-bottom: 14px;
}

.settings-toggle strong {
    display: block;
    color: #334155;
    font-size: 14px;
}

.settings-toggle span {
    display: block;
    color: #64748b;
    font-size: 12px;
    margin-top: 2px;
}

.settings-toggle input {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
}

.settings-save-bar {
    position: sticky;
    bottom: 0;
    z-index: 20;
    margin-top: 20px;
    background: rgba(255,255,255,0.92);
    backdrop-filter: blur(10px);
    border: 1px solid #e2e8f0;
    box-shadow: 0 -8px 25px rgba(15,23,42,0.08);
    border-radius: 18px;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.settings-save-bar span {
    color: #64748b;
    font-size: 14px;
}

.settings-save-bar button {
    flex-shrink: 0;
}

@media (max-width: 900px) {

    .settings-grid,
    .settings-row {
        grid-template-columns: 1fr;
    }

    .settings-save-bar {
        flex-direction: column;
        align-items: stretch;
    }

    .settings-save-bar button {
        width: 100%;
    }
}

.room-settings-add-form {
    margin: 0;
}

.room-settings-add-grid {
    display: grid;
    grid-template-columns: minmax(220px, 1.2fr) minmax(200px, 1fr) auto;
    gap: 14px;
    align-items: start;
}

.room-settings-add-grid .settings-field {
    margin-bottom: 0;
}

.room-settings-add-grid .settings-field input,
.room-settings-add-grid .settings-field select,
.room-settings-add-action button {
    min-height: 50px;
}

.room-settings-add-action {
    min-width: 140px;
    padding-top: 23px;
    align-self: start;
}

.room-settings-add-action button {
    width: 100%;
    justify-content: center;
}

.room-settings-list {
    display: grid;
    gap: 10px;
}

.room-settings-row {
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.room-settings-row.is-manual {
    border-color: #bbf7d0;
}

.room-settings-row-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 16px;
    cursor: pointer;
    list-style: none;
    background: #f8fafc;
}

.room-settings-row-header::-webkit-details-marker {
    display: none;
}

.room-settings-row[open] .room-settings-row-header {
    border-bottom: 1px solid #e2e8f0;
}

.room-settings-row-header::after {
    content: "\f078";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    color: #64748b;
    transition: transform 0.18s ease;
}

.room-settings-row[open] .room-settings-row-header::after {
    transform: rotate(180deg);
}

.room-settings-row.is-manual .room-settings-row-header {
    background: #f0fdf4;
}

.room-settings-summary-main {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.room-settings-summary-title {
    min-width: 0;
}

.room-settings-row-header strong {
    display: block;
    color: #1e293b;
    font-size: 16px;
    line-height: 1.25;
    overflow-wrap: anywhere;
}

.room-settings-summary-kind {
    display: block;
    margin-top: 3px;
    color: #64748b;
    font-size: 12px;
    line-height: 1.35;
    overflow-wrap: anywhere;
}

.room-settings-pill {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    min-height: 24px;
    padding: 0 9px;
    border-radius: 999px;
    background: #e0f2fe;
    color: #075985;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}

.room-settings-row.is-manual .room-settings-pill {
    background: #dcfce7;
    color: #166534;
}

.room-settings-disable,
.room-settings-enable {
    border: 1px solid #fecaca;
    background: #fff;
    color: #b91c1c;
    border-radius: 8px;
    padding: 8px 12px;
    font-weight: 700;
    cursor: pointer;
}

.room-settings-disable:hover {
    background: #fef2f2;
}

.room-settings-enable {
    border-color: #bbf7d0;
    color: #166534;
}

.room-settings-enable:hover {
    background: #f0fdf4;
}

.room-settings-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    align-items: start;
    padding: 16px;
}

.room-settings-views {
    grid-column: span 2;
}

.room-settings-checks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding: 10px;
    border: 1px solid #d7dde8;
    border-radius: 8px;
    background: #fff;
}

.room-settings-checks label {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    color: #334155;
}

.room-settings-checks input {
    width: 16px;
    height: 16px;
}

.room-settings-row-actions {
    display: flex;
    justify-content: flex-end;
    padding: 0 16px 16px;
}

.room-settings-disabled-card {
    margin-top: 18px;
}

.room-settings-disabled-row {
    border-color: #cbd5e1;
}

.room-settings-disabled-row .room-settings-row-header {
    background: #f1f5f9;
}

.room-settings-disabled-pill {
    background: #e2e8f0;
    color: #475569;
}

.room-settings-disabled-panel {
    display: flex;
    justify-content: flex-end;
    padding: 16px;
}

.room-settings-empty {
    padding: 16px;
    border: 1px dashed #cbd5e1;
    border-radius: 8px;
    color: #64748b;
    background: #f8fafc;
    font-size: 14px;
}

@media (max-width: 900px) {
    .room-settings-add-grid,
    .room-settings-grid {
        grid-template-columns: 1fr;
    }

    .room-settings-add-action {
        min-width: 0;
        padding-top: 0;
    }

    .room-settings-views {
        grid-column: auto;
    }

    .room-settings-row-header {
        align-items: flex-start;
    }

    .room-settings-summary-main {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }
}

.settings-page {
    padding-bottom: 120px;
}

.secret-toggle {
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    color: #334155;
    border-radius: 12px;
    padding: 0 14px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap;
}

.secret-toggle:hover {
    background: #e2e8f0;
}

.nexus-settings-shell {
    width: min(1260px, calc(100% - 40px));
}

.nexus-settings-tabs {
    width: 100%;
    box-sizing: border-box;
    overflow-x: auto;
    scrollbar-width: thin;
}

.nexus-settings-tabs a {
    flex: 0 0 auto;
}

.nexus-settings-link {
    text-decoration: none;
}

.nexus-users-card {
    margin-top: 20px;
}

.nexus-card-title-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

.nexus-card-title-row h3 {
    margin: 0;
}

.nexus-card-title-row span {
    color: #64748b;
    font-size: 12px;
    font-weight: 700;
}

.nexus-inline-save {
    position: static;
}

.checkout-settings-field select,
.checkout-settings-field input[type="time"],
.checkout-settings-field input[type="url"] {
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: 13px 14px;
    border: 1px solid #d9e2ec;
    border-radius: 12px;
    background: #fff;
    font-size: 14px;
}

/* System settings fixes */

.secret-field {
    display: flex;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 96px !important;
    gap: 8px !important;
    align-items: center !important;
}

.secret-field .secret-input {
    flex: 1;
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
}

.secret-field .secret-toggle {
    flex: 0 0 96px;
    width: 96px !important;
    height: 48px !important;
    min-width: 96px !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 1px solid #cbd5e1 !important;
    background: #f8fafc !important;
    color: #334155 !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.settings-save-bar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 18px !important;
}

.settings-save-bar span {
    width: auto !important;
    max-width: 720px !important;
    line-height: 1.4 !important;
}

.settings-save-bar button {
    width: auto !important;
    min-width: 220px !important;
    max-width: 280px !important;
    margin: 0 !important;
    white-space: nowrap !important;
}

@media (max-width: 700px) {
    .secret-field {
        grid-template-columns: 1fr !important;
    }

    .secret-field .secret-toggle {
        width: 100% !important;
    }

    .settings-save-bar {
        grid-template-columns: 1fr !important;
    }

    .settings-save-bar button {
        width: 100% !important;
        max-width: none !important;
    }
}

.muted-row {
    opacity: 0.6;
}

.text-danger {
    color: #dc2626 !important;
}

.user-actions {
    white-space: nowrap;
}

.action-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    border-radius: 10px;

    text-decoration: none;

    margin-right: 6px;

    transition: all 0.2s ease;
}

.action-icon i {
    font-size: 14px;
}

.action-icon.edit {
    background: #e0f2fe;
    color: #0369a1;
}

.action-icon.edit:hover {
    background: #bae6fd;
}

.action-icon.delete {
    background: #fee2e2;
    color: #dc2626;
}

.action-icon.delete:hover {
    background: #fecaca;
}

/* Apartment dashboard status badge wrapping fix */
.room-card .status {
    display: inline-block;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
    line-height: 1.25;
    box-sizing: border-box;
}

@media (max-width: 650px) {
    .room-card .status {
        font-size: 12px;
        padding: 7px 10px;
    }
}


/* Deposit module */
.deposit-mode-banner {
    padding: 12px 14px;
    border-radius: 10px;
    margin-bottom: 14px;
    font-weight: 700;
}

.deposit-mode-banner.sandbox {
    background: #fff7ed;
    border: 1px solid #fed7aa;
    color: #9a3412;
}

.deposit-alert {
    padding: 12px 14px;
    border-radius: 10px;
    margin-bottom: 14px;
    font-weight: 700;
}

.deposit-alert.error {
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #991b1b;
}

.deposit-alert.success {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    color: #166534;
}

.deposit-toolbar {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.deposit-panel {
    margin-bottom: 16px;
}

.deposit-form-grid,
.deposit-view-grid,
.deposit-metric-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 14px;
}

.deposit-form-grid label {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-weight: 700;
}

.deposit-form-grid input,
.deposit-form-grid select,
.deposit-action-row input,
.deposit-link-box input {
    width: 100%;
    padding: 10px;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    font-size: 14px;
}

.deposit-primary-button,
.deposit-secondary-button,
.deposit-danger-button {
    display: inline-block;
    margin-top: 14px;
    padding: 10px 14px;
    border: 0;
    border-radius: 9px;
    text-decoration: none;
    cursor: pointer;
    font-weight: 700;
    font-size: 14px;
}

.deposit-primary-button {
    background: #111827;
    color: #fff;
}

.deposit-secondary-button {
    background: #e5e7eb;
    color: #111827;
}

.deposit-danger-button {
    background: #991b1b;
    color: #fff;
}

.deposit-table-wrap {
    overflow-x: auto;
}

.deposit-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

.deposit-table th,
.deposit-table td {
    padding: 10px;
    border-bottom: 1px solid #e5e7eb;
    text-align: left;
    vertical-align: top;
}

.deposit-status {
    display: inline-block;
    padding: 4px 8px;
    border-radius: 999px;
    background: #e5e7eb;
    font-size: 12px;
    font-weight: 700;
}

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

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

.deposit-status-captured,
.deposit-status-partially_captured {
    background: #dbeafe;
    color: #1e40af;
}

.deposit-link-box {
    display: flex;
    gap: 8px;
    align-items: center;
}

.deposit-link-box .deposit-secondary-button {
    margin-top: 0;
}

.deposit-action-row {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.deposit-action-row .deposit-danger-button,
.deposit-action-row .deposit-secondary-button {
    margin-top: 0;
}

.deposit-metric {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 14px;
    padding: 16px;
    margin-bottom: 14px;
}

.deposit-metric span {
    display: block;
    color: #6b7280;
    font-size: 13px;
    margin-bottom: 6px;
}

.deposit-metric strong {
    font-size: 24px;
}

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

.deposit-mini-item {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    align-items: center;
    padding: 10px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    text-decoration: none;
    color: inherit;
    background: #fff;
}

.deposit-mini-item span {
    color: #6b7280;
    font-size: 13px;
}

.deposit-checkbox {
    display: block;
    margin: 10px 0 18px;
}

@media (max-width: 700px) {
    .deposit-link-box,
    .deposit-action-row,
    .deposit-mini-item {
        display: block;
    }

    .deposit-link-box .deposit-secondary-button,
    .deposit-action-row .deposit-danger-button,
    .deposit-action-row .deposit-secondary-button {
        margin-top: 8px;
    }
}

.maintenance-options-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.maintenance-options-card {
    border: 1px solid #e6edf5;
    border-radius: 18px;
    padding: 16px;
    background: #f8fbff;
}

.maintenance-options-card h4 {
    margin: 0 0 12px;
}

.maintenance-option-row {
    display: grid;
    grid-template-columns: 1fr 90px auto;
    gap: 10px;
    align-items: center;
    margin-bottom: 10px;
}

.maintenance-option-row input[type="text"],
.maintenance-option-row input[type="number"] {
    margin: 0;
    padding: 10px;
    font-size: 14px;
}

.maintenance-option-new {
    border-top: 1px solid #e6edf5;
    padding-top: 12px;
    margin-top: 12px;
}

.mini-check {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: bold;
    color: #65758b;
    white-space: nowrap;
}

.mini-check input {
    width: auto;
    margin: 0;
}

@media (max-width: 750px) {
    .maintenance-options-grid {
        grid-template-columns: 1fr;
    }

    .maintenance-option-row {
        grid-template-columns: 1fr;
    }
}

.settings-field select {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d7dde8;
    border-radius: 10px;
    font-size: 14px;
    background: #fff;
    color: #243b5a;
    box-sizing: border-box;
}

.settings-field select:focus {
    outline: none;
    border-color: #2f6fed;
    box-shadow: 0 0 0 3px rgba(47, 111, 237, 0.15);
}

.photo-meta {
    margin-top: 8px;
    display: grid;
    gap: 4px;
    font-size: 12px;
    color: #65758b;
}

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

.photo-meta i {
    color: #17324d;
    font-size: 12px;
}

.notification-dropdown-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 14px;
    border-bottom: 1px solid #e5e7eb;
}

.notification-dropdown-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.notification-action-btn,
.notification-action-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    border: none;
    background: transparent;
    color: #666;
    cursor: pointer;
    border-radius: 6px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.notification-action-btn:hover,
.notification-action-link:hover {
    background: #f3f4f6;
    color: #111827;
}

.notification-dropdown-item {
    padding: 12px 14px;
    border-bottom: 1px solid #f0f0f0;
}

.notification-dropdown-item:last-child {
    border-bottom: none;
}

.notification-dropdown-title {
    font-weight: 600;
    font-size: 14px;
    margin-bottom: 3px;
}

.notification-dropdown-message {
    font-size: 13px;
    color: #555;
}

.notification-dropdown-time {
    margin-top: 5px;
    font-size: 11px;
    color: #888;
}

.notification-dropdown-time {
    margin-top: 5px;
    font-size: 11px;
    color: #888;
}

.notification-dropdown-header {
    display: grid;
    grid-template-columns: 36px 1fr 36px;
    align-items: center;
    gap: 8px;
}

.notification-dropdown-header strong {
    text-align: center;
}

.notification-dropdown-header {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid #e5e7eb;
}

.notification-dropdown-header strong {
    text-align: center;
    font-size: 14px;
}

.notification-dropdown-actions {
    display: flex;
    align-items: center;
}

.notification-dropdown-actions-left {
    justify-content: flex-start;
}

.notification-dropdown-actions-right {
    justify-content: flex-end;
}

.notification-action-btn {
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: #65758b;
    cursor: pointer;
    border-radius: 8px;
    padding: 0;
}

.notification-action-btn:hover {
    background: #f3f7fb;
    color: #17324d;
}

.notification-view-all-link {
    width: auto;
    height: auto;
    padding: 4px 0;
    font-size: 13px;
    font-weight: 700;
    color: #1f6feb;
    text-decoration: none;
    white-space: nowrap;
}

.notification-view-all-link:hover {
    background: transparent;
    color: #17324d;
}

.notification-dropdown-time {
    margin-top: 6px;
    font-size: 11px;
    color: #7b8a9b;
}

.notification-dropdown-header {
    display: grid;
    grid-template-columns: 42px 1fr auto;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border-bottom: 1px solid #e5e7eb;
}

.notification-dropdown-header strong {
    text-align: center;
    font-size: 14px;
}

.notification-dropdown-actions-left {
    justify-content: flex-start;
}

.notification-dropdown-actions-right {
    justify-content: flex-end;
}

.notification-action-btn {
    width: 32px;
    height: 32px;
    border: 0;
    background: transparent;
    color: #65758b;
    cursor: pointer;
    border-radius: 8px;
    padding: 0;
}

.notification-action-btn:hover {
    background: #f3f7fb;
    color: #17324d;
}

.notification-view-all-link {
    width: auto;
    height: auto;
    padding: 4px 0;
    font-size: 13px;
    font-weight: 700;
    color: #1f6feb;
    text-decoration: none;
    white-space: nowrap;
}

.notification-view-all-link:hover {
    background: transparent;
    color: #17324d;
}

.notification-dropdown-time {
    margin-top: 6px;
    font-size: 11px;
    color: #7b8a9b;
}

/* ==========================================
   Usage Dashboard Fixes
========================================== */

.usage-filter-form {
    display: grid;
    gap: 18px;
}

.usage-filter-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 130px 1fr auto;
    gap: 14px;
    align-items: end;
}

.usage-filter-field label {
    display: block;
    margin-bottom: 7px;
    color: #17324d;
    font-size: 13px;
    font-weight: 800;
}

.usage-filter-field select,
.usage-filter-field input[type="search"] {
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #cfd8e3;
    border-radius: 12px;
    background: #fff;
    color: #17324d;
    font-size: 15px;
    box-sizing: border-box;
}

.usage-filter-field input[type="search"] {
    padding-right: 36px;
}

.usage-filter-check {
    height: 48px;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.usage-filter-check label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #17324d;
    font-size: 14px;
    font-weight: 800;
}

.usage-filter-check input[type="checkbox"] {
    width: auto;
    margin: 0;
}

.usage-filter-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.usage-apply-button {
    width: auto;
    min-width: 145px;
    height: 48px;
    margin: 0;
    padding: 0 18px;
    border-radius: 14px;
}

.usage-clear-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 18px;
    border-radius: 14px;
    background: #f1f5f9;
    color: #17324d;
    font-weight: 800;
    text-decoration: none;
}

.usage-clear-button:hover {
    background: #e2e8f0;
    text-decoration: none;
}

.status-card-grid {
    margin-top: 18px;
    margin-bottom: 18px;
}

.detail-card + .status-card-grid,
.status-card-grid + .detail-card,
.detail-card + .detail-grid,
.detail-grid + .detail-card {
    margin-top: 18px;
}

.pagination-summary {
    color: #65758b;
    font-size: 13px;
    font-weight: 800;
    background: #f3f6f9;
    border-radius: 999px;
    padding: 5px 10px;
}

.usage-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #e6edf5;
}

.usage-pagination a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #17324d;
    color: white;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 12px;
    font-weight: 800;
}

.usage-pagination a:last-child {
    justify-self: end;
}

.usage-pagination span {
    color: #65758b;
    font-weight: 800;
}

@media (max-width: 1100px) {
    .usage-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .usage-filter-check {
        align-items: end;
    }
}

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

    .usage-filter-check {
        height: auto;
    }

    .usage-filter-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .usage-apply-button,
    .usage-clear-button {
        width: 100%;
        box-sizing: border-box;
    }

    .usage-pagination {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .usage-pagination a,
    .usage-pagination a:last-child {
        justify-self: stretch;
    }
}

/* ==========================================
   Maintenance List Filters + Pagination
========================================== */

.maintenance-list-filters {
    display: grid;
    gap: 16px;
}

.maintenance-list-filter-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    align-items: end;
}

.maintenance-list-filter-field label {
    display: block;
    margin-bottom: 7px;
    color: #17324d;
    font-size: 13px;
    font-weight: 800;
}

.maintenance-list-filter-field select,
.maintenance-list-filter-field input[type="search"] {
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #cfd8e3;
    border-radius: 12px;
    background: #fff;
    color: #17324d;
    font-size: 15px;
    box-sizing: border-box;
}

.maintenance-list-search-field {
    grid-column: span 2;
}

.maintenance-list-filter-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.maintenance-list-filter-button {
    width: auto;
    min-width: 150px;
    height: 48px;
    margin: 0;
    padding: 0 18px;
    border-radius: 14px;
}

.maintenance-list-clear-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 0 18px;
    border-radius: 14px;
    background: #f1f5f9;
    color: #17324d;
    font-weight: 800;
    text-decoration: none;
}

.maintenance-list-clear-button:hover {
    background: #e2e8f0;
    text-decoration: none;
}

.maintenance-list-pagination {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    gap: 16px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid #e6edf5;
}

.maintenance-list-pagination a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #17324d;
    color: white;
    text-decoration: none;
    padding: 10px 16px;
    border-radius: 12px;
    font-weight: 800;
}

.maintenance-list-pagination a:last-child {
    justify-self: end;
}

.maintenance-list-pagination span {
    color: #65758b;
    font-weight: 800;
}

@media (max-width: 950px) {
    .maintenance-list-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .maintenance-list-search-field {
        grid-column: 1 / -1;
    }
}

@media (max-width: 600px) {
    .maintenance-list-filter-grid {
        grid-template-columns: 1fr;
    }

    .maintenance-list-search-field {
        grid-column: auto;
    }

    .maintenance-list-filter-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .maintenance-list-filter-button,
    .maintenance-list-clear-button {
        width: 100%;
        box-sizing: border-box;
    }

    .maintenance-list-pagination {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .maintenance-list-pagination a,
    .maintenance-list-pagination a:last-child {
        justify-self: stretch;
    }
}

@media (max-width: 600px) {
    .maintenance-list-filters {
        display: none;
        margin-top: 14px;
    }

    .maintenance-list-filters.is-open {
        display: grid;
    }
}

/* ==========================================
   Maintenance Print
========================================== */

body.maintenance-print-page {
    color: #111;
    background: #f5f5f5;
    margin: 0;
    padding: 20px;
    font-size: 14px;
}

.maintenance-print-screen-panel {
    background: #fff;
    border: 1px solid #d5dde7;
    border-radius: 18px;
    padding: 22px;
    margin-bottom: 24px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}

.maintenance-print-panel-header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start;
    margin-bottom: 18px;
}

.maintenance-print-panel-header h1 {
    margin: 0;
    font-size: 28px;
    color: #111;
}

.maintenance-print-panel-header p {
    margin: 6px 0 0;
    color: #65758b;
    font-weight: 600;
}

.maintenance-print-filter-form {
    display: grid;
    gap: 18px;
}

.maintenance-print-filter-grid {
    display: grid;
    grid-template-columns: 180px repeat(5, minmax(130px, auto));
    gap: 14px;
    align-items: end;
}

.maintenance-print-field label {
    display: block;
    margin-bottom: 7px;
    font-weight: 800;
    color: #17324d;
    font-size: 13px;
}

.maintenance-print-field select {
    width: 100%;
    height: 48px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid #cfd8e3;
    border-radius: 12px;
    background: #fff;
    color: #17324d;
    font-size: 15px;
    box-sizing: border-box;
}

.maintenance-print-check {
    height: 48px;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    color: #17324d;
    font-weight: 800;
    white-space: nowrap;
}

.maintenance-print-check input {
    width: auto;
    margin: 0;
}

.maintenance-print-actions {
    display: flex;
    gap: 10px;
    align-items: center;
}

.maintenance-print-button,
.maintenance-print-back-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 46px;
    width: auto;
    margin: 0;
    padding: 0 18px;
    border-radius: 12px;
    border: 0;
    background: #17324d;
    color: #fff;
    text-decoration: none;
    cursor: pointer;
    font-size: 14px;
    font-weight: 800;
}

.maintenance-print-back-link {
    background: #6b7280;
}

.maintenance-print-button:hover,
.maintenance-print-back-link:hover {
    opacity: 0.92;
    text-decoration: none;
}

.maintenance-print-title {
    display: none;
}

.maintenance-print-task {
    background: #fff;
    border: 1px solid #222;
    border-radius: 10px;
    padding: 12px;
    margin-bottom: 14px;
    page-break-inside: avoid;
}

.maintenance-print-task-header {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #ccc;
    padding-bottom: 8px;
    margin-bottom: 10px;
}

.maintenance-print-task-header strong {
    font-size: 20px;
    margin-right: 8px;
}

.maintenance-print-task-header span {
    font-size: 16px;
    font-weight: 800;
}

.maintenance-print-due-date {
    white-space: nowrap;
    font-size: 13px;
}

.maintenance-print-description,
.maintenance-print-conversation-notes {
    margin-bottom: 8px;
    line-height: 1.35;
}

.maintenance-print-conversation-notes {
    font-size: 13px;
    background: #f4f4f4;
    padding: 8px;
    border-radius: 6px;
}

.maintenance-print-scribble-area {
    height: 70px;
    border-top: 1px dashed #999;
    padding-top: 8px;
    margin-top: 8px;
    color: #444;
}

.maintenance-print-empty {
    background: #fff;
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 12px;
}

@media (max-width: 950px) {
    .maintenance-print-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .maintenance-print-panel-header {
        display: block;
    }

    .maintenance-print-back-link {
        margin-top: 12px;
    }
}

@media (max-width: 600px) {
    body.maintenance-print-page {
        padding: 12px;
    }

    .maintenance-print-filter-grid {
        grid-template-columns: 1fr;
    }

    .maintenance-print-actions {
        display: grid;
        grid-template-columns: 1fr;
    }

    .maintenance-print-button,
    .maintenance-print-back-link {
        width: 100%;
        box-sizing: border-box;
    }
}

@media print {
    body.maintenance-print-page {
        background: #fff;
        padding: 0;
        font-size: 12px;
    }

    .maintenance-print-screen-panel {
        display: none;
    }

    .maintenance-print-title {
        display: block;
        margin-bottom: 10px;
        border-bottom: 2px solid #111;
        padding-bottom: 6px;
    }

    .maintenance-print-task {
        border-radius: 0;
    }
}

.maintenance-print-task-heading {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.maintenance-print-priority {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 9px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 900;
    border: 1px solid #999;
}

.maintenance-print-priority.priority-high {
    background: #ffe0e0;
    color: #9d0000;
    border-color: #9d0000;
}

.maintenance-print-priority.priority-medium {
    background: #fff3cd;
    color: #7a5a00;
    border-color: #7a5a00;
}

.maintenance-print-priority.priority-low {
    background: #e7f3ff;
    color: #004c8c;
    border-color: #004c8c;
}

@media print {
    .maintenance-print-priority.priority-high {
        border: 2px solid #000;
        background: #fff;
        color: #000;
        text-transform: uppercase;
    }
}

.maintenance-print-due-date.overdue {
    color: #9d0000;
    font-weight: 800;
}

/* ==========================================
   Usage Dashboard Stat Cards
========================================== */

.usage-stats-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 16px;
    margin: 18px 0;
}

.usage-stat-card {
    display: flex;
    align-items: center;
    gap: 14px;
    background: #fff;
    border: 1px solid #e6edf5;
    border-radius: 18px;
    padding: 20px;
    box-shadow: 0 8px 25px rgba(0,0,0,0.06);
}

.usage-stat-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    background: #eef4fb;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex: 0 0 auto;
}

.usage-stat-card strong {
    display: block;
    color: #17324d;
    font-size: 28px;
    line-height: 1;
    margin-bottom: 6px;
}

.usage-stat-card span {
    display: block;
    color: #65758b;
    font-size: 14px;
    font-weight: 700;
}

@media (max-width: 950px) {
    .usage-stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 600px) {
    .usage-stats-grid {
        grid-template-columns: 1fr;
    }

    .usage-stat-card {
        padding: 16px;
    }
}

.maintenance-multi-select {
    width: 100%;
    min-height: 260px;
    padding: 10px;
    border: 1px solid #d5dde7;
    border-radius: 14px;
    background: #fff;
    color: #17324d;
    font-size: 15px;
    box-sizing: border-box;
}

.maintenance-multi-select option {
    padding: 10px 12px;
    border-radius: 8px;
    margin-bottom: 4px;
    font-weight: 700;
}

.maintenance-multi-select option:checked {
    background: #17324d;
    color: #fff;
}

.maintenance-multi-select:focus {
    outline: none;
    border-color: #2b5f8a;
    box-shadow: 0 0 0 3px rgba(43, 95, 138, 0.15);
}

@media (max-width: 600px) {
    .maintenance-multi-select {
        min-height: 320px;
    }
}

.maintenance-search-input {
    width: 100%;
    margin-bottom: 12px;
}

.maintenance-apartment-selector {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    max-height: 220px;
    overflow-y: auto;
    padding: 4px;
}

.maintenance-apartment-pill {
    position: relative;
    cursor: pointer;
}

.maintenance-apartment-pill input {
    display: none;
}

.maintenance-apartment-pill span {
    display: inline-block;
    padding: 8px 12px;
    border-radius: 999px;
    background: #f4f6f8;
    border: 1px solid #d9dee5;
    font-size: 14px;
    font-weight: 600;
}

.maintenance-apartment-pill input:checked + span {
    background: #17324d;
    color: white;
    border-color: #17324d;
}

.account-passkey-button {
    width: 100%;
    border: 1px solid #e6edf5;
    color: inherit;
    text-align: left;
    cursor: pointer;
}

.account-passkey-button strong,
.account-passkey-button span {
    text-align: left;
}

.account-passkey-button:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

.passkey-card {
    display: flex;
    align-items: center;
    gap: 16px;

    width: 100%;

    padding: 20px;

    background: #fff;
    border: 1px solid #dbe5ef;
    border-radius: 16px;

    cursor: pointer;

    transition: all 0.2s ease;
}

.passkey-card:hover {
    background: #f8fafc;
    border-color: #c7d6e5;
}

.passkey-card .status-icon {
    font-size: 32px;
    flex-shrink: 0;
}

.passkey-card strong {
    display: block;
    font-size: 18px;
    color: #173a5b;
}

.passkey-card span {
    display: block;
    color: #667085;
    margin-top: 4px;
}

.login-primary-button,
.login-passkey-button {
    width: 100%;
    height: 56px;
    border: none;
    border-radius: 16px;
    font-size: 17px;
    font-weight: 700;
    cursor: pointer;
    margin-top: 12px;
}

.login-primary-button {
    background: #17324d;
    color: #fff;
}

.login-passkey-button {
    background: #eef5ff;
    color: #17324d;
    border: 1px solid #c9d9ea;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
}

.login-passkey-button:hover {
    background: #e4effc;
}

.login-passkey-button:disabled {
    cursor: not-allowed;
    opacity: 0.62;
}

#passkeyLoginError {
    margin-top: 12px;
}

.login-actions {
    margin-top: 8px;
}

.login-notice {
    margin: 20px 4px 0;
    color: #667085;
    font-size: 14px;
    line-height: 1.5;
}

.account-security-intro {
    margin-bottom: 18px;
    line-height: 1.45;
}

.account-security-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.account-security-action {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    min-height: 96px;
    padding: 18px;
    background: #f8fbff;
    border: 1px solid #dbe5ef;
    border-radius: 18px;
    color: #17324d;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    box-sizing: border-box;
    transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

button.account-security-action {
    font-family: inherit;
}

.account-security-action:hover {
    background: #eef5ff;
    border-color: #bfd0e2;
    transform: translateY(-1px);
    text-decoration: none;
}

.account-security-action strong {
    display: block;
    font-size: 17px;
    font-weight: 800;
    color: #17324d;
}

.account-security-action span {
    display: block;
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.35;
    color: #65758b;
}

.account-security-icon,
.account-passkey-icon {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #e8f0fe;
    color: #17324d;
    flex: 0 0 auto;
}

.account-security-icon i,
.account-passkey-icon i {
    font-size: 20px;
}

.account-passkey-list {
    display: grid;
    gap: 10px;
}

.account-passkey-item {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    background: #f8fbff;
    border: 1px solid #dbe5ef;
    border-radius: 16px;
}

.account-passkey-item strong {
    display: block;
    color: #17324d;
    font-weight: 800;
}

.account-passkey-item span {
    display: block;
    margin-top: 4px;
    color: #65758b;
    font-size: 13px;
    line-height: 1.35;
}

#passkeyMessage {
    margin-top: 14px;
}

@media (max-width: 700px) {
    .account-security-actions {
        grid-template-columns: 1fr;
    }

    .account-security-action {
        min-height: auto;
        padding: 16px;
    }
}

.account-passkey-content {
    flex: 1;
    min-width: 0;
}

.account-passkey-delete-form {
    margin: 0;
    flex: 0 0 auto;
}

.account-passkey-delete {
    width: 38px;
    height: 38px;
    padding: 0;
    border-radius: 10px;
    background: #fee2e2;
    color: #dc2626;
    border: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.account-passkey-delete i {
    color: #dc2626;
    font-size: 14px;
}

.account-passkey-delete:hover {
    background: #fecaca;
}

/* Standalone identity verification */
.identity-admin-shell { max-width: 1240px; }
.identity-link-card { margin-bottom: 18px; padding: 20px 22px; display: grid; grid-template-columns: minmax(250px, .8fr) minmax(380px, 1.2fr); align-items: center; gap: 24px; border: 1px solid #bfdaca; border-radius: 17px; background: #f1faf5; box-shadow: 0 8px 26px rgba(23,50,77,.05); }
.identity-link-card > div:first-child span, .identity-link-card > div:first-child strong, .identity-link-card > div:first-child small { display: block; }
.identity-link-card > div:first-child span { color: #27805a; font-size: 10px; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.identity-link-card > div:first-child strong { margin-top: 6px; color: var(--checkout-navy); font-size: 16px; }
.identity-link-card > div:first-child small { margin-top: 4px; color: var(--checkout-muted); font-size: 11px; }
.identity-link-copy { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9px; }
.identity-link-copy input { height: 48px; margin: 0; padding: 0 14px; border: 1px solid #bfd5c8; border-radius: 12px; background: #fff; color: #4a6274; font: inherit; font-size: 12px; }
.identity-stat-grid { margin-bottom: 18px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.identity-stat-grid article { min-height: 104px; padding: 18px; display: flex; align-items: center; gap: 14px; border: 1px solid var(--checkout-line); border-radius: 16px; background: #fff; box-shadow: 0 6px 20px rgba(23,50,77,.05); }
.identity-stat-grid article > span { flex: 0 0 45px; width: 45px; height: 45px; display: grid; place-items: center; border-radius: 13px; background: #edf3f8; color: #55728a; font-size: 19px; }
.identity-stat-grid article > span.is-success { background: #e5f4eb; color: #27805a; }
.identity-stat-grid article > span.is-warning { background: #fff2d9; color: #9a6b1d; }
.identity-stat-grid article > span.is-error { background: #fee9e6; color: #a74339; }
.identity-stat-grid strong, .identity-stat-grid small { display: block; }
.identity-stat-grid strong { color: var(--checkout-navy); font-size: 25px; line-height: 1; }
.identity-stat-grid small { margin-top: 6px; color: var(--checkout-muted); font-size: 10px; font-weight: 800; }
.identity-check, .identity-result { display: inline-flex; align-items: center; padding: 6px 9px; border-radius: 999px; background: #edf2f5; color: #607487; font-size: 10px; font-weight: 850; white-space: nowrap; }
.identity-check.is-passed, .identity-result.is-success { background: #e7f6ed; color: #1e7950; }
.identity-check.is-review, .identity-result.is-warning { background: #fff1d7; color: #8d621b; }
.identity-check.is-failed, .identity-result.is-error { background: #fee9e6; color: #a74339; }
.identity-empty-state { padding: 70px 25px; display: grid; justify-items: center; color: var(--checkout-muted); text-align: center; }
.identity-empty-state > i { margin-bottom: 14px; color: #9aabba; font-size: 38px; }
.identity-empty-state strong { color: var(--checkout-navy); }
.identity-empty-state p { margin: 7px 0 0; font-size: 12px; }
.identity-limit-note { margin: 16px 3px 0; display: flex; align-items: flex-start; gap: 10px; color: #6f8091; font-size: 11px; line-height: 1.55; }
.identity-limit-note > i { margin-top: 3px; color: #3b7ba7; }
.identity-limit-note p { margin: 0; }
.identity-limit-note strong { color: var(--checkout-navy); }
.identity-view-shell { max-width: 1100px; }
.identity-result-hero { margin-bottom: 18px; padding: 26px 28px; display: flex; align-items: center; gap: 20px; border: 1px solid #d4e0e8; border-radius: 19px; background: #fff; box-shadow: 0 8px 28px rgba(23,50,77,.06); }
.identity-result-hero > span { flex: 0 0 62px; width: 62px; height: 62px; display: grid; place-items: center; border-radius: 19px; background: #edf3f8; color: #3a739c; font-size: 27px; }
.identity-result-hero.is-success > span { background: #dff2e7; color: #237b56; }
.identity-result-hero.is-warning > span { background: #fff0d1; color: #93651a; }
.identity-result-hero.is-error > span { background: #fee7e4; color: #a74339; }
.identity-result-hero small { color: #8696a5; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.identity-result-hero h2 { margin: 5px 0; color: var(--checkout-navy); font-size: 27px; }
.identity-result-hero p { margin: 0; color: var(--checkout-muted); font-size: 12px; }
.identity-review-grid { margin-bottom: 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.identity-review-grid figure { margin: 0; overflow: hidden; border: 1px solid var(--checkout-line); border-radius: 16px; background: #fff; }
.identity-review-grid img { width: 100%; aspect-ratio: 4 / 3; display: block; object-fit: contain; background: #eaf0f4; }
.identity-review-grid figcaption { padding: 11px 14px; color: var(--checkout-navy); font-size: 11px; font-weight: 850; }
.identity-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.identity-detail-grid article { padding: 20px; border: 1px solid var(--checkout-line); border-radius: 16px; background: #fff; box-shadow: 0 6px 20px rgba(23,50,77,.04); }
.identity-detail-grid h3 { margin: 0 0 15px; color: var(--checkout-navy); font-size: 15px; }
.identity-detail-grid dl { margin: 0; }
.identity-detail-grid dl div { padding: 9px 0; display: flex; justify-content: space-between; gap: 15px; border-top: 1px solid #edf1f4; }
.identity-detail-grid dt { color: var(--checkout-muted); font-size: 10px; }
.identity-detail-grid dd { margin: 0; color: var(--checkout-navy); font-size: 10px; font-weight: 850; text-align: right; }
.identity-retention-copy { margin: 17px 3px; color: var(--checkout-muted); font-size: 10px; }
.identity-retention-copy i { margin-right: 6px; color: #3e8064; }
.identity-review-actions { margin-top: 16px; padding: 17px 19px; display: flex; align-items: center; gap: 10px; border: 1px solid #e5d8b8; border-radius: 15px; background: #fffaf0; }
.identity-review-actions > div { min-width: 0; flex: 1; }
.identity-review-actions strong, .identity-review-actions small { display: block; }
.identity-review-actions strong { color: var(--checkout-navy); font-size: 13px; }
.identity-review-actions small { margin-top: 4px; color: var(--checkout-muted); font-size: 10px; }
.identity-review-reject { border-color: #e6c2c2; color: #a23d3d; }
.identity-reset-panel { margin-top: 16px; overflow: hidden; border: 1px solid #e3c9c6; border-radius: 15px; background: #fff8f7; }
.identity-reset-panel summary { padding: 14px 17px; display: flex; align-items: center; gap: 8px; color: #9b443d; font-size: 12px; font-weight: 850; cursor: pointer; list-style: none; }
.identity-reset-panel summary::-webkit-details-marker { display: none; }
.identity-reset-panel summary::after { margin-left: auto; content: "\f078"; font-family: "Font Awesome 6 Free"; font-size: 9px; font-weight: 900; transition: transform .18s ease; }
.identity-reset-panel[open] summary::after { transform: rotate(180deg); }
.identity-reset-panel > div { padding: 16px 17px; display: flex; align-items: center; gap: 18px; border-top: 1px solid #ecd7d4; }
.identity-reset-panel > div > div { min-width: 0; flex: 1; }
.identity-reset-panel strong, .identity-reset-panel small { display: block; }
.identity-reset-panel strong { color: var(--checkout-navy); font-size: 13px; }
.identity-reset-panel small { margin-top: 5px; color: var(--checkout-muted); font-size: 10px; line-height: 1.45; }
.identity-reset-panel form { flex: 0 0 auto; }
.identity-reset-button { width: auto; border-color: #ddaaa5; background: #fff; color: #9b3f38; white-space: nowrap; }
.identity-admin-page .guest-toast { position: fixed; left: 50%; bottom: 24px; z-index: 90; padding: 11px 16px; border-radius: 999px; background: #122941; color: #fff; font-size: 12px; font-weight: 800; opacity: 0; transform: translate(-50%, 20px); transition: .2s; pointer-events: none; }
.identity-admin-page .guest-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 820px) {
    .identity-link-card { grid-template-columns: 1fr; }
    .identity-stat-grid { grid-template-columns: repeat(2, 1fr); }
    .identity-detail-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
    .identity-admin-shell, .identity-view-shell { width: calc(100% - 20px); margin-top: 20px; }
    .identity-stat-grid { gap: 8px; }
    .identity-stat-grid article { min-height: 88px; padding: 13px; }
    .identity-stat-grid article > span { flex-basis: 39px; width: 39px; height: 39px; }
    .identity-link-copy { grid-template-columns: 1fr; }
    .identity-link-copy button { width: 100%; }
    .identity-review-grid { grid-template-columns: 1fr; }
    .identity-result-hero { align-items: flex-start; padding: 20px; }
    .identity-result-hero h2 { font-size: 23px; }
    .identity-review-actions { align-items: stretch; flex-direction: column; }
    .identity-review-actions .checkout-button { width: 100%; }
    .identity-reset-panel > div { align-items: stretch; flex-direction: column; }
    .identity-reset-panel form, .identity-reset-button { width: 100%; }
}

/* PMS single-record diagnostic */
.checkout-pms-diagnostic-link { margin-top: 14px; }
.pms-diagnostic-shell { max-width: 1280px; }
.pms-diagnostic-privacy {
    margin-bottom: 18px;
    padding: 14px 17px;
    display: flex;
    align-items: flex-start;
    gap: 11px;
    border: 1px solid #d6e2eb;
    border-radius: 14px;
    background: #f4f8fb;
    color: #516c80;
}
.pms-diagnostic-privacy i { margin-top: 2px; color: #2f7459; }
.pms-diagnostic-privacy p { margin: 0; font-size: 11px; line-height: 1.55; }
.pms-diagnostic-form { margin-bottom: 18px; }
.pms-diagnostic-controls {
    display: grid;
    grid-template-columns: 1.15fr .9fr .9fr;
    gap: 15px;
}
.pms-diagnostic-controls .checkout-settings-field { margin-bottom: 0; }
.pms-diagnostic-controls input { width: 100%; box-sizing: border-box; }
.pms-diagnostic-form-actions {
    margin-top: 20px;
    padding-top: 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #e4ebf0;
}
.pms-diagnostic-form-actions > span {
    display: flex;
    align-items: center;
    gap: 8px;
    color: var(--checkout-muted);
    font-size: 11px;
}
.pms-diagnostic-form-actions > span i { color: #3e789f; }
.pms-diagnostic-form-actions button {
    width: auto;
    min-height: 44px;
    padding: 0 17px;
    border-radius: 11px;
    white-space: nowrap;
}
.pms-diagnostic-summary {
    margin-bottom: 18px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}
.pms-diagnostic-summary article {
    min-width: 0;
    padding: 19px;
    display: flex;
    align-items: flex-start;
    gap: 13px;
    border: 1px solid var(--checkout-line);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 6px 20px rgba(23, 50, 77, .05);
}
.pms-diagnostic-summary article > span {
    flex: 0 0 43px;
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: #eaf2f8;
    color: #2b6b9d;
}
.pms-diagnostic-summary article.is-found { border-color: #bfe0cb; background: #f8fdf9; }
.pms-diagnostic-summary article.is-found > span { background: #e4f3e9; color: #21784e; }
.pms-diagnostic-summary article.is-missing { border-color: #ead9b7; background: #fffaf1; }
.pms-diagnostic-summary article.is-missing > span { background: #fff0d3; color: #936619; }
.pms-diagnostic-summary div { min-width: 0; }
.pms-diagnostic-summary small,
.pms-diagnostic-summary strong { display: block; }
.pms-diagnostic-summary small {
    color: #8393a1;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .055em;
    text-transform: uppercase;
}
.pms-diagnostic-summary strong {
    margin-top: 6px;
    overflow-wrap: anywhere;
    color: var(--checkout-navy);
    font-size: 17px;
}
.pms-diagnostic-summary p {
    margin: 6px 0 0;
    color: var(--checkout-muted);
    font-size: 10px;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.pms-diagnostic-summary code,
.pms-diagnostic-table-wrap code {
    padding: 2px 5px;
    border-radius: 5px;
    background: #edf2f5;
    color: #294e69;
    font: 600 10px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace;
}
.pms-diagnostic-field-guide,
.pms-diagnostic-returned-fields { margin-bottom: 18px; }
.pms-diagnostic-table-wrap {
    width: 100%;
    overflow-x: auto;
    border: 1px solid #dce5ec;
    border-radius: 14px;
}
.pms-diagnostic-table-wrap table {
    width: 100%;
    border-collapse: collapse;
    min-width: 720px;
}
.pms-diagnostic-table-wrap th {
    padding: 11px 14px;
    background: #f1f5f8;
    color: #667b8d;
    font-size: 9px;
    font-weight: 900;
    letter-spacing: .055em;
    text-align: left;
    text-transform: uppercase;
}
.pms-diagnostic-table-wrap td {
    padding: 13px 14px;
    border-top: 1px solid #e5ebf0;
    color: #4e6375;
    font-size: 11px;
    line-height: 1.5;
    vertical-align: top;
}
.pms-diagnostic-table-wrap tr.is-target td { background: #f4fbf7; }
.pms-diagnostic-table-wrap td strong,
.pms-diagnostic-table-wrap td small { display: block; }
.pms-diagnostic-table-wrap td strong { color: var(--checkout-navy); font-size: 12px; }
.pms-diagnostic-table-wrap td small { margin-top: 4px; color: var(--checkout-muted); font-size: 10px; }
.pms-diagnostic-table-wrap td pre {
    max-width: 680px;
    margin: 0;
    color: #334d61;
    font: 10px/1.45 ui-monospace, SFMono-Regular, Menlo, monospace;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
}
.pms-diagnostic-use {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 999px;
    font-size: 9px;
    font-weight: 900;
    white-space: nowrap;
}
.pms-diagnostic-use.is-yes { background: #e3f4e9; color: #1f7950; }
.pms-diagnostic-use.is-no { background: #eef1f4; color: #667786; }
.pms-diagnostic-empty {
    padding: 20px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px dashed #cad6df;
    border-radius: 13px;
    color: var(--checkout-muted);
    font-size: 11px;
}
.pms-diagnostic-endpoints { margin-bottom: 18px; display: grid; gap: 10px; }
.pms-diagnostic-endpoint {
    overflow: hidden;
    border: 1px solid #d8e2e9;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 5px 18px rgba(23, 50, 77, .04);
}
.pms-diagnostic-endpoint summary {
    padding: 15px 17px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--checkout-navy);
    cursor: pointer;
    list-style: none;
}
.pms-diagnostic-endpoint summary::-webkit-details-marker { display: none; }
.pms-diagnostic-endpoint summary::after {
    margin-left: 3px;
    content: "\f078";
    color: #8293a1;
    font-family: "Font Awesome 6 Free";
    font-size: 9px;
    font-weight: 900;
    transition: transform .18s ease;
}
.pms-diagnostic-endpoint[open] summary::after { transform: rotate(180deg); }
.pms-diagnostic-endpoint-state {
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    font-size: 12px;
}
.pms-diagnostic-endpoint-state.is-success { background: #e4f3e9; color: #21784e; }
.pms-diagnostic-endpoint-state.is-error { background: #fee9e6; color: #a74339; }
.pms-diagnostic-endpoint summary > span:nth-child(2) { min-width: 0; flex: 1; }
.pms-diagnostic-endpoint summary strong,
.pms-diagnostic-endpoint summary small { display: block; }
.pms-diagnostic-endpoint summary strong { font-size: 13px; }
.pms-diagnostic-endpoint summary small {
    margin-top: 4px;
    overflow: hidden;
    color: var(--checkout-muted);
    font: 9px/1.4 ui-monospace, SFMono-Regular, Menlo, monospace;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pms-diagnostic-endpoint-api {
    padding: 5px 8px;
    border-radius: 999px;
    background: #edf3f7;
    color: #527087;
    font-size: 9px;
    font-weight: 850;
    white-space: nowrap;
}
.pms-diagnostic-endpoint-body { padding: 0 17px 17px; border-top: 1px solid #e6ecf0; }
.pms-diagnostic-endpoint-meta {
    padding: 12px 1px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
}
.pms-diagnostic-endpoint-meta a {
    color: #2b6b9d;
    font-size: 10px;
    font-weight: 850;
    text-decoration: none;
}
.pms-diagnostic-endpoint-meta span {
    color: #a23f38;
    font-size: 10px;
    line-height: 1.45;
    text-align: right;
}
.pms-diagnostic-json-grid {
    display: grid;
    grid-template-columns: minmax(0, .72fr) minmax(0, 1.28fr);
    gap: 10px;
}
.pms-diagnostic-json-grid > div,
.pms-diagnostic-cache-grid article { min-width: 0; }
.pms-diagnostic-code-heading {
    padding: 9px 11px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border: 1px solid #dce4ea;
    border-bottom: 0;
    border-radius: 11px 11px 0 0;
    background: #f2f5f7;
}
.pms-diagnostic-code-heading strong {
    color: #536b7d;
    font-size: 9px;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.pms-diagnostic-code-heading button {
    width: auto;
    padding: 4px 7px;
    border: 1px solid #cad6df;
    border-radius: 6px;
    background: #fff;
    color: #48677e;
    font-size: 9px;
}
.pms-diagnostic-json-grid pre,
.pms-diagnostic-cache-grid pre {
    max-height: 560px;
    margin: 0;
    padding: 14px;
    overflow: auto;
    border: 1px solid #dce4ea;
    border-radius: 0 0 11px 11px;
    background: #122537;
    color: #dbe8f1;
    font: 10px/1.55 ui-monospace, SFMono-Regular, Menlo, monospace;
    tab-size: 2;
    white-space: pre;
}
.pms-diagnostic-cache-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}
.pms-diagnostic-cache-grid pre { border-radius: 11px; }
.pms-diagnostic-empty-card {
    padding: 60px 24px;
    display: grid;
    justify-items: center;
    text-align: center;
}
.pms-diagnostic-empty-card > i { margin-bottom: 13px; color: #8698a7; font-size: 35px; }
.pms-diagnostic-empty-card h3 { margin: 0; color: var(--checkout-navy); }
.pms-diagnostic-empty-card p { margin: 8px 0 0; color: var(--checkout-muted); font-size: 11px; }
.pms-diagnostic-toast {
    position: fixed;
    left: 50%;
    bottom: 24px;
    z-index: 100;
    padding: 10px 15px;
    border-radius: 999px;
    background: #122941;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    opacity: 0;
    transform: translate(-50%, 18px);
    transition: .18s ease;
    pointer-events: none;
}
.pms-diagnostic-toast.is-visible { opacity: 1; transform: translate(-50%, 0); }

@media (max-width: 900px) {
    .pms-diagnostic-controls,
    .pms-diagnostic-summary,
    .pms-diagnostic-cache-grid { grid-template-columns: 1fr; }
    .pms-diagnostic-json-grid { grid-template-columns: 1fr; }
}

@media (max-width: 680px) {
    .pms-diagnostic-shell { width: calc(100% - 20px); }
    .pms-diagnostic-form-actions,
    .pms-diagnostic-endpoint-meta { align-items: stretch; flex-direction: column; }
    .pms-diagnostic-form-actions button { width: 100%; }
    .pms-diagnostic-endpoint summary { padding: 13px; }
    .pms-diagnostic-endpoint-api { display: none; }
    .pms-diagnostic-endpoint-body { padding: 0 12px 12px; }
    .pms-diagnostic-endpoint-meta span { text-align: left; }
    .pms-diagnostic-json-grid pre,
    .pms-diagnostic-cache-grid pre { max-height: 420px; font-size: 9px; }
}

/* Provider-neutral Payments workspace */
.payments-container { display: grid; gap: 22px; }
.payments-alert {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    padding: 14px 16px;
    border: 1px solid #cbd5e1;
    border-radius: 14px;
    background: #f8fafc;
    color: #334155;
}
.payments-alert > div,
.payments-alert > span { display: grid; gap: 3px; }
.payments-alert.is-error { border-color: #fecaca; background: #fff1f2; color: #9f1239; }
.payments-alert.is-success { border-color: #bbf7d0; background: #f0fdf4; color: #166534; }
.payments-alert.is-info { border-color: #bae6fd; background: #f0f9ff; color: #075985; }
.payments-metric-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}
.payments-metric,
.payments-panel,
.payments-detail-hero {
    border: 1px solid #e2e8f0;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .05);
}
.payments-metric { display: grid; gap: 5px; padding: 18px; }
.payments-metric > span,
.payments-metric > small { color: #64748b; }
.payments-metric > strong { color: #0f172a; font-size: 1.55rem; }
.payments-metric.has-attention { border-color: #fdba74; background: #fff7ed; }
.payments-panel { padding: 22px; }
.payments-panel-heading {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    align-items: flex-start;
    margin-bottom: 18px;
}
.payments-panel-heading h2 { margin: 0 0 4px; color: #0f172a; }
.payments-panel-heading p,
.payments-empty { margin: 0; color: #64748b; }
.payments-provider-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 12px;
}
.payments-provider {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px 12px;
    padding: 15px;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    background: #f8fafc;
}
.payments-provider > div,
.payments-provider > div span { display: grid; gap: 3px; }
.payments-provider > div span,
.payments-provider > small { color: #64748b; }
.payments-provider > small { grid-column: 1 / -1; }
.payments-status {
    display: inline-flex;
    width: fit-content;
    align-items: center;
    padding: 5px 9px;
    border-radius: 999px;
    background: #e2e8f0;
    color: #475569;
    font-size: .78rem;
    font-weight: 800;
    line-height: 1.2;
}
.payments-status.is-success { background: #dcfce7; color: #166534; }
.payments-status.is-error { background: #ffe4e6; color: #9f1239; }
.payments-status.is-pending { background: #fef3c7; color: #92400e; }
.payments-status.is-muted { background: #e2e8f0; color: #475569; }
.payments-filters {
    display: grid;
    grid-template-columns: minmax(190px, 1.4fr) repeat(3, minmax(145px, 1fr)) auto auto;
    gap: 10px;
    align-items: end;
    margin-bottom: 18px;
}
.payments-filters label,
.payments-action label {
    display: grid;
    gap: 6px;
    color: #475569;
    font-size: .82rem;
    font-weight: 700;
}
.payments-filters input,
.payments-filters select,
.payments-action input,
.payments-action textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 11px;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    background: #fff;
    color: #0f172a;
    font: inherit;
}
.payments-action textarea { min-height: 80px; resize: vertical; }
.payments-primary-button,
.payments-secondary-button,
.payments-danger-button {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-height: 40px;
    box-sizing: border-box;
    padding: 9px 14px;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    font: inherit;
    font-weight: 800;
    text-decoration: none;
}
.payments-primary-button { background: #0f766e; color: #fff; }
.payments-secondary-button { border-color: #cbd5e1; background: #fff; color: #334155; }
.payments-danger-button { background: #be123c; color: #fff; }
.payments-obligation-list { display: grid; gap: 9px; }
.payments-obligation-row {
    display: grid;
    grid-template-columns: minmax(170px, 1.3fr) minmax(140px, 1fr) minmax(140px, .8fr) auto 14px;
    gap: 16px;
    align-items: center;
    padding: 14px 15px;
    border: 1px solid #e2e8f0;
    border-radius: 13px;
    color: #0f172a;
    text-decoration: none;
}
.payments-obligation-row:hover { border-color: #94a3b8; background: #f8fafc; }
.payments-obligation-row.needs-review { border-left: 4px solid #e11d48; }
.payments-obligation-main,
.payments-obligation-provider,
.payments-obligation-amount { display: grid; gap: 3px; }
.payments-obligation-row span { color: #64748b; font-size: .85rem; }
.payments-pagination {
    display: flex;
    justify-content: center;
    gap: 14px;
    align-items: center;
    margin-top: 18px;
    color: #64748b;
}
.payments-pagination a { color: #0f766e; font-weight: 800; }
.payments-detail-hero {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    align-items: center;
    padding: 24px;
    border-left: 6px solid #94a3b8;
}
.payments-detail-hero.is-success { border-left-color: #16a34a; }
.payments-detail-hero.is-error { border-left-color: #e11d48; }
.payments-detail-hero.is-pending { border-left-color: #d97706; }
.payments-detail-hero h2 { margin: 3px 0 5px; }
.payments-detail-hero p,
.payments-detail-hero span { margin: 0; color: #64748b; }
.payments-detail-hero > strong { font-size: 1.8rem; }
.payments-detail-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 18px;
}
.payments-definition-list { display: grid; gap: 0; margin: 0; }
.payments-definition-list > div {
    display: grid;
    grid-template-columns: minmax(130px, .8fr) minmax(0, 1.2fr);
    gap: 12px;
    padding: 10px 0;
    border-bottom: 1px solid #f1f5f9;
}
.payments-definition-list dt { color: #64748b; }
.payments-definition-list dd {
    margin: 0;
    color: #0f172a;
    font-weight: 700;
    overflow-wrap: anywhere;
}
.payments-action-stack { display: grid; gap: 10px; }
.payments-action { border: 1px solid #e2e8f0; border-radius: 12px; overflow: hidden; }
.payments-action summary { padding: 13px 15px; cursor: pointer; color: #0f172a; font-weight: 800; }
.payments-action form { display: grid; gap: 12px; padding: 0 15px 15px; }
.payments-action .payments-confirm { display: flex; align-items: flex-start; gap: 8px; font-weight: 600; }
.payments-action .payments-confirm input { width: auto; margin-top: 2px; }
.payments-table-wrap { overflow-x: auto; }
.payments-table { width: 100%; border-collapse: collapse; }
.payments-table th,
.payments-table td {
    padding: 11px 10px;
    border-bottom: 1px solid #e2e8f0;
    text-align: left;
    vertical-align: top;
}
.payments-table th {
    color: #64748b;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .03em;
}
.payments-timeline { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.payments-timeline li {
    position: relative;
    display: grid;
    grid-template-columns: 12px minmax(0, 1fr) auto;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid #f1f5f9;
}
.payments-timeline-dot {
    width: 9px;
    height: 9px;
    margin-top: 5px;
    border-radius: 999px;
    background: #0f766e;
}
.payments-timeline div { display: grid; gap: 3px; }
.payments-timeline div span,
.payments-timeline time { color: #64748b; font-size: .82rem; }
.apartment-deposit-summary {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
}
.apartment-deposit-summary > div {
    display: grid;
    gap: 4px;
    padding: 11px;
    border: 1px solid #e2e8f0;
    border-radius: 11px;
    background: #f8fafc;
}
.apartment-deposit-summary span { color: #64748b; font-size: .78rem; }

@media (max-width: 960px) {
    .payments-metric-grid,
    .payments-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .payments-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .payments-obligation-row { grid-template-columns: minmax(0, 1fr) auto; }
    .payments-obligation-provider,
    .payments-obligation-amount { grid-column: 1; }
    .apartment-deposit-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
    .payments-metric-grid,
    .payments-detail-grid,
    .payments-filters { grid-template-columns: 1fr; }
    .payments-panel-heading,
    .payments-detail-hero { flex-direction: column; }
    .payments-timeline li { grid-template-columns: 12px minmax(0, 1fr); }
    .payments-timeline time { grid-column: 2; }
    .apartment-deposit-summary { grid-template-columns: 1fr; }
}

/* Property operations hub */
.property-operations-page {
    background: #f4f7fb;
}

.property-operations-shell {
    width: min(1360px, calc(100% - 40px));
    margin: 0 auto;
    padding: 28px 0 48px;
}

.property-breadcrumb {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 16px;
    color: #8290a3;
    font-size: .82rem;
    font-weight: 700;
}

.property-breadcrumb a {
    color: #52657a;
    text-decoration: none;
}

.property-breadcrumb a:hover {
    color: #17324d;
}

.property-breadcrumb i {
    font-size: .62rem;
}

.property-hero {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    padding: 25px 28px;
    border: 1px solid #dfe7f1;
    border-radius: 24px;
    background:
        radial-gradient(circle at 94% 0, rgba(55, 116, 183, .11), transparent 31%),
        #fff;
    box-shadow: 0 12px 32px rgba(34, 55, 78, .07);
}

.property-hero-identity,
.property-stay-heading,
.property-section-heading > div,
.property-deposit-heading,
.property-maintenance-card header {
    display: flex;
    align-items: center;
    gap: 15px;
    min-width: 0;
}

.property-hero-icon {
    display: grid;
    place-items: center;
    flex: 0 0 58px;
    width: 58px;
    height: 58px;
    border-radius: 17px;
    background: #e9f2fb;
    color: #245d96;
    font-size: 1.35rem;
}

.property-eyebrow,
.property-stay-kicker {
    display: block;
    margin-bottom: 4px;
    color: #718299;
    font-size: .73rem;
    font-weight: 850;
    letter-spacing: .075em;
    text-transform: uppercase;
}

.property-hero h1 {
    margin: 0;
    color: #162f49;
    font-size: clamp(1.6rem, 3vw, 2.25rem);
    line-height: 1.08;
}

.property-hero p {
    margin: 7px 0 0;
    color: #6d7e92;
    font-weight: 650;
}

.property-hero-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
}

.property-state-pill,
.property-readiness-pill {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 9px 13px;
    border: 1px solid transparent;
    border-radius: 999px;
    font-size: .82rem;
    font-weight: 850;
    white-space: nowrap;
}

.property-hero-actions > a,
.property-primary-action {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 42px;
    padding: 10px 15px;
    border-radius: 12px;
    background: #17324d;
    color: #fff;
    font-size: .84rem;
    font-weight: 800;
    text-decoration: none;
}

.property-state-pill.is-complete,
.property-readiness-pill.is-complete {
    border-color: #bfe3cd;
    background: #eaf7ef;
    color: #217044;
}

.property-state-pill.is-warning,
.property-readiness-pill.is-warning {
    border-color: #f2d6a0;
    background: #fff7e6;
    color: #98600a;
}

.property-state-pill.is-error,
.property-readiness-pill.is-error {
    border-color: #efc4c1;
    background: #fff0ef;
    color: #a63a34;
}

.property-state-pill.is-info,
.property-readiness-pill.is-info {
    border-color: #c9dff3;
    background: #edf5fc;
    color: #2b6399;
}

.property-state-pill.is-muted,
.property-readiness-pill.is-muted {
    border-color: #dde4ec;
    background: #f3f6f9;
    color: #728196;
}

.property-operations-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.8fr) minmax(310px, .72fr);
    gap: 22px;
    align-items: start;
    margin-top: 22px;
}

.property-stays-column,
.property-operations-column,
.property-stay-list {
    display: grid;
    gap: 22px;
}

.property-section,
.property-side-section {
    border: 1px solid #dfe7f1;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 9px 26px rgba(34, 55, 78, .055);
}

.property-section {
    padding: 23px;
}

.property-side-section {
    position: sticky;
    top: 18px;
    padding: 21px;
}

.property-section-heading,
.property-side-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.property-section-icon {
    display: grid;
    place-items: center;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    background: #eaf2fa;
    color: #29669f;
}

.property-section-icon.is-next {
    background: #f0ecfb;
    color: #6552a4;
}

.property-section-heading h2,
.property-side-heading h2 {
    margin: 0;
    color: #18324c;
    font-size: 1.02rem;
}

.property-section-heading p,
.property-side-heading p {
    margin: 4px 0 0;
    color: #7b899b;
    font-size: .8rem;
}

.property-section-heading > span {
    display: grid;
    place-items: center;
    min-width: 30px;
    height: 30px;
    padding: 0 8px;
    border-radius: 999px;
    background: #edf2f7;
    color: #516378;
    font-size: .75rem;
    font-weight: 850;
}

.property-stay-card {
    overflow: hidden;
    border: 1px solid #dde6ef;
    border-radius: 18px;
    background: #fff;
}

.property-stay-card.is-next {
    border-color: #ded9f2;
    background: linear-gradient(180deg, #fdfcff 0, #fff 150px);
}

.property-stay-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    padding: 20px 20px 17px;
}

.property-stay-icon {
    display: grid;
    place-items: center;
    flex: 0 0 43px;
    width: 43px;
    height: 43px;
    border-radius: 13px;
    background: #eef4fa;
    color: #3b678f;
}

.property-stay-icon.is-warning {
    background: #fff3dc;
    color: #a46508;
}

.property-stay-icon.is-info {
    background: #eaf3fb;
    color: #2b6399;
}

.property-stay-icon.is-muted {
    background: #f0edf9;
    color: #6857a1;
}

.property-stay-heading h3 {
    margin: 0;
    color: #17324d;
    font-size: 1.16rem;
}

.property-stay-heading p {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin: 6px 0 0;
    color: #6f7f92;
    font-size: .8rem;
    font-weight: 650;
}

.property-stay-heading p i {
    color: #a3adba;
    font-size: .66rem;
}

.property-stay-facts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    border-top: 1px solid #edf1f5;
    border-bottom: 1px solid #edf1f5;
    background: #fafbfd;
}

.property-stay-facts > div {
    min-width: 0;
    padding: 13px 16px;
    border-right: 1px solid #e8edf3;
}

.property-stay-facts > div:last-child {
    border-right: 0;
}

.property-stay-facts span,
.property-deposit-strip dt {
    display: block;
    margin-bottom: 4px;
    color: #8491a2;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .045em;
    text-transform: uppercase;
}

.property-stay-facts strong {
    display: block;
    overflow: hidden;
    color: #263e57;
    font-size: .8rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.property-status-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 18px 20px;
}

.property-status-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 11px;
    border: 1px solid transparent;
    border-radius: 13px;
}

.property-status-item > span {
    display: grid;
    place-items: center;
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    border-radius: 9px;
    background: rgba(255, 255, 255, .72);
}

.property-status-item small,
.property-status-item strong {
    display: block;
}

.property-status-item small {
    margin-bottom: 3px;
    color: #75869b;
    font-size: .62rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.property-status-item strong {
    overflow: hidden;
    font-size: .76rem;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.property-status-item.is-complete {
    border-color: #d3eadc;
    background: #eff8f2;
    color: #247047;
}

.property-status-item.is-warning {
    border-color: #f3dfb7;
    background: #fff8e9;
    color: #96610e;
}

.property-status-item.is-error {
    border-color: #f0d0cd;
    background: #fff2f1;
    color: #a53c36;
}

.property-status-item.is-muted {
    border-color: #e5e9ef;
    background: #f5f7f9;
    color: #758397;
}

.property-deposit-strip,
.property-contact-strip {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 0 20px 16px;
    padding: 14px 15px;
    border-radius: 14px;
}

.property-deposit-strip {
    border: 1px solid #e5dbbd;
    background: #fffaf0;
}

.property-deposit-heading > span {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #fff;
    color: #8b650f;
}

.property-deposit-heading small,
.property-contact-strip small {
    display: block;
    margin-bottom: 3px;
    color: #7c8797;
    font-size: .68rem;
    font-weight: 850;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.property-deposit-heading strong {
    color: #6e5212;
    font-size: .86rem;
}

.property-deposit-strip dl {
    display: flex;
    align-items: center;
    gap: 18px;
    margin: 0;
}

.property-deposit-strip dl div {
    min-width: 74px;
}

.property-deposit-strip dd {
    margin: 0;
    color: #34475c;
    font-size: .8rem;
    font-weight: 850;
}

.property-deposit-strip > a {
    color: #76560e;
    font-size: .77rem;
    font-weight: 850;
    text-decoration: none;
    white-space: nowrap;
}

.property-payment-link-strip {
    display: grid;
    grid-template-columns: minmax(150px, .8fr) minmax(240px, 1.2fr);
    align-items: start;
    border-color: #cfe2ef;
    background: #f4f9fc;
}

.property-payment-link-strip .property-deposit-heading > span {
    color: #25617e;
}

.property-payment-link-strip .property-deposit-heading strong {
    color: #244c66;
}

.property-payment-link-strip > p,
.property-payment-link-strip > a,
.property-payment-link-actions,
.property-payment-link-form {
    grid-column: 1 / -1;
}

.property-payment-link-actions {
    padding: 4px 0 0;
}

.property-payment-link-form {
    display: flex;
    align-items: flex-end;
    gap: 9px;
    flex-wrap: wrap;
    padding-top: 10px;
    border-top: 1px solid #dbe8f0;
}

.property-payment-link-form > label {
    display: grid;
    gap: 5px;
    color: #52677d;
    font-size: .7rem;
    font-weight: 750;
}

.property-payment-link-form input:not([type="checkbox"]) {
    min-height: 38px;
    width: 130px;
    padding: 8px 10px;
    border: 1px solid #d2dee8;
    border-radius: 9px;
    background: #fff;
    color: #253e55;
    font: inherit;
}

.property-payment-link-form button {
    min-height: 38px;
    padding: 9px 12px;
    border: 0;
    border-radius: 9px;
    background: #255c78;
    color: #fff;
    font: inherit;
    font-size: .74rem;
    font-weight: 850;
    cursor: pointer;
}

.property-payment-link-form > small {
    flex-basis: 100%;
    color: #6d7f90;
    line-height: 1.45;
}

.property-contact-strip {
    border: 1px solid #dce7f2;
    background: #f3f8fc;
}

.property-contact-strip > div {
    display: flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.property-contact-strip > div small {
    flex-basis: 100%;
    margin: 0 0 -4px;
}

.property-contact-strip a {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: #2c587e;
    font-size: .78rem;
    font-weight: 750;
    text-decoration: none;
}

.property-whatsapp-action {
    padding: 9px 12px;
    border-radius: 10px;
    background: #e8f7ee;
    color: #247144 !important;
    white-space: nowrap;
}

.property-stay-actions {
    display: flex;
    align-items: center;
    gap: 9px;
    flex-wrap: wrap;
    padding: 0 20px 18px;
}

.property-stay-actions > a:not(.property-primary-action),
.property-stay-actions > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    min-height: 39px;
    padding: 9px 12px;
    border: 1px solid #d8e1eb;
    border-radius: 11px;
    background: #fff;
    color: #36536f;
    font-family: inherit;
    font-size: .76rem;
    font-weight: 800;
    text-decoration: none;
    cursor: pointer;
}

.property-sync-note {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #9b6a15;
    font-size: .7rem;
    font-weight: 700;
}

.property-cleaning-history summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 14px 20px;
    color: #52677d;
    font-size: .76rem;
    font-weight: 800;
    cursor: pointer;
    list-style: none;
}

.property-cleaning-history summary::-webkit-details-marker {
    display: none;
}

.property-cleaning-history[open] summary > i {
    transform: rotate(180deg);
}

.property-source-note {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    padding: 11px 20px;
    border-top: 1px solid #edf1f5;
    background: #fafbfd;
    color: #7a899b;
    font-size: .68rem;
}

.property-empty-state {
    display: flex;
    align-items: center;
    gap: 15px;
    min-height: 116px;
    padding: 20px;
    border: 1px dashed #d8e2ec;
    border-radius: 16px;
    background: #fafbfd;
}

.property-empty-state > span {
    display: grid;
    place-items: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border-radius: 13px;
    background: #edf3f8;
    color: #68809a;
}

.property-empty-state h3 {
    margin: 0;
    color: #29445f;
    font-size: .93rem;
}

.property-empty-state p {
    margin: 5px 0 0;
    color: #7c8b9d;
    font-size: .79rem;
}

.property-side-heading {
    padding-bottom: 15px;
    border-bottom: 1px solid #edf1f5;
}

.property-housekeeping-card.room-housekeeping-panel {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 12px;
    margin: 0 0 12px;
    padding: 14px;
    border-width: 1px;
    border-radius: 15px;
    box-shadow: none;
}

.property-operation-icon {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 11px;
    background: rgba(255, 255, 255, .8);
    color: inherit;
}

.property-housekeeping-card .room-housekeeping-panel-copy strong {
    font-size: .88rem;
}

.property-housekeeping-card .room-housekeeping-panel-copy span {
    font-size: .7rem;
}

.property-housekeeping-card > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: auto;
    padding: 8px 10px;
    border: 0;
    border-radius: 9px;
    background: #fff;
    color: inherit;
    font-size: .72rem;
    font-weight: 850;
    cursor: pointer;
}

.property-cleaning-history {
    margin: -3px 0 12px;
    border: 1px solid #e5eaf0;
    border-radius: 12px;
}

.property-cleaning-history summary {
    padding: 11px 13px;
}

.property-cleaning-history > div {
    display: grid;
    gap: 0;
    padding: 0 13px 9px;
}

.property-cleaning-history p {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin: 0;
    padding: 8px 0;
    border-top: 1px solid #edf1f5;
    color: #6d7c90;
    font-size: .7rem;
}

.property-maintenance-card {
    overflow: hidden;
    margin-top: 12px;
    border: 1px solid #e2e7ed;
    border-radius: 15px;
}

.property-maintenance-card header {
    padding: 14px;
    background: #fafbfd;
}

.property-operation-icon.is-maintenance {
    background: #fff2e5;
    color: #a65b0a;
}

.property-maintenance-card header small,
.property-maintenance-card header strong {
    display: block;
}

.property-maintenance-card header small {
    color: #8491a1;
    font-size: .66rem;
    font-weight: 850;
    letter-spacing: .05em;
    text-transform: uppercase;
}

.property-maintenance-card header strong {
    margin-top: 3px;
    color: #2b435b;
    font-size: .84rem;
}

.property-maintenance-card header > a {
    display: grid;
    place-items: center;
    margin-left: auto;
    width: 31px;
    height: 31px;
    border-radius: 9px;
    background: #17324d;
    color: #fff;
    text-decoration: none;
}

.property-maintenance-card > p {
    margin: 0;
    padding: 15px;
    color: #7b899a;
    font-size: .78rem;
}

.property-maintenance-card > div {
    display: grid;
}

.property-maintenance-card > div > a {
    display: grid;
    grid-template-columns: 4px minmax(0, 1fr) auto;
    gap: 11px;
    align-items: center;
    padding: 11px 13px;
    border-top: 1px solid #edf1f5;
    color: #2f485f;
    text-decoration: none;
}

.property-maintenance-card > div > a > span {
    width: 4px;
    height: 30px;
    border-radius: 999px;
    background: #d4dce5;
}

.property-maintenance-card > div strong,
.property-maintenance-card > div small {
    display: block;
}

.property-maintenance-card > div strong {
    font-size: .76rem;
}

.property-maintenance-card > div small {
    margin-top: 3px;
    color: #8794a4;
    font-size: .66rem;
}

.property-maintenance-card > div i {
    color: #a0aab6;
    font-size: .68rem;
}

.property-view-all {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 14px;
    border-top: 1px solid #e7ecf2;
    color: #31597f;
    font-size: .72rem;
    font-weight: 850;
    text-decoration: none;
}

.property-health-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 9px;
    margin-top: 12px;
}

.property-health-item {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 12px;
    border: 1px solid #e1e7ee;
    border-radius: 13px;
    background: #f7f9fb;
    color: #617286;
    text-decoration: none;
}

.property-health-item > span {
    display: grid;
    place-items: center;
    flex: 0 0 31px;
    width: 31px;
    height: 31px;
    border-radius: 9px;
    background: #fff;
}

.property-health-item small,
.property-health-item strong {
    display: block;
}

.property-health-item small {
    color: #8692a2;
    font-size: .62rem;
    font-weight: 850;
    text-transform: uppercase;
}

.property-health-item strong {
    overflow: hidden;
    margin-top: 3px;
    font-size: .73rem;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.property-health-item.is-complete {
    border-color: #d3eadc;
    background: #eff8f2;
    color: #247047;
}

.property-health-item.is-error {
    border-color: #f0d0cd;
    background: #fff2f1;
    color: #a53c36;
}

.property-health-item.is-warning {
    border-color: #f3dfb7;
    background: #fff8e9;
    color: #96610e;
}

.property-operation-error {
    grid-column: 1 / -1;
    margin: 0;
    color: #a53c36;
    font-size: .68rem;
}

@media (max-width: 1120px) {
    .property-operations-layout {
        grid-template-columns: 1fr;
    }

    .property-side-section {
        position: static;
    }

    .property-health-grid {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
}

@media (max-width: 760px) {
    .property-operations-shell {
        width: min(100% - 24px, 1360px);
        padding-top: 18px;
    }

    .property-hero,
    .property-stay-card-header,
    .property-deposit-strip,
    .property-contact-strip {
        align-items: flex-start;
        flex-direction: column;
    }

    .property-hero {
        padding: 20px;
    }

    .property-hero-actions {
        justify-content: flex-start;
        width: 100%;
    }

    .property-section {
        padding: 17px;
    }

    .property-status-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        padding: 15px;
    }

    .property-stay-facts {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .property-stay-facts > div:nth-child(2) {
        border-right: 0;
    }

    .property-stay-facts > div:nth-child(-n + 2) {
        border-bottom: 1px solid #e8edf3;
    }

    .property-deposit-strip,
    .property-contact-strip {
        margin-right: 15px;
        margin-left: 15px;
    }

    .property-payment-link-strip {
        grid-template-columns: 1fr;
    }

    .property-deposit-strip dl {
        width: 100%;
        justify-content: space-between;
    }

    .property-contact-strip > div {
        display: grid;
    }

    .property-stay-actions {
        padding-right: 15px;
        padding-left: 15px;
    }
}

@media (max-width: 500px) {
    .property-hero-identity,
    .property-stay-heading {
        align-items: flex-start;
    }

    .property-hero-icon {
        flex-basis: 48px;
        width: 48px;
        height: 48px;
    }

    .property-hero-actions > a,
    .property-state-pill {
        flex: 1 1 auto;
    }

    .property-section-heading {
        align-items: flex-start;
    }

    .property-status-grid {
        grid-template-columns: 1fr;
    }

    .property-status-item strong {
        white-space: normal;
    }

    .property-deposit-strip dl {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .property-stay-actions > a,
    .property-stay-actions > button {
        width: 100%;
    }

    .property-sync-note {
        width: 100%;
    }

    .property-health-grid {
        grid-template-columns: 1fr;
    }

    .property-housekeeping-card.room-housekeeping-panel {
        grid-template-columns: auto minmax(0, 1fr);
    }

    .property-housekeeping-card > button {
        grid-column: 2;
        width: 100%;
    }
}

/* Provider-neutral Smart Access settings */

.smart-access-phase-note {
    margin-bottom: 14px;
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #d8cce9;
    border-radius: 12px;
    background: #faf7ff;
    color: #65458b;
}

.smart-access-phase-note > i { font-size: 15px; }
.smart-access-phase-note strong,
.smart-access-phase-note span { display: block; }
.smart-access-phase-note strong { font-size: 11px; }
.smart-access-phase-note span { margin-top: 2px; font-size: 10px; line-height: 1.4; }
.smart-access-phase-note > div { min-width: 0; flex: 1; }
.smart-access-phase-note > a {
    flex: 0 0 auto;
    color: inherit;
    font-size: 10px;
    font-weight: 850;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.smart-access-phase-note.is-developer { border-color: #b9cee0; background: #f1f7fb; color: #315d7c; }
.smart-access-phase-note .smart-access-developer-copy { margin-top: 7px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 9px; }

.smart-access-settings-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.65fr) minmax(300px, .85fr);
    gap: 18px;
    align-items: start;
}

.smart-access-connections-card,
.smart-access-add-card,
.smart-access-assignment-card,
.smart-access-policy-card { min-width: 0; }

.smart-access-connection-body { padding: 17px; }
.smart-access-connection-form { margin-bottom: 15px; }
.smart-access-connection-form .payments-secret-grid .checkout-settings-field:last-child {
    grid-column: auto;
}

.smart-access-provider-actions {
    padding-top: 15px;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    border-top: 1px solid #e2e8ee;
}

.smart-access-provider-actions form { margin: 0; }
.smart-access-provider-actions button {
    width: auto;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.smart-access-provider-links {
    margin: 10px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 13px;
}
.smart-access-provider-links a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #286b98;
    font-size: 10px;
    font-weight: 850;
    text-decoration: none;
}
.smart-access-provider-links a:hover,
.smart-access-provider-links a:focus-visible { text-decoration: underline; text-underline-offset: 2px; }
.smart-access-provider-create-heading {
    margin: 3px 0 15px;
    padding: 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    border: 1px solid #dce5ec;
    border-radius: 13px;
    background: #f8fbfd;
}
.smart-access-provider-create-heading > div { min-width: 0; flex: 1; }
.smart-access-provider-create-heading strong,
.smart-access-provider-create-heading small { display: block; }
.smart-access-provider-create-heading strong { color: var(--checkout-navy); font-size: 13px; }
.smart-access-provider-create-heading small { margin-top: 3px; color: var(--checkout-muted); font-size: 10px; line-height: 1.4; }
.smart-access-provider-create-heading .smart-access-provider-links { margin: 0; justify-content: flex-end; }

.smart-access-danger-check {
    margin: 0 0 15px;
    padding: 11px 13px;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border: 1px solid #ebc6c4;
    border-radius: 12px;
    background: #fff7f6;
    color: #923d38;
}

.smart-access-danger-check.is-disabled { opacity: .55; }
.smart-access-danger-check input { width: auto; margin: 2px 0 0; }
.smart-access-danger-check strong,
.smart-access-danger-check small { display: block; }
.smart-access-danger-check strong { font-size: 11px; }
.smart-access-danger-check small { margin-top: 3px; font-size: 9px; line-height: 1.4; }
.smart-access-full-button { width: 100%; }

.smart-access-roadmap {
    margin-top: 20px;
    padding-top: 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-top: 1px solid #e0e7ed;
}

.smart-access-roadmap > div { min-width: 0; margin-right: auto; }
.smart-access-roadmap strong,
.smart-access-roadmap small { display: block; }
.smart-access-roadmap strong { color: var(--checkout-navy); font-size: 13px; }
.smart-access-roadmap small { margin-top: 3px; color: var(--checkout-muted); font-size: 10px; }
.smart-access-seam-create + form { margin-top: 16px; }
.smart-access-seam-create .checkout-coming-badge.is-ready {
    background: #e8f7ee;
    color: #16764b;
}
.smart-access-property-heading { margin-top: 42px; }

.smart-access-property-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(360px, .75fr);
    gap: 18px;
    align-items: start;
}

.smart-access-assignment-list { display: grid; gap: 10px; }
.smart-access-assignment {
    border: 1px solid #d9e3eb;
    border-radius: 14px;
    background: #fff;
    overflow: hidden;
}

.smart-access-assignment > summary {
    padding: 13px;
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
    list-style: none;
}

.smart-access-assignment > summary::-webkit-details-marker { display: none; }
.smart-access-assignment[open] > summary { border-bottom: 1px solid #e1e8ee; background: #f9fbfc; }
.smart-access-assignment[open] > summary .payments-details-chevron { transform: rotate(180deg); }
.smart-access-assignment > summary > span:first-child {
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 10px;
    background: #eaf2f8;
    color: #2b6b9d;
}

.smart-access-assignment > summary > div { min-width: 0; margin-right: auto; }
.smart-access-assignment > summary strong,
.smart-access-assignment > summary small { display: block; }
.smart-access-assignment > summary strong { overflow: hidden; color: var(--checkout-navy); font-size: 13px; text-overflow: ellipsis; white-space: nowrap; }
.smart-access-assignment > summary small { margin-top: 3px; color: var(--checkout-muted); font-size: 10px; }
.smart-access-assignment-form { padding: 17px; }
.smart-access-delete-form { padding: 0 17px 17px; display: flex; justify-content: flex-end; }
.smart-access-device-help {
    padding: 10px 17px 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 14px;
    color: var(--checkout-muted);
    font-size: 10px;
}
.smart-access-device-help .smart-access-provider-links { margin: 0; }

.smart-access-form-grid,
.smart-access-language-grid,
.smart-access-toggle-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 14px;
}

.smart-access-toggle-grid { gap: 10px; }
.smart-access-toggle-grid .settings-toggle { margin-bottom: 14px; }
.smart-access-form-grid .checkout-settings-field,
.smart-access-language-grid .checkout-settings-field { min-width: 0; }
.smart-access-form-grid .checkout-number-field input { width: 100%; box-sizing: border-box; }
.smart-access-form-grid .checkout-settings-field select,
.smart-access-form-grid .checkout-settings-field input { width: 100%; box-sizing: border-box; }

.smart-access-assignment textarea,
.smart-access-policy-card textarea,
.smart-access-add-assignment textarea {
    width: 100%;
    min-height: 78px;
    padding: 12px 13px;
    box-sizing: border-box;
    resize: vertical;
    border: 1px solid #d9e2ec;
    border-radius: 12px;
    background: #fff;
    color: var(--checkout-navy);
    font: inherit;
    font-size: 13px;
}

.smart-access-empty-inline {
    padding: 14px;
    display: flex;
    align-items: center;
    gap: 9px;
    border: 1px dashed #cbd8e3;
    border-radius: 12px;
    background: #f9fbfc;
    color: var(--checkout-muted);
    font-size: 11px;
}

.smart-access-add-assignment { margin-top: 14px; border: 1px solid #cedce7; border-radius: 14px; background: #f8fbfd; }
.smart-access-add-assignment > summary {
    padding: 13px 15px;
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    color: #2b6b9d;
    font-size: 12px;
    font-weight: 850;
}

.smart-access-add-assignment > .smart-access-empty-inline { margin: 0 15px 15px; }
.smart-access-instructions { margin: 0 0 16px; border: 1px solid #dce5ec; border-radius: 12px; background: #fbfdff; }
.smart-access-instructions > summary { padding: 11px 13px; cursor: pointer; color: var(--checkout-navy); font-size: 11px; font-weight: 800; }
.smart-access-instructions .smart-access-language-grid { padding: 4px 13px 0; border-top: 1px solid #e3e9ee; }

.smart-access-gates {
    min-width: 0;
    margin: 0 0 16px;
    padding: 14px;
    border: 1px solid #dbe4eb;
    border-radius: 14px;
    background: #f9fbfc;
}

.smart-access-gates legend { padding: 0 6px; color: var(--checkout-navy); font-size: 12px; font-weight: 850; }
.smart-access-gates > p { margin: -2px 0 12px; color: var(--checkout-muted); font-size: 10px; line-height: 1.45; }
.smart-access-gates .settings-toggle { background: #fff; }
.smart-access-policy-toggle { border-color: #cbddeb; background: #f1f7fb; }

.smart-access-copy-card { margin-top: 18px; }
.smart-access-preview-card { margin-top: 18px; padding: 0; overflow: hidden; }
.smart-access-preview-card > summary::-webkit-details-marker { display: none; }
.smart-access-preview-summary {
    padding: 18px 20px;
    display: flex;
    align-items: center;
    gap: 13px;
    cursor: pointer;
    list-style: none;
}
.smart-access-preview-summary-icon {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    display: grid;
    place-items: center;
    border-radius: 12px;
    background: #eaf2f8;
    color: var(--checkout-blue);
}
.smart-access-preview-summary > div { min-width: 0; margin-right: auto; }
.smart-access-preview-summary h3 { margin: 0 0 3px; color: var(--checkout-navy); font-size: 16px; }
.smart-access-preview-summary p { margin: 0; color: var(--checkout-muted); font-size: 11px; line-height: 1.4; }
.smart-access-preview-summary-action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #286b98;
    font-size: 10px;
    font-weight: 850;
    white-space: nowrap;
}
.smart-access-preview-summary-action i { font-size: 9px; transition: transform .15s ease; }
.smart-access-preview-card[open] .smart-access-preview-summary-action i { transform: rotate(180deg); }
.smart-access-preview-body { padding: 20px; border-top: 1px solid #e1e8ed; background: #fbfdfe; }
.smart-access-preview-layout {
    display: grid;
    grid-template-columns: minmax(220px, .7fr) minmax(320px, 1.3fr);
    align-items: start;
    gap: 22px;
}
.smart-access-preview-copy > p { margin: 14px 0 0; color: var(--checkout-muted); font-size: 11px; line-height: 1.55; }
.smart-access-preview-options { margin-top: 14px; }
.smart-access-preview-options .checkout-settings-field { margin-bottom: 13px; }
.smart-access-preview-options select { width: 100%; }
.smart-access-preview-phone {
    width: min(100%, 390px);
    margin: 0 auto;
    padding: 10px;
    border: 1px solid #bfd0dc;
    border-radius: 30px;
    background: #172333;
    box-shadow: 0 18px 38px rgba(20,47,77,.18);
}
.smart-access-preview-phone iframe {
    width: 100%;
    height: 590px;
    display: block;
    border: 0;
    border-radius: 21px;
    background: #eef4f8;
}
.smart-access-copy-boundary {
    margin: 0 0 15px;
    padding: 12px 14px;
    display: flex;
    align-items: flex-start;
    gap: 9px;
    border: 1px solid #cbddeb;
    border-radius: 12px;
    background: #f1f7fb;
    color: #3f6078;
    font-size: 11px;
    line-height: 1.5;
}
.smart-access-copy-boundary i { margin-top: 2px; color: #2b6b9d; }

.smart-access-provider-actions button:disabled,
.smart-access-full-button:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.smart-access-controls-card { margin-bottom: 18px; }
.smart-access-controls-card .checkout-settings-card-header { margin-bottom: 14px; }
.smart-access-controls-summary {
    margin-bottom: 13px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}
.smart-access-controls-summary > span {
    padding: 6px 9px;
    border-radius: 999px;
    background: #edf3f7;
    color: #64798b;
    font-size: 9px;
    font-weight: 750;
}
.smart-access-controls-summary b { color: var(--checkout-navy); font-size: 10px; }
.smart-access-controls-form { display: grid; gap: 12px; }
.smart-access-control-list {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 1px solid #d9e3ea;
    border-radius: 15px;
    background: #fff;
    overflow: hidden;
}
.smart-access-control-row {
    position: relative;
    padding: 13px 14px;
    display: grid;
    grid-template-columns: 36px minmax(0, 1fr) auto 42px;
    align-items: center;
    gap: 11px;
    border-bottom: 1px solid #e6ecf0;
    background: #fff;
    cursor: pointer;
    transition: background .15s ease, opacity .15s ease;
}
.smart-access-control-row:last-child { border-bottom: 0; }
.smart-access-control-row:hover { background: #f9fbfc; }
.smart-access-control-row.is-dependent { padding-left: 29px; }
.smart-access-control-row.is-enabled { background: #f5fbf8; }
.smart-access-control-row.is-blocked { cursor: default; opacity: .62; }
.smart-access-control-icon {
    width: 36px;
    height: 36px;
    display: grid;
    place-items: center;
    border-radius: 11px;
    background: #eaf2f8;
    color: #2b6b9d;
    font-size: 13px;
}
.smart-access-control-row.is-enabled .smart-access-control-icon { background: #dff2e9; color: #207555; }
.smart-access-control-copy { min-width: 0; }
.smart-access-control-copy strong,
.smart-access-control-copy small,
.smart-access-control-copy em { display: block; }
.smart-access-control-copy strong { color: var(--checkout-navy); font-size: 12px; }
.smart-access-control-copy small { margin-top: 3px; color: var(--checkout-muted); font-size: 10px; line-height: 1.4; }
.smart-access-control-copy em { margin-top: 4px; color: #7a8d9b; font-size: 9px; font-style: normal; line-height: 1.35; }
.smart-access-control-copy em i { margin-right: 4px; }
.smart-access-control-state {
    padding: 5px 7px;
    border-radius: 999px;
    background: #eef1f4;
    color: #6a7c8b;
    font-size: 8px;
    font-weight: 900;
    text-transform: uppercase;
    white-space: nowrap;
}
.smart-access-control-row.is-enabled .smart-access-control-state { background: #e1f3e9; color: #19754e; }
.smart-access-control-row > input[type="checkbox"] {
    position: relative;
    width: 42px;
    height: 24px;
    margin: 0;
    padding: 0;
    appearance: none;
    -webkit-appearance: none;
    border: 1px solid #bac8d2;
    border-radius: 999px;
    background: #dce4e9;
    cursor: pointer;
    transition: background .15s ease, border-color .15s ease;
}
.smart-access-control-row > input[type="checkbox"]::after {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 5px rgba(23,50,77,.2);
    transition: transform .15s ease;
}
.smart-access-control-row > input[type="checkbox"]:checked { border-color: #2b8060; background: #2b8060; }
.smart-access-control-row > input[type="checkbox"]:checked::after { transform: translateX(18px); }
.smart-access-control-row > input[type="checkbox"]:focus-visible { outline: 3px solid rgba(39,107,158,.24); outline-offset: 2px; }
.smart-access-control-row > input[type="checkbox"]:disabled { cursor: not-allowed; }
.smart-access-controls-confirmation,
.smart-access-controls-noscript-confirmation {
    padding: 11px 13px;
    display: grid;
    grid-template-columns: 19px minmax(0, 1fr);
    align-items: flex-start;
    gap: 9px;
    border: 1px solid #e5c88e;
    border-radius: 11px;
    background: #fff9ec;
}
.smart-access-controls-confirmation[hidden] { display: none; }
.smart-access-controls-confirmation input,
.smart-access-controls-noscript-confirmation input { width: 17px; height: 17px; margin: 1px 0 0; padding: 0; }
.smart-access-controls-confirmation strong,
.smart-access-controls-confirmation span { display: block; }
.smart-access-controls-confirmation strong { color: #77500f; font-size: 10px; }
.smart-access-controls-confirmation span,
.smart-access-controls-noscript-confirmation span { margin-top: 2px; color: #7d683e; font-size: 9px; line-height: 1.4; }
.smart-access-controls-developer { padding: 10px 12px; border: 1px solid #ccdae4; border-radius: 11px; background: #f5f9fc; }
.smart-access-controls-developer summary { cursor: pointer; color: #315d7c; font-size: 10px; font-weight: 850; }
.smart-access-controls-developer p { margin: 7px 0 0; color: #5d7282; font: 9px/1.5 ui-monospace, SFMono-Regular, Menlo, monospace; }
.smart-access-controls-actions { display: flex; align-items: center; justify-content: flex-end; gap: 14px; }
.smart-access-controls-actions > span { margin-right: auto; color: var(--checkout-muted); font-size: 9px; }
.smart-access-controls-actions .checkout-button { width: auto; min-width: 176px; }

.smart-access-staff-operations {
    margin: 18px 0;
    padding: 16px;
    border: 1px solid #cbddeb;
    border-radius: 14px;
    background: #f4f9fc;
}
.smart-access-staff-operations > h3 { margin: 0 0 5px; color: var(--checkout-navy); font-size: 14px; }
.smart-access-staff-operations > p { margin: 0 0 13px; color: var(--checkout-muted); font-size: 11px; }
.smart-access-operation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.smart-access-operation-card { border: 1px solid #d8e3eb; border-radius: 12px; background: #fff; overflow: hidden; }
.smart-access-operation-card > summary { padding: 12px; display: flex; align-items: center; gap: 10px; cursor: pointer; }
.smart-access-operation-card > summary > i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 9px; background: #e9f3f9; color: #2470a8; }
.smart-access-operation-card > summary span { display: grid; gap: 2px; }
.smart-access-operation-card > summary strong { color: var(--checkout-navy); font-size: 12px; }
.smart-access-operation-card > summary small { color: var(--checkout-muted); font-size: 10px; }
.smart-access-operation-card form { padding: 0 12px 13px; border-top: 1px solid #e5ecf1; }
.smart-access-operation-card form > label:not(.smart-access-override-confirm) { display: grid; gap: 5px; margin: 10px 0; color: var(--checkout-navy); font-size: 10px; font-weight: 800; }
.smart-access-operation-card textarea { width: 100%; padding: 9px; border: 1px solid #cbd8e3; border-radius: 9px; resize: vertical; }
.smart-access-operation-card button { padding: 9px 12px; border: 0; border-radius: 9px; background: var(--checkout-navy); color: #fff; font-weight: 800; cursor: pointer; }
.smart-access-impact-list { margin: 10px 0; padding-left: 18px; color: #456276; font-size: 10px; line-height: 1.5; }
.smart-access-impact-list .is-warning { color: #9a4d18; font-weight: 800; }
.smart-access-command-history { margin: 14px 0; border: 1px solid #dce5ec; border-radius: 12px; background: #fbfdff; }
.smart-access-command-history > summary { padding: 11px 13px; cursor: pointer; color: var(--checkout-navy); font-size: 11px; font-weight: 800; }
.smart-access-command-history > div { border-top: 1px solid #e3e9ee; }
.smart-access-command-history article { padding: 9px 13px; display: grid; grid-template-columns: 1fr auto; gap: 3px 10px; border-bottom: 1px solid #edf1f4; font-size: 10px; }
.smart-access-command-history article:last-child { border-bottom: 0; }
.smart-access-command-history article span,
.smart-access-command-history article small { color: var(--checkout-muted); }
.smart-access-command-history article small { grid-column: 1 / -1; }

@media (max-width: 1050px) {
    .smart-access-settings-layout,
    .smart-access-property-layout,
    .smart-access-preview-layout { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
    .smart-access-form-grid,
    .smart-access-language-grid,
    .smart-access-toggle-grid { grid-template-columns: 1fr; }
    .smart-access-provider-actions { display: grid; grid-template-columns: 1fr; }
    .smart-access-provider-actions button,
    .smart-access-provider-actions form { width: 100%; }
    .smart-access-assignment > summary { align-items: flex-start; flex-wrap: wrap; }
    .smart-access-assignment > summary > div { flex: 1 1 calc(100% - 48px); }
    .smart-access-assignment > summary .payments-badge { margin-left: 46px; }
    .smart-access-control-row,
    .smart-access-control-row.is-dependent {
        padding: 12px;
        grid-template-columns: 36px minmax(0, 1fr) 42px;
        align-items: start;
        gap: 9px;
    }
    .smart-access-control-icon { grid-row: 1 / span 2; }
    .smart-access-control-row > input[type="checkbox"] { grid-column: 3; grid-row: 1; margin-top: 6px; }
    .smart-access-control-state { grid-column: 2; width: fit-content; }
    .smart-access-controls-actions { align-items: stretch; flex-direction: column; }
    .smart-access-controls-actions .checkout-button { width: 100%; }
    .smart-access-operation-grid { grid-template-columns: 1fr; }
    .smart-access-phase-note { flex-wrap: wrap; }
    .smart-access-phase-note > a { margin-left: 30px; }
    .smart-access-provider-create-heading { align-items: flex-start; flex-wrap: wrap; }
    .smart-access-provider-create-heading .smart-access-provider-links { width: 100%; margin-left: 46px; justify-content: flex-start; }
    .smart-access-preview-summary { padding: 15px; align-items: flex-start; flex-wrap: wrap; }
    .smart-access-preview-summary > div { flex: 1 1 calc(100% - 53px); }
    .smart-access-preview-summary-action { margin-left: 53px; }
    .smart-access-preview-body { padding: 14px; }
    .smart-access-preview-phone { padding: 7px; border-radius: 24px; }
    .smart-access-preview-phone iframe { height: 540px; border-radius: 18px; }
}