:root {
    --brand: #17324d;
    --brand-soft: #eaf0f5;
    --accent: #d89b3c;
}

body { background: #f4f6f8; color: #22313f; }
.app-shell { min-height: 100vh; }
.sidebar { width: 260px; background: var(--brand); color: #fff; }
.sidebar .brand { color: #fff; text-decoration: none; letter-spacing: .02em; }
.sidebar .nav-link { color: rgba(255,255,255,.78); border-radius: .5rem; margin-bottom: .25rem; }
.sidebar .nav-link:hover, .sidebar .nav-link.active { color: #fff; background: rgba(255,255,255,.12); }
.sidebar .nav-link.disabled { color: rgba(255,255,255,.42); }
.sidebar .section-label { font-size: .72rem; letter-spacing: .1em; color: rgba(255,255,255,.45); text-transform: uppercase; }
.topbar { background: #fff; border-bottom: 1px solid #e2e8ee; }
.content-wrap { min-width: 0; }
.metric-card { border: 0; box-shadow: 0 4px 18px rgba(23,50,77,.07); }
.metric-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 12px; background: var(--brand-soft); color: var(--brand); font-weight: 700; }
.table > :not(caption) > * > * { vertical-align: middle; }
.money { text-align: right; font-variant-numeric: tabular-nums; }
.guest-shell { min-height: 100vh; background: linear-gradient(135deg, #17324d 0%, #285779 55%, #d89b3c 160%); }
.login-card { max-width: 430px; border: 0; box-shadow: 0 20px 55px rgba(0,0,0,.22); }
.badge-stage { background: #edf1f4; color: #5f6b76; }
details summary { cursor: pointer; }
.attachment-preview-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: .75rem; }
.attachment-preview-item { position: relative; min-width: 0; overflow: hidden; border: 1px solid #dfe5ea; border-radius: .75rem; background: #fff; }
.attachment-preview-open { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.attachment-preview-open:focus-visible { outline: 3px solid rgba(13,110,253,.35); outline-offset: -3px; }
.attachment-preview-media { display: block; width: 100%; height: 96px; border: 0; background: #eef2f5; object-fit: cover; }
.attachment-pdf-tile { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .35rem; color: #5f6b76; font-size: .75rem; }
.attachment-pdf-icon { padding: .25rem .45rem; border-radius: .25rem; background: #b42318; color: #fff; font-weight: 700; }
.attachment-preview-remove { position: absolute; top: .35rem; right: .35rem; width: 1.75rem; height: 1.75rem; padding: 0; border: 2px solid #fff; border-radius: 50%; background: #c62828; color: #fff; font-size: 1.25rem; line-height: 1.35rem; box-shadow: 0 2px 6px rgba(0,0,0,.2); }
.attachment-preview-remove:hover, .attachment-preview-remove:focus-visible { background: #a71919; }
.attachment-preview-details { display: flex; flex-direction: column; gap: .1rem; padding: .5rem .625rem; font-size: .75rem; }
.attachment-preview-name { overflow: hidden; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.attachment-modal-body { display: flex; align-items: center; justify-content: center; min-height: 240px; padding: 0; overflow: hidden; background: #20252a; }
.attachment-modal-image { display: block; max-width: 100%; max-height: calc(100vh - 10rem); object-fit: contain; }
.attachment-modal-pdf { width: 100%; height: calc(100vh - 10rem); min-height: 420px; border: 0; background: #fff; }

@media (max-width: 575.98px) {
    .attachment-modal-pdf { min-height: 65vh; }
}

@media (max-width: 991.98px) {
    .sidebar { width: 100%; }
    .desktop-sidebar { display: none !important; }
}