/* Shared Django shell, matching the React Articles palette and spacing. */
.portal-authenticated {
  --pa-primary: #16745d;
  --pa-bg: #f5f7fa;
  --bs-primary: #16745d;
  --bs-primary-rgb: 22, 116, 93;
  --bs-link-color: #16745d;
  --bs-link-color-rgb: 22, 116, 93;
  --bs-link-hover-color: #105e4b;
  --bs-link-hover-color-rgb: 16, 94, 75;
  --bs-body-color: #263448;
  --bs-secondary-color: #778395;
  --bs-border-color: #e1e7ed;
  font-family: Inter, "Segoe UI", Arial, sans-serif;
  color: #263448;
}
.portal-sidebar {
  --bs-offcanvas-width: 252px;
  background: #142638 !important;
  color: #aebccc;
  padding: 30px 19px 24px;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
}
.portal-sidebar-heading { display: flex; align-items: center; justify-content: space-between; }
.portal-brand { display: flex; align-items: center; gap: 10px; color: white; font-size: 25px; font-weight: 750; letter-spacing: -.9px; text-decoration: none; padding: 0 8px; }
.portal-brand:hover { color: white; }
.portal-brand .brand-mark { background: #25816b; width: 35px; height: 35px; font-size: 22px; }
.portal-brand-dot { color: #58bea1; margin-left: -10px; }
.portal-workspace { display: flex; align-items: center; gap: 10px; border: 1px solid #314152; border-radius: 9px; padding: 13px 10px; margin: 32px 0; color: #edf2f7; text-decoration: none; }
.portal-workspace:hover { background: #21364a; color: white; }
.portal-workspace > span:last-child { min-width: 0; }
.portal-workspace-icon { background: #23374a; border-radius: 7px; padding: 8px; font-size: 18px; color: #a1b4c7; }
.portal-workspace small { display: block; font-size: 8px; letter-spacing: 1.1px; color: #aebccc; margin-bottom: 5px; }
.portal-workspace strong { display: block; font-size: 12px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-nav-label { display: block; font-size: 9px; letter-spacing: 1.6px; font-weight: 600; padding-left: 13px; color: #8192a6; }
.portal-nav { display: grid; gap: 7px; margin-top: 15px; }
.portal-nav-link { display: flex; align-items: center; gap: 11px; padding: 12px; border-radius: 7px; font-size: 12px; color: #aebccc; text-decoration: none; }
.portal-nav-link > i:first-child { font-size: 18px; width: 20px; text-align: center; flex-shrink: 0; }
.portal-nav-link:hover { background: #21364a; color: white; }
.portal-nav-link.active { background: #204437; color: #c2eedb; }
a.portal-nav-link.active::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #5cc9a1; margin-left: auto; flex-shrink: 0; }
.portal-catalogs summary { list-style: none; cursor: pointer; }
.portal-catalogs summary::-webkit-details-marker { display: none; }
.portal-chevron { font-size: 11px; margin-left: auto; transition: transform .15s; }
.portal-catalogs[open] .portal-chevron { transform: rotate(180deg); }
.portal-subnav { margin: 8px 0 5px 22px; padding-left: 12px; border-left: 1px solid #344858; display: grid; gap: 3px; }
.portal-subnav a { display: flex; align-items: center; gap: 9px; font-size: 11px; color: #aebccc; text-decoration: none; border-radius: 5px; padding: 10px 7px; }
.portal-subnav a:hover { color: white; background: #21364a; }
.portal-subnav a.active { background: #204437; color: #c2eedb; font-weight: 600; }
.portal-sidebar-footer { margin-top: auto; padding: 35px 6px 0; }
.portal-sidebar-footer .portal-nav-label { padding: 0; font-size: 8px; }
.portal-sidebar-footer p { color: #93a3b5; font-size: 12px; line-height: 1.8; margin: 12px 0 20px; }
.portal-sidebar-footer a { color: #d1deea; font-size: 11px; text-decoration: none; }
.portal-sidebar-footer a i { margin-left: 5px; }
.portal-topbar { min-height: 74px; background: white; border-bottom: 1px solid #e8edf2; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 36px; }
.portal-breadcrumb { display: flex; align-items: center; gap: 13px; font-size: 12px; color: #778395; }
.portal-breadcrumb i { font-size: 10px; }
.portal-breadcrumb strong { font-weight: 500; color: #304357; }
.portal-topbar-actions { display: flex; align-items: center; gap: 18px; min-width: 0; }
.portal-tenant-switch > button { max-width: 230px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border: 0 !important; background: transparent; font-size: 12px; }
.portal-tenant-switch .dropdown-menu { max-width: min(350px, 90vw); }
.portal-tenant-switch .dropdown-item { white-space: normal; }
.portal-user { display: flex; gap: 9px; align-items: center; }
.portal-user strong { display: block; font-size: 11px; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.portal-user small { display: block; font-size: 10px; color: #778395; margin-top: 2px; }
.portal-avatar { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: #16745d; background: #edf5f1; font-size: 19px; }
.portal-logout { color: #778395; padding: 6px; }
.portal-menu-toggle { font-size: 23px; padding: 0 5px; color: #304357; }
.portal-authenticated #portal-content > .container-fluid { padding: 36px !important; max-width: 1900px; }
.portal-authenticated #portal-content h1 { font-size: 29px; font-weight: 650; letter-spacing: -.8px; color: #263448; }
.portal-authenticated #portal-content h1 > i { font-size: 24px; }
.portal-authenticated .module-icon { background: #edf5f1; color: #16745d; }
.portal-authenticated .card { border: 1px solid #e1e7ed !important; border-radius: 11px; box-shadow: 0 3px 12px #23334604 !important; }
.portal-authenticated .card-header { border-bottom-color: #e8edf2; }
.portal-authenticated .table { --bs-table-color: #405163; --bs-table-hover-bg: #f6faf8; }
.portal-authenticated .table-light { --bs-table-bg: #f8fafb; --bs-table-color: #778395; }
.portal-authenticated th { font-size: 11px; font-weight: 600; }
.portal-authenticated td { font-size: 12px; }
.portal-authenticated .table > :not(caption) > * > * { border-bottom-color: #eef1f5; padding: 15px 16px; }
.portal-authenticated .order-lines-table > :not(caption) > * > * { padding: .45rem .5rem; }
.portal-authenticated .btn { border-radius: 7px; font-size: 12px; font-weight: 500; }
.portal-authenticated .btn-primary { --bs-btn-bg: #16745d; --bs-btn-border-color: #16745d; --bs-btn-hover-bg: #105e4b; --bs-btn-hover-border-color: #105e4b; --bs-btn-active-bg: #105e4b; --bs-btn-active-border-color: #105e4b; --bs-btn-disabled-bg: #16745d; --bs-btn-disabled-border-color: #16745d; --bs-btn-focus-shadow-rgb: 22,116,93; }
.portal-authenticated .btn-outline-primary { --bs-btn-color: #16745d; --bs-btn-border-color: #a9cdbf; --bs-btn-hover-bg: #16745d; --bs-btn-hover-border-color: #16745d; --bs-btn-active-bg: #105e4b; --bs-btn-active-border-color: #105e4b; --bs-btn-focus-shadow-rgb: 22,116,93; }
.portal-authenticated .form-control:focus, .portal-authenticated .form-select:focus, .portal-authenticated autocomplete-select-input input:focus { border-color: #73b8a5; box-shadow: 0 0 0 .15rem #16745d20; }
.portal-authenticated .form-check-input:checked { background-color: #16745d; border-color: #16745d; }
.portal-authenticated .dropdown-item.active, .portal-authenticated .dropdown-item:active { background-color: #16745d; }
.portal-authenticated .pagination { --bs-pagination-active-bg: #16745d; --bs-pagination-active-border-color: #16745d; --bs-pagination-focus-box-shadow: 0 0 0 .15rem #16745d20; }
.portal-sidebar a:focus-visible, .portal-sidebar summary:focus-visible { outline: 2px solid #73b8a5; outline-offset: 2px; }
@media (min-width: 992px) {
  .portal-sidebar { position: fixed; inset: 0 auto 0 0; width: 252px; height: 100vh; z-index: 1030; }
  .portal-main { margin-left: 252px; min-width: 0; }
}
@media (max-width: 1199.98px) {
  .portal-user > div { display: none; }
  .portal-topbar { padding: 14px 24px; }
  .portal-authenticated #portal-content > .container-fluid { padding: 28px 24px !important; }
}
@media (max-width: 991.98px) {
  .portal-sidebar { width: 270px; }
  .portal-topbar { min-height: 62px; padding: 12px 16px; gap: 9px; }
  .portal-topbar-actions { margin-left: auto; gap: 10px; }
  .portal-breadcrumb > span, .portal-breadcrumb > i { display: none; }
}
@media (max-width: 575.98px) {
  .portal-authenticated #portal-content > .container-fluid { padding: 24px 16px !important; }
  .portal-authenticated #portal-content h1 { font-size: 25px; }
  .portal-tenant-switch > button { max-width: 130px; padding: 5px; font-size: 11px; }
  .portal-user { display: none; }
  .portal-topbar-actions { gap: 5px; }
  .portal-authenticated #portal-content .d-flex.gap-2 { flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { .portal-chevron { transition: none; } }