/* Owner dashboard based on the selected executive reference. */
.reference-owner { --ref-ink:#14243d; --ref-muted:#667286; --ref-border:#e2e8ee; --ref-navy:#102844; --ref-gold:#c29a48; --ref-blue:#3677ce; --ref-teal:#35a99a; grid-template-columns:clamp(208px,16vw,240px) minmax(0,1fr); grid-template-rows:70px minmax(0,1fr); background:#f9fbfd; color:var(--ref-ink); font-size:16px; }
.reference-owner .owner-header { grid-column:2; grid-row:1; height:70px; padding:0 24px; box-shadow:none; border-bottom:1px solid var(--ref-border); position:sticky; top:0; z-index:20; gap:20px; }
.reference-owner .owner-header>.brand { display:none; }
.reference-owner .owner-header-search { width:min(350px,35vw); height:40px; border:1px solid var(--ref-border); border-radius:10px; display:flex; align-items:center; gap:10px; padding:0 12px; background:#f8fafc; color:#a6afbe; margin-inline-end:auto; }
.reference-owner .owner-header-search svg,.reference-owner .owner-bell svg { width:19px; height:19px; }
.reference-owner .owner-header-search input { flex:1; width:0; border:0; outline:0; background:transparent; font-size:14px; color:var(--ref-ink); }
.reference-owner .header-actions { gap:22px; }
.reference-owner .owner-bell { position:relative; display:grid; place-items:center; color:var(--ref-ink); }
.reference-owner .owner-bell i { position:absolute; top:-2px; right:-2px; width:8px; height:8px; background:#e64c5b; border-radius:50%; border:1px solid white; }
.reference-owner .owner-profile { display:flex; gap:9px; align-items:center; font-size:13px; font-weight:800; max-width:250px; }
.reference-owner .owner-profile>span:last-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.reference-owner .owner-profile small { display:block; color:#7b8798; font-size:11px; font-weight:500; }
.reference-owner .owner-profile-avatar { width:36px; height:36px; display:grid; place-items:center; border-radius:50%; background:#f0e5de; color:#7b4c3c; font-size:18px; flex:none; }
.reference-owner .owner-logout { display:none; }
.reference-owner .owner-sidebar { grid-column:1; grid-row:1/3; position:sticky; top:0; height:100vh; z-index:21; background:linear-gradient(160deg,#132f4d,#0b2038); padding:0 10px 15px; color:#e7eef5; display:flex; flex-direction:column; overflow:auto; }
.reference-owner .ref-sidebar-brand { height:105px; flex:none; display:flex; gap:10px; align-items:center; justify-content:center; color:white; font-size:29px; font-weight:900; line-height:1.05; }
.reference-owner .ref-sidebar-brand small { display:block; font-size:10px; color:#cad5df; font-weight:600; margin-top:6px; }
.reference-owner .ref-brand-symbol { font-size:31px; color:#d2a652; transform:rotate(-18deg); text-shadow:2px 2px 0 #8d682f; }
.reference-owner .owner-sidebar nav { display:flex; flex-direction:column; gap:5px; }
.reference-owner .owner-sidebar .nav-item { border-radius:7px; min-height:44px; font-size:14px; font-weight:700; gap:11px; padding:9px 13px; margin:0; color:#dce7f0; line-height:1.15; transform:none; }
.reference-owner .owner-sidebar .nav-item svg { width:18px; height:18px; flex:none; }
.reference-owner .owner-sidebar .nav-item:hover { background:#1d4668; color:#fff; }
.reference-owner .owner-sidebar .nav-item.active { background:#174668; color:#fff; box-shadow:inset -4px 0 0 #23c2e9; }
.reference-owner .owner-sidebar .nav-count { margin-right:auto; background:#f15a6b; color:white; border-radius:50%; min-width:23px; height:23px; font-size:12px; }
.reference-owner .owner-sidebar .sidebar-label { margin:16px 14px 4px; color:#94adc2; font-size:11px; }
.reference-owner .ref-sidebar-footer { margin-top:auto; padding:15px 0 0; border-top:1px solid #55718b55; }
.reference-owner .ref-sidebar-footer .nav-item { color:#b7c7d6; }
.reference-owner .owner-main { grid-column:2; grid-row:2; width:100%; max-width:none; padding:22px clamp(18px,2.2vw,36px) 28px; margin:0; }
.ref-overview { max-width:1680px; margin:0 auto; }
.ref-topline h1 { margin:0 0 1px; font-size:clamp(24px,2.2vw,33px); line-height:1.15; font-weight:900; color:#13253e; }
.ref-topline p { margin:0; color:#7d8898; font-size:14px; }
.ref-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:16px 0; }
.ref-company-tabs { display:flex; gap:9px; flex-wrap:wrap; }
.ref-company-tab,.ref-period { min-width:130px; height:39px; display:flex; align-items:center; justify-content:center; gap:10px; border:1px solid #dce3ea; background:#fff; border-radius:9px; padding:0 11px; color:#31445d; font-size:13px; font-weight:700; box-shadow:0 2px 5px #152c4006; }
.ref-company-tab svg { width:16px; height:16px; }.ref-company-tab svg:last-child { width:12px; height:12px; margin-right:6px; }
.ref-company-tab.featured { background:#c39b49; color:#fff; border-color:#c39b49; }
.ref-company-tab:hover { border-color:#b99145; }
.ref-period { min-width:212px; justify-content:flex-start; color:#5b697e; }
.ref-period svg { width:16px; height:16px; }.ref-period svg:last-child { width:11px; height:11px; margin-right:auto; }
.ref-period select { border:0; background:transparent; color:inherit; outline:0; appearance:none; font-size:13px; font-weight:700; padding:0; cursor:pointer; }
.ref-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.ref-metric { min-height:112px; border:1px solid #e5ebed; border-radius:11px; padding:17px 18px; display:flex; align-items:flex-start; justify-content:space-between; box-shadow:0 5px 16px #19334209; }
.ref-metric.mint { background:#f3fcf8; }.ref-metric.blue { background:#f3f9fd; }.ref-metric.aqua { background:#f2fcfa; }.ref-metric.gold { background:#fffbf2; }
.ref-metric-copy { display:flex; flex-direction:column; align-items:flex-start; min-width:0; }.ref-metric-copy>span { font-size:14px; font-weight:800; white-space:nowrap; }.ref-metric-copy strong { color:#122541; font-size:31px; line-height:1.25; font-weight:900; font-family:Zain,Tahoma,sans-serif; }.ref-metric-copy small { color:#84909b; font-size:11px; white-space:nowrap; }
.ref-metric>i { width:46px; height:46px; flex:none; display:grid; place-items:center; border-radius:50%; font-style:normal; }.ref-metric svg { width:23px; height:23px; stroke-width:2.3; }
.ref-metric.mint>i { background:#c9f2df;color:#126b54; }.ref-metric.blue>i { background:#d3e9ff;color:#1a69c4; }.ref-metric.aqua>i { background:#c7f3e8;color:#167c70; }.ref-metric.gold>i { background:#f9eab8;color:#a47a17; }
.ref-primary-grid,.ref-bottom-grid { display:grid; grid-template-columns:minmax(285px,1fr) minmax(0,2fr); gap:14px; margin-top:16px; align-items:stretch; }
.ref-bottom-grid { grid-template-columns:minmax(310px,1fr) minmax(0,1.35fr); }
.ref-panel { background:#fff; border:1px solid #e0e7ec; border-radius:10px; box-shadow:0 4px 16px #1c344008; padding:16px; min-width:0; }
.ref-panel-head { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:12px; }.ref-panel-head h2 { margin:0; display:flex; align-items:center; gap:8px; font-size:17px; font-weight:900; color:#172a43; white-space:nowrap; }.ref-panel-head h2 svg { width:18px; height:18px; }.ref-panel-head>a { font-size:12px; font-weight:800; color:#2180b6; white-space:nowrap; }
.ref-alert-list { display:flex; flex-direction:column; gap:9px; }.ref-alert { min-height:49px; padding:8px 13px; display:flex; justify-content:space-between; align-items:center; gap:9px; border-radius:8px; border-right:3px solid; }.ref-alert:hover { filter:brightness(.98); }.ref-alert-title { display:flex; flex-direction:column; gap:0; min-width:0; }.ref-alert-title b { font-size:13px; line-height:1.25; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.ref-alert-title small { font-size:11px; color:#737f8c; }.ref-alert>strong { width:30px; height:30px; display:grid; place-items:center; flex:none; border-radius:50%; font-size:16px; }
.ref-alert.red { background:#fff2f2; border-color:#ed6878; }.ref-alert.red strong { background:#f9c7d0; color:#c51f39; }.ref-alert.amber { background:#fff9ed; border-color:#e6b553; }.ref-alert.amber strong { background:#f9e5bd;color:#986415; }.ref-alert.blue { background:#f1f8ff; border-color:#5b9ede; }.ref-alert.blue strong { background:#c9e4fb;color:#135a9f; }.ref-alert.gray { background:#f7f8fa; border-color:#7b8798; }.ref-alert.gray strong { background:#dbe0e6;color:#4c596a; }
.ref-legend { display:flex; gap:14px; align-items:center; flex-wrap:wrap; }.ref-legend span { display:flex; align-items:center; gap:5px; font-size:11px; color:#677487; }.ref-legend i { width:8px; height:8px; border-radius:50%; display:block; }
.reference-chart { display:flex; height:223px; position:relative; padding:10px 29px 0 4px; direction:ltr; }.chart-gridlines { position:absolute; inset:9px 29px 27px 4px; display:flex; flex-direction:column; justify-content:space-between; pointer-events:none; color:#82909e; font:11px Arial,sans-serif; }.chart-gridlines span { height:1px; border-bottom:1px solid #e7edf0; display:flex; align-items:center; padding-left:3px; }.chart-columns { display:flex; flex:1; justify-content:space-around; align-items:stretch; gap:2px; padding-top:0; z-index:1; }.chart-month { min-width:0; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; }.chart-bars { display:flex; align-items:flex-end; justify-content:center; gap:2px; width:100%; height:calc(100% - 27px); }.chart-bar { width:clamp(4px,1vw,15px); height:var(--bar-height); background:var(--bar-color); border-radius:3px 3px 0 0; min-height:0; }.chart-label { height:26px; width:100%; display:grid; place-items:center; white-space:nowrap; color:#66758a; font-size:11px; direction:rtl; }
.ref-comparison .table-wrap { border:0; border-radius:0; overflow:auto; }.ref-comparison table { width:100%; border-collapse:separate; border-spacing:0 3px; font-size:12px; }.ref-comparison th { background:#f3f6f9; color:#5a6a80; border:0; padding:7px 9px; font-size:11px; }.ref-comparison td { padding:8px 9px; border:0; white-space:nowrap; }.ref-comparison td:first-child { font-weight:800; }.ref-comparison td:first-child a { display:flex; gap:6px; align-items:center; }.ref-comparison td:first-child svg { width:15px; height:15px; }.ref-comparison .company-row.tone-0 { background:#fff9ec; }.ref-comparison .company-row.tone-1 { background:#edf6ff; }.ref-comparison .company-row.tone-2 { background:#eef9f5; }.ref-comparison .tone-0 svg { color:#bc8e36; }.ref-comparison .tone-1 svg { color:#2b78c8; }.ref-comparison .tone-2 svg { color:#238f7a; }.ref-total { font-weight:900; border-top:1px solid #dae3e9; }.ref-total td { border-top:1px solid #e0e6eb; font-size:13px; }
.ref-activity-list { display:flex; flex-direction:column; }.ref-activity-row { min-height:52px; display:flex; align-items:center; gap:10px; border-bottom:1px solid #edf0f3; }.ref-activity-row:last-child { border:0; }.ref-activity-row>div { display:flex; flex-direction:column; min-width:0; flex:1; }.ref-activity-row strong { font-size:13px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.ref-activity-row small { font-size:11px; color:#83909d; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.ref-avatar { width:33px; height:33px; border-radius:50%; display:grid; place-items:center; font-size:15px; font-weight:800; flex:none; }.ref-avatar.tone-0 { background:#f9e9dd;color:#864e3c; }.ref-avatar.tone-1 { background:#d8efe7;color:#1b715b; }.ref-avatar.tone-2 { background:#e0e9f9;color:#2a5597; }.ref-activity-symbol { width:29px; height:29px; border-radius:50%; background:#f0f5f8; color:#4287a8; display:grid; place-items:center; flex:none; }.ref-activity-symbol svg { width:15px; height:15px; }.ref-activity-row time { color:#83909d; font-size:10px; white-space:nowrap; flex:none; }
@media(max-width:1150px) { .reference-owner .owner-profile>span:last-child { display:none; }.ref-primary-grid,.ref-bottom-grid { grid-template-columns:1fr 1.65fr; }.ref-metric { padding:13px; }.ref-metric>i { width:38px;height:38px; }.ref-metric-copy strong { font-size:27px; } }
@media(max-width:950px) { .reference-owner { grid-template-columns:minmax(0,1fr); }.reference-owner .owner-header { grid-column:1; }.reference-owner .owner-header>.brand { display:flex; }.reference-owner .owner-menu-toggle { display:grid; }.reference-owner .owner-sidebar { position:fixed; right:-255px; top:70px; height:calc(100vh - 70px); width:240px; transition:right .2s; box-shadow:-15px 0 30px #0f172a44; }.reference-owner .owner-sidebar.open { right:0; }.reference-owner .owner-sidebar .ref-sidebar-brand { display:none; }.reference-owner .owner-main { grid-column:1; }.ref-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) { .reference-owner .owner-header { padding:0 12px; gap:8px; }.reference-owner .owner-header-search { display:none; }.reference-owner .header-actions { margin-right:auto; gap:13px; }.reference-owner .owner-main { padding:16px 11px; }.ref-topline h1 { font-size:24px; }.ref-toolbar { flex-direction:column; align-items:stretch; }.ref-company-tabs { flex-wrap:nowrap; overflow:auto; padding-bottom:3px; }.ref-company-tab { min-width:132px; }.ref-period { align-self:flex-start; }.ref-primary-grid,.ref-bottom-grid { grid-template-columns:1fr; }.ref-chart-panel,.ref-comparison { min-width:0; }.ref-alerts,.ref-activity { order:1; }.ref-chart-panel,.ref-comparison { order:2; }.ref-metric-copy strong { font-size:26px; }.ref-metric-copy small { white-space:normal; }.ref-legend { gap:5px; }.ref-legend span { font-size:10px; }.reference-chart { overflow:hidden; }.ref-activity-row time { display:none; } }
@media(max-width:390px) { .ref-metric { padding:10px; }.ref-metric>i { width:33px;height:33px; }.ref-metric-copy>span { font-size:12px; }.ref-metric-copy strong { font-size:24px; }.ref-panel { padding:12px; } }

.reference-owner [hidden] { display:none!important; }
.reference-owner .owner-sidebar a[href='/owner/pending'] { font-size:12px; gap:6px; padding-inline:9px; }
