/* IET WorkHub - Django port. Section 1: minimal reset (replaces Tailwind preflight) */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;border:0 solid}
html{line-height:1.5;-webkit-text-size-adjust:100%}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-size:inherit;font-weight:inherit}
ol,ul{list-style:none}
img,svg{display:block}
table{border-collapse:collapse;width:100%}
button,input,select,textarea{font:inherit;letter-spacing:inherit;color:inherit;background:transparent}
textarea{resize:vertical}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
:focus-visible{outline:2px solid var(--primary);outline-offset:2px}
/* Section 2: original WorkHub design (copied unchanged from IET_WorkHub.html) */
:root{--background:#f6f8fa;--foreground:#172a39;--card:#fff;--card-foreground:#171717;--popover:#fff;--popover-foreground:#171717;--primary:#147d80;--primary-foreground:#fafafa;--secondary:#f5f5f5;--secondary-foreground:#171717;--muted:#f5f5f5;--muted-foreground:#737373;--accent:#f5f5f5;--accent-foreground:#171717;--destructive:#e7000b;--border:#e5e5e5;--input:#e5e5e5;--ring:#147d80;--chart-1:#f54900;--chart-2:#009689;--chart-3:#104e64;--chart-4:#ffb900;--chart-5:#fe9a00;--radius:.5rem;--sidebar:#142936;--sidebar-foreground:#c5d1d9;--sidebar-primary:#171717;--sidebar-primary-foreground:#fafafa;--sidebar-accent:#25404d;--sidebar-accent-foreground:#fff;--sidebar-border:#2b3e4a;--sidebar-ring:#a1a1a1}body{background:var(--background);color:var(--foreground);letter-spacing:-.015em;font-family:Arial,Helvetica,sans-serif;font-size:16px}button,a,input,textarea{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed}.brand{color:#fff;align-items:center;gap:11px;display:flex}.brand-mark{color:#fff;background:#32b7ab;border-radius:10px;flex-shrink:0;place-items:center;width:36px;height:36px;display:grid}.brand strong{letter-spacing:-.6px;font-size:19px}.brand small{letter-spacing:1.55px;color:#849ca9;margin-top:3px;font-size:9px;font-weight:600;display:block}.nav-label{letter-spacing:1.5px;margin-bottom:8px;font-weight:600;color:#7d96a5!important;font-size:10px!important}.nav-item{margin:2px 0;color:#b9c9d4!important;gap:12px!important;height:44px!important;padding:0 12px!important;font-size:14px!important}.nav-item svg{width:18px!important;height:18px!important}.nav-item[data-active=true]{border-radius:5px;box-shadow:inset 3px 0 #64d2bf;color:#7de0d2!important;background:#244651!important}.nav-count{color:#a9dace;background:#345562;border-radius:4px;margin-left:auto;padding:1px 7px;font-size:11px}.company-nav{color:#acbfca!important;height:38px!important;padding:0 12px!important;font-size:13px!important}.company-dot{border-radius:3px;flex-shrink:0;width:8px;height:8px;display:inline-block}.sidebar-note{color:#a9c2cb;border:1px solid #30444e;border-radius:8px;align-items:flex-start;gap:8px;padding:12px;font-size:11px;display:flex}.sidebar-note svg{color:#68bcaf;flex-shrink:0}.sidebar-note small{color:#77909e;margin-top:4px;font-size:10px;display:block}.profile{color:#edf3f5;align-items:center;gap:10px;margin-top:18px;padding:8px 1px 0;display:flex}.profile strong{font-size:13px;display:block}.profile small{color:#90a7b5;margin-top:3px;font-size:10px;display:block}.profile a{color:#9dafb9;margin-left:auto}.avatar{color:#506772;background:#e8eef0;border:1px solid #dce6e9;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:12px;font-weight:600;display:inline-flex}.avatar-sm{width:27px;height:27px;font-size:10px}.topbar{background:#fff;border-bottom:1px solid #e7ecef;justify-content:space-between;align-items:center;gap:20px;height:76px;padding:0 36px;display:flex}.breadcrumb{color:#8b99a4;align-items:center;gap:12px;font-size:13px;display:flex}.breadcrumb strong{color:#3b5160;font-weight:500}.topbar-right{align-items:center;gap:24px;display:flex}.live-label{color:#7e9098;align-items:center;gap:7px;font-size:11px;display:flex}.live-label i{background:#45ae93;border-radius:50%;width:6px;height:6px}.company-select{width:185px}.company-select button{border-color:#e1e8ec;height:36px;font-size:13px}.main-content{width:100%;max-width:1680px;margin:auto;padding:34px 36px 0}.page-heading{justify-content:space-between;align-items:center;gap:20px;margin-bottom:28px;display:flex}.eyebrow{letter-spacing:1.3px;text-transform:uppercase;color:#82929e;margin-bottom:9px;font-size:10px;font-weight:600;display:block}.page-heading h1{letter-spacing:-1px;font-size:29px;font-weight:650;line-height:1.3}.page-heading p{color:#7b8c99;margin-top:7px;font-size:14px}.heading-actions button{height:39px;font-size:13px;box-shadow:0 2px 3px #142e3912}.stat-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:26px;display:grid}.stat-card{text-align:left;background:#fff;border:1px solid #e3e9ed;border-radius:10px;padding:19px 21px;transition:transform .15s,border-color .15s;box-shadow:0 2px 2px #213c4603}.stat-card:hover{border-color:#b0cecf;transform:translateY(-2px)}.stat-top{color:#647786;justify-content:space-between;align-items:center;font-size:13px;display:flex}.stat-icon{border-radius:8px;place-items:center;width:31px;height:31px;display:grid}.teal{color:#218f8a;background:#e8f5f3}.orange{color:#d29358;background:#fff3e9}.purple{color:#8c81ba;background:#f0eefe}.green{color:#599376;background:#eaf5ed}.stat-card>strong{letter-spacing:-1px;margin:10px 0 5px;font-size:34px;font-weight:600;display:block}.stat-card>small{color:#8a98a3;font-size:11px}.panel{background:#fff;border:1px solid #e3e9ed;border-radius:10px;overflow:hidden}.overview-grid{grid-template-columns:minmax(0,2.3fr) minmax(270px,1fr);gap:22px;display:grid}.panel-heading{justify-content:space-between;align-items:center;gap:10px;padding:21px 22px 18px;display:flex}.panel h2,.section-heading h2{letter-spacing:-.35px;font-size:16px;font-weight:600}.panel-heading p{color:#8a9aa5;margin-top:5px;font-size:12px}.panel-heading button{color:#6d818e;padding:0 6px;font-size:11px}.table-wrap{overflow-x:auto}.table-wrap th,.panel th{color:#8a9aa5;text-transform:uppercase;letter-spacing:.8px;white-space:nowrap;background:#fafbfc;height:39px;font-size:10px;font-weight:500}.table-wrap td,.panel td{border-color:#edf1f4;padding-top:18px;padding-bottom:18px;font-size:12px}.table-wrap tr:last-child{border:0}.task-title{color:#2b424f;font-size:13px;font-weight:550}.task-title:hover{text-underline-offset:3px;text-decoration:underline}.task-sub{color:#95a2ab;align-items:center;gap:5px;margin-top:5px;font-size:10px;display:flex}.example-label{color:#7d83a0;background:#f3f5fc;border:1px solid #e1e6f0;border-radius:3px;padding:0 4px;font-size:9px;display:inline-flex}.status{white-space:nowrap;color:#718396;background:#f0f3f7;border-radius:4px;align-items:center;gap:5px;padding:4px 7px;font-size:10px;font-weight:500;display:inline-flex}.status>span{background:currentColor;border-radius:50%;width:5px;height:5px}.status-in-progress{color:#5383b8;background:#eaf2ff}.status-blocked,.status-paused{color:#c8796b;background:#fff0ed}.status-review{color:#9873be;background:#f3eeff}.status-done,.status-active{color:#578d6c;background:#e9f5ed}.status-ready-to-join{color:#b3945a;background:#fff6e8}.priority{color:#8e9aa7;white-space:nowrap;align-items:center;gap:5px;font-size:11px;display:inline-flex}.priority>span{font-size:15px;font-weight:700}.priority-high{color:#bc9455}.priority-urgent{color:#c86563}.priority-low{color:#90a4ae}.person{white-space:nowrap;color:#6c7d89;align-items:center;gap:7px;font-size:11px;display:inline-flex}.due{color:#7d8d98;white-space:nowrap;align-items:center;gap:3px;font-size:11px;display:inline-flex}.late{color:#c67c59!important}.company-label{white-space:nowrap;align-items:center;gap:6px;font-size:11px;display:flex}.company-label i{border-radius:2px;width:6px;height:6px}.panel-foot{color:#9aa6ad;border-top:1px solid #edf1f4;align-items:center;gap:6px;padding:12px 22px;font-size:10px;display:flex}.activity-list{padding:1px 22px 15px}.activity{border-bottom:1px solid #f0f3f5;align-items:flex-start;gap:9px;padding:13px 0;display:flex}.activity:last-child{border:0}.activity p{color:#81919c;overflow-wrap:anywhere;font-size:11px;line-height:1.65}.activity strong{color:#506773;font-weight:600}.activity small{color:#a4afb7;margin-top:4px;font-size:9px;display:block}.activity-dot{background:#d1e8e3;border-radius:50%;width:7px;height:7px}.companies-overview{margin-top:28px}.section-heading{justify-content:space-between;align-items:center;margin-bottom:13px;display:flex}.section-heading button{color:#8595a1;font-size:11px}.company-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;display:grid}.company-card{text-align:left;background:#fff;border:1px solid #e3e9ed;border-radius:10px;padding:21px;transition:border-color .15s}.company-card:hover{border-color:#9dc6c8}.company-card-top{color:#a2b1ba;justify-content:space-between;align-items:center;margin-bottom:17px;display:flex}.company-monogram{border-radius:9px;place-items:center;width:38px;height:38px;font-size:12px;font-weight:700;display:grid}.company-card h3,.company-detail h2{font-size:15px;font-weight:600}.company-card p,.company-detail>p{color:#93a2ac;margin-top:4px;font-size:10px}.company-metrics{color:#9aa7b0;justify-content:space-between;margin:23px 0 9px;font-size:10px;display:flex}.company-metrics strong{color:#506978;font-weight:600}.work-note{background:#edf3f5;border:1px solid #e1e9ed;border-radius:8px;align-items:center;gap:15px;margin-top:25px;padding:19px 22px;display:flex}.note-icon{color:#7c9aa7;background:#e2ecef;border-radius:9px;place-items:center;width:40px;height:40px;display:grid}.work-note strong{color:#526f7d;font-size:12px;font-weight:600}.work-note p{color:#8c9ca6;margin-top:4px;font-size:11px}.work-note button{color:#607e8d;flex-shrink:0;margin-left:auto;font-size:11px}.workspace-footer{color:#a6b3bc;justify-content:space-between;gap:12px;padding:29px 0 22px;font-size:10px;display:flex}.workspace-footer span:first-child{font-weight:600}.task-toolbar{justify-content:space-between;align-items:center;gap:14px;padding:18px;display:flex}.search-box{width:100%;max-width:380px;position:relative}.search-box>svg{color:#93a3ae;position:absolute;top:11px;left:11px}.search-box input{height:39px;padding-left:35px;font-size:13px}.filter-controls{align-items:center;gap:12px;display:flex}.filter-controls>button{min-width:148px;font-size:12px}.layout-toggle{border:1px solid #e1e7ea;border-radius:6px;padding:2px;display:flex}.layout-toggle button{width:30px;height:30px}.task-summary{color:#8e9fa9;border-top:1px solid #f0f3f5;justify-content:space-between;padding:12px 20px;font-size:11px;display:flex}.task-summary label{align-items:center;gap:7px;display:flex}.board{background:#f8fafb;border-top:1px solid #e9edf0;gap:16px;padding:18px;display:flex;overflow-x:auto}.board-column{flex:1;min-width:220px}.board-heading{color:#90a2ad;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:11px;display:flex}.board-card{text-align:left;background:#fff;border:1px solid #e0e7ec;border-radius:8px;width:100%;margin-bottom:12px;padding:16px;display:block;box-shadow:0 2px 4px #26353d04}.board-card:hover{border-color:#abc9c9}.board-company{color:#8c9da8;font-size:9px}.board-card h3{margin:8px 0 12px;font-size:14px;font-weight:550;line-height:1.5}.board-card .example-label{margin-right:6px}.board-card-foot{color:#8a9ba6;justify-content:space-between;align-items:center;margin-top:17px;font-size:11px;display:flex}.blank{text-align:center;color:#96a4ae;padding:48px 28px}.blank-icon{color:#90b5b4;background:#eff6f6;border-radius:14px;place-items:center;width:50px;height:50px;margin:0 auto 16px;display:grid}.blank h3{color:#49636f;font-size:16px;font-weight:600}.blank p{max-width:380px;margin:8px auto 20px;font-size:13px;line-height:1.65}.project-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;display:grid}.project-card{padding:24px}.project-icon{color:#468f91;background:#edf6f5;border-radius:10px;place-items:center;width:45px;height:45px;display:grid}.project-card h2{margin:8px 0;font-size:18px}.project-card>p{color:#8a9ba6;min-height:44px;font-size:13px;line-height:1.6}.project-progress{color:#899aa6;justify-content:space-between;margin:24px 0 9px;font-size:11px;display:flex}.project-progress strong{color:#588386}.project-actions{justify-content:space-between;margin-top:22px;display:flex}.project-actions button{font-size:12px}.chat-header{border-bottom:1px solid #edf1f4;justify-content:space-between;align-items:center;gap:16px;padding:22px 25px;display:flex}.chat-header p{color:#8b9ca6;margin-top:5px;font-size:12px}.chat-messages{min-height:350px;max-height:520px;padding:24px;overflow-y:auto}.chat-message{gap:12px;max-width:88%;margin-bottom:25px;display:flex}.chat-message.mine{flex-direction:row-reverse;margin-left:auto}.message-meta{align-items:center;gap:12px;margin-bottom:7px;display:flex}.message-meta strong{color:#526c79;font-size:12px}.message-meta time{color:#9baab3;font-size:10px}.message-body{white-space:pre-wrap;overflow-wrap:anywhere;color:#526b7b;background:#f3f6f8;border-radius:0 9px 9px;padding:13px 16px;font-size:14px;line-height:1.6}.mine .message-body{background:#eef7f5;border-radius:9px 0 9px 9px}.message-composer{background:#fcfdfd;border-top:1px solid #e9edf0;padding:20px 24px}.message-composer textarea{background:#fff;min-height:75px;font-size:14px}.message-composer>div{justify-content:space-between;align-items:center;margin-top:12px;display:flex}.message-composer span{color:#a1adb6;font-size:10px}.info-banner{color:#628782;background:#edf6f5;border:1px solid #daebe8;border-radius:8px;align-items:center;gap:12px;margin-bottom:22px;padding:17px 20px;display:flex}.info-banner svg{flex-shrink:0}.info-banner p{font-size:13px;line-height:1.65}.help-text{color:#92a1ac;margin-top:15px;font-size:11px;line-height:1.7}.company-detail{padding:24px}.company-detail-stats{color:#96a6af;justify-content:space-between;padding:25px 0;font-size:11px;display:flex}.company-detail-stats strong{color:#4b6470;margin-bottom:5px;font-size:22px;font-weight:550;display:block}.company-detail>button{font-size:12px}.detail-grid{grid-template-columns:1fr 1fr;gap:24px;margin-bottom:26px;display:grid}.detail-grid>div{color:#637d8b;flex-direction:column;gap:8px;font-size:14px;display:flex}.detail-grid small{color:#99a8b1;font-size:11px}.detail-grid .person{font-size:14px}.task-description{color:#657d8a;white-space:pre-wrap;overflow-wrap:anywhere;font-size:15px;line-height:1.8}.document-link{color:#258f8c;align-items:center;gap:8px;margin-top:20px;font-size:13px;display:flex}.task-comments{padding:18px 0}.task-comment{gap:10px;margin-bottom:22px;display:flex}.task-comment>div{min-width:0}.task-comment strong{color:#5a7180;font-size:12px}.task-comment small{color:#a0acb6;margin-top:3px;font-size:10px;display:block}.task-comment p{white-space:pre-wrap;overflow-wrap:anywhere;color:#6a7f8b;margin-top:9px;font-size:14px;line-height:1.7}.discussion-empty{color:#9aa8b3;text-align:center;padding:20px 10px;font-size:13px;line-height:1.8}.editor-form{flex-direction:column;gap:17px;padding-top:5px;display:flex}.field{flex-direction:column;gap:7px;min-width:0;display:flex}.field>span{color:#6f838f;font-size:12px;font-weight:500}.field input,.field textarea,.field button{font-size:14px}.form-grid{grid-template-columns:1fr 1fr;gap:17px;display:grid}.form-note{color:#8a9ca5;background:#f4f7f8;border-radius:7px;padding:13px;font-size:12px;line-height:1.75}.color-input{background:#fff;border:1px solid #dce4e9;border-radius:5px;width:70px;height:38px;padding:4px}.form-error,.error-banner{color:#b76e5c;background:#fff0ed;border:1px solid #f3dcd5;border-radius:7px;padding:12px;font-size:13px;line-height:1.5}.error-banner{align-items:center;gap:10px;margin-bottom:20px;display:flex}.error-banner button{margin-left:auto}.entry{background:radial-gradient(at 30% 25%,#21434c 0%,#142a37 55%,#0f222e 100%);place-items:center;min-height:100dvh;padding:24px;display:grid}.entry-card{background:#fff;border-radius:16px;width:100%;max-width:430px;padding:38px;box-shadow:0 20px 80px #05151e55}.entry-card>.brand-mark{width:45px;height:45px;margin-bottom:26px}.entry-card h1{letter-spacing:-1.2px;font-size:33px;font-weight:650}.entry-card>p{color:#8597a3;margin-top:12px;font-size:15px;line-height:1.8}.entry-alert{color:#708993;gap:10px;margin:17px 0 8px;padding:17px 0;font-size:13px;line-height:1.7;display:flex}.entry-alert svg{flex-shrink:0;margin-top:3px}.entry-note{text-align:center;font-size:11px!important;line-height:1.7!important}.work-sidebar [data-sidebar=sidebar]{background:#142936}@media (min-width:1450px){.main-content{padding:40px 44px 0}.stat-card{padding:24px}.overview-grid{grid-template-columns:2.4fr 1fr}.stat-card>small{font-size:12px}.task-title{font-size:14px}.table-wrap td{padding-top:21px;padding-bottom:21px}}@media (max-width:1200px){.main-content{padding:26px 24px 0}.topbar{padding:0 24px}.overview-grid{grid-template-columns:1fr}.activity-panel{display:none}.stat-grid{gap:12px}.stat-card{padding:15px}.stat-card>small{line-height:1.5;display:block}.company-grid{gap:12px}.company-card{padding:17px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.live-label{display:none}}@media (max-width:767px){.topbar{gap:10px;height:64px;padding:0 16px}.breadcrumb{gap:5px;font-size:11px}.breadcrumb>svg{display:none}.breadcrumb{font-size:0}.breadcrumb strong{font-size:12px}.company-select{width:150px}.main-content{padding:24px 16px 0}.page-heading{align-items:flex-start;gap:12px}.page-heading h1{font-size:25px}.page-heading p{font-size:12px;line-height:1.7}.eyebrow{font-size:9px}.heading-actions button{gap:4px;height:34px;padding:0 10px;font-size:11px}.stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.stat-card>strong{font-size:30px}.stat-card>small{font-size:10px}.company-grid,.project-grid{grid-template-columns:1fr}.company-card p,.company-detail>p{font-size:12px}.work-note{align-items:flex-start;padding:16px}.work-note button{display:none}.work-note p{line-height:1.7}.note-icon{flex-shrink:0}.workspace-footer span:nth-child(2){display:none}.task-toolbar{flex-direction:column;align-items:stretch;padding:14px}.filter-controls{justify-content:space-between}.filter-controls>button{width:auto}.search-box{max-width:none}.chat-header{flex-wrap:wrap;padding:18px}.chat-messages{min-height:300px;padding:18px}.chat-message{gap:7px;max-width:100%}.message-meta{flex-wrap:wrap;gap:7px}.message-meta time{font-size:9px}.message-composer{padding:15px}.message-composer span{max-width:150px;font-size:9px}.info-banner{align-items:flex-start}.info-banner p{font-size:12px}.task-summary{padding:12px 15px}.company-metrics{font-size:12px}.panel-heading{padding:18px}.panel-foot{padding:12px 15px;font-size:9px}.entry-card{padding:28px}.detail-grid{gap:20px}.task-sheet .status{font-size:11px}}.nav-item{font-size:15px!important}.company-nav{font-size:14px!important}.nav-label{font-size:11px!important}.profile strong{font-size:14px}.profile small,.sidebar-note,.sidebar-note small{font-size:12px}.brand small{font-size:10px}.breadcrumb{font-size:14px}.live-label{font-size:12px}.company-select button{font-size:14px}.eyebrow{font-size:12px}.page-heading p{font-size:16px}.heading-actions button,.stat-top{font-size:14px}.stat-card>small{font-size:12px;line-height:1.6}.panel h2,.section-heading h2{font-size:17px}.panel-heading p,.panel-heading button,.section-heading button{font-size:13px}.table-wrap th,.panel th{font-size:12px}.task-title{font-size:15px}.task-sub,.example-label,.status{font-size:12px}.priority,.person,.due,.company-label{font-size:13px}.table-wrap td,.panel td{font-size:14px}.panel-foot{font-size:12px}.activity p{font-size:14px}.activity small{font-size:12px}.company-card h3,.company-detail h2{font-size:18px}.company-card p,.company-detail>p,.company-metrics{font-size:13px}.work-note strong{font-size:15px}.work-note p,.work-note button{font-size:13px}.workspace-footer{font-size:12px}.search-box input,.filter-controls>button{font-size:14px}.task-summary{font-size:13px}.board-card h3{font-size:16px}.board-company,.board-card-foot{font-size:12px}.blank p{font-size:15px}.blank button{font-size:14px}.project-card>p{font-size:15px}.project-progress,.project-actions button,.chat-header p,.message-meta strong{font-size:14px}.message-meta time{font-size:12px}.message-body,.message-composer textarea{font-size:16px}.message-composer span{font-size:12px}.message-composer button,.info-banner p{font-size:14px}.help-text{font-size:13px}.company-detail-stats,.company-detail>button{font-size:14px}.detail-grid small{font-size:13px}.task-description{font-size:16px}.document-link,.task-comment strong{font-size:14px}.task-comment small{font-size:12px}.task-comment p{font-size:16px}.discussion-empty,.field>span{font-size:14px}.field input,.field textarea{font-size:16px}.form-note{font-size:13px}.entry-note{font-size:13px!important}.task-sheet .status{font-size:12px}.message-composer>div{gap:12px}@media (max-width:767px){.page-heading{flex-wrap:wrap}.heading-actions{margin-left:auto}.page-heading p{font-size:15px}.eyebrow{font-size:11px}.stat-card>small{font-size:12px}.stat-top{font-size:13px}.panel-heading{flex-wrap:wrap}.company-metrics,.work-note p{font-size:13px}.topbar .breadcrumb{font-size:0}.topbar .breadcrumb strong{font-size:13px}.form-grid{gap:12px}.entry-card{padding:26px}.message-meta time,.message-composer span{font-size:11px}.nav-item{height:46px!important}}
/* Section 3: components that used shadcn/Tailwind in the React build */
.app{display:flex;min-height:100dvh}
.work-sidebar{width:256px;flex-shrink:0;background:#142936;color:var(--sidebar-foreground);display:flex;flex-direction:column;height:100dvh;position:sticky;top:0;z-index:40}
.sidebar-head{padding:20px 20px 24px}
.sidebar-body{flex:1;overflow-y:auto}
.sidebar-group{padding:0 16px}
.sidebar-group+.sidebar-group{margin-top:20px}
.sidebar-foot{padding:16px}
.nav-item,.company-nav{display:flex;align-items:center;gap:12px;width:100%;border-radius:6px;transition:background .15s}
.nav-item:hover,.company-nav:hover{background:#1d3644}
.nav-item[data-active=true]:hover{background:#244651!important}
.company-nav svg:last-child{margin-left:auto}
.nav-label{display:block;padding:0 12px}
.profile form{margin-left:auto}
.profile form button{color:#9dafb9;display:grid;place-items:center;padding:4px}
.profile form button:hover{color:#fff}
.app-main{flex:1;min-width:0;display:flex;flex-direction:column}
.btn.sidebar-toggle{display:none}
.sidebar-backdrop{display:none}
.main-content{flex:1}
@media (max-width:767px){
  .work-sidebar{position:fixed;left:0;top:0;transform:translateX(-100%);transition:transform .2s}
  .sidebar-open .work-sidebar{transform:none}
  .sidebar-open .sidebar-backdrop{display:block;position:fixed;inset:0;background:#0009;z-index:30}
  .btn.sidebar-toggle{display:inline-flex}
}
.company-select select{border-color:#e1e8ec;height:36px;font-size:14px}
.company-select form{margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:36px;padding:0 16px;border-radius:6px;background:var(--primary);color:var(--primary-foreground);font-size:14px;font-weight:500;white-space:nowrap;border:1px solid transparent;transition:background .15s}
.btn:hover{background:#0f6669}
.btn:disabled{opacity:.5}
.btn-outline{background:#fff;color:var(--foreground);border-color:#dce4e9}
.btn-outline:hover{background:#f3f7f8}
.btn-ghost{background:transparent;color:inherit}
.btn-ghost:hover{background:#eef3f5}
.btn-secondary{background:#eaf0f2;color:var(--foreground)}
.btn-secondary:hover{background:#e0e8eb}
.btn-sm{height:32px;padding:0 12px;font-size:13px}
.btn-icon{width:36px;padding:0}
.btn-block{width:100%}
.mt-2{margin-top:8px}.mt-5{margin-top:20px}.mt-7{margin-top:28px}.mt-8{margin-top:32px}
.heading-actions .btn{height:39px;font-size:14px;box-shadow:0 2px 3px #142e3912}
.panel-heading .btn,.section-heading .btn{color:#6d818e;padding:0 8px;font-size:13px}
.work-note .btn{color:#607e8d;flex-shrink:0;margin-left:auto;font-size:13px}
.company-detail>.btn{width:100%;font-size:14px}
.layout-toggle .btn{width:30px;height:30px;padding:0}
.input,.select,.textarea{width:100%;background:#fff;border:1px solid #dce4e9;border-radius:6px;padding:0 12px;height:38px;font-size:14px;outline:none}
.textarea{padding:10px 12px;height:auto;min-height:80px;line-height:1.6}
.input:focus,.select:focus,.textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px #147d8022}
.select{appearance:none;padding-right:30px;background-repeat:no-repeat;background-position:right 10px center;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3ad' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E")}
.search-box .input{height:39px}
.filter-controls .select{min-width:148px;font-size:14px}
.data-table th{text-align:left;padding:0 12px}
.data-table td{padding:18px 12px;vertical-align:middle;border-top:1px solid #edf1f4}
.data-table .pl-5{padding-left:20px}
.col-task{min-width:270px}.col-open{width:32px}
.row-link{cursor:pointer}
.row-link:hover{background:#fafcfc}
.badge{display:inline-flex;align-items:center;border-radius:6px;padding:2px 9px;font-size:12px;font-weight:500;background:#eaf0f2;color:#4b6470}
.badge-outline{background:transparent;border:1px solid #dce4e9}
.progress{height:6px;background:#e6eef0;border-radius:99px;overflow:hidden}
.progress>span{display:block;height:100%;background:var(--primary);border-radius:99px}
.stat-card,.company-card,.board-card{display:block;color:inherit}
.company-card>h3,.company-card>p{display:block}
.task-title{display:inline-block;text-align:left}
.task-summary a.clear{text-decoration:underline;margin-left:4px}
.task-toolbar .input{font-size:14px}
.flex-between{display:flex;align-items:center;justify-content:space-between}
.tabs{display:flex;background:#eaf0f2;border-radius:8px;padding:3px}
.tab{flex:1;height:34px;border-radius:6px;font-size:14px;color:#6b7f8b}
.tab.is-active{background:#fff;color:var(--foreground);box-shadow:0 1px 2px #0001}
[hidden]{display:none!important}
.form-panel{max-width:640px;padding:26px}
.form-actions{display:flex;justify-content:flex-end;gap:10px;padding-top:6px}
.field-error{color:#b76e5c;font-size:12px;font-style:normal}
.detail-panel{max-width:860px;padding:26px 28px}
.detail-title{font-size:24px;font-weight:600;line-height:1.35;letter-spacing:-.5px;margin:6px 0 12px}
.detail-badges{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding-bottom:20px;border-bottom:1px solid #edf1f4;margin-bottom:24px}
.toasts{position:fixed;right:20px;bottom:20px;display:flex;flex-direction:column;gap:10px;z-index:100}
.toast{background:#fff;border:1px solid #e3e9ed;border-radius:8px;padding:12px 16px;font-size:14px;box-shadow:0 8px 24px #0002;display:flex;gap:8px;align-items:center}
.toast-success{border-color:#bfe3d5;background:#f1faf6;color:#2d6e53}
.toast-error{border-color:#f3dcd5;background:#fff0ed;color:#b76e5c}
.entry-card .field{margin-bottom:14px}
.entry-card .btn{height:44px;margin-top:6px}
.entry-card form{margin-top:26px}
.entry-card .form-error{margin-bottom:14px}
.empty-inline{padding:6px 0}
.chat-company-form{margin:0}

.text-muted{color:#94a3ad}

/* =========================================================================
   Section 4: CRM layer (pipeline, customer 360, reports, search, KPI strips)
   ========================================================================= */
:root{--won:#3d8b5f;--won-bg:#eaf5ed;--lost:#c8665a;--lost-bg:#fff0ed;
  --st-lead:#8fa2ae;--st-qualified:#5383b8;--st-proposal:#9873be;--st-negotiation:#d29358}
.text-link{color:#1d7f82;text-decoration:underline;text-underline-offset:3px;word-break:break-word}
.num{font-variant-numeric:tabular-nums}
.inline-form{margin:0}.inline-form .select{height:39px;min-width:150px}
.heading-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.page-heading p a{color:#1d7f82}

/* topbar: search + New */
.topbar{gap:16px}
.topbar-left{display:flex;align-items:center;gap:12px;min-width:0}
.topbar-search{position:relative;flex:1;max-width:520px}
.topbar-search>svg{position:absolute;left:12px;top:11px;color:#93a3ae;pointer-events:none}
.topbar-search .input{height:38px;padding-left:36px;padding-right:34px;background:#f3f6f8;border-color:transparent}
.topbar-search .input:focus{background:#fff}
.topbar-search kbd{position:absolute;right:10px;top:8px;font:600 11px/1 Arial,sans-serif;color:#8a9aa5;border:1px solid #d9e2e7;border-radius:4px;padding:4px 6px;background:#fff;pointer-events:none}
.topbar-search input:focus~kbd{display:none}
.search-pop{position:absolute;left:0;right:0;top:44px;background:#fff;border:1px solid #dfe7ec;border-radius:10px;box-shadow:0 14px 40px #10273a26;z-index:60;max-height:70vh;overflow:auto;padding:6px}
.search-pop a{display:flex;gap:10px;align-items:center;padding:9px 10px;border-radius:7px}
.search-pop a:hover,.search-pop a.is-focus{background:#f0f6f6}
.search-pop .sp-icon{width:30px;height:30px;border-radius:8px;background:#edf6f5;color:#468f91;display:grid;place-items:center;flex-shrink:0}
.search-pop strong{font-size:14px;font-weight:550;color:#2b424f;display:block}
.search-pop small{font-size:12px;color:#8a9aa5;display:block}
.search-pop .sp-type{margin-left:auto;font-size:10px;letter-spacing:.8px;text-transform:uppercase;color:#9aa8b2}
.search-pop .sp-foot,.search-pop .sp-empty{padding:10px;font-size:13px;color:#8a9aa5}
.topbar-right{gap:14px}
.new-menu{position:relative}
.new-menu>summary{list-style:none;cursor:pointer;height:36px}
.new-menu>summary::-webkit-details-marker{display:none}
.new-menu-pop{position:absolute;right:0;top:44px;background:#fff;border:1px solid #dfe7ec;border-radius:10px;box-shadow:0 14px 40px #10273a26;min-width:190px;padding:6px;z-index:60}
.new-menu-pop a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:7px;font-size:14px;color:#2b424f}
.new-menu-pop a:hover{background:#f0f6f6}
.new-menu-pop svg{color:#468f91}
.new-menu-pop hr{border-top:1px solid #edf1f4;margin:5px 4px}
@media (max-width:900px){.topbar-search kbd{display:none}.company-select{display:none}.topbar .breadcrumb{display:none}.topbar-search{max-width:none}}
@media (max-width:520px){.new-menu summary span{display:none}.new-menu summary{padding:0 10px}}

/* KPI strip */
.kpi-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:#fff;border:1px solid #e3e9ed;border-radius:10px;margin-bottom:22px;overflow:hidden}
.kpi{padding:17px 22px;border-right:1px solid #edf1f4;min-width:0}
.kpi:last-child{border-right:0}
.kpi small{display:block;font-size:11px;letter-spacing:.9px;text-transform:uppercase;color:#8a9aa5;font-weight:600}
.kpi strong{display:block;font-size:27px;letter-spacing:-.8px;font-weight:600;margin:6px 0 3px;color:#233a48;font-variant-numeric:tabular-nums;white-space:nowrap}
.kpi em{display:block;font-style:normal;font-size:12px;color:#8a98a3}
.kpi-green strong{color:var(--won)}.kpi-orange strong{color:#c97e3d}
.strip-title{font-size:13px;letter-spacing:1px;text-transform:uppercase;color:#82929e;font-weight:600;margin:0 0 10px}
.sales-heading{margin-top:2px}
@media (max-width:900px){.kpi-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.kpi:nth-child(2){border-right:0}.kpi:nth-child(-n+2){border-bottom:1px solid #edf1f4}}

/* filter bar */
.filter-bar{display:flex;gap:12px;align-items:center;margin-bottom:16px;flex-wrap:wrap}
.filter-bar .search-box{flex:1;min-width:200px;max-width:380px}
.filter-bar .select{width:auto;min-width:150px}

/* status colours for deals + customers */
.status-lead{color:#6f8796;background:#eef3f6}
.status-qualified{color:#4c7bb0;background:#eaf2ff}
.status-proposal{color:#8d68b8;background:#f3eeff}
.status-negotiation{color:#bf7c3a;background:#fff3e6}
.status-won,.status-customer{color:#3f8a5f;background:#e9f5ed}
.status-lost{color:#c0675a;background:#fff0ed}
.status-prospect{color:#4c7bb0;background:#eaf2ff}
.status-inactive{color:#8a96a0;background:#f1f3f5}

/* pipeline board */
.pipeline{display:grid;grid-template-columns:repeat(4,minmax(250px,1fr));gap:14px;overflow-x:auto;padding-bottom:6px;align-items:start}
.stage-col{background:#eef2f5;border-radius:10px;padding:10px;min-height:340px;display:flex;flex-direction:column;transition:background .12s,outline-color .12s;outline:2px dashed transparent;outline-offset:-2px}
.stage-col.is-over{background:#e1f0ef;outline-color:var(--primary)}
.stage-head{display:flex;justify-content:space-between;align-items:center;padding:6px 6px 8px;border-bottom:3px solid var(--st-lead);margin-bottom:8px}
.stage-head.stage-qualified{border-color:var(--st-qualified)}.stage-head.stage-proposal{border-color:var(--st-proposal)}.stage-head.stage-negotiation{border-color:var(--st-negotiation)}
.stage-head strong{font-size:15px;font-weight:600;color:#2b424f}
.stage-head .col-count{margin-left:8px;font-size:12px;background:#fff;border-radius:99px;padding:1px 8px;color:#6b7f8b}
.stage-add{width:28px;height:28px;border-radius:6px;display:grid;place-items:center;color:#6d818e}
.stage-add:hover{background:#fff;color:var(--primary)}
.stage-sub{display:flex;justify-content:space-between;font-size:12px;color:#7d909c;padding:0 6px 10px}
.stage-sub .col-total{font-weight:600;color:#4b6470}
.stage-cards{display:flex;flex-direction:column;gap:10px;flex:1;min-height:90px}
.stage-empty{border:1px dashed #cfdbe1;border-radius:8px;padding:22px 10px;text-align:center;font-size:13px;color:#9aaab4}
.deal-card{background:#fff;border:1px solid #e0e7ec;border-radius:9px;padding:13px 14px;box-shadow:0 1px 2px #26353d0a;cursor:grab;transition:box-shadow .12s,border-color .12s}
.deal-card[data-can-edit="0"]{cursor:default}
.deal-card:hover{border-color:#a9c9c9;box-shadow:0 4px 12px #26353d14}
.deal-card.is-dragging{opacity:.45;transform:rotate(1.5deg)}
.deal-title{display:block;font-size:15px;font-weight:600;color:#25404e;line-height:1.35}
.deal-title:hover{text-decoration:underline;text-underline-offset:3px}
.deal-customer{display:block;font-size:13px;color:#7d909c;margin-top:3px}
.deal-customer:hover{color:var(--primary)}
.deal-value{font-size:19px;font-weight:600;letter-spacing:-.4px;margin:10px 0 8px;color:#233a48;font-variant-numeric:tabular-nums}
.deal-meta{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#8a9ba6}
.deal-meta span{display:inline-flex;align-items:center;gap:5px}
.deal-next{margin-top:10px;padding-top:9px;border-top:1px solid #f0f3f5;font-size:12px;color:#6a8a79;display:flex;align-items:center;gap:5px}
.deal-next.warn{color:#c47e45}
.close-zones{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.close-zone{display:flex;align-items:center;gap:14px;padding:16px 18px;border:2px dashed #d3dde3;border-radius:10px;background:#fff;transition:all .12s}
.close-zone .zone-icon{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;flex-shrink:0}
.close-zone.won .zone-icon{background:var(--won-bg);color:var(--won)}.close-zone.lost .zone-icon{background:var(--lost-bg);color:var(--lost)}
.close-zone strong{display:block;font-size:15px;color:#35505e}.close-zone small{font-size:12px;color:#8a9ba6}
.close-zone .btn{margin-left:auto}
.is-dragging-board .close-zone{border-color:#9db7c3;background:#f8fbfc}
.close-zone.won.is-over{border-color:var(--won);background:var(--won-bg)}
.close-zone.lost.is-over{border-color:var(--lost);background:var(--lost-bg)}
@media (max-width:767px){.close-zones{grid-template-columns:1fr}.pipeline{grid-template-columns:repeat(4,82vw)}}

/* buttons for outcomes */
.btn-won{background:var(--won)}.btn-won:hover{background:#2f7650}
.btn-lost{background:var(--lost)}.btn-lost:hover{background:#b15549}
.btn-lost-outline{background:#fff;color:var(--lost);border-color:#efcfc9}.btn-lost-outline:hover{background:var(--lost-bg)}

/* modal */
dialog.modal{border:0;border-radius:14px;padding:24px;width:min(460px,92vw);box-shadow:0 24px 80px #0a1c2a55;color:var(--foreground)}
dialog.modal::backdrop{background:#0f222e99}
dialog.modal form{display:flex;flex-direction:column;gap:16px}
.modal-head{display:flex;gap:14px;align-items:center}
.modal-head>span{width:44px;height:44px;border-radius:11px;display:grid;place-items:center}
.modal-head.won>span{background:var(--won-bg);color:var(--won)}.modal-head.lost>span{background:var(--lost-bg);color:var(--lost)}
.modal-head h3{font-size:19px;font-weight:600}.modal-head p{font-size:13px;color:#8a9ba6;margin-top:3px}

/* stage stepper */
.stepper-panel{padding:20px 24px;margin-bottom:22px}
.stepper{display:flex;align-items:center}
.step{flex:1;display:flex;align-items:center;gap:10px;position:relative;color:#8a9ba6;font-size:14px;font-weight:500;background:none;padding:0}
.step+.step::before{content:"";flex:1;height:2px;background:#e1e8ec;margin-right:10px;min-width:12px}
.step i{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-size:13px;font-weight:600;background:#eef2f5;color:#8a9ba6;flex-shrink:0;border:2px solid #eef2f5}
.step span{white-space:nowrap}
.step-done i{background:var(--primary);color:#fff;border-color:var(--primary)}.step-done{color:#3b5a63}.step-done+.step::before{background:var(--primary)}
.step-current i{background:#fff;color:var(--primary);border-color:var(--primary);box-shadow:0 0 0 4px #147d8022}.step-current{color:var(--primary);font-weight:600}
.step-won i{background:var(--won);border-color:var(--won);color:#fff}.step-won{color:var(--won);font-weight:600}
.step-lost i{background:var(--lost);border-color:var(--lost);color:#fff}.step-lost{color:var(--lost);font-weight:600}
button.step{cursor:pointer}
button.step:hover i{border-color:var(--primary);color:var(--primary);background:#fff}
@media (max-width:767px){.step span{display:none}.step-current span,.step-won span,.step-lost span{display:inline}.stepper-panel{padding:16px}}
.closed-banner{display:flex;align-items:center;gap:12px;margin-top:18px;padding:13px 16px;border-radius:9px;font-size:14px}
.closed-banner>div{display:flex;flex-direction:column;gap:2px;flex:1}.closed-banner span{font-size:13px;opacity:.85}
.closed-banner form{margin:0}
.closed-banner.won{background:var(--won-bg);color:#2d6e4c}.closed-banner.lost{background:var(--lost-bg);color:#a85548}

/* customer 360 / deal detail layout */
.c360{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:22px;align-items:start}
.c360-side{display:flex;flex-direction:column;gap:18px}
@media (max-width:1100px){.c360{grid-template-columns:1fr}}
.detail-panel-wide{padding:20px 22px}
.detail-panel-wide .tabs{margin-bottom:18px}
.panel-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;font-size:14px}
.side-card{padding:20px}
.side-card h2{font-size:15px;margin-bottom:14px}
.facts{display:flex;flex-direction:column;gap:14px}
.facts dt{font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:#93a2ac;font-weight:600;margin-bottom:4px}
.facts dd{font-size:14px;color:#3b5160;overflow-wrap:anywhere}
.facts dd.pre{white-space:pre-line}
.task-description.small{font-size:14px;line-height:1.7}
.cust-cell{display:flex;align-items:center;gap:12px}
.cust-mono{width:36px;height:36px;border-radius:9px;background:#e8f3f2;color:#2a8a86;display:inline-grid;place-items:center;font-size:12px;font-weight:700;flex-shrink:0}
.deal-rows{display:flex;flex-direction:column}
.deal-row{display:flex;align-items:center;gap:14px;padding:14px 4px;border-top:1px solid #edf1f4}
.deal-row:first-child{border-top:0}
.deal-row:hover{background:#fafcfc}
.deal-row>div{flex:1;min-width:0}.deal-row strong{font-weight:550;color:#2b424f;display:block}
.deal-row small{font-size:12px;color:#8a9ba6}
.contact-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media (max-width:700px){.contact-grid{grid-template-columns:1fr}}
.contact-card{display:flex;gap:12px;align-items:flex-start;border:1px solid #e6edf1;border-radius:9px;padding:14px}
.contact-card>div{flex:1;min-width:0}
.contact-card small{display:block;font-size:12px;color:#8a9ba6;margin-top:2px}
.contact-links{display:flex;flex-direction:column;gap:5px;margin-top:9px;font-size:13px}
.contact-links a{display:inline-flex;align-items:center;gap:6px;color:#1d7f82;overflow-wrap:anywhere}
.check-field{display:flex;gap:10px;align-items:center;font-size:14px;color:#556b78}
.check-field input{width:17px;height:17px;accent-color:var(--primary)}

/* activity composer */
.composer{background:#f7fafb;border:1px solid #e6edf1;border-radius:10px;padding:16px;margin-bottom:22px;display:flex;flex-direction:column;gap:12px}
.kind-pick{display:flex;gap:8px;flex-wrap:wrap}
.kind-pick label{cursor:pointer}
.kind-pick input{position:absolute;opacity:0;pointer-events:none}
.kind-pick span{display:inline-flex;gap:6px;align-items:center;height:34px;padding:0 14px;border:1px solid #dce4e9;border-radius:99px;font-size:14px;background:#fff;color:#556b78}
.kind-pick input:checked+span{background:#e8f3f2;border-color:var(--primary);color:var(--primary);font-weight:600}
.kind-pick input:focus-visible+span{outline:2px solid var(--primary);outline-offset:2px}
.composer-row{display:flex;gap:10px;flex-wrap:wrap}
.composer-row>*{flex:1;min-width:180px}
.composer-row ul{display:none}
.followup-box{display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #dce4e9;border-radius:6px;padding:0 0 0 12px}
.followup-box .select{border:0;height:36px;background-color:transparent;box-shadow:none}
.followup-label{font-size:12px;color:#6f838f;white-space:nowrap;font-weight:600}
.composer-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.composer-foot small{font-size:12px;color:#8a9ba6;flex:1;min-width:200px}

/* timeline */
.timeline{position:relative}
.tl-item{display:flex;gap:14px;padding-bottom:20px;position:relative}
.tl-item:not(:last-child)::before{content:"";position:absolute;left:16px;top:34px;bottom:0;width:2px;background:#e9eff2}
.tl-icon{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;flex-shrink:0;background:#eef2f5;color:#6b7f8b}
.tl-call .tl-icon,.tl-icon.tl-call{background:#e8f3f2;color:#2a8a86}
.tl-email .tl-icon,.tl-icon.tl-email{background:#eaf2ff;color:#4c7bb0}
.tl-meeting .tl-icon,.tl-icon.tl-meeting{background:#f3eeff;color:#8d68b8}
.tl-note .tl-icon,.tl-icon.tl-note{background:#fff6e8;color:#b3945a}
.tl-won .tl-icon{background:var(--won-bg);color:var(--won)}.tl-lost .tl-icon{background:var(--lost-bg);color:var(--lost)}
.tl-stage .tl-icon{background:#f0f3f7;color:#7a8da0}
.tl-body{flex:1;min-width:0}
.tl-head{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}
.tl-head strong{font-size:14px;color:#41596a;font-weight:600}
.tl-head small{font-size:12px;color:#9aa8b2}
.tl-body p{font-size:14px;color:#60768a;line-height:1.65;white-space:pre-wrap;overflow-wrap:anywhere;margin-top:4px}
.tl-stage .tl-body p,.tl-won .tl-body p,.tl-lost .tl-body p{font-size:13px;color:#7f93a1}
.tl-chips{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.chip{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:3px 9px;border-radius:99px;background:#f0f4f6;color:#5d7381}
.chip:hover{background:#e4edf0}
.chip-task{background:#eaf5f3;color:#2a7a76}.chip-task.late{background:#fff3e9;color:#c0763f!important}

/* reports */
.report-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:1000px){.report-grid{grid-template-columns:1fr}}
.report-card{padding-bottom:18px}
.bars{display:flex;flex-direction:column;gap:16px;padding:2px 22px 6px}
.bar-row{display:grid;grid-template-columns:minmax(120px,190px) 1fr 70px;gap:14px;align-items:center}
.bar-label{font-size:14px;color:#41596a;display:flex;flex-direction:column;gap:2px;min-width:0}
.bar-label small{font-size:12px;color:#93a2ac}
.bar-label a:hover{text-decoration:underline}
.bar{height:10px;background:#edf2f4;border-radius:99px;overflow:hidden}
.bar>span{display:block;height:100%;border-radius:99px;background:var(--primary)}
.bar-lead{background:var(--st-lead)!important}.bar-qualified{background:var(--st-qualified)!important}.bar-proposal{background:var(--st-proposal)!important}.bar-negotiation{background:var(--st-negotiation)!important}
.bar-won{background:var(--won)!important}.bar-lost{background:var(--lost)!important}
.bar-row .num{text-align:right;font-size:14px;color:#35505e}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--st-lead);margin-right:7px}
.dot.stage-qualified{background:var(--st-qualified)}.dot.stage-proposal{background:var(--st-proposal)}.dot.stage-negotiation{background:var(--st-negotiation)}
.dot.won{background:var(--won)}.dot.lost{background:var(--lost);margin-left:12px}
.legend{font-size:12px;color:#8a9ba6;display:flex;align-items:center}
.cols{display:flex;align-items:flex-end;gap:14px;height:190px;padding:12px 22px 0}
.col-group{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;height:100%}
.col-bars{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:5px}
.col{width:42%;max-width:26px;border-radius:5px 5px 0 0;min-height:3px}
.col.won{background:var(--won)}.col.lost{background:#e7aca4}
.col-group small{font-size:12px;color:#7d909c}.col-group em{font-style:normal;font-size:11px;color:#9aa8b2}
.activity-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:6px 22px 6px}
.tile{display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 6px;border:1px solid #edf1f4;border-radius:10px}
.tile strong{font-size:24px;font-weight:600;color:#2b424f}.tile small{font-size:12px;color:#8a9ba6}

/* search results */
.search-results{display:flex;flex-direction:column;gap:18px;max-width:860px}
.result-row{display:flex;align-items:center;gap:14px;padding:12px 22px;border-top:1px solid #edf1f4}
.result-row:hover{background:#fafcfc}
.result-row>div{flex:1;min-width:0}
.result-row strong{display:block;font-size:15px;font-weight:550;color:#2b424f}.result-row small{font-size:13px;color:#8a9ba6}
.result-icon{width:36px;height:36px;border-radius:9px;background:#edf6f5;color:#468f91;display:grid;place-items:center;flex-shrink:0}
body.is-dragging-board{user-select:none}
.close-zones{position:sticky;bottom:12px;z-index:20}
.close-zone{box-shadow:0 6px 20px #10273a14}

/* =========================================================================
   Helpdesk layer
   ========================================================================= */
.kpi-strip{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
a.kpi{display:block;color:inherit}a.kpi:hover{background:#fafcfc}
.kpi-red strong{color:#c0675a}
.sidebar-body{overflow-y:auto}
.nav-count.hot{background:#c0675a;color:#fff}

/* status + priority + SLA */
.status-new{color:#4c7bb0;background:#eaf2ff}
.status-assigned{color:#6d7fb0;background:#eef1fb}
.status-waiting-for-user{color:#9873be;background:#f3eeff}
.status-resolved{color:#3f8a5f;background:#e9f5ed}
.status-closed{color:#7d8d98;background:#eef1f3}
.status-reopened{color:#c0675a;background:#fff0ed}
.priority-critical{color:#c86563}.priority-medium{color:#7d8d98}
.sla{display:inline-flex;align-items:center;gap:5px;font-size:12px;padding:3px 9px;border-radius:99px;white-space:nowrap;background:#f0f3f5;color:#6b7f8b}
.sla-ok{background:#e9f5ed;color:#3f8a5f}.sla-warn{background:#fff3e6;color:#bf7c3a}.sla-bad{background:#fff0ed;color:#c0675a}
.ticket-no{font-size:12px;color:#8a9ba6;font-variant-numeric:tabular-nums;letter-spacing:.2px}

/* board (7 status columns) */
.board7{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(265px,1fr);gap:14px;overflow-x:auto;padding:4px 2px 12px;align-items:start}
.board7 .stage-col{min-height:260px}
.stage-head.st-new{border-color:#5383b8}.stage-head.st-assigned{border-color:#8794c8}.stage-head.st-in_progress{border-color:#d29358}
.stage-head.st-waiting{border-color:#9873be}.stage-head.st-resolved{border-color:#3d8b5f}.stage-head.st-reopened{border-color:#c8665a}.stage-head.st-closed{border-color:#9aa9b3}
.deal-card .deal-title{font-size:15px}
.tcard-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:8px}

/* list: bulk bar + checkboxes */
.bulkbar{position:sticky;bottom:12px;z-index:25;display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:#142936;color:#fff;border-radius:12px;padding:12px 16px;margin-top:14px;box-shadow:0 12px 40px #10273a40}
.bulkbar[hidden]{display:none}
.bulkbar .select{height:36px;width:auto;min-width:150px}
.bulkbar strong{font-size:14px}
.bulkbar form{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.bulkbar .btn-ghost{color:#c5d1d9}
td.chk,th.chk{width:38px;padding-left:16px!important}
td.chk input,th.chk input{width:16px;height:16px;accent-color:var(--primary)}
.row-link{cursor:pointer}.row-link:hover{background:#fafcfc}
.pager{display:flex;gap:8px;justify-content:center;padding:16px;align-items:center;font-size:14px;color:#7d8d98}

/* ticket detail */
.sla-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:18px}
.sla-box{border:1px solid #e6edf1;border-radius:10px;padding:13px 16px}
.sla-box small{display:block;font-size:11px;letter-spacing:.8px;text-transform:uppercase;color:#93a2ac;font-weight:600}
.sla-box strong{display:block;font-size:17px;margin-top:5px;color:#2b424f}
@media(max-width:700px){.sla-grid{grid-template-columns:1fr}}
.action-card{background:#f7fafb;border:1px solid #e6edf1;border-radius:10px;padding:16px;margin-bottom:18px;display:flex;flex-direction:column;gap:12px}
.action-card h3{font-size:14px;font-weight:600;color:#41596a}
.action-card .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.action-card .row>*{flex:1;min-width:150px}
.action-card .row .btn{flex:0 0 auto}
.stars{display:flex;gap:4px;flex-direction:row-reverse;justify-content:flex-end}
.stars input{position:absolute;opacity:0;pointer-events:none}
.stars label{font-size:28px;line-height:1;color:#d3dde3;cursor:pointer}
.stars input:checked~label,.stars label:hover,.stars label:hover~label{color:#e2a73b}
.stars input:focus-visible+label{outline:2px solid var(--primary);border-radius:4px}
.rating-shown{color:#e2a73b;font-size:20px;letter-spacing:2px}
.tl-internal{background:#fffaf0;border:1px dashed #ecd9a8;border-radius:10px;padding:10px 12px;margin-left:-12px}
.tl-internal .tl-head strong::after{content:"  \1F512 internal";font-weight:500;font-size:11px;color:#b3945a}
.tl-created .tl-icon{background:#e8f3f2;color:#2a8a86}.tl-status .tl-icon{background:#f0f3f7;color:#7a8da0}
.tl-assign .tl-icon{background:#f3eeff;color:#8d68b8}.tl-comment .tl-icon{background:#eaf2ff;color:#4c7bb0}
.tl-edit .tl-icon{background:#fff6e8;color:#b3945a}.tl-priority .tl-icon{background:#fff0ed;color:#c0675a}
.tl-arrow{color:#9aa8b2;margin:0 4px}
.file-list{display:flex;flex-direction:column;gap:8px}
.file-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid #e6edf1;border-radius:8px;font-size:14px;color:#2b424f}
.file-row:hover{background:#fafcfc}.file-row small{margin-left:auto;color:#93a2ac}
.check-inline{display:flex;gap:8px;align-items:center;font-size:13px;color:#6f838f}
.check-inline input{accent-color:var(--primary);width:16px;height:16px}

/* reports */
.report-head{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end;margin-bottom:18px}
.report-head .field{min-width:160px}
.report-title{font-size:13px;letter-spacing:1px;color:#82929e;font-weight:600;margin-bottom:12px}
.table-compact td,.table-compact th{padding-top:11px!important;padding-bottom:11px!important}
.mini-bar{display:inline-block;width:80px;height:8px;border-radius:99px;background:#edf2f4;vertical-align:middle;overflow:hidden;margin-right:8px}
.mini-bar>span{display:block;height:100%;background:var(--primary)}
.cols.tight{height:150px}
@media print{.work-sidebar,.topbar,.heading-actions,.report-head,.sidebar-backdrop,.toasts{display:none!important}.app-main{margin:0!important}.panel{break-inside:avoid;box-shadow:none}}

.pro-badge{font-size:10px;letter-spacing:1px;background:#32b7ab;color:#fff;border-radius:4px;padding:1px 6px;margin-left:8px;vertical-align:middle}
.bell{position:relative}
.bell b{position:absolute;top:-4px;right:-4px;background:#c0675a;color:#fff;border-radius:99px;font-size:10px;padding:1px 5px;font-weight:600}
.data-table .pl-5{min-width:250px}
.task-sub{flex-wrap:wrap}
.data-table td{vertical-align:middle}
.filter-controls .select{width:auto;min-width:140px}
.task-toolbar .search-box{flex:1 1 260px}

/* =========================================================================
   PRO POLISH — calm, professional CRM look (layout unchanged)
   ========================================================================= */
:root{
  --primary:#0f7c80;--ring:#0f7c80;
  --ink:#1b2a37;--ink-2:#46586a;--ink-3:#7b8b99;--ink-4:#a3b0bb;
  --line:#e6ebf0;--line-2:#eef2f5;--bg:#f4f6f9;
  --shadow-1:0 1px 2px rgba(16,37,52,.05);--shadow-2:0 6px 20px rgba(16,37,52,.08);
}
html{-webkit-text-size-adjust:100%}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif!important;font-size:14px!important;color:var(--ink);background:var(--bg);letter-spacing:0!important;-webkit-font-smoothing:antialiased;line-height:1.5}
button,input,select,textarea{font-family:inherit}
a{color:inherit;text-decoration:none}

/* ---------- sidebar ---------- */
.work-sidebar{background:linear-gradient(180deg,#0e2230 0%,#0f2937 100%)!important;border-right:1px solid #16303f;width:244px}
.sidebar-head{padding:20px 18px 18px!important;border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:14px}
.brand strong{font-size:17px!important;letter-spacing:-.2px!important;font-weight:650}
.brand small{font-size:9.5px!important;letter-spacing:1.6px!important;color:#7f9aa8!important}
.brand-mark{background:linear-gradient(135deg,#2fb8aa,#17958f)!important;border-radius:10px!important;box-shadow:0 4px 12px rgba(47,184,170,.35)}
.sidebar-group{padding:0 12px!important}
.sidebar-group+.sidebar-group{margin-top:18px!important}
.nav-label{font-size:10.5px!important;letter-spacing:1.3px!important;font-weight:650!important;color:#6f8a99!important;padding:0 10px;margin-bottom:6px!important}
.nav-item{height:38px!important;font-size:13.5px!important;font-weight:500;padding:0 10px!important;border-radius:8px!important;color:#b7c8d3!important;margin:1px 0!important;gap:11px!important}
.nav-item svg{width:17px!important;height:17px!important;opacity:.85}
.nav-item:hover{background:rgba(255,255,255,.06)!important;color:#fff!important}
.nav-item[data-active=true]{background:rgba(56,200,184,.14)!important;color:#fff!important;box-shadow:none!important;position:relative}
.nav-item[data-active=true]::before{content:"";position:absolute;left:-12px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:#38c8b8}
.nav-item[data-active=true] svg{color:#5fe0d1;opacity:1}
.nav-count{background:rgba(255,255,255,.1)!important;color:#d3e4ec!important;border-radius:99px!important;font-size:11px!important;padding:1px 8px!important}
.sidebar-foot{padding:12px!important;border-top:1px solid rgba(255,255,255,.06)}
.profile{margin-top:0!important;padding:8px!important;border-radius:10px;background:rgba(255,255,255,.04)}
.profile strong{font-size:13px!important}.profile small{font-size:11.5px!important;color:#8fa7b4!important}
.profile .avatar{background:#2a4756!important;color:#cfe5ee!important;border-color:#365a6b!important}
.profile button{color:#8fa7b4;padding:6px;border-radius:6px}.profile button:hover{background:rgba(255,255,255,.08);color:#fff}

/* ---------- top bar ---------- */
.topbar{height:62px!important;padding:0 28px!important;border-bottom:1px solid var(--line)!important;background:rgba(255,255,255,.92);backdrop-filter:saturate(1.4) blur(8px);position:sticky;top:0;z-index:30}
.breadcrumb{font-size:13px!important;color:var(--ink-3)!important;gap:8px!important}
.breadcrumb strong{color:var(--ink)!important;font-weight:600!important}
.topbar-search .input{height:38px!important;background:#f1f4f8!important;border:1px solid transparent!important;border-radius:9px!important;font-size:13.5px!important;padding-left:38px!important}
.topbar-search .input:hover{background:#ecf0f5!important}
.topbar-search .input:focus{background:#fff!important;border-color:var(--primary)!important}
.topbar-search>svg{top:11px!important;color:var(--ink-3)!important}
.topbar-search kbd{border-radius:5px!important;background:#fff!important;color:var(--ink-3)!important;border:1px solid var(--line)!important;font-size:11px!important}
.topbar-right{gap:10px!important}
.bell{color:var(--ink-2)!important;border-radius:9px!important}.bell:hover{background:#eef2f6!important}
.new-menu>summary{height:36px!important}
.new-menu-pop{border-radius:12px!important;border:1px solid var(--line)!important;box-shadow:var(--shadow-2)!important;padding:6px!important}
.new-menu-pop a{border-radius:8px!important;font-size:13.5px!important;padding:9px 11px!important}

/* ---------- page heading ---------- */
.main-content{padding:26px 32px 0!important;max-width:1560px}
.page-heading{margin-bottom:22px!important;align-items:flex-end!important}
.eyebrow{font-size:11px!important;letter-spacing:1.1px!important;color:var(--ink-3)!important;margin-bottom:6px!important}
.page-heading h1{font-size:24px!important;font-weight:650!important;letter-spacing:-.4px!important;color:var(--ink)!important;line-height:1.25}
.page-heading p{font-size:14px!important;color:var(--ink-3)!important;margin-top:6px!important}
.heading-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- buttons & fields ---------- */
.btn{height:36px!important;padding:0 14px!important;border-radius:8px!important;font-size:13.5px!important;font-weight:600!important;border:1px solid transparent;box-shadow:0 1px 2px rgba(15,60,64,.18);transition:background .15s,box-shadow .15s,border-color .15s}
.btn:hover{box-shadow:0 2px 6px rgba(15,60,64,.22)}
.btn:active{transform:translateY(.5px)}
.btn-outline{background:#fff!important;color:var(--ink-2)!important;border-color:#d7dfe6!important;box-shadow:var(--shadow-1)!important}
.btn-outline:hover{background:#f7f9fb!important;border-color:#c5d0da!important;color:var(--ink)!important}
.btn-ghost{box-shadow:none!important;color:var(--ink-2)!important;background:transparent!important}
.btn-ghost:hover{background:#eef2f6!important;box-shadow:none!important}
.btn-secondary{background:#e9eef3!important;color:var(--ink)!important;box-shadow:none!important}
.btn-sm{height:32px!important;font-size:13px!important;padding:0 11px!important}
.btn-icon{width:36px;padding:0!important}
.btn:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #38b6ad;outline-offset:2px}
.input,.select,.textarea{height:38px!important;border:1px solid #d5dde5!important;border-radius:8px!important;font-size:14px!important;color:var(--ink);background-color:#fff;transition:border-color .15s,box-shadow .15s}
.textarea{height:auto!important;min-height:84px;padding:10px 12px!important;line-height:1.55}
.input:hover,.select:hover,.textarea:hover{border-color:#bcc8d3!important}
.input:focus,.select:focus,.textarea:focus{border-color:var(--primary)!important;box-shadow:0 0 0 3px rgba(15,124,128,.14)!important}
.input::placeholder,.textarea::placeholder{color:var(--ink-4)}
.field>span{font-size:12.5px!important;font-weight:600!important;color:var(--ink-2)!important}
.field-error{font-size:12.5px!important;color:#c0483b!important;display:flex;gap:5px;align-items:center}
.form-note{background:#f3f7f9!important;border:1px solid var(--line-2);border-radius:8px!important;color:var(--ink-3)!important;font-size:13px!important}
.form-panel{box-shadow:var(--shadow-1)}
.editor-form{gap:18px!important}
.form-actions{border-top:1px solid var(--line-2);padding-top:18px!important;margin-top:6px}

/* ---------- panels / tables ---------- */
.panel{border:1px solid var(--line)!important;border-radius:12px!important;box-shadow:var(--shadow-1);background:#fff}
.panel-heading{padding:18px 20px 14px!important}
.panel h2,.section-heading h2{font-size:15px!important;font-weight:650!important;letter-spacing:-.1px!important;color:var(--ink)}
.panel-heading p{font-size:12.5px!important;color:var(--ink-3)!important;margin-top:3px!important}
.strip-title{font-size:11.5px!important;letter-spacing:1.1px!important;color:var(--ink-3)!important;margin:2px 0 10px!important}
.data-table{width:100%;border-collapse:collapse}
.data-table th,.panel th{background:#f8fafc!important;color:var(--ink-3)!important;font-size:11px!important;font-weight:650!important;letter-spacing:.7px!important;height:38px!important;border-top:1px solid var(--line-2);border-bottom:1px solid var(--line)}
.data-table td,.panel td{font-size:13.5px!important;padding:13px 12px!important;border-top:1px solid var(--line-2)!important;color:var(--ink-2)}
.data-table tr:first-child td{border-top:0!important}
.data-table tbody tr{transition:background .12s}
.data-table tbody tr:hover{background:#f8fbfc}
.data-table .pl-5{padding-left:20px!important}
.task-title{font-size:14px!important;font-weight:600!important;color:var(--ink)!important;line-height:1.35}
.task-title:hover{color:var(--primary)!important;text-decoration:none!important}
.task-sub{font-size:12px!important;color:var(--ink-3)!important;margin-top:3px!important;gap:4px 6px!important}
.ticket-no{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px!important;background:#eef2f6;color:var(--ink-2)!important;padding:1px 6px;border-radius:5px;letter-spacing:0!important}
.table-compact td,.table-compact th{padding-top:12px!important;padding-bottom:12px!important}
.person{font-size:13px!important;color:var(--ink-2)!important;gap:8px!important}
.late{color:#cb6a46!important}
.text-muted{color:var(--ink-3)!important}
.text-link{color:var(--primary)!important;text-decoration:none!important;font-weight:500}.text-link:hover{text-decoration:underline!important}

/* ---------- avatars ---------- */
.avatar{width:32px!important;height:32px!important;font-size:11.5px!important;font-weight:650!important;border:1px solid transparent}
.avatar-sm{width:26px!important;height:26px!important;font-size:10px!important}
.avatar-empty{background:#f1f4f7!important;color:var(--ink-4)!important;border:1px dashed #cfd8e0!important}

/* ---------- pills: status / priority / SLA ---------- */
.status{border-radius:99px!important;padding:3px 10px 3px 8px!important;font-size:12px!important;font-weight:600!important;gap:6px!important}
.status>span{width:6px!important;height:6px!important}
.priority{font-size:12.5px!important;font-weight:600;gap:7px!important;color:var(--ink-2)}
.pdot{width:8px;height:8px;border-radius:50%;background:#9aa9b5;display:inline-block;flex-shrink:0}
.priority-critical .pdot{background:#e0483b;box-shadow:0 0 0 3px rgba(224,72,59,.16)}
.priority-high .pdot{background:#ee8a2b}.priority-medium .pdot{background:#4d8fd6}.priority-low .pdot{background:#a5b3be}
.priority-critical{color:#c0392e!important}.priority-high{color:#b9690f!important}.priority-medium,.priority-low{color:var(--ink-2)!important}
.priority>span{display:none}
.sla{border-radius:99px!important;font-size:12px!important;font-weight:600;padding:3px 10px!important}
.sla-ok{background:#e8f6ee!important;color:#2a8553!important}.sla-warn{background:#fff3e1!important;color:#b46a0b!important}.sla-bad{background:#fdeceb!important;color:#c0392e!important}
.badge{border-radius:99px!important;font-size:11.5px!important;font-weight:600}

/* ---------- KPI strip ---------- */
.kpi-strip{gap:0;border:1px solid var(--line)!important;border-radius:12px!important;box-shadow:var(--shadow-1);margin-bottom:20px!important;background:#fff}
.kpi{position:relative;padding:16px 20px 15px!important;border-right:1px solid var(--line-2)!important}
.kpi small{font-size:11.5px!important;letter-spacing:.5px!important;text-transform:none!important;color:var(--ink-3)!important;font-weight:600!important}
.kpi strong{font-size:28px!important;letter-spacing:-.8px!important;font-weight:650!important;color:var(--ink)!important;margin:7px 0 4px!important}
.kpi em{font-size:12.5px!important;color:var(--ink-3)!important}
.kpi-icon{position:absolute;right:16px;top:15px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:#eef3f7;color:#5b7285}
.kpi-green .kpi-icon{background:#e8f6ee;color:#2a8553}.kpi-green strong{color:var(--ink)!important}
.kpi-orange .kpi-icon{background:#fff3e1;color:#b46a0b}.kpi-orange strong{color:#b46a0b!important}
.kpi-red .kpi-icon{background:#fdeceb;color:#c0392e}.kpi-red strong{color:#c0392e!important}
a.kpi:hover{background:#fafcfd}

/* ---------- board ---------- */
.stage-col{background:#eef1f5!important;border-radius:12px!important;padding:10px!important}
.stage-head{border-bottom-width:2px!important;padding:4px 4px 9px!important}
.stage-head strong{font-size:13.5px!important;font-weight:650!important}
.stage-head .col-count{background:#fff!important;font-size:11.5px!important;font-weight:600;color:var(--ink-2)!important}
.deal-card{border:1px solid var(--line)!important;border-radius:10px!important;padding:12px 13px!important;box-shadow:var(--shadow-1)!important;border-left:3px solid #c9d3dc!important}
.deal-card:hover{box-shadow:var(--shadow-2)!important;border-color:#bfd3d6!important}
.deal-card.prio-critical{border-left-color:#e0483b!important}.deal-card.prio-high{border-left-color:#ee8a2b!important}.deal-card.prio-medium{border-left-color:#4d8fd6!important}
.deal-card .deal-title{font-size:14px!important;font-weight:600;line-height:1.4}
.deal-customer{font-size:12.5px!important;color:var(--ink-3)!important}
.tcard-foot{margin-top:11px!important}
.stage-empty{font-size:12.5px!important;color:var(--ink-4)!important}

/* ---------- detail ---------- */
.stepper-panel{padding:18px 22px!important}
.step{font-size:13px!important;color:var(--ink-3)!important}
.step i{width:28px!important;height:28px!important;font-size:12px!important}
.sla-box{border-radius:10px!important;background:#fafcfd;border:1px solid var(--line)!important}
.sla-box small{font-size:11px!important;letter-spacing:.6px!important;color:var(--ink-3)!important}
.sla-box strong{font-size:16px!important;margin:5px 0 8px!important;font-weight:650!important}
.action-card{background:#f8fafc!important;border:1px solid var(--line)!important;border-radius:10px!important}
.action-card h3{font-size:13.5px!important;color:var(--ink)!important}
.composer{background:#f8fafc!important;border-radius:10px!important}
.detail-panel-wide{padding:20px 22px!important}
.facts dt{font-size:11px!important;letter-spacing:.6px!important;color:var(--ink-3)!important}
.facts dd{font-size:14px!important;color:var(--ink)!important}
.side-card{padding:18px 20px!important}.side-card h2{font-size:14px!important;margin-bottom:14px!important}
.tl-head strong{font-size:13.5px!important;color:var(--ink)!important}.tl-head small{font-size:12px!important}
.tl-body p{font-size:13.5px!important;color:var(--ink-2)!important}
.file-row{border-radius:8px!important;font-size:13.5px!important}
.tabs{background:#eef2f6!important;border-radius:9px!important;padding:3px!important}
.tab{font-size:13px!important;font-weight:600;border-radius:7px!important;color:var(--ink-3)!important;height:32px!important}
.tab.is-active,.tab[aria-selected=true]{background:#fff!important;color:var(--ink)!important;box-shadow:var(--shadow-1)}

/* ---------- misc ---------- */
.blank{padding:44px 24px!important}.blank h3{font-size:15px!important;color:var(--ink)!important}.blank p{font-size:14px!important;color:var(--ink-3)!important}
.blank-icon{background:#eaf4f4!important;color:#3a9296!important;border-radius:14px!important}
.toast{border-radius:10px!important;font-size:13.5px!important;box-shadow:var(--shadow-2)!important}
.workspace-footer{font-size:12px!important;color:var(--ink-4)!important;border-top:1px solid var(--line);margin-top:30px;padding:18px 0 22px!important}
.result-row{padding:12px 20px!important}.result-row strong{font-size:14px!important}.result-row small{font-size:12.5px!important}
.pager{font-size:13.5px!important}
.bulkbar{border-radius:12px!important;background:#10222f!important}
.filter-controls .select{width:auto;min-width:140px}
.task-toolbar{padding:14px 18px!important}
.task-summary{font-size:13px!important}
.bar-label{font-size:13.5px!important}.bar{height:8px!important}
.legend{font-size:12px!important}

/* ---------- login ---------- */
.entry{background:radial-gradient(1200px 600px at 20% 10%,#1d4f58 0%,transparent 60%),linear-gradient(160deg,#0d2230,#0f2c39)!important}
.entry-card{border-radius:18px!important;padding:40px 38px!important;box-shadow:0 30px 90px rgba(3,15,22,.5)!important}
.entry-card h1{font-size:28px!important;letter-spacing:-.6px!important}
.entry-card>p{font-size:14.5px!important;color:var(--ink-3)!important}

/* ---------- combobox (select OR type) ---------- */
.combo{position:relative}
.combo-native{display:none}
.combo-box{position:relative}
.combo-input{padding-right:34px!important}
.combo-chev{position:absolute;right:11px;top:11px;color:var(--ink-3);transform:rotate(90deg);pointer-events:none}
.combo-list{position:absolute;z-index:50;left:0;right:0;top:calc(100% - 22px);margin-top:4px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:var(--shadow-2);max-height:280px;overflow:auto;padding:5px}
.combo-opt{display:flex;flex-direction:column;gap:1px;padding:8px 10px;border-radius:7px;cursor:pointer;font-size:14px}
.combo-opt strong{font-weight:600;color:var(--ink)}.combo-opt small{font-size:12px;color:var(--ink-3)}
.combo-opt:hover,.combo-opt.is-active{background:#eef6f6}
.combo-opt.is-selected{background:#e6f3f3}
.combo-add{flex-direction:row;color:var(--primary);font-weight:600;border-top:1px solid var(--line-2);margin-top:4px;border-radius:7px}
.combo-empty{padding:12px;font-size:13px;color:var(--ink-3);text-align:center}
.combo-hint{display:block;margin-top:6px;font-size:12px;color:var(--ink-3)}
.combo.is-ok .combo-input{border-color:#7cc4a0!important}
.combo.is-new .combo-input{border-color:#4d8fd6!important;box-shadow:0 0 0 3px rgba(77,143,214,.12)}
.combo.is-new .combo-hint{color:#2f6fb5;font-weight:600}
.combo.is-bad .combo-input{border-color:#e0a79f!important}.combo.is-bad .combo-hint{color:#c0392e}

@media (max-width:900px){.main-content{padding:20px 16px 0!important}.topbar{padding:0 14px!important}.kpi strong{font-size:24px!important}}
.data-table td{white-space:nowrap}.data-table td.pl-5{white-space:normal}
.data-table input[type=checkbox],.bulkbar input[type=checkbox]{accent-color:var(--primary)}
input[type=file].input{height:auto!important;padding:6px!important;color:var(--ink-3);font-size:13px!important}
input[type=file]::file-selector-button{border:1px solid #d5dde5;background:#f6f8fa;color:var(--ink-2);border-radius:7px;padding:6px 12px;margin-right:12px;font:600 13px inherit;font-family:inherit;cursor:pointer}
input[type=file]::file-selector-button:hover{background:#eef2f6}
.legend{display:flex;gap:6px;align-items:center}.legend .dot{margin:0 4px 0 10px}
.panel-heading .btn-ghost{color:var(--primary)!important}
.cols.tight{gap:6px!important;padding:12px 16px 0!important}.cols.tight .col-group{min-width:0}.cols.tight .col{max-width:9px}

/* =========================================================================
   Section 6: ZOHO-STYLE LAYER  (same teal + navy palette, Zoho Desk/CRM structure)
   collapsible sidebar · compact topbar · view tabs · dense lists · KPI cards
   chevron stage bar · sectioned forms · split sign-in
   ========================================================================= */
:root{
  --z-side:236px;--z-mini:68px;--z-top:56px;
  --z-bg:#f3f5f8;--z-line:#e2e8ee;--z-line-2:#edf1f5;
  --z-teal:#0f7c80;--z-teal-d:#0b686b;--z-teal-50:#eaf6f6;--z-teal-100:#d3ecec;
  --z-side-bg:#0e2230;--z-side-act:rgba(56,200,184,.16);
}
body{background:var(--z-bg)!important;font-size:13.5px!important}

/* ---------- sidebar ---------- */
.work-sidebar{width:var(--z-side)!important;transition:width .18s ease;background:var(--z-side-bg)!important;border-right:0!important}
.sidebar-head{height:var(--z-top);display:flex;align-items:center;padding:0 16px!important;margin:0!important;border-bottom:1px solid rgba(255,255,255,.07)!important}
.brand{gap:10px!important;min-width:0}
.brand-mark{width:32px!important;height:32px!important;border-radius:8px!important;flex-shrink:0}
.brand-text{min-width:0;white-space:nowrap}
.brand strong{font-size:16px!important;line-height:1.1;display:block}
.brand small{margin-top:2px!important;font-size:9px!important}
.sidebar-create{padding:14px 14px 6px}
.sidebar-create .btn{height:36px!important;border-radius:6px!important;background:var(--z-teal)!important;box-shadow:none!important;font-weight:600!important;justify-content:center}
.sidebar-create .btn:hover{background:#12918f!important}
.sidebar-body{padding:6px 0 10px;scrollbar-width:thin;scrollbar-color:#2b4352 transparent}
.sidebar-group{padding:0 10px!important}
.sidebar-group+.sidebar-group{margin-top:14px!important}
.nav-label{display:block;padding:6px 10px 5px!important;margin:0!important;font-size:10.5px!important;letter-spacing:.9px!important;text-transform:uppercase;color:#6c8798!important;font-weight:600!important}
.nav-label em{font-style:normal}
.nav-item{height:36px!important;border-radius:6px!important;padding:0 10px!important;gap:12px!important;font-size:13.5px!important;font-weight:500;color:#b4c6d1!important;margin:1px 0!important;white-space:nowrap;position:relative}
.nav-item>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis}
.nav-item svg{flex-shrink:0;opacity:.8}
.nav-item:hover{background:rgba(255,255,255,.07)!important;color:#fff!important}
.nav-item[data-active=true]{background:var(--z-side-act)!important;color:#fff!important;font-weight:600}
.nav-item[data-active=true]::before{left:-10px!important;top:7px!important;bottom:7px!important;width:3px!important;background:#38c8b8!important}
.nav-item[data-active=true] svg{color:#5fe0d1;opacity:1}
.nav-count{margin-left:auto;min-width:22px;text-align:center;background:rgba(255,255,255,.12)!important;color:#dcebf1!important;border-radius:99px!important;font-size:11px!important;font-weight:600;padding:1px 7px!important}
.nav-item[data-active=true] .nav-count{background:#38c8b8!important;color:#06312e!important}
.sidebar-foot{padding:8px 10px!important;border-top:1px solid rgba(255,255,255,.07)!important}
.collapse-btn{display:flex;align-items:center;gap:12px;width:100%;height:34px;padding:0 10px;border-radius:6px;color:#8ba3b1;font-size:12.5px;font-weight:500;white-space:nowrap}
.collapse-btn:hover{background:rgba(255,255,255,.07);color:#fff}
.collapse-btn .flip{transform:rotate(180deg);transition:transform .18s}

/* collapsed rail (desktop) */
@media (min-width:768px){
  .nav-mini .work-sidebar{width:var(--z-mini)!important}
  .nav-mini .brand-text,.nav-mini .nav-item>span,.nav-mini .collapse-btn span,.nav-mini .sidebar-create .btn span{display:none}
  .nav-mini .sidebar-head{justify-content:center;padding:0!important}
  .nav-mini .sidebar-create{padding:14px 12px 6px}
  .nav-mini .sidebar-group{padding:0 12px!important}
  .nav-mini .nav-label{font-size:0!important;padding:0!important;height:1px;margin:8px 8px!important;background:rgba(255,255,255,.09)}
  .nav-mini .nav-item{justify-content:center;padding:0!important}
  .nav-mini .nav-item[data-active=true]::before{left:-12px!important}
  .nav-mini .nav-count{position:absolute;top:2px;right:3px;min-width:16px;padding:0 4px!important;font-size:9.5px!important;line-height:15px}
  .nav-mini .collapse-btn{justify-content:center;padding:0}
  .nav-mini .collapse-btn .flip{transform:none}
}
@media (max-width:767px){
  .work-sidebar{width:260px!important;box-shadow:0 0 40px rgba(0,0,0,.35)}
  .btn.sidebar-toggle{display:inline-flex}
  .collapse-btn{display:none}
}
.btn.sidebar-toggle{display:inline-flex!important;color:var(--ink-2)!important;margin-left:-8px}

/* ---------- top bar ---------- */
.topbar{height:var(--z-top)!important;padding:0 20px!important;background:#fff!important;backdrop-filter:none;border-bottom:1px solid var(--z-line)!important;box-shadow:0 1px 0 rgba(16,37,52,.02)}
.topbar-left{gap:6px}
.breadcrumb{font-size:13px!important}
.topbar-search{max-width:460px;margin:0 auto 0 12px}
.topbar-search .input{height:34px!important;border-radius:6px!important;background:#f3f6f9!important;border:1px solid #e6ecf1!important;font-size:13px!important}
.topbar-search .input:focus{background:#fff!important;border-color:var(--z-teal)!important}
.topbar-search>svg{top:9px!important}
.topbar-search kbd{top:6px!important}
.topbar-right{gap:6px!important}
.new-menu>summary{height:34px!important;border-radius:6px!important;background:var(--z-teal);box-shadow:none!important;padding:0 12px!important;font-weight:600!important}
.new-menu>summary:hover{background:var(--z-teal-d)}
.new-menu-pop,.user-pop{top:42px!important;border-radius:8px!important;box-shadow:0 10px 30px rgba(16,37,52,.16)!important}
.bell{width:34px;height:34px;border-radius:6px!important;display:inline-grid!important;place-items:center}
.bell b{top:2px!important;right:1px!important;background:#e0483b!important;min-width:16px;text-align:center;padding:1px 4px!important;line-height:14px}
.user-menu{position:relative}
.user-menu>summary{list-style:none;cursor:pointer;display:grid;place-items:center;width:38px;height:38px;border-radius:50%}
.user-menu>summary::-webkit-details-marker{display:none}
.user-menu>summary:hover .user-avatar,.user-menu[open] .user-avatar{box-shadow:0 0 0 3px var(--z-teal-100)}
.user-avatar{width:32px!important;height:32px!important;background:var(--z-teal)!important;color:#fff!important;border:0!important;transition:box-shadow .15s}
.user-pop{position:absolute;right:0;background:#fff;border:1px solid var(--z-line);min-width:250px;padding:6px;z-index:60}
.user-pop-head{display:flex;gap:12px;align-items:center;padding:12px 10px 14px;border-bottom:1px solid var(--z-line-2);margin-bottom:6px}
.user-pop-head strong{display:block;font-size:14px;color:var(--ink)}
.user-pop-head small{display:block;font-size:12px;color:var(--ink-3);margin-top:1px}
.avatar-lg{width:42px!important;height:42px!important;font-size:14px!important;background:var(--z-teal-50)!important;color:var(--z-teal)!important;border-color:var(--z-teal-100)!important}
.user-pop-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:6px;font-size:13.5px;color:var(--ink-2)}
.user-pop-item:hover{background:#f1f5f8;color:#c0392e}

/* ---------- page heading ---------- */
.main-content{padding:18px 24px 0!important;max-width:none!important}
.page-heading{align-items:center!important;margin-bottom:16px!important;gap:16px}
.eyebrow{text-transform:none!important;letter-spacing:0!important;font-size:12px!important;font-weight:500!important;color:var(--ink-3)!important;margin-bottom:2px!important}
.page-heading h1{font-size:20px!important;font-weight:600!important;letter-spacing:-.1px!important}
.page-heading p{font-size:13px!important;margin-top:4px!important;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.page-heading p:empty{display:none}
.heading-actions .btn{height:34px!important}

/* ---------- buttons / inputs ---------- */
.btn{height:34px!important;border-radius:6px!important;box-shadow:none!important;font-weight:500!important;font-size:13px!important;padding:0 14px!important;background:var(--z-teal)}
.btn:hover{background:var(--z-teal-d);box-shadow:none!important}
.btn-outline{background:#fff!important;border-color:#cfd9e1!important;color:#2f4252!important}
.btn-outline:hover{background:#f5f8fa!important;border-color:#b6c4cf!important}
.btn-ghost{background:transparent!important}
.btn-icon{width:34px}
.btn-sm{height:30px!important}
.input,.select,.textarea{height:36px!important;border-radius:6px!important;font-size:13.5px!important;border-color:#cfd9e1!important}
.input:focus,.select:focus,.textarea:focus{border-color:var(--z-teal)!important;box-shadow:0 0 0 3px rgba(15,124,128,.12)!important}
.field>span{font-size:13px!important;font-weight:500!important;color:#4a5c6b!important}

/* ---------- panels ---------- */
.panel{border:1px solid var(--z-line)!important;border-radius:8px!important;box-shadow:0 1px 2px rgba(16,37,52,.04)!important}
.panel>.panel-heading{padding:12px 18px!important;border-bottom:1px solid var(--z-line-2)}
.panel>.panel-heading h2{font-size:14px!important;font-weight:600!important}
.panel>.panel-heading p{margin-top:1px!important;font-size:12px!important}
.panel-heading .btn-ghost{height:28px!important;font-size:12.5px!important}

/* ---------- KPI cards ---------- */
.kpi-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;overflow:visible!important;margin-bottom:16px!important}
.kpi{background:#fff;border:1px solid var(--z-line)!important;border-top:3px solid #9fb2c1!important;border-radius:8px!important;padding:14px 16px 13px!important;box-shadow:0 1px 2px rgba(16,37,52,.04);transition:box-shadow .15s,transform .15s}
a.kpi:hover{box-shadow:0 6px 18px rgba(16,37,52,.1);transform:translateY(-1px);background:#fff!important}
.kpi-green{border-top-color:#2f9a64!important}.kpi-orange{border-top-color:#e39a3b!important}.kpi-red{border-top-color:#e0483b!important}
.kpi:not(.kpi-green):not(.kpi-orange):not(.kpi-red){border-top-color:var(--z-teal)!important}
.kpi small{font-size:12px!important;color:var(--ink-3)!important;font-weight:500!important;padding-right:38px}
.kpi strong{font-size:26px!important;margin:6px 0 2px!important}
.kpi em{font-size:12px!important}
.kpi-icon{right:14px!important;top:14px!important;width:32px!important;height:32px!important;border-radius:50%!important;background:var(--z-teal-50)!important;color:var(--z-teal)!important}
.strip-title{font-size:12px!important;font-weight:600!important;color:var(--ink-2)!important;letter-spacing:.4px!important;text-transform:uppercase;margin:4px 0 10px!important}

/* ---------- list view ---------- */
.view-tabs{display:flex;gap:2px;padding:0 12px;border-bottom:1px solid var(--z-line);overflow-x:auto;scrollbar-width:none}
.view-tab{display:inline-flex;align-items:center;gap:7px;padding:13px 14px 12px;font-size:13.5px;font-weight:500;color:#5d6e7e;border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.view-tab em{font-style:normal;font-size:11.5px;font-weight:600;background:#eef2f6;color:#5d6e7e;border-radius:99px;padding:0 7px;line-height:18px}
.view-tab:hover{color:var(--ink)}
.view-tab.is-active{color:var(--z-teal);border-color:var(--z-teal);font-weight:600}
.view-tab.is-active em{background:var(--z-teal-50);color:var(--z-teal)}
.task-toolbar{flex-wrap:wrap;padding:12px 16px!important;gap:10px!important;background:#fbfcfd;border-bottom:1px solid var(--z-line-2)}
.task-toolbar .search-box{flex:1 1 240px;max-width:340px}
.task-toolbar .search-box>svg{top:10px!important}
.search-box input{height:34px!important}
.filter-controls{flex-wrap:wrap;gap:8px!important}
.filter-controls .select{height:34px!important;min-width:128px;font-size:13px!important}
.layout-toggle{border:1px solid #cfd9e1!important;border-radius:6px!important;background:#fff;padding:2px!important;gap:2px}
.layout-toggle .btn{width:30px!important;height:28px!important;border-radius:4px!important}
.layout-toggle .btn-secondary{background:var(--z-teal-50)!important;color:var(--z-teal)!important}
.data-table th,.panel th{text-transform:none!important;letter-spacing:0!important;font-size:12px!important;font-weight:600!important;color:#5d6e7e!important;background:#f6f8fa!important;height:40px!important;border-bottom:1px solid var(--z-line)!important;border-top:0!important}
.data-table td,.panel td{font-size:13px!important;padding:10px 12px!important;border-top:1px solid var(--z-line-2)!important}
.data-table tbody tr:hover{background:#f2f9f9!important}
.data-table tr:has(input[data-check]:checked){background:var(--z-teal-50)}
.task-title{font-size:13.5px!important;font-weight:600!important}
.ticket-no{background:none!important;padding:0!important;color:var(--z-teal)!important;font-family:inherit!important;font-weight:600;font-size:12px!important}
.status{border-radius:4px!important;padding:2px 9px 2px 7px!important;font-size:12px!important}
.sla{border-radius:4px!important;font-size:12px!important;padding:2px 8px!important}
.pager{justify-content:space-between!important;border-top:1px solid var(--z-line-2);padding:10px 16px!important;font-size:13px!important}
.pager-range{margin-right:auto;color:var(--ink-3)}
.board-help{padding:0 16px 14px;margin:0!important}
.board7{padding:14px 16px 16px!important;background:#f6f8fa;border-top:1px solid var(--z-line-2)}
.stage-col{background:#eaeef3!important;border-radius:8px!important}
.deal-card{border-radius:8px!important}

/* ---------- stage bar (Zoho CRM chevrons) ---------- */
.stepper-panel{padding:14px 18px!important}
.stepper{gap:3px;align-items:stretch}
.step{flex:1;min-width:0;height:38px;justify-content:center;gap:8px;padding:0 20px 0 22px;margin:0;background:#e6ecf1;color:#5d6e7e!important;font-size:12.5px!important;font-weight:600;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%,14px 50%)}
.step:first-child{clip-path:polygon(0 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,0 100%);border-radius:6px 0 0 6px;padding-left:14px}
.step:last-child{padding-right:14px}
.step+.step::before,.step-done+.step::before{display:none!important}
.step i{width:20px!important;height:20px!important;font-size:11px!important;background:rgba(255,255,255,.7)!important;color:#5d6e7e!important;border:0!important;box-shadow:none!important}
.step span{overflow:hidden;text-overflow:ellipsis}
.step-done{background:#bfe3e0!important;color:#0b4f52!important}
.step-done i{background:var(--z-teal)!important;color:#fff!important}
.step-current{background:var(--z-teal)!important;color:#fff!important}
.step-current i{background:#fff!important;color:var(--z-teal)!important;box-shadow:none!important}
@media (max-width:767px){.step span{display:none}.step-current span{display:inline}}

/* ---------- detail / side cards ---------- */
.c360{gap:16px!important;grid-template-columns:minmax(0,1fr) 300px!important}
.c360-side{gap:16px!important}
.side-card h2{font-size:13px!important;text-transform:uppercase;letter-spacing:.5px;color:var(--ink-2)!important;padding-bottom:10px;border-bottom:1px solid var(--z-line-2);margin-bottom:14px!important}
.detail-panel-wide{padding:18px 20px!important}
.sla-box{background:#fff!important;border-radius:8px!important}
.action-card,.composer{border-radius:8px!important}
.tabs{background:transparent!important;border-bottom:1px solid var(--z-line);border-radius:0!important;padding:0!important;gap:4px}
.tab{flex:0 0 auto!important;padding:0 14px;height:38px!important;border-radius:0!important;border-bottom:2px solid transparent;margin-bottom:-1px}
.tab.is-active{background:transparent!important;box-shadow:none!important;color:var(--z-teal)!important;border-color:var(--z-teal)}

/* ---------- forms ---------- */
.form-panel{max-width:760px;padding:22px 24px 0!important;overflow:visible!important}
.form-panel.form-wide{max-width:980px}
.form-section-title{font-size:12px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;color:var(--z-teal);padding-bottom:8px;border-bottom:1px solid var(--z-line-2);margin-top:4px}
.editor-form>.form-section-title:first-child,.editor-form>.form-error+.form-section-title{margin-top:0}
.form-panel .form-actions{position:sticky;bottom:0;z-index:5;background:#fff;margin:6px -24px 0;padding:14px 24px!important;border-top:1px solid var(--z-line)!important;border-radius:0 0 8px 8px;box-shadow:0 -6px 12px -10px rgba(16,37,52,.2)}
.form-grid{gap:16px 20px!important}

/* ---------- login (split) ---------- */
.login-shell{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(380px,1fr);min-height:100dvh;background:#fff}
.login-hero{background:radial-gradient(900px 500px at 15% 0%,#1d5560 0%,transparent 60%),linear-gradient(165deg,#0d2230,#0f2c39);color:#fff;padding:36px 56px;display:flex;flex-direction:column;justify-content:space-between}
.login-hero .brand strong{font-size:18px!important}
.login-hero-copy{max-width:480px}
.login-hero-copy h2{font-size:34px;font-weight:650;letter-spacing:-.6px;line-height:1.2}
.login-hero-copy>p{margin-top:14px;font-size:15px;line-height:1.7;color:#a9c0cc}
.login-hero-copy ul{margin-top:30px;display:flex;flex-direction:column;gap:18px}
.login-hero-copy li{display:flex;gap:14px;align-items:flex-start;font-size:14px;color:#a9c0cc;line-height:1.5}
.login-hero-copy li svg{flex-shrink:0;color:#5fe0d1;background:rgba(56,200,184,.14);width:36px;height:36px;padding:9px;border-radius:9px}
.login-hero-copy li strong{color:#fff;font-weight:600}
.login-hero-foot{color:#6c8798;font-size:12px}
.login-panel{display:grid;place-items:center;padding:32px}
.login-panel .entry-card{box-shadow:none!important;padding:0!important;max-width:380px;border-radius:0!important}
.login-panel .entry-card h1{font-size:26px!important;font-weight:650;letter-spacing:-.4px!important}
.login-panel .entry-card>p{margin-top:6px!important;font-size:14px!important}
.login-panel .entry-card form{margin-top:24px}
.login-panel .entry-card .btn{height:40px!important;margin-top:8px;font-size:14px!important}
@media (max-width:900px){.login-shell{grid-template-columns:1fr}.login-hero{display:none}}

/* ---------- misc ---------- */
.workspace-footer{margin-top:24px!important}
.toasts{bottom:20px}
@media (max-width:900px){.main-content{padding:14px 14px 0!important}.kpi-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.topbar-search{margin-left:0}.c360{grid-template-columns:1fr!important}}
@media (max-width:520px){.topbar{padding:0 10px!important}.topbar-search{display:none}.user-menu>summary{width:34px}}
@media print{.sidebar-create,.sidebar-foot{display:none!important}}

/* ---- Zoho layer fixes ---- */
.btn.btn-icon{padding:0!important;width:34px}
.kpi-strip{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important}
.task-toolbar .search-box{flex:0 1 250px}
.filter-controls .select{min-width:0!important;width:auto;padding-left:10px;max-width:150px}
.task-toolbar{flex-wrap:nowrap;align-items:center}
.filter-controls{flex:1;justify-content:flex-end;flex-wrap:nowrap}
@media (max-width:1280px){.task-toolbar{flex-wrap:wrap}.filter-controls{flex-wrap:wrap;justify-content:flex-start}}