:root{
  --sr-purple:#2b084f;
  --sr-purple-2:#4b148c;
  --sr-gold:#d4af37;
  --sr-silver:#f4f6f8;
  --sr-white:#ffffff;
  --sr-ink:#1f1f2e;
  --sr-muted:#6f6f7a;
  --sr-border:#eadff7;
  --sr-danger:#b42318;
  --sr-warn:#b7791f;
  --sr-ok:#087443;
}

body{
  background:linear-gradient(135deg,#fbf8ff 0%,#ffffff 45%,#f6f0ff 100%);
}

.hero{
  background:linear-gradient(135deg,var(--sr-purple),var(--sr-purple-2));
  color:white;
  border-radius:24px;
  padding:28px;
  margin-bottom:24px;
  box-shadow:0 18px 40px rgba(43,8,79,.25);
  border:1px solid rgba(212,175,55,.35);
}

.hero h1{
  margin:4px 0 8px;
  font-size:32px;
  letter-spacing:-.5px;
}

.hero p{
  color:#f4eaff;
  max-width:900px;
}

.eyebrow{
  color:var(--sr-gold);
  font-weight:800;
  letter-spacing:2px;
  text-transform:uppercase;
  font-size:12px;
}

.grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:18px;
  margin-bottom:20px;
}

.card{
  background:rgba(255,255,255,.96);
  border:1px solid var(--sr-border);
  border-radius:22px;
  padding:20px;
  box-shadow:0 12px 32px rgba(43,8,79,.08);
}

.card h2,.card h3{
  color:var(--sr-purple);
  margin-top:0;
}

.metric{
  font-size:34px;
  font-weight:900;
  color:var(--sr-purple);
  margin:8px 0;
}

.small-note{
  color:var(--sr-muted);
  font-size:14px;
}

.button, button, input[type="submit"]{
  background:linear-gradient(135deg,var(--sr-purple),var(--sr-purple-2));
  color:white !important;
  border:none;
  border-radius:999px;
  padding:9px 15px;
  text-decoration:none;
  display:inline-block;
  font-weight:700;
  box-shadow:0 8px 20px rgba(43,8,79,.18);
}

.button:hover, button:hover{
  filter:brightness(1.08);
}

.badge,.pill{
  display:inline-block;
  border-radius:999px;
  padding:5px 10px;
  font-weight:700;
  font-size:12px;
  background:#f3e8ff;
  color:var(--sr-purple);
  border:1px solid #e2c8ff;
}

.priority-high{
  background:#fff1f0;
  color:var(--sr-danger);
  border-color:#ffccc7;
}

.priority-medium{
  background:#fff7e6;
  color:var(--sr-warn);
  border-color:#ffe0a3;
}

.priority-low{
  background:#edfdf5;
  color:var(--sr-ok);
  border-color:#b7ebd0;
}

table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
}

th{
  background:#f6efff;
  color:var(--sr-purple);
  text-align:left;
  font-size:13px;
  padding:11px;
}

td{
  padding:11px;
  border-bottom:1px solid #f1e8fb;
}

tr:hover td{
  background:#fbf7ff;
}

.sr-dashboard-shell{
  display:grid;
  grid-template-columns:1.4fr .8fr;
  gap:20px;
}

.sr-ai-panel{
  background:linear-gradient(180deg,#ffffff,#fbf7ff);
  border:1px solid rgba(212,175,55,.45);
}

.sr-ai-title{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--sr-purple);
  font-weight:900;
}

.sr-ai-orb{
  width:34px;
  height:34px;
  border-radius:50%;
  background:radial-gradient(circle at 30% 30%,#fff,#d4af37 35%,#5b1a8e 70%);
  box-shadow:0 0 22px rgba(212,175,55,.45);
}

.sr-timeline-item{
  border-left:4px solid var(--sr-gold);
  padding:8px 0 8px 14px;
  margin:10px 0;
}

.sentinel-mini-brand img{
  max-height:42px;
}

@media(max-width:1000px){
  .sr-dashboard-shell{grid-template-columns:1fr;}
}

/* RE-105/106/107 Premium Sidebar */
.sidebar,
.side-nav,
nav.sidebar,
aside,
#sidebar {
  background: linear-gradient(180deg, #2b084f 0%, #3d0f73 55%, #1f063a 100%) !important;
  border-right: 1px solid rgba(212,175,55,.35) !important;
  box-shadow: 14px 0 34px rgba(43,8,79,.18) !important;
}

.sidebar a,
.side-nav a,
nav.sidebar a,
aside a,
#sidebar a {
  color: #f7efff !important;
  border-radius: 14px !important;
  margin: 4px 10px !important;
  padding: 10px 14px !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  display: block !important;
}

.sidebar a:hover,
.side-nav a:hover,
nav.sidebar a:hover,
aside a:hover,
#sidebar a:hover {
  background: rgba(212,175,55,.18) !important;
  color: #ffffff !important;
  transform: translateX(2px);
}

.sidebar h3,
.sidebar h4,
.side-nav h3,
.side-nav h4,
aside h3,
aside h4,
#sidebar h3,
#sidebar h4 {
  color: #d4af37 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
  padding: 12px 18px 4px !important;
}

.sidebar .brand,
.side-nav .brand,
#sidebar .brand {
  color: #ffffff !important;
  font-weight: 900 !important;
  letter-spacing: .5px !important;
}

.sidebar img,
.side-nav img,
#sidebar img {
  max-width: 150px;
  height: auto;
}

/* ==========================================================
   RE-108 HIGH CONTRAST PATCH
   Makes all dashboard text easier to read
   ========================================================== */

body{
    color:#1E293B !important;
}

/* Cards */
.card,
.card *{
    color:#1E293B;
}

.card h1,
.card h2,
.card h3,
.card h4,
.card h5{
    color:#2B084F !important;
    font-weight:700;
}

/* Paragraphs */
.card p,
.card li,
.card label,
.card span{
    color:#334155 !important;
}

/* Dashboard metric numbers */
.metric{
    color:#2B084F !important;
    font-weight:800;
}

/* Small helper text */
.small-note,
.text-muted{
    color:#475569 !important;
}

/* Tables */
table{
    color:#1E293B !important;
}

th{
    background:#F5F1FB !important;
    color:#2B084F !important;
    font-weight:700;
}

td{
    color:#334155 !important;
}

/* Forms */
input,
select,
textarea{
    color:#111827 !important;
    background:white !important;
}

input::placeholder,
textarea::placeholder{
    color:#64748B !important;
}

/* Timeline */
.sr-timeline-item{
    color:#334155 !important;
}

.sr-timeline-item strong{
    color:#2B084F !important;
}

/* AI Copilot */
.sr-ai-panel{
    color:#1E293B !important;
}

.sr-ai-panel li{
    color:#334155 !important;
}

/* Priorities */
.badge{
    font-weight:700;
}

.priority-high{
    color:#991B1B !important;
}

.priority-medium{
    color:#92400E !important;
}

.priority-low{
    color:#166534 !important;
}


/* ==========================================================
   RE-108 Sidebar Heading Upgrade
   ========================================================== */

.sidebar h3,
.sidebar h4,
.sidebar .sidebar-heading,
.side-nav h3,
.side-nav h4,
.side-nav .sidebar-heading,
nav.sidebar h3,
nav.sidebar h4,
aside h3,
aside h4,
#sidebar h3,
#sidebar h4{

    color:#D4AF37 !important;          /* Metallic Gold */
    font-weight:800 !important;
    text-transform:uppercase;
    letter-spacing:1.5px;
    font-size:12px;
    opacity:1 !important;
}

/* Gold divider under headings */
.sidebar h3::after,
.sidebar h4::after,
.side-nav h3::after,
.side-nav h4::after{
    content:"";
    display:block;
    width:36px;
    height:2px;
    margin-top:6px;
    background:#D4AF37;
    border-radius:2px;
}

/* ==========================================================
   SentinelRE Premium Navigation Section Titles
   ========================================================== */

.nav-section-title{

    color:#D4AF37 !important;      /* Premium Gold */
    font-size:13px !important;
    font-weight:800 !important;
    letter-spacing:1.5px;
    text-transform:uppercase;

    padding:14px 16px 6px;
    margin-top:18px;
    margin-bottom:6px;

    border-bottom:1px solid rgba(212,175,55,.30);
}

/* Optional subtle glow */

.nav-section-title{
    text-shadow:0 0 6px rgba(212,175,55,.18);
}


/* ==========================================================
   RE-108 ENTERPRISE UI MODERNIZATION
   SentinelRE Premium SaaS Experience
   ========================================================== */

/* Global readability */
body{
  font-family: Inter, "Segoe UI", Arial, sans-serif !important;
  color:#1E293B !important;
  background:linear-gradient(135deg,#fbf8ff 0%,#ffffff 45%,#f7f2ff 100%) !important;
}

/* Premium Sidebar */
.sidebar,
.side-nav,
nav.sidebar,
aside,
#sidebar{
  background:linear-gradient(180deg,#21043D 0%,#2B084F 50%,#160329 100%) !important;
  color:#FFFFFF !important;
  border-right:1px solid rgba(212,175,55,.35) !important;
  box-shadow:14px 0 34px rgba(43,8,79,.22) !important;
}

/* Sidebar section headings */
.nav-section-title{
  color:#D4AF37 !important;
  font-size:12px !important;
  font-weight:900 !important;
  letter-spacing:1.7px !important;
  text-transform:uppercase !important;
  padding:16px 18px 7px !important;
  margin-top:16px !important;
  border-bottom:1px solid rgba(212,175,55,.30) !important;
  opacity:1 !important;
}

/* Sidebar links */
.sidebar a,
.side-nav a,
nav.sidebar a,
aside a,
#sidebar a{
  color:#FFFFFF !important;
  font-weight:700 !important;
  border-radius:14px !important;
  padding:11px 15px !important;
  margin:5px 10px !important;
  display:block !important;
  text-decoration:none !important;
}

.sidebar a:hover,
.side-nav a:hover,
nav.sidebar a:hover,
aside a:hover,
#sidebar a:hover{
  background:rgba(212,175,55,.18) !important;
  color:#FFFFFF !important;
  transform:translateX(2px);
}

.sidebar a.active,
.side-nav a.active,
nav.sidebar a.active,
#sidebar a.active{
  background:#FFFFFF !important;
  color:#2B084F !important;
  border-left:5px solid #D4AF37 !important;
}

/* Logo */
.sentinel-mini-brand{
  background:#FFFFFF !important;
  border:1px solid rgba(212,175,55,.45) !important;
  box-shadow:0 10px 26px rgba(43,8,79,.18) !important;
}

.sentinel-mini-brand img{
  max-height:46px !important;
  width:auto !important;
}

/* Hero */
.hero{
  background:
    radial-gradient(circle at top right,rgba(212,175,55,.22),transparent 35%),
    linear-gradient(135deg,#2B084F 0%,#4B148C 100%) !important;
  border:1px solid rgba(212,175,55,.45) !important;
  border-radius:26px !important;
  box-shadow:0 22px 48px rgba(43,8,79,.24) !important;
}

.hero h1{
  color:#FFFFFF !important;
  font-weight:900 !important;
}

.hero p{
  color:#F3E8FF !important;
}

.eyebrow{
  color:#D4AF37 !important;
  font-weight:900 !important;
}

/* Cards */
.card{
  background:#FFFFFF !important;
  border:1px solid #E9DDF7 !important;
  border-radius:24px !important;
  box-shadow:0 14px 34px rgba(43,8,79,.10) !important;
  color:#1E293B !important;
}

.card h1,
.card h2,
.card h3,
.card h4{
  color:#2B084F !important;
  font-weight:900 !important;
}

.card p,
.card li,
.card span,
.card td,
.card label{
  color:#334155 !important;
}

.small-note,
.text-muted{
  color:#475569 !important;
}

/* KPI metrics */
.metric{
  color:#2B084F !important;
  font-size:36px !important;
  font-weight:900 !important;
}

/* Buttons */
.button,
button,
input[type="submit"]{
  background:linear-gradient(135deg,#2B084F,#4B148C) !important;
  color:#FFFFFF !important;
  border:none !important;
  border-radius:999px !important;
  font-weight:800 !important;
  box-shadow:0 10px 24px rgba(43,8,79,.22) !important;
}

.button.secondary{
  background:#FFFFFF !important;
  color:#2B084F !important;
  border:1px solid #D4AF37 !important;
}

/* Tables */
table{
  color:#1E293B !important;
  border-collapse:separate !important;
  border-spacing:0 !important;
}

th{
  background:#F4F0FB !important;
  color:#2B084F !important;
  font-weight:900 !important;
}

td{
  color:#334155 !important;
  border-bottom:1px solid #EFE6FA !important;
}

tr:hover td{
  background:#FBF7FF !important;
}

/* Badges */
.badge,
.pill{
  font-weight:800 !important;
  border-radius:999px !important;
}

/* Priority badges */
.priority-high{
  background:#FEE2E2 !important;
  color:#991B1B !important;
  border:1px solid #FCA5A5 !important;
}

.priority-medium{
  background:#FEF3C7 !important;
  color:#92400E !important;
  border:1px solid #FCD34D !important;
}

.priority-low{
  background:#DCFCE7 !important;
  color:#166534 !important;
  border:1px solid #86EFAC !important;
}

/* AI Copilot */
.sr-ai-panel{
  background:linear-gradient(180deg,#FFFFFF,#FBF7FF) !important;
  border:1px solid rgba(212,175,55,.50) !important;
}

.sr-ai-title{
  color:#2B084F !important;
  font-weight:900 !important;
}

.sr-ai-panel li{
  color:#334155 !important;
}

/* Timeline */
.sr-timeline-item{
  border-left:4px solid #D4AF37 !important;
  color:#334155 !important;
}

.sr-timeline-item strong{
  color:#2B084F !important;
}

/* Forms */
input,
select,
textarea{
  color:#111827 !important;
  background:#FFFFFF !important;
  border:1px solid #D8C9EA !important;
  border-radius:12px !important;
}

input::placeholder,
textarea::placeholder{
  color:#64748B !important;
}

/* Layout polish */
.grid{
  gap:20px !important;
}

main,
.content,
.page-content{
  padding-top:12px !important;
}

/* Mobile */
@media(max-width:900px){
  .sentinel-mini-brand{display:none !important;}
  .hero{border-radius:18px !important;}
  .card{border-radius:18px !important;}
}


/* RE-109 Universal Client Workspace Tabs */
.workspace-tabs{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.workspace-tabs a{
  background:#FFFFFF;
  color:#2B084F !important;
  border:1px solid rgba(212,175,55,.55);
  border-radius:999px;
  padding:9px 14px;
  font-weight:800;
  text-decoration:none;
  box-shadow:0 6px 16px rgba(43,8,79,.08);
}

.workspace-tabs a:hover{
  background:#2B084F;
  color:#FFFFFF !important;
}

#overview,
#timeline,
#documents,
#transactions,
#tasks,
#compliance,
#notes{
  scroll-margin-top:90px;
}

/* ==========================================================
   RE-120A Dashboard Card Overflow Fix
   ========================================================== */

.card{
    overflow:hidden;
}

/* Broker Approval Queue */
.broker-approval-card,
#broker-approval-card{

    display:flex;
    flex-direction:column;

    min-height:340px;
    max-height:340px;

    overflow:hidden;
}

/* Scroll only the table area */

.broker-approval-card table,
#broker-approval-card table{

    display:block;

    width:100%;

    overflow-y:auto;
    overflow-x:hidden;

    max-height:240px;
}

/* Prevent long text from stretching the card */

.broker-approval-card td,
#broker-approval-card td{

    white-space:normal;
    word-break:break-word;
}

/* Empty state */

.broker-approval-card .empty-state,
#broker-approval-card .empty-state{

    padding:30px;
    text-align:center;
    color:#64748B;
}


/* Broker Approval Queue layout fix */
.full-width-card{
    grid-column:1 / -1 !important;
    width:100% !important;
}

.broker-approval-card{
    overflow:hidden !important;
    margin-bottom:24px !important;
}

.broker-approval-card table{
    width:100% !important;
    table-layout:fixed !important;
}

.broker-approval-card th,
.broker-approval-card td{
    white-space:normal !important;
    word-break:break-word !important;
}

.broker-approval-card td:last-child,
.broker-approval-card th:last-child{
    width:30% !important;
}


/* Broker Approval Queue column width fix */
.broker-approval-card{
    grid-column:1 / -1 !important;
    width:100% !important;
    overflow:hidden !important;
}

.broker-approval-card .table-wrap{
    width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    -webkit-overflow-scrolling:touch;
}

.broker-approval-card table{
    min-width:950px !important;
    width:100% !important;
    table-layout:auto !important;
}

.broker-approval-card th,
.broker-approval-card td{
    white-space:nowrap !important;
    word-break:normal !important;
}

.broker-approval-card th:nth-child(1),
.broker-approval-card td:nth-child(1){
    width:120px !important;
}

.broker-approval-card th:nth-child(2),
.broker-approval-card td:nth-child(2){
    width:180px !important;
}

.broker-approval-card th:nth-child(3),
.broker-approval-card td:nth-child(3){
    width:160px !important;
}

.broker-approval-card th:nth-child(4),
.broker-approval-card td:nth-child(4){
    min-width:260px !important;
}

.broker-approval-card th:nth-child(5),
.broker-approval-card td:nth-child(5){
    min-width:320px !important;
    white-space:normal !important;
}


/* Force Broker Approval Queue to scroll horizontally */
.broker-approval-scroll{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding-bottom:8px !important;
}

.broker-approval-scroll table{
    width:1100px !important;
    min-width:1100px !important;
    table-layout:auto !important;
}

.broker-approval-scroll th,
.broker-approval-scroll td{
    white-space:normal !important;
    word-break:break-word !important;
}

.broker-approval-scroll th:nth-child(4),
.broker-approval-scroll td:nth-child(4),
.broker-approval-scroll th:nth-child(5),
.broker-approval-scroll td:nth-child(5){
    min-width:300px !important;
}


/* ==========================================================
   PHASE B — Charts & Dashboard Visualization
   ========================================================== */

.chart-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:20px;
  margin-bottom:22px;
}

.chart-card{
  background:#FFFFFF;
  border:1px solid #E9DDF7;
  border-radius:24px;
  padding:20px;
  box-shadow:0 14px 34px rgba(43,8,79,.10);
}

.chart-card h2{
  color:#2B084F;
  margin-top:0;
}

.bar-row{
  margin:14px 0;
}

.bar-label{
  display:flex;
  justify-content:space-between;
  font-weight:800;
  color:#334155;
  margin-bottom:6px;
}

.bar-track{
  width:100%;
  height:14px;
  background:#F1E8FB;
  border-radius:999px;
  overflow:hidden;
}

.bar-fill{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg,#2B084F,#D4AF37);
}

.kpi-ring{
  width:145px;
  height:145px;
  border-radius:50%;
  margin:18px auto;
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(circle at center,#fff 0 58%,transparent 59%),
    conic-gradient(#D4AF37 var(--score),#E9DDF7 0);
}

.kpi-ring span{
  font-size:28px;
  font-weight:900;
  color:#2B084F !important;
}

.sparkline{
  height:70px;
  border-radius:16px;
  background:linear-gradient(135deg,#F7F0FF,#FFFFFF);
  border:1px solid #E9DDF7;
  position:relative;
  overflow:hidden;
}

.sparkline::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:18px;
  height:34px;
  background:linear-gradient(135deg,transparent 0%,rgba(43,8,79,.18) 25%,rgba(212,175,55,.35) 55%,rgba(43,8,79,.22) 100%);
  clip-path:polygon(0 80%,15% 55%,30% 70%,45% 35%,60% 50%,75% 20%,100% 40%,100% 100%,0 100%);
}



/* =========================================================
   RE-201 Premium Navigation
   ========================================================= */

.sidebar-nav a.active,
.sidebar-nav a[aria-current="page"] {
    background: linear-gradient(
        135deg,
        rgba(190, 151, 56, 0.22),
        rgba(116, 78, 163, 0.20)
    );
    border-left: 3px solid var(--gold, #c8a24f);
    box-shadow: inset 0 0 0 1px rgba(218, 183, 91, 0.18);
    font-weight: 800;
    transform: translateX(2px);
}

.sidebar-nav a {
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.sidebar-nav a:focus-visible {
    outline: 2px solid var(--gold, #c8a24f);
    outline-offset: 2px;
}

html.sentinelre-js body {
    opacity: 0;
}

html.sentinelre-js body.sentinelre-page-ready {
    opacity: 1;
    transition: opacity 140ms ease-out;
}

@media (prefers-reduced-motion: reduce) {
    .sidebar-nav a,
    html.sentinelre-js body.sentinelre-page-ready {
        transition: none;
    }
}


/* =========================================================
   RE-201 Release 1 Collapsible Navigation and Section Icons
   ========================================================= */

.nav-icon-library {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    pointer-events: none;
}

.nav-section {
    margin: 5px 0;
    border-radius: 10px;
}

.nav-section-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 38px;
    padding: 8px 10px;
    border: 0;
    border-left: 3px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: inherit;
    cursor: pointer;
    font: inherit;
    text-align: left;
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        color 160ms ease;
}

.nav-section-toggle:hover {
    background: rgba(255, 255, 255, 0.07);
}

.nav-section-toggle:focus-visible {
    outline: 2px solid var(--gold, #c8a24f);
    outline-offset: 2px;
}

.nav-section-heading {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 9px;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.075em;
    line-height: 1.25;
    text-transform: uppercase;
}

.nav-section-icon {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
    color: var(--gold, #c8a24f);
}

.nav-section-chevron {
    position: relative;
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    margin-left: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 170ms ease;
    opacity: 0.75;
}

.nav-section-toggle[aria-expanded="false"]
.nav-section-chevron {
    transform: rotate(-45deg);
}

.nav-section-links {
    overflow: hidden;
}

.nav-section-links[hidden] {
    display: none;
}

.nav-section-links > a {
    display: block;
    margin-left: 7px;
}

.nav-section-active > .nav-section-toggle {
    border-left-color: rgba(200, 162, 79, 0.85);
    background: rgba(200, 162, 79, 0.07);
}

.nav-section-active >
.nav-section-toggle >
.nav-section-heading {
    color: var(--gold, #c8a24f);
}

.nav-section-collapsed {
    margin-bottom: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .nav-section-toggle,
    .nav-section-chevron {
        transition: none;
    }
}


/* =========================================================
   RE-201 Release 2 Branded Pictograms, Quick Actions,
   and Badge-Ready Status Indicators
   ========================================================= */

.sidebar-nav .nav-section-links > a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 9px;
}

.nav-link-content {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 9px;
}

.nav-link-label {
    min-width: 0;
    overflow-wrap: anywhere;
}

.nav-link-pictogram {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(200, 162, 79, 0.45);
    border-radius: 9px 9px 11px 11px;
    background:
        linear-gradient(
            145deg,
            rgba(85, 50, 120, 0.96),
            rgba(42, 25, 67, 0.96)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.11),
        0 3px 8px rgba(0, 0, 0, 0.18);
    color: var(--gold, #d0aa55);
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        background-color 160ms ease;
}

.nav-link-pictogram::after {
    content: "";
    position: absolute;
    bottom: -3px;
    left: 50%;
    width: 8px;
    height: 3px;
    border-radius: 0 0 4px 4px;
    background: var(--gold, #d0aa55);
    transform: translateX(-50%);
    opacity: 0.78;
}

.nav-link-pictogram-svg {
    width: 16px;
    height: 16px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sidebar-nav .nav-section-links > a:hover
.nav-link-pictogram,
.sidebar-nav .nav-section-links > a.active
.nav-link-pictogram {
    transform: translateY(-1px);
    border-color: rgba(218, 181, 97, 0.95);
    background:
        linear-gradient(
            145deg,
            rgba(112, 67, 151, 0.98),
            rgba(56, 31, 86, 0.98)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.15),
        0 5px 12px rgba(0, 0, 0, 0.24),
        0 0 0 2px rgba(200, 162, 79, 0.08);
}

.nav-status-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 22px;
    height: 22px;
    padding: 0 6px;
    border: 1px solid rgba(218, 181, 97, 0.7);
    border-radius: 999px;
    background:
        linear-gradient(
            145deg,
            rgba(200, 162, 79, 0.95),
            rgba(157, 116, 39, 0.96)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.32),
        0 2px 7px rgba(0, 0, 0, 0.22);
    color: #22152e;
    font-size: 0.68rem;
    font-weight: 900;
    line-height: 1;
}

.nav-status-count[data-level="attention"] {
    border-color: rgba(255, 210, 102, 0.9);
    background:
        linear-gradient(
            145deg,
            #f0c766,
            #bd8527
        );
}

.nav-status-count[data-level="critical"] {
    border-color: rgba(255, 183, 183, 0.9);
    background:
        linear-gradient(
            145deg,
            #d66a6a,
            #933c50
        );
    color: #fff;
}

.sentinelre-quick-actions {
    margin: 7px 4px 15px;
    overflow: hidden;
    border: 1px solid rgba(200, 162, 79, 0.32);
    border-radius: 14px;
    background:
        radial-gradient(
            circle at top right,
            rgba(200, 162, 79, 0.12),
            transparent 38%
        ),
        linear-gradient(
            145deg,
            rgba(64, 37, 91, 0.96),
            rgba(36, 23, 53, 0.98)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.07),
        0 9px 22px rgba(0, 0, 0, 0.18);
}

.sentinelre-quick-actions-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 11px 11px 9px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.sentinelre-quick-actions-heading {
    display: flex;
    align-items: center;
    min-width: 0;
    gap: 9px;
}

.sentinelre-quick-actions-heading > div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.sentinelre-quick-actions-heading strong {
    color: #fff;
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.sentinelre-quick-actions-heading small {
    margin-top: 2px;
    color: rgba(241, 229, 255, 0.66);
    font-size: 0.61rem;
    line-height: 1.25;
}

.sentinelre-mini-crest {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 34px;
    width: 34px;
    height: 36px;
    border: 1px solid rgba(218, 181, 97, 0.66);
    border-radius: 11px 11px 14px 14px;
    background:
        linear-gradient(
            145deg,
            rgba(107, 62, 144, 0.98),
            rgba(49, 29, 73, 0.98)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.15),
        0 4px 10px rgba(0, 0, 0, 0.21);
    color: var(--gold, #d0aa55);
}

.sentinelre-mini-crest-icon {
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sentinelre-quick-actions-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 27px;
    width: 27px;
    height: 27px;
    border: 1px solid rgba(200, 162, 79, 0.45);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.045);
    color: var(--gold, #d0aa55);
    cursor: pointer;
    font-size: 1rem;
    font-weight: 700;
    line-height: 1;
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        transform 160ms ease;
}

.sentinelre-quick-actions-toggle:hover {
    border-color: rgba(218, 181, 97, 0.88);
    background: rgba(200, 162, 79, 0.11);
    transform: translateY(-1px);
}

.sentinelre-quick-actions-toggle:focus-visible {
    outline: 2px solid var(--gold, #d0aa55);
    outline-offset: 2px;
}

.sentinelre-quick-actions-list {
    display: grid;
    gap: 5px;
    padding: 7px;
}

.sentinelre-quick-actions-list[hidden] {
    display: none;
}

.sentinelre-quick-action {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 51px;
    padding: 7px 8px;
    border: 1px solid transparent;
    border-radius: 10px;
    color: inherit;
    text-decoration: none;
    transition:
        background-color 160ms ease,
        border-color 160ms ease,
        transform 160ms ease;
}

.sentinelre-quick-action:hover {
    border-color: rgba(200, 162, 79, 0.28);
    background: rgba(255, 255, 255, 0.065);
    transform: translateX(2px);
}

.sentinelre-action-badge {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 40px;
    border: 1px solid rgba(218, 181, 97, 0.62);
    border-radius: 12px 12px 15px 15px;
    background:
        linear-gradient(
            145deg,
            rgba(117, 67, 154, 0.98),
            rgba(52, 29, 78, 0.98)
        );
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.14),
        0 4px 11px rgba(0, 0, 0, 0.22);
    color: var(--gold, #d0aa55);
}

.sentinelre-action-badge::before {
    content: "";
    position: absolute;
    top: 4px;
    width: 14px;
    height: 2px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.18);
}

.sentinelre-action-badge::after {
    content: "";
    position: absolute;
    bottom: -4px;
    left: 50%;
    width: 10px;
    height: 4px;
    border-radius: 0 0 5px 5px;
    background: var(--gold, #d0aa55);
    transform: translateX(-50%);
}

.sentinelre-action-icon {
    width: 21px;
    height: 21px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.65;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.sentinelre-action-text {
    display: flex;
    min-width: 0;
    flex: 1 1 auto;
    flex-direction: column;
}

.sentinelre-action-text strong {
    color: rgba(255, 255, 255, 0.94);
    font-size: 0.75rem;
    font-weight: 750;
    line-height: 1.2;
}

.sentinelre-action-text small {
    margin-top: 2px;
    color: rgba(236, 224, 246, 0.62);
    font-size: 0.61rem;
    line-height: 1.25;
}

.sentinelre-action-arrow {
    flex: 0 0 auto;
    color: rgba(218, 181, 97, 0.82);
    font-size: 1.25rem;
    line-height: 1;
}

.sentinelre-quick-actions-collapsed
.sentinelre-quick-actions-header {
    border-bottom-color: transparent;
}

@media (prefers-reduced-motion: reduce) {
    .nav-link-pictogram,
    .sentinelre-quick-action,
    .sentinelre-quick-actions-toggle {
        transition: none;
    }
}


/* =========================================================
   RE-201.5 ROLE-AWARE NAVIGATION INTELLIGENCE
   ========================================================= */

.nav-status-count {
    min-width: 1.55rem;
    height: 1.55rem;
    margin-left: auto;
    padding: 0 0.42rem;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;

    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 999px;

    background:
        linear-gradient(
            145deg,
            rgba(214, 179, 90, 0.95),
            rgba(174, 128, 35, 0.95)
        );

    color: #21162f;
    font-size: 0.71rem;
    font-weight: 800;
    line-height: 1;

    box-shadow:
        0 3px 10px rgba(0, 0, 0, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.35);

    transition:
        transform 160ms ease,
        box-shadow 160ms ease;
}

.nav-status-count[data-level="normal"] {
    background:
        linear-gradient(
            145deg,
            #79c99e,
            #3e9269
        );

    color: #071d12;
}

.nav-status-count[data-level="attention"] {
    background:
        linear-gradient(
            145deg,
            #e5c56f,
            #b88a2f
        );

    color: #21162f;
}

.nav-status-count[data-level="critical"] {
    background:
        linear-gradient(
            145deg,
            #ff857e,
            #b92f3d
        );

    color: #ffffff;

    box-shadow:
        0 0 0 1px rgba(255, 120, 120, 0.25),
        0 4px 14px rgba(185, 47, 61, 0.42);
}

.sidebar a:hover .nav-status-count,
.nav-section a:hover .nav-status-count {
    transform: translateY(-1px) scale(1.04);
}

html[data-sentinel-role="realtor"]
.quick-actions-panel::before {
    content: "Personal Production Workspace";

    display: block;
    margin-bottom: 0.5rem;

    color: rgba(229, 197, 111, 0.92);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

html[data-sentinel-role="broker"]
.quick-actions-panel::before {
    content: "Brokerage Executive Workspace";

    display: block;
    margin-bottom: 0.5rem;

    color: rgba(229, 197, 111, 0.92);
    font-size: 0.66rem;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

@media (prefers-reduced-motion: no-preference) {
    .nav-status-count[data-level="critical"] {
        animation:
            sentinelre-critical-badge-pulse
            2.8s ease-in-out infinite;
    }
}

@keyframes sentinelre-critical-badge-pulse {
    0%,
    100% {
        box-shadow:
            0 0 0 0 rgba(185, 47, 61, 0.20),
            0 4px 14px rgba(185, 47, 61, 0.36);
    }

    50% {
        box-shadow:
            0 0 0 5px rgba(185, 47, 61, 0),
            0 5px 18px rgba(185, 47, 61, 0.48);
    }
}

@media (prefers-reduced-motion: reduce) {
    .nav-status-count {
        animation: none !important;
        transition: none !important;
    }
}
