* { box-sizing: border-box; }
html { min-height: 100%; background: #eef3f6; }
body { margin: 0; min-height: 100%; color: #20303d; background: #eef3f6; font-family: "Segoe UI", Arial, sans-serif; font-size: 15px; line-height: 1.45; }
a { color: #0f6171; text-decoration: none; }
a:hover, a:focus { color: #093f4a; text-decoration: underline; }
button, input, select, textarea { font: inherit; }
.topbar { height: 72px; background: #fff; border-bottom: 1px solid #d8e0e5; }
.topbar-inner { max-width: 1500px; height: 100%; margin: 0 auto; padding: 0 28px; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; -ms-flex-pack: justify; justify-content: space-between; }
.brand { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; color: #173b52; font-weight: 800; letter-spacing: .08em; }
.brand:hover { text-decoration: none; }
.brand small { display: block; color: #758793; font-size: 10px; font-weight: 600; letter-spacing: .12em; }
.brand-mark { width: 36px; height: 36px; margin-right: 10px; display: inline-block; border-radius: 9px; background: #e46b47; color: #fff; text-align: center; line-height: 36px; font-size: 20px; }
.brand-mark.large { width: 52px; height: 52px; line-height: 52px; font-size: 28px; }
.account { display: -ms-flexbox; display: flex; gap: 14px; -ms-flex-align: center; align-items: center; color: #5d6c75; font-size: 13px; }
.account form { margin-left: 14px; }
.link-button { padding: 0; border: 0; background: transparent; color: #0f6171; cursor: pointer; }
.shell { max-width: 1500px; min-height: calc(100vh - 108px); margin: 0 auto; display: -ms-flexbox; display: flex; }
.sidebar { width: 238px; padding: 30px 18px; background: #153b52; color: #fff; -ms-flex: 0 0 238px; flex: 0 0 238px; }
.nav-link { display: block; margin-bottom: 4px; padding: 11px 14px; border-radius: 6px; color: #dce8ee; font-weight: 600; }
.nav-link:hover, .nav-link:focus { background: #22536d; color: #fff; text-decoration: none; }
.nav-sub-link { padding-left: 22px; font-size: 13px; font-weight: 600; }
.nav-section { margin: 24px 14px 8px; color: #88a8ba; font-size: 10px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.content { width: calc(100% - 238px); padding: 38px 42px 60px; }
.footer { padding: 12px 24px; background: #fff; border-top: 1px solid #d8e0e5; color: #7a8992; text-align: center; font-size: 11px; }
.page-header { margin-bottom: 28px; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: end; align-items: flex-end; }
.page-header h1 { margin: 2px 0 6px; color: #173b52; font-size: 31px; line-height: 1.15; }
.page-header p { margin: 0; }
.eyebrow { color: #d05b38; font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.muted { color: #71808a; }
.header-actions { display: -ms-flexbox; display: flex; gap: 10px; }
.btn { display: inline-block; padding: 9px 15px; border: 1px solid #b8c7cf; border-radius: 5px; background: #fff; color: #234456; font-weight: 700; line-height: 1.2; cursor: pointer; text-align: center; }
.btn:hover, .btn:focus { background: #edf3f6; text-decoration: none; }
.btn-primary { border-color: #0f6171; background: #0f6171; color: #fff; }
.btn-primary:hover, .btn-primary:focus { background: #0b4d5a; color: #fff; }
.btn-secondary { border-color: #aebdc5; background: #fff; }
.btn-danger { border-color: #b84d43; background: #fff; color: #9a392f; }
.btn-danger:hover, .btn-danger:focus { background: #fbe8e5; color: #7d2d25; }
.btn-light { border-color: #fff; background: #fff; color: #173b52; }
.btn-small { padding: 6px 10px; font-size: 12px; white-space: nowrap; }
.btn-block { width: 100%; }
.stat-grid { margin: 0 -8px 28px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.stat-card { width: calc(25% - 16px); min-width: 180px; margin: 0 8px 16px; padding: 20px; border: 1px solid #dae3e8; border-radius: 8px; background: #fff; box-shadow: 0 3px 12px rgba(24,54,70,.04); }
.stat-card span, .stat-card small { display: block; color: #758691; }
.stat-card strong { display: block; margin: 5px 0; color: #173b52; font-size: 31px; }
.stat-card.warning { border-left: 4px solid #d98a29; }
.two-columns { margin: 0 -8px 20px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.two-columns > .panel { width: calc(50% - 16px); margin: 0 8px 16px; }
.panel { margin-bottom: 22px; padding: 22px; border: 1px solid #d9e2e7; border-radius: 8px; background: #fff; box-shadow: 0 3px 12px rgba(24,54,70,.035); }
.panel-header { margin-bottom: 16px; display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: center; align-items: center; }
.panel h2 { margin: 1px 0; color: #173b52; font-size: 20px; }
.panel h3 { color: #244c61; font-size: 16px; }
.document-row { display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 12px; padding: 13px 0; border-bottom: 1px solid #edf1f3; }
.document-row:last-child { border-bottom: 0; }
.document-row form { margin: 0 8px; }
.document-row .grow, .location-list .grow { min-width: 0; }
.document-row strong, .document-row span { display: block; }
.document-row span { color: #778690; font-size: 12px; }
.file-icon { width: 42px; height: 42px; border-radius: 7px; background: #e8f1f3; color: #0f6171; text-align: center; line-height: 42px; font-size: 11px; font-weight: 800; -ms-flex: 0 0 42px; flex: 0 0 42px; }
.grow { -ms-flex: 1 1 auto; flex: 1 1 auto; }
.location-list a { padding: 12px 2px; border-bottom: 1px solid #edf1f3; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 10px; color: #264757; }
.location-list a:hover { text-decoration: none; background: #fafcfd; }
.location-list strong, .location-list small { display: block; }
.location-list small { color: #7a8992; }
.location-dot { width: 9px; height: 9px; border-radius: 50%; background: #65a59c; }
.pill { display: inline-block; margin: 2px; padding: 4px 8px; border-radius: 12px; background: #eaf1f4; color: #49616d; font-size: 11px; white-space: nowrap; }
.pill.dark { background: #244f60; color: #fff; }
.support-strip { padding: 20px 22px; border-radius: 8px; background: #e46b47; color: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 14px; }
.support-strip div { -ms-flex: 1 1 auto; flex: 1 1 auto; }
.support-strip strong, .support-strip span { display: block; }
.support-strip div span { color: #ffe9e1; font-size: 13px; }
.filter-bar { margin-bottom: 20px; padding: 14px; border: 1px solid #d9e2e7; border-radius: 7px; background: #fff; display: -ms-flexbox; display: flex; gap: 10px; }
.filter-bar .form-control { min-width: 170px; }
.form-control { width: 100%; min-height: 40px; padding: 8px 10px; border: 1px solid #b9c7cf; border-radius: 5px; background: #fff; color: #20303d; }
.form-control:focus { border-color: #0f6171; outline: 2px solid #cce4e8; }
.cards-list { display: block; }
.location-card { margin-bottom: 12px; padding: 18px 20px; border: 1px solid #d9e2e7; border-radius: 8px; background: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 16px; color: #263d49; }
.location-card:hover { border-color: #aabdc7; box-shadow: 0 5px 16px rgba(24,54,70,.07); text-decoration: none; }
.location-card h2 { margin: 0 0 3px; color: #173b52; font-size: 18px; }
.location-card p, .location-card span { margin: 0; color: #71808a; font-size: 13px; }
.location-symbol { width: 46px; height: 46px; border-radius: 50%; background: #e7f0f2; color: #0f6171; text-align: center; line-height: 46px; font-size: 19px; font-weight: 800; -ms-flex: 0 0 46px; flex: 0 0 46px; }
.location-metrics { min-width: 92px; text-align: right; }
.location-metric { display: -ms-flexbox; display: flex; -ms-flex-pack: end; justify-content: flex-end; -ms-flex-align: baseline; align-items: baseline; }
.location-metric + .location-metric { margin-top: 1px; }
.location-metrics strong { color: #173b52; font-size: 18px; }
.location-metrics small { margin-left: 7px; color: #84919a; }
.management-row { margin-bottom: 12px; padding: 17px 20px; border: 1px solid #d9e2e7; border-radius: 8px; background: #fff; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; gap: 15px; }
.management-row h2 { margin: 0 0 3px; color: #173b52; font-size: 18px; }
.management-row p, .management-row .grow > span { margin: 0; color: #71808a; font-size: 13px; }
.management-row.planning-warning { border-left: 4px solid #d98a29; }
.management-row.planning-warning .location-symbol { background: #fff0d7; color: #8b5a17; }
.inactive-row { background: #f4f6f7; opacity: .82; }
.row-actions { display: -ms-flexbox; display: flex; gap: 7px; -ms-flex-align: center; align-items: center; }
.row-actions form, .header-actions form { margin: 0; }
.breadcrumb { margin-bottom: 15px; color: #7b8a93; font-size: 12px; }
.breadcrumb span { margin: 0 6px; }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 10px; border-bottom: 2px solid #cfdce2; color: #58707c; font-size: 11px; letter-spacing: .06em; text-align: left; text-transform: uppercase; }
td { padding: 12px 10px; border-bottom: 1px solid #e8eef1; vertical-align: middle; }
.status { display: inline-block; padding: 4px 8px; border-radius: 11px; background: #e7eef2; color: #516874; font-size: 11px; font-weight: 700; white-space: nowrap; }
.status-active, .status-published, .status-completed, .status-answered { background: #dff0e9; color: #2c6d58; }
.status-open, .status-pending, .status-scheduled { background: #fff0d7; color: #8b5a17; }
.status-postponed { background: #f4e6fa; color: #74418a; }
.status-closed, .status-retired, .status-archived { background: #edf0f2; color: #66747b; }
.status-draft { background: #e6eafa; color: #435a99; }
.status-overdue { background: #fbe1dd; color: #a13d30; }
.large-status { padding: 7px 13px; font-size: 12px; }
.tabs-layout { display: -ms-flexbox; display: flex; gap: 28px; }
.tabs-layout > div { width: 50%; }
.timeline { padding-left: 8px; }
.timeline-item { position: relative; padding: 0 0 20px 22px; border-left: 1px solid #d6e0e5; }
.timeline-item strong, .timeline-item span { display: block; }
.timeline-item > div > span { margin-top: 2px; color: #778690; font-size: 12px; }
.timeline-dot { position: absolute; left: -5px; top: 5px; width: 9px; height: 9px; border-radius: 50%; background: #0f6171; }
.form-panel { max-width: 820px; }
.upload-layout { margin: 0 -8px; display: -ms-flexbox; display: flex; -ms-flex-align: start; align-items: flex-start; }
.upload-layout > .panel { margin-left: 8px; margin-right: 8px; }
.upload-panel { width: calc(66.666% - 16px); max-width: none; }
.upload-guide { width: calc(33.333% - 16px); }
.guide-item { margin-top: 17px; padding-bottom: 17px; border-bottom: 1px solid #e5ecef; }
.guide-item strong, .guide-item span, .advanced-link span { display: block; }
.guide-item span, .advanced-link span { margin-top: 3px; color: #71808a; font-size: 13px; }
.advanced-link { margin-top: 20px; padding: 15px; border-radius: 6px; background: #f0f5f7; }
.advanced-link a { font-weight: 700; }
input[type="file"].form-control { min-height: 54px; padding-top: 14px; background: #f8fbfc; }
.stacked-form p, .form-group { margin: 0 0 17px; }
.stacked-form label { display: block; margin-bottom: 5px; color: #344e5d; font-weight: 700; }
.help-text { display: block; margin-top: 4px; color: #75838d; }
.field-error { display: block; margin-top: 4px; color: #a33d34; }
.check-label { display: -ms-flexbox !important; display: flex !important; -ms-flex-align: center; align-items: center; gap: 8px; }
.check-label input { width: 18px; height: 18px; }
.form-actions { display: -ms-flexbox; display: flex; gap: 10px; padding-top: 6px; }
.report-form { margin-top: 20px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: end; align-items: flex-end; gap: 12px; }
.report-form > div { width: 145px; }
.report-form label { display: block; margin-bottom: 5px; color: #344e5d; font-weight: 700; }
.report-form .btn { min-height: 40px; }
.compact-input { width: 130px; min-width: 0; }
.selection-table input[type="checkbox"] { width: 18px; height: 18px; }
.selection-table td { min-width: 110px; }
.selection-table td:first-child { min-width: 38px; width: 38px; }
.bulk-actions { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-align: end; align-items: flex-end; gap: 22px; }
.bulk-actions > div:first-child { width: 320px; }
.bulk-actions label { display: block; margin-bottom: 5px; font-weight: 700; }
.status-filters { margin: 0 -6px 22px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.filter-card { min-width: 145px; margin: 0 6px 8px; padding: 13px 16px; border: 1px solid #d5e0e5; border-radius: 7px; background: #fff; color: #405b69; }
.filter-card strong, .filter-card span { display: block; }
.filter-card strong { color: #173b52; font-size: 23px; }
.filter-card span { font-size: 12px; }
.filter-card.active { border-color: #0f6171; box-shadow: inset 0 0 0 1px #0f6171; }
.filter-card.overdue strong { color: #a13d30; }
.bulk-resolution { margin: 0 -8px; display: -ms-flexbox; display: flex; }
.bulk-resolution > div { width: 50%; margin: 0 8px; }
.bulk-resolution label { display: block; margin-bottom: 5px; color: #344e5d; font-weight: 700; }
.bulk-resolution .pending-check { margin-top: 12px; }
.executed-pending-panel { margin-top: 28px; border-top: 4px solid #0f6171; }
.select-all { margin: 0; font-size: 13px; }
.messages { margin-bottom: 18px; }
.alert { padding: 11px 14px; border-radius: 6px; background: #e8f1f3; color: #244c5d; }
.alert-success { background: #dff0e9; color: #28634f; }
.alert-error { background: #fbe1dd; color: #953c32; }
.empty-state { padding: 28px; border: 1px dashed #cbd7dc; border-radius: 6px; color: #7c8991; text-align: center; }
.conversation { max-width: 840px; }
.message { max-width: 720px; margin-bottom: 14px; padding: 17px; border: 1px solid #d8e2e6; border-radius: 8px; background: #fff; }
.message.staff { margin-left: 70px; border-left: 4px solid #0f6171; background: #f6fafb; }
.message-meta { display: -ms-flexbox; display: flex; -ms-flex-pack: justify; justify-content: space-between; color: #6f7e87; font-size: 12px; }
.message p { margin-bottom: 0; }
.auth-shell { min-height: calc(100vh - 42px); padding: 55px 20px; background: #153b52; }
.login-card { width: 100%; max-width: 470px; margin: 0 auto; padding: 38px; border-radius: 10px; background: #fff; box-shadow: 0 18px 50px rgba(0,0,0,.22); }
.login-card.compact { max-width: 540px; }
.login-card h1 { margin: 8px 0 10px; color: #173b52; font-size: 28px; line-height: 1.18; }
.login-brand { margin-bottom: 32px; display: -ms-flexbox; display: flex; -ms-flex-align: center; align-items: center; color: #173b52; }
.login-brand strong, .login-brand span { display: block; }
.login-brand strong { letter-spacing: .1em; font-size: 18px; }
.login-brand div span { color: #7b8991; font-size: 12px; }
.subtle-link { display: block; margin-top: 16px; text-align: center; }
.security-note { margin: 24px 0 0; padding-top: 16px; border-top: 1px solid #e4eaed; color: #84919a; font-size: 11px; text-align: center; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0; }
@media (max-width: 980px) {
    .sidebar { width: 205px; -ms-flex: 0 0 205px; flex-basis: 205px; }
    .content { width: calc(100% - 205px); padding: 28px 24px 48px; }
    .stat-card { width: calc(50% - 16px); }
    .two-columns > .panel { width: calc(100% - 16px); }
    .tabs-layout { display: block; }
    .tabs-layout > div { width: 100%; }
    .upload-layout { display: block; }
    .upload-panel, .upload-guide { width: calc(100% - 16px); }
}
@media (max-width: 700px) {
    .topbar { height: auto; }
    .topbar-inner { padding: 14px 18px; }
    .account > span { display: none; }
    .shell { display: block; }
    .sidebar { width: 100%; padding: 10px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .nav-link { margin: 2px; padding: 8px 10px; font-size: 12px; }
    .nav-section { width: 100%; margin: 8px 10px 2px; }
    .content { width: 100%; padding: 24px 16px 40px; }
    .page-header { display: block; }
    .header-actions { margin-top: 16px; -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .stat-card { width: calc(100% - 16px); }
    .location-metrics { display: none; }
    .support-strip { display: block; }
    .support-strip .btn { margin-top: 12px; }
    .filter-bar { display: block; }
    .filter-bar .form-control, .filter-bar .btn { margin-bottom: 8px; }
    .document-row { -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .management-row { -ms-flex-wrap: wrap; flex-wrap: wrap; }
    .bulk-actions { display: block; }
    .bulk-actions > div:first-child { width: 100%; margin-bottom: 14px; }
    .bulk-resolution { display: block; margin: 0; }
    .bulk-resolution > div { width: 100%; margin: 0 0 14px; }
    .message.staff { margin-left: 20px; }
    .login-card { padding: 28px 22px; }
}