/* Screen-only visual update. Existing data, permissions and exports are unchanged. */
.rail-toggle { display: none; }
@media screen {
  body { background: #f5f5fa; }
  .sidebar { background: linear-gradient(165deg, #373d52, #25262e 78%); color: #e4e5ef; }
  .nav-icon { color: #b6c2f5; }
  .nav-item { color: #d5d7e3; }
  .nav-item.active { background: #283d92; box-shadow: inset 3px 0 #a4b2ff; }
  .brand-copy span, .sidebar-user .profile-copy small { color: #b8bfd4; }
  .panel { border-color: #e4e5ed; border-radius: 18px; box-shadow: 0 5px 20px #292a4710; }
  .panel h3, #page-title { color: #20212a; }
  .topbar { background: #ffffffef; border-bottom: 1px solid #e4e5ed; }
  .menu-button { display: inline-flex; align-items: center; justify-content: center; }
  .configured-document-table .document-actions-cell,
  .configured-document-table thead th:last-child {
    position: sticky; right: 0; z-index: 3; background: #fff;
    border-left: 1px solid #dce0ec; box-shadow: -7px 0 12px -9px #31395280;
  }
  .configured-document-table thead th:last-child { z-index: 5; background: #f5f6fb; }
  .configured-document-table .document-actions-cell { min-width: 176px; width: 176px; padding: 12px 10px; }
  .configured-document-table thead th:last-child { text-align: center; }
  .document-row-actions { display: flex; flex-direction: column; }
  .document-file-buttons { flex-wrap: nowrap; justify-content: center; width: 100%; gap: 4px; }
  .document-edit-buttons { flex-wrap: wrap; justify-content: center; width: 100%; gap: 4px; }
  .document-file-buttons .table-action, .document-edit-buttons > .table-action { min-height: 32px; padding: 5px 8px; font-size: 12px; border-radius: 7px; }
  article[role="button"] { cursor: pointer; transition: border-color .15s, box-shadow .15s; }
  article[role="button"]:hover { border-color: #858bd6; box-shadow: 0 5px 18px #44499e18; }
  article[role="button"]:focus-visible { outline: 3px solid #747bd4; outline-offset: 3px; }
  .dashboard-view .workspace { height: auto; min-height: 100dvh; }
  .dashboard-view .content { display: block; }
  .dashboard-view .metric-grid { grid-template-columns: repeat(6,minmax(0,1fr)); gap: 14px; margin: 22px 0; }
  .dashboard-view .metric-card { min-height: 150px; padding: 20px 16px; border: 1px solid #e3e3ec; border-radius: 17px; background: #fff; align-items: start; }
  .dashboard-view .metric-card strong { color: #24242d; font-size: 32px; }
  .dashboard-view .metric-card small { color: #80808c; }
  .dashboard-view .metric-card:has(#metric-doc-total) { order: -6; }
  .dashboard-view .metric-card:has(#metric-doc-effective) { order: -5; }
  .dashboard-view .metric-card:has(#metric-doc-active) { order: -4; }
  .dashboard-view .metric-card:has(#metric-doc-expiring) { order: -3; }
  .dashboard-view .metric-card:has(#metric-doc-expired) { order: -2; }
  .dashboard-view .metric-card:has(#metric-doc-missing) { order: -1; }
  .dashboard-view .dashboard-secondary-metric { display: none; }
  .dashboard-view .dashboard-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; gap: 20px; }
  .dashboard-view .overview-status, .dashboard-view .overview-distribution { padding: 24px; min-height: 440px; }
  .dashboard-view .status-chart-wrap { grid-template-columns: 1fr; justify-items: center; gap: 22px; }
  .dashboard-view .status-donut { width: 180px; height: 180px; }
  .dashboard-view .status-legend { width: 100%; max-width: none; }
  .dashboard-view .overview-details { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; height: auto; border: 0; background: transparent; }
  .dashboard-view .overview-detail-tabs { display: none; }
  .dashboard-view .overview-details .panel:not(.hidden) { display: block; max-height: none; overflow: visible; padding: 24px; border: 1px solid #e4e5ed; border-radius: 18px; background: #fff; }
  .dashboard-view .overview-details .panel-header h3 { display: block; }
  .dashboard-view .overview-details .panel-header { justify-content: space-between; margin-bottom: 20px; }
  .dashboard-view .overview-details .overview-recent { grid-column: auto; }
  .dashboard-view .overview-details .asset-overview-panel { grid-column: 1 / -1; order: 3; }
}
@media screen and (min-width: 981px) {
  .app-shell:not(.dashboard-view) .topbar { display: none; }
  .rail-toggle { display: grid; place-items: center; position: absolute; top: 30px; right: -15px; z-index: 32; margin: 0; border: 1px solid #dfe1ed; border-radius: 50%; background: #fff; color: #454977; width: 30px; height: 30px; box-shadow: 0 3px 10px #12193620; cursor: pointer; }
  .rail-toggle:hover { background: #eeeffa; }
  .rail-toggle:focus-visible { outline: 3px solid #8995ef; outline-offset: 3px; }
  .sidebar-collapsed .rail-toggle svg { transform: rotate(180deg); }
  .dashboard-view .menu-button { display: none; }
  .sidebar-collapsed { --sidebar-width: 76px; }
  .sidebar-collapsed .brand { padding: 12px 8px; justify-content: center; }
  .sidebar-collapsed .brand-logo { width: 56px; height: 38px; }
  .sidebar-collapsed .brand-copy,
  .sidebar-collapsed .nav-item > span:not(.nav-icon),
  .sidebar-collapsed .profile-copy,
  .sidebar-collapsed .profile-button > span:last-child,
  .sidebar-collapsed .security-badge > span:last-child { display: none; }
  .sidebar-collapsed .nav-item { grid-template-columns: 1fr; justify-items: center; padding: 10px 4px; }
  .sidebar-collapsed .sidebar-bottom { padding: 14px 10px; }
  .sidebar-collapsed .profile-button, .sidebar-collapsed .security-badge { justify-content: center; }
  .sidebar-collapsed .sidebar-user .profile-menu { left: 0; right: auto; min-width: 230px; }
}
@media screen {
  .dashboard-view .dashboard-grid { align-items: stretch; }
  .dashboard-view .overview-deadlines { order: 2; padding: 24px; min-width: 0; }
  .dashboard-view .overview-details { order: 3; }
  .dashboard-view .panel-header h3 { font-size: 21px; color: #24242d; letter-spacing: -.025em; }
  .dashboard-view .text-button { color: #4945b6; }
  .dashboard-view .overview-switch [aria-pressed="true"] { background: #eeedf9; border-color: #c1bde6; color: #4945b6; }
  .dashboard-view .bar-fill { background: linear-gradient(90deg, #605bd0, #8c91e3); }
  .dashboard-view .metric-card { position: relative; padding-bottom: 34px; --metric-color: #7166ca; }
  .dashboard-view .metric-card:has(#metric-doc-effective) { --metric-color: #499577; }
  .dashboard-view .metric-card:has(#metric-doc-expiring) { --metric-color: #c29a43; }
  .dashboard-view .metric-card:has(#metric-doc-expired) { --metric-color: #ce5769; }
  .dashboard-view .metric-card[style*="--metric-progress"]::after { content: ''; position: absolute; bottom: 18px; left: 18px; right: 18px; height: 4px; border-radius: 4px; background: linear-gradient(to right, var(--metric-color) var(--metric-progress), #f0eff5 var(--metric-progress)); }
  .deadline-subtitle { margin: 9px 0 0; font-size: 12px; line-height: 1.5; color: #82828e; }
  .deadline-list { display: grid; gap: 12px; }
  .deadline-item { width: 100%; display: grid; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 12px 10px; border: 1px solid transparent; border-radius: 12px; background: #f9f8fb; text-align: left; font: inherit; cursor: pointer; }
  .deadline-item:hover, .deadline-item:focus-visible { border-color: #a8a4dd; outline: none; background: #f2f0fa; }
  .deadline-days { display: grid; place-items: center; padding: 7px 2px; border-radius: 9px; background: #f8f1e4; color: #b18735; }
  .deadline-days strong { font-size: 21px; line-height: 1.1; }
  .deadline-days small { font-size: 9px; letter-spacing: .05em; }
  .deadline-copy { min-width: 0; display: grid; gap: 5px; }
  .deadline-copy strong { color: #2c2b36; font-size: 13px; }
  .deadline-copy small { color: #80808a; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
  .deadline-label { padding: 5px 7px; background: #faf3e6; color: #ad843a; border-radius: 20px; font-size: 10px; font-weight: 700; white-space: nowrap; }
  .overdue .deadline-days, .overdue .deadline-label { background: #f7e8ed; color: #c6536c; }
}
@media screen and (min-width: 1300px) {
  .dashboard-view .dashboard-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .dashboard-view .dashboard-grid > .panel { min-height: 490px; padding: 24px; }
  .dashboard-view .overview-details { grid-column: 1 / -1; }
}
@media screen and (min-width: 981px) and (max-width: 1299px) {
  .dashboard-view .overview-deadlines { grid-column: 1 / -1; }
  .deadline-list { grid-template-columns: 1fr 1fr; }
}
@media screen and (max-width: 1250px) { .dashboard-view .metric-grid { grid-template-columns: repeat(3,minmax(0,1fr)); } }
@media screen and (max-width: 980px) {
  .app-shell:not(.dashboard-view) .topbar-left > div { display: none; }
  .app-shell:not(.dashboard-view) .topbar { min-height: 48px; padding: 5px 12px; }
  .dashboard-view .dashboard-grid, .dashboard-view .overview-details { grid-template-columns: 1fr; }
  .dashboard-view .overview-status, .dashboard-view .overview-distribution { min-height: 0; }
}
@media screen and (max-width: 600px) {
  .dashboard-view .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .configured-document-table .document-actions-cell { min-width: 168px; width: 168px; }
  .document-file-buttons { gap: 3px; }
  .document-file-buttons .table-action { padding: 6px; }
}
