.skip-link { position: absolute; z-index: 100; }
.container-tight { max-width: 450px; margin-inline: auto; }
.page-body { min-height: 65vh; }

/* The sidebar inherits the actual global theme, including its native Tabler colors. */
/* Compact version mark, aligned to the logotype rather than superscript. */
.tksol-brand { padding-block: .75rem; margin-block: .25rem; }
/* Reflect the original TeikosCRM wordmark with a new PSA descriptor. */
.tksol-brand-link { display: inline-flex; align-items: flex-start; gap: .16rem; text-decoration: none; letter-spacing: -.035em; color: var(--tblr-body-color); }
.tksol-wordmark { font-size: 1.48rem; line-height: 1.3; white-space: nowrap; font-weight: 400; }
.tksol-wordmark strong { font-weight: 700; }
.tksol-product { font-weight: 400; }
.tksol-version { display: inline-flex; align-items: center; justify-content: center; border-radius: .33rem; padding: .04rem .29rem; margin-top: -.15rem; font-size: .75rem; line-height: 1.5; letter-spacing: 0; font-weight: 700; background: var(--tblr-blue-lt, #e8f2ff); border: 1px solid rgba(66,153,225,.20); color: var(--tblr-blue, #206bc4); }
[data-bs-theme="dark"] .tksol-version { background: rgba(32,107,196,.22); color: #86b8ff; border-color: rgba(134,184,255,.22); }
.navbar-vertical .navbar-nav { margin-top: .35rem; }

.directory-wide .page,
.directory-wide .page-wrapper,
.directory-wide .page-body { overflow-x: visible; }
.directory-wide #content > .container-xl { max-width: none; }

/* Keep list controls and actual results in the first mobile viewport. */
.directory-column-picker { position: relative; margin-left: auto; }
.directory-column-picker > summary { display: inline-flex; align-items: center; justify-content: center; list-style: none; cursor: pointer; }
.directory-column-picker > summary::-webkit-details-marker { display: none; }
.directory-column-menu { position: absolute; z-index: 1050; right: 0; top: calc(100% + .5rem); width: min(345px, calc(100vw - 2rem)); max-height: min(65vh, 520px); overflow-y: auto; border: 1px solid var(--tblr-border-color); background: var(--tblr-bg-surface); padding: 1rem; border-radius: .5rem; box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.18); }
.directory-filters-card .card-body { padding-block: .65rem; }
@media (max-width: 991.98px) {
  .navbar-vertical .navbar-brand { margin: 0; padding: .35rem 0; }
  .navbar-vertical .container-fluid { align-items: center; }
  .navbar-vertical .navbar-collapse { flex-basis: 100%; }
  .page-body { padding-top: .5rem; }
  .directory-wide .page-header { margin-bottom: .25rem !important; }
  .directory-wide .page-pretitle { display: none; }
  .directory-wide .page-title { font-size: 1.35rem; }
  .directory-wide .card-header { min-height: 3rem; padding-block: .5rem; }
  .directory-filters-card .card-body { padding: .6rem; }
}

/* One selectable field per row, including on narrow portrait screens. */
.directory-column-options { display: flex; flex-direction: column; gap: .15rem; }
.directory-column-option { display: flex; align-items: center; gap: .65rem; width: 100%; padding: .4rem .2rem; margin: 0; cursor: pointer; }
.directory-column-option .form-check-input { float: none; flex: 0 0 auto; margin: 0; }
.directory-column-option .form-check-label { flex: 1; line-height: 1.4; }

@media (max-width: 991.98px) {
  .navbar-vertical .navbar-toggler { order: 0; margin-right: .65rem; }
  .navbar-vertical .tksol-brand { order: 1; margin-right: auto; }
  .navbar-vertical #primary-navigation { order: 2; }
}

.mobile-header-actions, .directory-mobile-submit, .directory-mobile-filter-toggle, .directory-mobile-reset { display: none; }
@media (max-width: 991.98px) {
  /* One sticky toolbar instead of two vertically stacked headers. */
  .page > .navbar-vertical { position: sticky; top: 0; z-index: 1030; width: 100%; min-height: 0; box-shadow: 0 1px 0 var(--tblr-border-color); }
  .page > .navbar-vertical > .container-fluid { flex-wrap: wrap; gap: .35rem; padding: .35rem .7rem; }
  .page > .navbar-vertical .navbar-toggler { margin-right: .2rem; }
  .page > .navbar-vertical .tksol-brand { padding: 0; margin: 0 auto 0 0; }
  .page > .navbar-vertical .tksol-wordmark { font-size: 1.2rem; }
  .page > .navbar-vertical .tksol-version { font-size: .6rem; }
  .mobile-header-actions { display: flex; align-items: center; gap: .35rem; order: 2; }
  .mobile-header-actions .btn { padding: .3rem .45rem; }
  .page > .navbar-vertical #primary-navigation { order: 3; width: 100%; }
  .page-wrapper > header.navbar { display: none; }
  .page-wrapper .page-body { padding: .5rem 0 0; margin: 0; }
  .page-wrapper .page-body > .container-xl { padding-inline: .65rem; }
  .directory-wide .page-header { margin: 0 0 .4rem !important; padding: 0; }
  .directory-wide .page-title { margin: 0; }
  .directory-filter-form { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: .4rem; margin: 0; align-items: stretch; }
  .directory-filter-form > * { padding: 0; margin: 0; min-width: 0; }
  .directory-search-field { grid-column: 1; }
  .directory-search-field .form-label { display: none; }
  .directory-search-wrap { position: relative; min-width: 0; }
  .directory-search-field .form-control { height: 38px; font-size: .875rem; padding: .4rem 2.2rem .4rem .55rem; }
  .directory-search-field input[type="search"]::-webkit-search-cancel-button { display: none; }
  .directory-mobile-reset { display: flex; align-items: center; justify-content: center; position: absolute; right: .15rem; top: 50%; transform: translateY(-50%); width: 2rem; height: 2rem; font-size: 1.45rem; line-height: 1; font-weight: 600; text-decoration: none; color: var(--tblr-secondary); border-radius: .3rem; }
  .directory-mobile-reset:hover, .directory-mobile-reset:focus-visible { color: var(--tblr-primary); background: var(--tblr-bg-surface-secondary); }
  .directory-mobile-submit { display: block; grid-column: 2; }
  .directory-mobile-filter-toggle { display: block; grid-column: 3; }
  .directory-mobile-submit .btn, .directory-mobile-filter-toggle .btn { height: 38px; min-width: 38px; padding: .4rem; }
  .directory-mobile-filter-toggle summary { list-style: none; cursor: pointer; }
  .directory-mobile-filter-toggle summary::-webkit-details-marker { display: none; }
  .directory-state-field { display: none; grid-column: 1 / -1; }
  .directory-filter-form:has(.directory-mobile-filter-toggle[open]) .directory-state-field { display: block; }
  .directory-filter-form > .col-md-4 { display: none !important; }
  .directory-filter-form:has(.directory-mobile-filter-toggle[open]) > .col-md-4 { display: none !important; }
  .directory-filters-card { margin-bottom: .45rem !important; }
  .directory-filters-card .card-body { padding: .45rem; }
}

.access-status-toggle { cursor: pointer; font: inherit; font-weight: 500; padding: .35em .6em; }
.access-status-toggle:hover { filter: brightness(.94); text-decoration: underline; }
.access-status-toggle:focus-visible { outline: 2px solid var(--tblr-primary); outline-offset: 2px; }
.access-confirm-dialog { width: min(420px, calc(100vw - 2rem)); padding: 1.5rem; border: 1px solid var(--tblr-border-color); border-radius: .65rem; background: var(--tblr-bg-surface); color: var(--tblr-body-color); box-shadow: 0 1rem 3rem rgba(0,0,0,.2); }
.access-confirm-dialog::backdrop { background: rgba(0,0,0,.45); }

/* Desktop navigation: one compact rail, with a persistent account area at its foot. */
.desktop-sidebar-toggle, .desktop-account-menu { display: none; }
@media (min-width: 992px) {
  .page > .app-sidebar { width: 220px; min-width: 220px; transition: width .18s ease, min-width .18s ease; }
  .page > .app-sidebar > .container-fluid { display: flex; flex-direction: column; align-items: stretch; min-height: 100vh; padding: .75rem .65rem; }
  .app-sidebar .tksol-brand { width: 100%; margin: 0 0 .7rem; padding: .25rem .45rem; }
  .app-sidebar #primary-navigation { display: block !important; width: 100%; flex: 0 0 auto; }
  .app-sidebar .nav-link { display: flex; align-items: center; gap: .55rem; border-radius: .35rem; }
  .app-sidebar .nav-icon { width: 1.15rem; flex: 0 0 1.15rem; text-align: center; font-size: 1.1rem; }
  .app-sidebar .navbar-nav { margin-top: .4rem; }
  .desktop-sidebar-toggle { display: block; align-self: flex-end; margin: -.1rem .4rem .1rem; width: 1.8rem; height: 1.8rem; padding: 0; }
  .page-wrapper > .app-topbar { display: none; }
  .page-wrapper > .page-body { padding-top: 1.15rem; }
  .desktop-account-menu { display: block; margin-top: auto; border-top: 1px solid var(--tblr-border-color); padding-top: .7rem; position: relative; width: 100%; }
  .desktop-account-menu summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: .5rem; padding: .4rem; border-radius: .4rem; }
  .desktop-account-menu summary::-webkit-details-marker { display: none; }
  .desktop-account-menu summary:hover { background: var(--tblr-bg-surface-secondary); }
  .account-avatar { display: inline-flex; flex: 0 0 2rem; align-items: center; justify-content: center; height: 2rem; border-radius: .45rem; background: var(--tblr-blue-lt, #e8f2ff); color: var(--tblr-blue, #206bc4); font-weight: 700; }
  .account-caption { min-width: 0; display: flex; flex-direction: column; line-height: 1.3; font-size: .78rem; }
  .account-caption strong, .account-caption small { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
  .account-caption small { color: var(--tblr-secondary); }
  .account-chevron { margin-left: auto; }
  .account-actions { position: absolute; bottom: calc(100% + .4rem); left: 0; width: max(205px, 100%); background: var(--tblr-bg-surface); border: 1px solid var(--tblr-border-color); border-radius: .5rem; padding: .65rem; box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.2); z-index: 1060; }
  .sidebar-compact .page > .app-sidebar { width: 70px; min-width: 70px; }
  .sidebar-compact .app-sidebar .tksol-wordmark, .sidebar-compact .app-sidebar .nav-link-title, .sidebar-compact .app-sidebar .account-caption, .sidebar-compact .app-sidebar .account-chevron { display: none; }
  .sidebar-compact .app-sidebar .tksol-brand { justify-content: center; }
  .sidebar-compact .app-sidebar .tksol-brand-link { justify-content: center; }
  .sidebar-compact .app-sidebar .tksol-version { margin-top: 0; }
  .sidebar-compact .app-sidebar .nav-link { justify-content: center; }
  .sidebar-compact .app-sidebar .nav-icon { font-size: 1.35rem; }
  .sidebar-compact .desktop-account-menu summary { justify-content: center; }
  .sidebar-compact .account-actions { left: calc(100% + .6rem); bottom: 0; width: 225px; }
}

/* Shared account popovers and the desktop heading bar. */
.app-account-panel[hidden] { display:none !important; }
.app-account-panel { position:fixed; z-index:1100; width:min(280px,calc(100vw - 1.25rem)); padding:.75rem; border:1px solid var(--tblr-border-color); border-radius:.5rem; background:var(--tblr-bg-surface); color:var(--tblr-body-color); box-shadow:0 .75rem 2rem rgba(0,0,0,.22); }
.app-account-panel .dropdown-item { width:100%; text-align:left; border:0; padding:.55rem; border-radius:.3rem; background:transparent; color:inherit; text-decoration:none; }
.app-account-panel .dropdown-item:hover { background:var(--tblr-bg-surface-secondary); }
.account-trigger { display:flex; gap:.7rem; align-items:center; border:0; background:transparent; color:inherit; padding:.25rem; border-radius:.4rem; cursor:pointer; }
.account-trigger:hover { background:var(--tblr-bg-surface-secondary); }
@media(min-width:992px) {
  .page { display:flex; min-width:0; }
  .page > .app-sidebar { flex:0 0 220px; width:220px; min-width:220px; }
  .page > .page-wrapper { flex:1 1 0; width:0; min-width:0; }
  .sidebar-compact .page > .app-sidebar { flex-basis:70px; width:70px; min-width:70px; }
  .app-sidebar .mobile-sidebar-brand { display:none; }
  .page-wrapper > .app-topbar { display:flex; min-height:72px; }
  .app-topbar-inner { width:100%; display:flex; gap:1.5rem; align-items:center; padding:.65rem 1.2rem; }
  .desktop-topbar-brand { flex:0 0 auto; font-size:1.1rem; }
  .app-page-heading { min-width:0; margin-left:1.2rem; flex:1; }
  .app-page-breadcrumb { font-size:.7rem; color:var(--tblr-secondary); }
  .app-page-title { font-size:1.1rem; font-weight:650; }
  .desktop-account-trigger .account-caption { text-align:right; }
  #desktop-account-panel { top:65px; right:1rem; }
  #mobile-account-panel { display:none !important; }
  .directory-wide .page-header { display:none; }
  .directory-wide .page-wrapper > .page-body > .container-xl { width:100%; max-width:none; margin:0; }
}
@media(max-width:767.98px) {
  .mobile-account-trigger { border:0; cursor:pointer; }
  #mobile-account-panel { top:65px; right:.5rem; }
  #desktop-account-panel { display:none !important; }
}
@media (min-width:768px) and (max-width:991.98px) {
  .app-topbar-inner { display:flex; align-items:center; width:100%; gap:1rem; padding:.65rem 1rem; }
  .app-page-heading { flex:1; }
  .app-page-breadcrumb { font-size:.7rem; color:var(--tblr-secondary); }
  .app-page-title { font-size:1rem; font-weight:650; }
  #desktop-account-panel { top:70px; right:.75rem; }
}
@media (max-width:767.98px) {
  .page > .app-sidebar .mobile-sidebar-brand { display:block; }
  .page > .app-sidebar .mobile-header-actions { order:2; }
  .page > .app-sidebar .mobile-account-trigger { font:inherit; font-weight:700; }
}

/* Desktop shell correction: Tabler's .page flex rules must not shrink the
   page-wrapper to the width of its children when the navigation is compact. */
@media (min-width: 992px) {
  body .page { display: block !important; width: 100%; min-width: 0; }
  body .page > .app-sidebar {
    position: fixed; inset: 0 auto 0 0; width: 220px; min-width: 0;
    height: 100vh; overflow-y: auto; z-index: 1020;
  }
  body .page > .page-wrapper {
    display: flex; flex-direction: column;
    width: calc(100% - 220px) !important;
    min-width: 0 !important; margin-left: 220px; flex: none;
    min-height: 100vh;
  }
  body.sidebar-compact .page > .app-sidebar { width: 70px; min-width: 0; }
  body.sidebar-compact .page > .page-wrapper {
    width: calc(100% - 70px) !important; margin-left: 70px;
  }
  .page-wrapper > .app-topbar { width: 100%; flex: 0 0 auto; }
  .page-wrapper .app-topbar-inner { min-width: 0; flex-wrap: nowrap; }
  .page-wrapper .app-page-heading { min-width: 0; flex: 1 1 auto; margin-left: 0; }
  .page-wrapper .app-page-breadcrumb { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .page-wrapper .app-page-title { white-space: nowrap; }
  .page-wrapper .desktop-account-trigger { flex: 0 0 auto; max-width: 240px; }
  .page-wrapper .desktop-account-trigger .account-caption { min-width: 0; max-width: 170px; }
  .page-wrapper > .page-body { width: 100%; min-width: 0; flex: 1 0 auto; }
  .directory-wide .page-wrapper > .page-body > .container-xl {
    display: block; width: 100%; max-width: 100%; min-width: 0; padding-inline: 1.2rem;
  }
  .directory-wide .directory-filters-card, .directory-wide #directory-results { width: 100%; }
}
.mobile-account-trigger.account-avatar {
  background: var(--tblr-blue-lt, #e8f2ff);
  color: var(--tblr-blue, #206bc4);
  border: 1px solid rgba(66,153,225,.22);
}
[data-bs-theme="dark"] .mobile-account-trigger.account-avatar {
  background: rgba(32,107,196,.28);
  color: #86b8ff;
  border-color: rgba(134,184,255,.27);
}

/* Same avatar token on desktop and mobile: mobile shows the initial only. */
.account-avatar,
.mobile-account-trigger.account-avatar {
  display: inline-flex;
  flex: 0 0 2rem;
  width: 2rem;
  height: 2rem;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 0;
  border-radius: .45rem;
  background: var(--tblr-blue-lt, #e8f2ff);
  color: var(--tblr-blue, #206bc4);
  font-size: .875rem;
  font-weight: 700;
  line-height: 1;
}
[data-bs-theme="dark"] .account-avatar,
[data-bs-theme="dark"] .mobile-account-trigger.account-avatar {
  background: rgba(32,107,196,.28);
  color: #86b8ff;
}
.mobile-account-trigger.account-avatar { cursor: pointer; }
.mobile-account-trigger.account-avatar:focus-visible {
  outline: 2px solid var(--tblr-primary);
  outline-offset: 3px;
}

/* Desktop account: full first and last name; breadcrumb is an actual hierarchy. */
@media (min-width: 992px) {
  .page-wrapper .desktop-account-trigger { max-width: none; min-width: 245px; padding: .4rem .6rem; gap: .85rem; }
  .page-wrapper .desktop-account-trigger .account-caption { max-width: none; min-width: 175px; align-items: flex-end; }
  .desktop-account-trigger .account-caption strong { display: flex; flex-direction: column; text-align: right; line-height: 1.25; font-size: .9rem; }
  .desktop-account-trigger .account-caption strong span { white-space: normal; overflow-wrap: anywhere; }
  .desktop-account-trigger .account-caption small { max-width: 225px; }
  .desktop-account-trigger .account-avatar { width: 2.6rem; height: 2.6rem; flex-basis: 2.6rem; font-size: 1rem; }
  .app-page-breadcrumb:empty { display: none; }
  .app-page-breadcrumb a { color: var(--tblr-secondary); text-decoration: none; }
  .app-page-breadcrumb a:hover { color: var(--tblr-primary); text-decoration: underline; }
  .app-page-breadcrumb { white-space: nowrap; font-size: .76rem; }
}

/* Desktop correction: keep the page within the viewport; only the table scrolls. */
@media (min-width: 992px) {
  html, body { max-width: 100%; overflow-x: clip; }
  body.directory-wide .page,
  body.directory-wide .page-wrapper,
  body.directory-wide .page-body { overflow-x: clip; }
  .directory-wide .page-wrapper > .page-body > .container-xl {
    padding-left: .55rem;
    padding-right: .55rem;
  }
  .directory-wide .directory-table-area {
    display: block; width: 100%; max-width: 100%; overflow-x: auto;
    overscroll-behavior-x: contain;
  }
  .app-topbar-inner { min-width: 0; }
  .page-wrapper .desktop-account-trigger { width: auto; max-width: 420px; min-width: 260px; }
  .page-wrapper .desktop-account-trigger .account-caption {
    width: auto; max-width: 350px; min-width: 200px;
  }
  .desktop-account-trigger .account-caption strong {
    display: block; white-space: nowrap; overflow: hidden; text-overflow: clip;
    overflow-wrap: normal; font-size: .95rem;
  }
  .desktop-account-trigger .account-caption small { max-width: 100%; }
}
@media (min-width: 992px) and (max-width: 1180px) {
  .desktop-account-trigger .account-caption strong { white-space: normal; }
  .page-wrapper .desktop-account-trigger { min-width: 180px; }
  .page-wrapper .desktop-account-trigger .account-caption { min-width: 110px; }
}

/* Desktop: override Tabler's built-in sidebar offset instead of adding it twice.
   The custom fixed rail owns the only horizontal offset. */
@media (min-width: 992px) {
  body .page > .page-wrapper {
    margin-left: 220px !important;
    margin-right: 0 !important;
  }
  body.sidebar-compact .page > .page-wrapper {
    margin-left: 70px !important;
  }
  body.directory-wide .page-wrapper > .page-body {
    padding-top: .35rem;
    margin-top: 0;
  }
  body.directory-wide .page-wrapper > .page-body > .container-xl {
    padding-top: 0;
  }
  body.directory-wide .directory-filters-card { margin-top: 0; }
}

/* Desktop: sticky topbar, app information in the side rail, no main footer. */
.sidebar-app-info { display: none; }
@media (min-width: 992px) {
  .page-wrapper > .app-topbar {
    position: sticky; top: 0; z-index: 1025;
    background: var(--tblr-bg-surface);
  }
  .page-wrapper > .page-body { flex: 0 0 auto; min-height: 0; }
  .page > .app-sidebar > .container-fluid { min-height: 100%; }
  .sidebar-app-info {
    display: flex; position: relative; margin-top: auto; padding: .75rem .45rem .2rem;
    border-top: 1px solid var(--tblr-border-color); color: var(--tblr-secondary);
  }
  .sidebar-info-text { display: flex; flex-direction: column; gap: .15rem; min-width: 0; font-size: .78rem; }
  .sidebar-info-text strong { color: var(--tblr-body-color); font-weight: 600; }
  .sidebar-info-text small { font-size: .7rem; }
  .sidebar-info-button { display: none; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; border: 0; border-radius: .4rem; color: var(--tblr-secondary); background: transparent; cursor: pointer; font-size: 1.35rem; }
  .sidebar-info-button:focus-visible { outline: 2px solid var(--tblr-primary); outline-offset: 2px; }
  .sidebar-info-popover[hidden] { display: none !important; }
  .sidebar-info-popover { position: absolute; bottom: 0; left: calc(100% + .75rem); width: 220px; display: flex; flex-direction: column; gap: .25rem; padding: .8rem; background: var(--tblr-bg-surface); color: var(--tblr-body-color); border: 1px solid var(--tblr-border-color); border-radius: .5rem; box-shadow: 0 .5rem 1.5rem rgba(0,0,0,.2); z-index: 1050; }
  .sidebar-compact .sidebar-app-info { justify-content: center; padding-inline: 0; }
  .sidebar-compact .sidebar-info-text { display: none; }
  .sidebar-compact .sidebar-info-button { display: inline-flex; }
}
@media (min-width: 992px) {
  .sidebar-compact .sidebar-info-popover {
    position: fixed; left: 79px; bottom: 14px;
  }
}
/* The brand remains visually unchanged on hover, focus and visited links. */
a.tksol-brand-link,
a.tksol-brand-link:hover,
a.tksol-brand-link:focus,
a.tksol-brand-link:active,
a.tksol-brand-link:visited {
  color: var(--tblr-body-color);
  text-decoration: none;
  cursor: pointer;
}
a.tksol-brand-link:hover .tksol-wordmark,
a.tksol-brand-link:hover .tksol-product,
a.tksol-brand-link:hover .tksol-version { color: inherit; text-decoration: none; }
a.tksol-brand-link:hover .tksol-version { color: var(--tblr-blue, #206bc4); }
[data-bs-theme="dark"] a.tksol-brand-link:hover .tksol-version { color: #86b8ff; }

/*
 * TeikosFSM - Field Service Management Portal
 * @author Andrea Zaccheroni
 * @copyright (c) 2026 Teikos srl. All rights reserved.
 * @desc Software developed on commission for Teikos srl.
 * Contractual exploitation and authorship terms remain subject to the applicable agreement.
 */
.login-screen .page { display: block !important; min-height: 100dvh; }
.login-screen .page-wrapper { display: block !important; width: 100% !important; min-width: 0; margin: 0 !important; }
.login-screen .page-body { min-height: 0; padding-top: 0; }
.login-screen .container-tight { width: 100%; max-width: 440px; padding-inline: 1rem; }
.login-screen .login-brand { display: flex; align-items: flex-start; justify-content: center; gap: .2rem; margin-top: .4rem; }
.login-screen .login-brand .tksol-wordmark { font-size: 2rem; }
.login-screen .login-brand .tksol-version { font-size: .85rem; }
.login-legal-footer { line-height: 1.5; }
@media (max-width: 991.98px) {
  .login-screen .container-tight { max-width: 440px; padding-inline: .85rem; }
  .login-screen .card-body { padding: 1.35rem; }
}
@media (min-width: 992px) {
  body.login-screen .page > .page-wrapper { width: 100% !important; margin-left: 0 !important; }
  .sidebar-info-text { overflow-wrap: anywhere; line-height: 1.4; }
}

/* Shared legal notice: understated, centered, and separated from the edges on mobile. */
.app-mobile-legal-footer { display: none; }
@media (max-width: 991.98px) {
  .app-mobile-legal-footer {
    display: block;
    box-sizing: border-box;
    width: calc(100% - 2rem);
    max-width: 34rem;
    margin: 1rem auto 0;
    padding: .75rem .5rem max(1.25rem, env(safe-area-inset-bottom));
    text-align: center;
    color: var(--tblr-secondary-color, #777);
    opacity: .65;
    font-size: .6875rem;
    line-height: 1.5;
    overflow-wrap: anywhere;
  }
}

/* Consultant create/edit: persistent save action without obscuring final fields. */
.consultant-save-dock, .form-save-dock {
  position: sticky;
  bottom: 0;
  z-index: 1010;
  display: flex;
  justify-content: flex-end;
  padding: .75rem max(.75rem, env(safe-area-inset-right)) max(.75rem, env(safe-area-inset-bottom));
  margin-top: 1rem;
  background: var(--tblr-bg-surface, var(--tblr-body-bg));
  border-top: 1px solid var(--tblr-border-color);
  box-shadow: 0 -.3rem 1rem rgba(0,0,0,.08);
}
@media (max-width: 991.98px) {
  .consultant-save-dock, .form-save-dock {
    margin-inline: -.5rem;
    margin-top: .5rem;
    padding: .35rem max(.6rem, env(safe-area-inset-right)) max(.35rem, env(safe-area-inset-bottom));
    box-shadow: 0 -.15rem .55rem rgba(0,0,0,.045);
  }
  .consultant-save-dock > .btn:not(.consultant-save-fab), .form-save-dock > .btn:not(.form-save-fab) {
    min-height: 38px;
    padding: .35rem .8rem;
  }
}

/* Dense consultant create/edit cards; preserve accessible input tap targets. */
.consultant-form-groups .card-header {
  min-height: 0;
  padding: .6rem 1rem;
}
.consultant-form-groups .card-header .card-title {
  margin: 0;
  font-size: 1rem;
  line-height: 1.35;
}
.consultant-form-groups .card-body {
  padding: .85rem 1rem;
}
.consultant-form-groups .card-body > .row {
  --tblr-gutter-y: .75rem;
}
.consultant-form-groups .form-label {
  margin-bottom: .25rem;
  font-size: .875rem;
}
@media (max-width: 991.98px) {
  .consultant-form-groups .card-header { padding: .55rem .85rem; }
  .consultant-form-groups .card-body { padding: .75rem .85rem; }
}

/* Read-only consultant profile: match compact editing cards. */
.consultant-profile-summary .card-body { padding: .85rem 1rem; }
.consultant-profile-summary .h2 { margin-bottom: 0; }
.consultant-profile-groups .card-header { min-height: 0; padding: .6rem 1rem; }
.consultant-profile-groups .card-title { margin: 0; font-size: 1rem; line-height: 1.35; }
.consultant-profile-groups .card-body { padding: .85rem 1rem; }
.consultant-profile-groups dl { row-gap: .3rem; }
.consultant-profile-groups dt { margin-bottom: 0; }
.consultant-profile-groups dd { margin-bottom: .3rem; }
@media (max-width: 991.98px) {
  .consultant-profile-summary .card-body,
  .consultant-profile-groups .card-body { padding: .75rem .85rem; }
  .consultant-profile-groups .card-header { padding: .55rem .85rem; }
  .consultant-profile-groups dt { margin-bottom: 0; }
  .consultant-profile-groups dd { margin-bottom: .45rem; }
}

/* Force one row for the mobile directory title and create action.
   Tabler's page-header responsive flex rules otherwise stack/center them. */
@media (max-width: 991.98px) {
  .directory-wide .consultant-directory-heading {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    justify-items: stretch;
    gap: .75rem;
    width: 100%;
    text-align: left;
  }
  .consultant-directory-heading > :first-child { min-width: 0; text-align: left; }
  .consultant-directory-heading > .btn { justify-self: end; }
}

/* Desktop consultant list: approved compact floating create action. */
@media (min-width: 992px) {
  .consultant-create-fab {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1020;
    width: 46px;
    height: 46px;
    padding: 0;
    border-radius: var(--tblr-border-radius, .375rem);
    align-items: center;
    justify-content: center;
    box-shadow: 0 5px 16px rgba(0, 0, 0, .22);
  }
}

/* Impersonation: orange shell with readable dark text and a distinct dark avatar. */
.account-impersonated {
  background: #f89a4e !important;
  border-color: #f89a4e !important;
  color: #19140f !important;
}
.account-impersonated .account-caption strong { color: #19140f !important; }
.account-impersonated .account-caption small { color: #382317 !important; }
.account-impersonated .account-avatar {
  background: #64300a !important;
  border: 1px solid #64300a !important;
  color: #fff !important;
}
.account-impersonated:hover,
.account-impersonated:focus-visible { background: #f58b38 !important; }

/* Mode-specific account badge, easy to distinguish during impersonation. */
.account-impersonated-safe { background: #8ed5a9 !important; border-color: #8ed5a9 !important; color: #173d28 !important; }
.account-impersonated-safe .account-caption strong { color: #173d28 !important; }
.account-impersonated-safe .account-caption small { color: #27543a !important; }
.account-impersonated-safe .account-avatar { background: #24593c !important; border-color: #24593c !important; color: #fff !important; }
.account-impersonated-safe:hover, .account-impersonated-safe:focus-visible { background: #7cc99a !important; }
.account-impersonated-full { background: #f89a4e !important; border-color: #f89a4e !important; }

/* Shared desktop action FAB: create, edit, save (mobile keeps existing actions). */
@media (min-width: 992px) {
  .consultant-action-fab {
    position: fixed; right: 24px; bottom: 24px; z-index: 1020;
    width: 46px; height: 46px; padding: 0;
    border-radius: var(--tblr-border-radius, .375rem);
    align-items: center; justify-content: center;
    box-shadow: 0 5px 16px rgba(0,0,0,.22);
  }
  .consultant-save-dock, .form-save-dock { position: static; padding: 0; margin: 0; border: 0; box-shadow: none; background: transparent; }
}

/* Centered-content pages: title moves toward the content as CSS viewport grows.
   At large browser zoom (narrow viewport), keep it close to the brand.
   Full-width directories always keep the original brand-adjacent title. */
@media (min-width: 992px) {
  body:not(.directory-wide) .page-wrapper .app-page-heading {
    margin-left: clamp(0px, calc((100vw - 1600px) * .3), 400px);
  }
}

/* Extra-wide viewports (typically browser zoom below ~90% on QHD):
   bring centered-page title closer to centered content, without changing
   the owner-approved ordinary desktop range or full-width directories. */
@media (min-width: 2800px) {
  body:not(.directory-wide) .page-wrapper .app-page-heading {
    margin-left: clamp(360px, calc(360px + (100vw - 2800px) * .35), 850px);
  }
}

/* Approved softer neutral light-theme surfaces; dark theme unchanged. */
html[data-bs-theme="light"] {
  --tblr-body-bg: #e5e8eb;
  --tblr-bg-surface-primary: #f1f3f5;
  --tblr-bg-surface: #f1f3f5;
  --tblr-bg-surface-secondary: #e1e5e9;
}

.customer-badges { display: flex; flex-wrap: wrap; gap: .25rem; }
.customer-badges .badge { white-space: normal; text-align: left; }

/* The consultant directory status live-region must not reserve spacing when empty. */
#directory-feedback:empty { display: none; }

/* DEC-054: one compact TABLE standard for every implemented Modern table. */
.directory-wide .directory-table-area { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
.directory-wide .directory-table-area > .standard-table {
  display: table; table-layout: auto; width: 100%;
  min-width: 100%;
}
.directory-wide .standard-table tr > :is(th, td) { padding: .65rem .55rem; }
.standard-table thead th, .standard-table td { overflow-wrap: anywhere; white-space: normal; vertical-align: middle; }
.standard-table thead th > a { display: block; white-space: normal; overflow-wrap: normal; }
.standard-table td[data-column="access"] .badge { white-space: normal; text-align: left; }
.standard-table td[data-column="start"], .standard-table td[data-column="validity"] { white-space: nowrap; }
.directory-column-option > label { display: flex; align-items: center; gap: .65rem; flex: 1; min-width: 0; cursor: pointer; }
.directory-drag-handle { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 32px; flex: 0 0 28px; padding: 0; border: 0; border-radius: .25rem; background: transparent; cursor: grab; touch-action: none; user-select: none; color: var(--tblr-secondary); font-size: 1.25rem; }
.directory-drag-handle:focus-visible { outline: 2px solid var(--tblr-primary); outline-offset: 1px; }
.directory-column-dragging { border-radius: .35rem; background: var(--tblr-bg-surface-secondary); }
.directory-column-dragging .directory-drag-handle { cursor: grabbing; }
[data-column-feedback]:empty { display: none; }
.customer-detail { min-width: 0; }
.customer-detail-section { scroll-margin-top: 5rem; min-width: 0; }
.table-search-form { display: flex; align-items: end; gap: .5rem; }
.table-search-form .directory-search-field { flex: 1; min-width: 0; }
@media (max-width: 991.98px) {
  .directory-wide .directory-table-area > .standard-table { min-width: 100%; }
  .standard-table thead th, .standard-table td { padding: .65rem .55rem; font-size: .875rem; }
  .table-search-form .btn { height: 38px; min-width: 38px; padding: .4rem; }
}

.customer-detail-page .app-page-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.customer-detail-breadcrumb { display: flex; gap: .25rem; min-width: 0; }
.customer-detail-breadcrumb a { flex-shrink: 0; }
.customer-detail-breadcrumb [aria-current] { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Let naturally narrow identifiers occupy only their intrinsic width. */
.standard-table th[data-column="id"], .standard-table td[data-column="id"] { width: 1%; white-space: nowrap; overflow-wrap: normal; }

/* Directory table: intrinsic widths for compact fields; no broken status labels. */
.standard-table td[data-column="access"], .standard-table th:has(a[href*="sort=access"]),
.standard-table td[data-column="role"], .standard-table td[data-column="id"] { white-space: nowrap; overflow-wrap: normal; }
.standard-table td[data-column="access"] .badge,
.standard-table td[data-column="access"] .access-status-toggle { white-space: nowrap; overflow-wrap: normal; word-break: keep-all; }
.standard-table td[data-column="name"] { min-width: 0; }

/* Customer detail: fixed last action column independent of user data preferences. */
.customer-detail-table th.detail-actions-sticky,
.customer-detail-table td.detail-actions-sticky {
  position: sticky; right: 0; z-index: 2; width: 96px; min-width: 96px;
  white-space: nowrap; padding-inline: .45rem; text-align: center;
  background: var(--tblr-bg-surface); border-left: 1px solid var(--tblr-border-color);
  box-shadow: -3px 0 5px -5px rgba(0,0,0,.6);
}
.customer-detail-table thead th.detail-actions-sticky { z-index: 3; background: var(--tblr-bg-surface-secondary); }
.customer-detail-table tbody tr:nth-child(even) td.detail-actions-sticky { background: var(--tblr-bg-surface-secondary); }
.customer-detail-table .detail-action-btn { padding: .25rem; line-height: 1; }

/* SPEC-006 visual review: compact section cards, inputs, rows and fixed action rail. */
.customer-detail-section { margin-bottom: .6rem !important; }
.customer-detail-section > .card-header { min-height: 0; padding: .5rem .8rem; }
.customer-detail-section > .card-body { padding: .35rem .8rem !important; }
.customer-detail-section > .card-footer { padding: .3rem .7rem; min-height: 0; }
.customer-detail-section .table-search-form .form-control { min-height: 35px; height: 35px; }
.customer-detail-section .table-search-form .btn { min-height: 35px; height: 35px; }
.customer-detail-section .standard-table tr > :is(th, td) { padding: .35rem .5rem; }
.customer-detail-section .detail-section-add { width: 32px; height: 32px; padding: .25rem; display: inline-flex; align-items: center; justify-content: center; }
.customer-detail-table th.detail-actions-sticky,
.customer-detail-table td.detail-actions-sticky { width: 68px; min-width: 68px; padding-inline: .2rem !important; }
.customer-detail-table .detail-actions-sticky .gap-1 { gap: 2px !important; }
.customer-detail-table .detail-action-btn { padding: .15rem; width: 26px; height: 26px; }
@media (max-width: 991.98px) {
  .customer-detail-section > .card-header { padding: .4rem .65rem; }
  .customer-detail-section > .card-body { padding: .3rem .65rem !important; }
  .customer-detail-table th.detail-actions-sticky,
  .customer-detail-table td.detail-actions-sticky { width: 66px; min-width: 66px; }
}

/* SPEC-006 customer identity summary, compact and responsive. */
.customer-company-card > .card-header { min-height: 0; padding: .5rem .8rem; }
.customer-company-card > .card-body { padding: .6rem .8rem; }
.customer-company-fields { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .65rem 1rem; margin: 0; }
.customer-company-fields > div { min-width: 0; }
.customer-company-fields dt { color: var(--tblr-secondary); font-size: .75rem; font-weight: 500; margin: 0 0 .15rem; }
.customer-company-fields dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 991.98px) {
  .customer-company-card > .card-header { padding: .4rem .65rem; }
  .customer-company-fields { grid-template-columns: repeat(2,minmax(0,1fr)); gap: .7rem; }
}
@media (max-width: 420px) {
  .customer-company-fields { grid-template-columns: minmax(0,1fr); gap: .55rem; }
}

.customer-delete-fab { position: fixed; right: 20px; bottom: 20px; z-index: 1010; width: 46px; height: 46px; border-radius: .65rem; display: flex; align-items: center; justify-content: center; padding: 0; box-shadow: 0 3px 12px rgba(0,0,0,.3); }
@media (max-width: 991.98px) { .customer-delete-fab { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom)); } }

/* Reusable icon-only button geometry: icon artwork is defined per action/size. */
.ui-icon-button {
  --ui-button-side: 36px;
  display: inline-flex;
  box-sizing: border-box;
  flex: 0 0 var(--ui-button-side);
  align-items: center;
  justify-content: center;
  width: var(--ui-button-side);
  min-width: var(--ui-button-side);
  height: var(--ui-button-side);
  min-height: var(--ui-button-side);
  aspect-ratio: 1 / 1;
  padding: 0;
  line-height: 1;
}
.ui-icon-button--sm { --ui-button-side: 28px; }
.ui-icon-button--md { --ui-button-side: 36px; }
.ui-icon-button--lg { --ui-button-side: 46px; }

/* Normalize disabled row action sizes regardless of legacy button padding. */
.customer-detail-table .detail-actions-sticky .ui-icon-button { padding: 0 !important; }

/* SPEC-008: Legacy contract workspace; keep each table's scroll inside its panel. */
.contract-workspace { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1rem; align-items: start; }
.contract-workspace > *, .contract-panels, .contract-panel { min-width: 0; }
.contract-panel-notice { overflow-wrap: anywhere; }
.contract-panel-notice summary { cursor: pointer; }
.contract-panel .card-title { font-size: 1rem; }
.contract-panel-table td[data-column="start"], .contract-panel-table td[data-column="end"],
.contract-panel-table td[data-column="expiry"], .contract-panel-table td.text-end { white-space: nowrap; }
.contract-panel-table :is(th, td)[data-column="description"] { min-width: 10rem; }
.contract-panel-table :is(th, td)[data-column="document"] { min-width: 8.5rem; }
.contract-panel-table :is(th, td)[data-column="oda"],
.contract-panel-table :is(th, td)[data-column="cig"],
.contract-panel-table :is(th, td)[data-column="sale"] { white-space: nowrap; }
.contract-panel .directory-column-picker { flex-shrink: 0; }
@media (min-width: 1200px) {
  .contract-workspace { grid-template-columns: minmax(0, .9fr) minmax(0, 1.5fr); }
}

/* SPEC-009: compact, keyboard/touch-accessible information beside the daily tariff label. */
.tariff-field-help { display: inline-flex; position: relative; align-items: center; }
.tariff-field-help-trigger { border: 0; background: transparent; color: var(--tblr-secondary, #868e96); padding: 0 .25rem; min-width: 1.5rem; min-height: 1.5rem; cursor: help; line-height: 1; border-radius: .25rem; }
.tariff-field-help-trigger:focus-visible { outline: 2px solid var(--tblr-primary); outline-offset: 2px; }
.tariff-field-help-text { position: absolute; right: 0; bottom: calc(100% + .4rem); z-index: 1080; width: min(13rem, calc(100vw - 2rem)); padding: .65rem .8rem; background: var(--tblr-bg-surface, #25282b); color: var(--tblr-body-color, #f8f9fa); border: 1px solid var(--tblr-border-color, #495057); border-radius: .4rem; box-shadow: 0 3px 10px #0004; font-size: .8rem; font-weight: 400; line-height: 1.45; opacity: 0; visibility: hidden; pointer-events: none; transition: opacity .1s ease; }
.tariff-field-help:hover .tariff-field-help-text, .tariff-field-help:focus-within .tariff-field-help-text { opacity: 1; visibility: visible; }

/* SPEC-010: compact responsive personal settings; independent password form. */
.account-settings { max-width: 860px; min-width: 0; }
.account-settings .card-body { min-width: 0; overflow-wrap: anywhere; }

/* SPEC-010: extra palettes extend rather than alter the existing light/dark themes. */
html[data-app-theme="pearl"] {
  --tblr-body-bg: #e9edf1; --tblr-bg-surface: #f7f9fa; --tblr-bg-surface-primary: #f7f9fa;
  --tblr-bg-surface-secondary: #dce4ea; --tblr-primary: #456d8a; --tblr-primary-rgb: 69,109,138;
  --tblr-border-color: #c6d2dc; --tblr-secondary: #536779;
}
html[data-app-theme="sand"] {
  --tblr-body-bg: #eeeae2; --tblr-bg-surface: #faf8f3; --tblr-bg-surface-primary: #faf8f3;
  --tblr-bg-surface-secondary: #e5dfd3; --tblr-primary: #586b53; --tblr-primary-rgb: 88,107,83;
  --tblr-border-color: #d5ccbc; --tblr-secondary: #677162;
}
html[data-app-theme="graphite"] {
  --tblr-body-bg: #252a30; --tblr-bg-surface: #31383f; --tblr-bg-surface-primary: #31383f;
  --tblr-bg-surface-secondary: #384149; --tblr-primary: #78c4ae; --tblr-primary-rgb: 120,196,174;
  --tblr-border-color: #4c5862; --tblr-secondary: #a5b4bc; --tblr-body-color: #edf2f3;
}
html[data-app-theme="night"] {
  --tblr-body-bg: #1d293a; --tblr-bg-surface: #26374b; --tblr-bg-surface-primary: #26374b;
  --tblr-bg-surface-secondary: #2d4055; --tblr-primary: #79bfdf; --tblr-primary-rgb: 121,191,223;
  --tblr-border-color: #40536a; --tblr-secondary: #aec2d5; --tblr-body-color: #f0f4f9;
}
html[data-app-theme="pearl"] .app-sidebar { background: #536779; }
html[data-app-theme="sand"] .app-sidebar { background: #677162; }
/* Pearl and Sand have deliberately colored sidebars: give all navigation states
   explicit foreground/hover/active colors rather than Tabler light-theme gray. */
html[data-app-theme="pearl"] .app-sidebar { --app-rail-text: #f8fbff; --app-rail-muted: #e5edf5; --app-rail-hover: #40586c; --app-rail-active: #344e64; }
html[data-app-theme="sand"] .app-sidebar { --app-rail-text: #fbfaf5; --app-rail-muted: #f0ede3; --app-rail-hover: #4e5b49; --app-rail-active: #3f503d; }
html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar {
  color: var(--app-rail-text);
  --tblr-navbar-color: var(--app-rail-text);
  --tblr-navbar-hover-color: #fff;
  --tblr-navbar-active-color: #fff;
}
html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar :is(.nav-link, .nav-link-title, .nav-icon, .account-caption strong, .desktop-account-menu summary, .desktop-sidebar-toggle, .navbar-toggler, .sidebar-info-button, .sidebar-info-text) {
  color: var(--app-rail-text);
}
html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar :is(.account-caption small, .sidebar-info-text span) {
  color: var(--app-rail-muted);
}
html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar :is(.nav-link, .desktop-account-menu summary, .desktop-sidebar-toggle, .navbar-toggler) {
  transition: background-color .12s ease, color .12s ease;
}
html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar :is(.nav-link:hover, .nav-link:focus-visible, .desktop-account-menu summary:hover, .desktop-account-menu summary:focus-visible, .desktop-sidebar-toggle:hover, .navbar-toggler:hover) {
  background: var(--app-rail-hover);
  color: #fff;
}
html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar :is(.nav-item.active > .nav-link, .nav-link[aria-current="page"]) {
  background: var(--app-rail-active);
  color: #fff;
  font-weight: 600;
}
html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar :is(.desktop-sidebar-toggle, .navbar-toggler) {
  border-color: var(--app-rail-muted);
}
/* Mobile Pearl/Sand rail: the logo and account initial must contrast with
   their dark colored header. Limit to mobile; preserve impersonation badges. */
@media (max-width: 991.98px) {
  html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar .mobile-sidebar-brand a.tksol-brand-link,
  html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar .mobile-sidebar-brand a.tksol-brand-link:is(:hover, :focus, :active, :visited) {
    color: var(--app-rail-text);
  }
  html[data-app-theme="pearl"] .app-sidebar .mobile-account-trigger.account-avatar:not(.account-impersonated):not(.account-impersonated-safe):not(.account-impersonated-full) {
    background: #f7f9fc;
    color: #23435e;
    border: 1px solid #d9e4ef;
  }
  html[data-app-theme="sand"] .app-sidebar .mobile-account-trigger.account-avatar:not(.account-impersonated):not(.account-impersonated-safe):not(.account-impersonated-full) {
    background: #faf8f0;
    color: #354b32;
    border: 1px solid #dfdfcf;
  }
  html:is([data-app-theme="pearl"], [data-app-theme="sand"]) .app-sidebar .mobile-sidebar-brand .tksol-version {
    background: #e9f2ff;
    color: #174b8b;
    border-color: #bcd6f5;
  }
}
html[data-app-theme="graphite"] .app-sidebar { background: #191e23; }
html[data-app-theme="night"] .app-sidebar { background: #111c2b; }

.account-theme-grid { display:grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap:.75rem; }
.account-theme-choice { display:flex; flex-direction:column; gap:.4rem; cursor:pointer; min-width:0; }
.account-theme-choice input { position:absolute; opacity:0; width:1px; height:1px; }
.account-theme-swatch { display:flex; height:76px; width:100%; overflow:hidden; background:var(--swatch-bg); border:2px solid var(--tblr-border-color); border-radius:.5rem; }
.account-theme-swatch-sidebar { width:25%; background:var(--swatch-side); }
.account-theme-swatch-main { flex:1; display:flex; flex-direction:column; gap:7px; padding:11px 9px; }
.account-theme-swatch-main span { background:var(--swatch-panel); border-radius:3px; height:10px; }
.account-theme-swatch-main span:first-child { width:75%; }
.account-theme-swatch-main span:last-child { width:50%; background:var(--swatch-accent); }
.account-theme-swatch--light { --swatch-bg:#e5e8eb; --swatch-side:#f1f3f5; --swatch-panel:#f1f3f5; --swatch-accent:#206bc4; }
.account-theme-swatch--dark { --swatch-bg:#1b1e24; --swatch-side:#15171c; --swatch-panel:#30343b; --swatch-accent:#4299e1; }
.account-theme-swatch--pearl { --swatch-bg:#e9edf1; --swatch-side:#536779; --swatch-panel:#f7f9fa; --swatch-accent:#5986a5; }
.account-theme-swatch--sand { --swatch-bg:#eeeae2; --swatch-side:#677162; --swatch-panel:#faf8f3; --swatch-accent:#8a7656; }
.account-theme-swatch--graphite { --swatch-bg:#252a30; --swatch-side:#191e23; --swatch-panel:#31383f; --swatch-accent:#6ead9d; }
.account-theme-swatch--night { --swatch-bg:#1d293a; --swatch-side:#111c2b; --swatch-panel:#26374b; --swatch-accent:#60a5c8; }
.account-theme-choice input:checked + .account-theme-swatch { border-color:var(--tblr-primary); box-shadow:0 0 0 2px var(--tblr-primary); }
.account-theme-choice input:focus-visible + .account-theme-swatch { outline:3px solid var(--tblr-primary); outline-offset:3px; }
.account-theme-name { font-size:.875rem; font-weight:600; text-align:center; }
@media (max-width:575.98px) { .account-theme-grid {grid-template-columns:repeat(2,minmax(0,1fr));} }

.team-notes { overflow-wrap: anywhere; min-width: 10rem; max-width: 24rem; }

.team-note-value { white-space: pre-wrap; }


/* SHELL REFINEMENT PREVIEW — owner review on development, uncommitted.
   One coherent outlined icon set; active state remains semantic on every theme. */
.app-sidebar .nav-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:1.5rem;min-width:1.5rem;height:1.5rem;flex:0 0 1.5rem;
  line-height:1;color:inherit;opacity:.88;
}
.app-sidebar .nav-svg{display:block;width:19px;height:19px;overflow:visible}
.app-sidebar .nav-item.active .nav-icon,
.app-sidebar .nav-link[aria-current="page"] .nav-icon{opacity:1}
@media(min-width:992px){
  .app-sidebar .navbar-nav{gap:.15rem;margin-top:.35rem}
  .app-sidebar .nav-link{
    gap:.7rem;min-height:43px;padding:.62rem .75rem;
    border-radius:.55rem;transition:background-color .15s ease,color .15s ease;
  }
  .app-sidebar .nav-link-title{font-size:.83rem;font-weight:450}
  .app-sidebar .nav-item.active .nav-link-title{font-weight:600}
  .app-sidebar .nav-item.active>.nav-link,
  .app-sidebar .nav-link[aria-current="page"]{background:color-mix(in srgb,var(--tblr-primary) 18%,transparent)}
  .app-sidebar .nav-link:hover{background:color-mix(in srgb,var(--tblr-primary) 11%,transparent)}
  .app-sidebar .nav-link:focus-visible{outline:2px solid var(--tblr-primary);outline-offset:2px}
  .sidebar-compact .app-sidebar .nav-link{padding:.6rem;justify-content:center}
  .sidebar-compact .app-sidebar .nav-icon{width:1.5rem;min-width:1.5rem;flex-basis:1.5rem}
  /* Content-sized consultant chip: no forced 260px width; single-line name.
     For genuinely long names, truncate cleanly instead of wrapping the topbar. */
  .page-wrapper .desktop-account-trigger{
    flex:0 1 auto;width:max-content;min-width:0;max-width:min(610px,62vw);
    display:inline-flex;align-items:center;gap:.55rem;
    padding:.35rem .42rem .35rem .7rem;margin-left:auto;
    border-radius:.55rem;
  }
  .page-wrapper .desktop-account-trigger .account-caption{
    flex:0 1 auto;width:max-content;min-width:0;max-width:min(535px,calc(62vw - 3.4rem));
    display:flex;flex-direction:column;align-items:stretch;text-align:right;
  }
  .desktop-account-trigger .account-caption strong{
    display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    max-width:100%;min-width:0;line-height:1.25;font-size:.86rem;
  }
  .desktop-account-trigger .account-caption small{
    display:block;max-width:100%;min-width:0;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.7rem;
  }
  .desktop-account-trigger .account-avatar{
    flex:0 0 2.3rem;width:2.3rem;height:2.3rem;font-size:.9rem;
  }
}
@media(min-width:992px) and (max-width:1180px){
  .page-wrapper .desktop-account-trigger{min-width:0;max-width:min(430px,48vw)}
  .desktop-account-trigger .account-caption strong{white-space:nowrap}
}
@media(max-width:991.98px){
  .app-sidebar .nav-svg{width:20px;height:20px}
}