/* THE YBDC CRM — Dark Emerald + Gold dashboard reference theme
   Sole active overlay. CSS only: does not alter CRM records, functions or security.
   Layout reference: dark jade sidebar, charcoal green dashboard, glassy emerald tiles,
   gold accents, green lead-trend line, split lead-source and leads-trend cards.
*/
:root {
 color-scheme:dark !important;
 --ink:#f1f4e9;--muted:#9cafa8;--green:#17a976;--dark:#041911;
 --line:#25453a;--light:#0b1c19;--surface:#0b201a;--gold:#ecc066;
 --shadow:0 9px 25px rgba(0,0,0,.17);
 --ybdc-forest:#051a15;--ybdc-panel:#0a1a17;--ybdc-emerald:#126648;
 background:#071512;color:#f1f3ed;
}
html,body,#app,.layout,.main,.content {background:#071512 !important;color:#e9f1ec !important}
body{font-family:'DM Sans',Arial,sans-serif !important}
::selection{background:#255c43;color:#fff}
:focus-visible{outline:2px solid #efc66d !important;outline-offset:2px}
/* 1. Left fixed, dark evergreen navigation as in the reference. */
.sidebar {
 background:linear-gradient(180deg,#00271c 0%,#041c15 43%,#03140f 100%) !important;
 border-right:1px solid #18503b !important;
 box-shadow:none !important;
 width:286px !important; flex:0 0 286px !important;
 min-height:100vh !important;max-height:100vh !important;
 padding:20px 15px 17px !important;
 overflow-y:auto !important;overflow-x:hidden !important;
 scrollbar-color:#2b4f40 transparent;
}
.brand{padding:7px 12px 31px !important;gap:11px !important;min-height:142px !important;align-items:center !important}
.brand .brand-mark.yp-logo{width:102px !important;height:114px !important;flex:none !important;border:0 !important;background:transparent !important;border-radius:0 !important}
.brand .brand-mark.yp-logo img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 9px #0006)}
.brand h2{font-family:Georgia,'Times New Roman',serif !important;font-size:19px !important;line-height:1.1 !important;color:#ecc26a !important;letter-spacing:.01em !important;font-weight:700 !important}
.brand small{color:#e5ddc1 !important;font-size:9px !important;letter-spacing:1.6px !important}
.section-label{font-size:9px !important;color:#638a78 !important;letter-spacing:1.3px !important}
.nav,.nav-group .nav{gap:6px !important}
.nav-group{padding-top:18px !important}
.nav-btn {
 min-height:51px !important;padding:13px 16px !important;
 border:1px solid transparent !important;border-radius:10px !important;
 color:#d0dcd2 !important;background:transparent !important;
 font-size:13px !important;font-weight:600 !important;
 box-shadow:none !important;transition:background .15s,color .15s !important;
}
.nav-btn svg{width:21px !important;height:21px !important;color:#e7d7b3 !important;opacity:.94 !important}
.nav-btn:hover{background:#0c402f !important;color:#fff !important;transform:none !important;border-color:#2e5c43 !important}
.nav-btn.active {
 background:linear-gradient(105deg,#11573e,#07422f) !important;
 border:1px solid #aa863a !important;border-left-color:#e6b94f !important;
 box-shadow:inset 3px 0 #eac65e !important;
 color:#f5f6ef !important;
}
.nav-btn.active svg{color:#f5e6c1 !important}
.sidebar .side-note{display:none !important}
.sidebar-bottom{margin-top:auto !important;padding:18px 6px 8px !important;flex-shrink:0 !important}
.side-user{border-top:1px solid #244736 !important;margin-top:0 !important;padding-top:15px !important}
.side-user strong{color:#f5f0dd !important}
.side-user small{color:#91afa0 !important}
.side-user .avatar,.avatar{background:#0f684a !important;color:#f9f3df !important;border-radius:50% !important}
.exit{color:#c5d6ca !important}
.exit:hover{color:#efc16b !important;background:#16452f !important}
/* 2. Wide search in the charcoal-green header. */
.main{min-width:0 !important;flex:1 !important}
.topbar {
 height:77px !important;min-height:77px !important;
 display:flex !important;align-items:center !important;
 background:linear-gradient(90deg,#0d1e1a,#0a1615 75%,#091414) !important;
 border-bottom:1px solid #294036 !important;box-shadow:none !important;
 padding:0 25px !important;gap:18px !important;
}
.breadcrumb{font-size:10px !important;color:#80988c !important}
.breadcrumb span{color:#e9be69 !important}
.yp-global-search{
 background:#132522 !important;color:#d8e2da !important;
 height:46px !important;min-width:190px !important;max-width:565px !important;
 flex:1 1 360px !important;border:1px solid #486056 !important;
 border-radius:11px !important;padding:0 13px !important;box-shadow:inset 0 0 0 1px #ffffff05 !important;
}
.yp-global-search svg{color:#d6e2db !important;width:20px !important;height:20px !important}
.yp-global-search input{background:transparent !important;border:none !important;box-shadow:none !important;color:#f3f4ec !important;font-size:13px !important}
.yp-global-search input::placeholder{color:#acbdb4 !important}
.yp-global-search:focus-within{border-color:#e2bb68 !important;box-shadow:0 0 0 2px #d3a84b24 !important}
.yp-today-badge{background:#10221f !important;border:1px solid #385047 !important;border-radius:10px !important;padding:8px 12px !important}
.yp-today-badge strong{color:#efece3 !important;font-size:11px !important}
.yp-today-badge small{color:#a1b4a9 !important}
.yp-today-icon svg{color:#eac46b !important}
.icon-btn{background:#0e241e !important;color:#e8e4cf !important;border:1px solid #32473f !important;border-radius:10px !important}
.icon-btn:hover{background:#1c4734 !important}
.user-chip{border-color:#2f4a3f !important}
.user-chip strong{color:#f9f8f0 !important}
.user-chip small{color:#aabeb1 !important}
.user-chip .avatar{background:#0f6348 !important}
/* 3. Greeting + stat cards. */
.content{max-width:1750px !important;margin:0 auto !important;padding:26px 27px 70px !important;color:#e8f1eb !important}
.heading-row{margin-bottom:24px !important;gap:18px !important}
.heading-row h1{
 color:#f5f5ed !important;font-family:Georgia,'Times New Roman',serif !important;
 font-size:clamp(27px,2.4vw,35px) !important;font-weight:700 !important;
 letter-spacing:-.7px !important;line-height:1.16 !important;
}
.heading-row p{font-size:13px !important;margin-top:9px !important;color:#a6b5ae !important}
.eyebrow{color:#e4ba61 !important;letter-spacing:1.25px !important;font-weight:750 !important;font-size:10px !important}
.btn,.mini{background:#112d25 !important;border:1px solid #335446 !important;color:#e0eddf !important;border-radius:10px !important;box-shadow:none !important}
.btn:hover,.mini:hover{background:#204937 !important;color:white !important;border-color:#6b916f !important}
.btn.primary{background:linear-gradient(108deg,#0c7551,#0b5a42) !important;color:#fff !important;border-color:#23916a !important}
.btn.primary:hover{background:linear-gradient(108deg,#12895f,#117751) !important}
.btn.secondary{background:#182d26 !important;color:#ebeddc !important;border-color:#426250 !important}
.btn.danger,.danger-outline{background:#3a2420 !important;color:#ffd0b9 !important;border-color:#684b3c !important}
.stats{display:grid !important;grid-template-columns:repeat(4,minmax(0,1fr)) !important;gap:15px !important;margin-bottom:17px !important}
.stat{
 min-height:152px !important;padding:19px 20px !important;
 border:1px solid #275443 !important;border-radius:13px !important;
 background:linear-gradient(145deg,#082e23,#05231d 65%,#081e1a) !important;
 box-shadow:0 6px 25px #0002 !important;color:#fff !important;
 position:relative !important;overflow:hidden !important;
}
.stat::before{content:none !important;display:none !important}
.stat::after{content:'' !important;display:block !important;position:absolute;right:-27px;bottom:-40px;width:129px;height:129px;border:0;border-radius:50%;background:radial-gradient(circle,#1f8d6d25 0 30%,transparent 32% 100%);opacity:.75;pointer-events:none}
.stat:nth-child(4){background:linear-gradient(145deg,#2b2a19,#1c241c 75%) !important;border-color:#655537 !important}
.stat-head{color:#e4efe3 !important;font-size:12px !important;font-weight:700 !important}
.stat-icon{width:44px !important;height:44px !important;background:linear-gradient(135deg,#086647,#0d4e3c) !important;border-radius:11px !important;color:#bdf6c9 !important}
.stat:nth-child(4) .stat-icon{background:linear-gradient(135deg,#736020,#43391e) !important;color:#ffd673 !important}
.stat-icon svg{width:23px !important;height:23px !important}
.stat-number{font-family:'Manrope','DM Sans',sans-serif !important;font-size:36px !important;line-height:1.12 !important;font-weight:800 !important;letter-spacing:-1px !important;margin-top:13px !important;color:#fff !important}
.stat-foot{font-size:11px !important;margin-top:7px !important;color:#b6cbbb !important;position:relative;z-index:1}
.stat-foot .up{color:#2ad398 !important}
.stat:nth-child(4) .stat-foot .up{color:#f6c853 !important}
button.stat:hover{transform:translateY(-2px) !important;border-color:#b7964b !important;box-shadow:0 12px 27px #0005 !important}
/* 4. Lead source / trend analytics cards. */
.card,.yp-analytics-card{
 border:1px solid #2b453c !important;border-radius:13px !important;
 background:linear-gradient(135deg,#0d1d1b,#091917) !important;
 color:#eaf3ec !important;box-shadow:0 5px 21px #0002 !important;overflow:hidden !important;
}
.ybdc-analytics{grid-template-columns:1fr 1fr !important;gap:16px !important;margin-bottom:17px !important}
.yp-analytics-card{padding:20px 22px !important;min-width:0 !important;min-height:278px !important}
.yp-analytics-head h3,.card-header h3{color:#f7f7f2 !important;font-weight:800 !important;font-size:14px !important}
.yp-period{border:1px solid #3b5449 !important;border-radius:9px !important;color:#e1ebe2 !important;background:#14251f !important;padding:8px 11px !important;font-size:11px !important}
.yp-sources{gap:20px !important;min-height:195px !important;margin-top:15px !important}
.yp-donut{width:190px !important;height:190px !important;flex:none !important}
.yp-donut-hole{width:122px !important;height:122px !important;background:#0a1b18 !important;box-shadow:0 0 0 1px #2e5240 !important}
.yp-donut-hole strong{font-size:30px !important;color:#fafafa !important}
.yp-donut-hole span{font-size:12px !important;color:#c1cec4 !important}
.yp-source-list{gap:14px !important}
.yp-source-list li,.yp-source-list li strong{color:#e4eae4 !important;font-size:11px !important}
.yp-source-list li .yp-source-count,.yp-source-count{color:#cbd6c8 !important}
.yp-source-label i{box-shadow:0 0 0 1px #ffffff12}
.yp-trend-total{color:#c1d9c7 !important}
.yp-trend-total strong{color:#d6fae1 !important}
.yp-trend-total span,.yp-chart-labels{color:#a0ada5 !important}
.yp-chart-grid{stroke:#294239 !important;stroke-dasharray:2 3 !important}
.yp-trend-svg polyline{stroke:#24cb85 !important;stroke-width:3.2px !important}
#ypAreaGradient stop:first-child{stop-color:#1db970 !important;stop-opacity:.33 !important}
#ypAreaGradient stop:last-child{stop-color:#1db970 !important;stop-opacity:0 !important}
/* 5. Recent enquiries, lists and filters. */
.content:has(.ybdc-analytics) .grid2{grid-template-columns:1fr !important;gap:16px !important}
.card-header{background:transparent !important;border-bottom:1px solid #2a4438 !important;padding:18px 21px 15px !important}
.card-header small{color:#91aa9b !important;font-size:11px !important}
.link{color:#f0c763 !important;font-weight:800 !important}
.link:hover{color:#ffdc85 !important}
.table-wrap{overflow-x:auto !important;background:#091916 !important}
table{color:#e2e8e2 !important}
thead th,table thead th{background:#132622 !important;color:#dbe7df !important;border-color:#29463a !important;text-transform:none !important;letter-spacing:.05px !important;font-size:11px !important;padding:13px 13px !important}
tbody td,table tbody td{color:#e1e8e1 !important;border-top:1px solid #273e34 !important;padding:13px 13px !important;font-size:11px !important}
tbody tr:nth-child(even){background:#0a1d18 !important}
tbody tr:hover{background:#17382a !important}
td strong{color:#f3f7ed !important}
.tiny-muted{color:#90b09c !important}
.yp-enquiries-table{min-width:980px}
.yp-money{color:#f3daa4 !important;font-weight:750 !important}
.pill{border-radius:20px !important;background:#144a34 !important;color:#bdf4d2 !important;border-color:#286847 !important}
.pill.gold{background:#4b411f !important;border-color:#64552c !important;color:#ffe28b !important}
.pill.blue{background:#143947 !important;border-color:#28576a !important;color:#b6dfed !important}
.pill.red{background:#4a2f2b !important;border-color:#795046 !important;color:#fbd0c3 !important}
.pill.gray{background:#243831 !important;border-color:#405b4d !important;color:#dae6db !important}
.pill.purple{background:#403551 !important;border-color:#635477 !important;color:#ead4f8 !important}
/* 6. Operational screens, lead forms and dialogs. */
.field,input:not([type=checkbox]):not([type=radio]),select,textarea{
 background:#10281f !important;color:#f0f6ec !important;border:1px solid #345846 !important;
 border-radius:10px !important;color-scheme:dark !important;
}
input:focus,select:focus,textarea:focus,.field:focus{border-color:#ebc36d !important;outline:0 !important;box-shadow:0 0 0 3px #e4b95f21 !important}
input::placeholder,textarea::placeholder{color:#8fa798 !important}
.form-item label,.login-card label{color:#e5efe5 !important}
.form-item small{color:#a4b9aa !important}
.toolbar{gap:12px !important}
.activity,.follow-row,.step{border-color:#2d4a3b !important}
.activity .circle,.step-number{background:#184f39 !important;color:#d3f5d8 !important;border-color:#39664b !important}
.activity strong,.follow-text h4,.step h4{color:#f0f6e8 !important}
.activity p,.activity small,.follow-text p,.step p{color:#a6b9aa !important}
.lead-pick,.match-card,.date-box{background:#0e251d !important;color:#e0ebe0 !important;border-color:#365343 !important}
.lead-pick:hover,.lead-pick.selected{background:#16422d !important;border-color:#a28c46 !important}
.lead-pick h4,.match-card h4,.date-box strong{color:#f3f5e9 !important}
.lead-pick p,.match-card p,.date-box small{color:#a3b8a5 !important}
.info,.integration-state{background:#142f24 !important;color:#d5e4d5 !important;border-color:#345642 !important}
.info.warn{background:#392e1c !important;color:#f4dcab !important;border-color:#77613a !important}
.tag,.code{background:#1a392d !important;color:#d3edcf !important;border-color:#355d45 !important}
.empty h3{color:#f4f7eb !important}
.empty p,.note{color:#a5b9aa !important}
.modal-layer{background:rgba(0,10,7,.76) !important;z-index:100 !important}
.modal{background:#0d241d !important;border:1px solid #355747 !important;color:#e9f4e9 !important;border-radius:16px !important;box-shadow:0 28px 90px #0009 !important}
.modal-head,.modal-foot{background:#0e241d !important;border-color:#315342 !important}
.modal-head h2{color:#f6f8ed !important}
.modal-head p{color:#acc2b2 !important}
.modal-body{background:#0d241d !important}
.close{color:#f6eed4 !important;background:#184430 !important;border-color:#426b4c !important}
.close:hover{background:#236343 !important}
.detail-grid .item{border-color:#294a37 !important}
.detail-grid .item small{color:#a6bba9 !important}
.detail-grid .item strong{color:#eef5e7 !important}
.wa-text{color:#d7e9d8 !important;background:#173a2b !important}
.import-preview{border-color:#2c4e3a !important}
.toast{background:#165c42 !important;color:#fff !important;border-radius:10px !important}
.toast.error{background:#743d32 !important}
.demo-banner{background:#3b311c !important;color:#f8e5b2 !important;border:1px solid #79643c !important}
/* Login retains the same professional evergreen identity. */
.login-page{background:#061612 !important;color:#f5f2e7 !important}
.login-left{background:linear-gradient(150deg,#063d2c,#04241a 75%) !important;color:#eef4df !important}
.login-left:after{color:#205d43 !important}
.login-left .brand h2{color:#f1c466 !important}
.login-copy .eyebrow{color:#eac067 !important}
.login-copy h1{color:#f7f7ea !important}
.login-copy p{color:#bfd0c2 !important}
.login-foot{color:#a1bba7 !important}
.login-right{background:#0a1f19 !important}
.login-card h2{color:#f5f7eb !important}
.login-card>p,.login-hint{color:#a7bcac !important}
.login-card .demo-btn{background:#214d37 !important;border-color:#4b7450 !important;color:#e4f3d9 !important}
.login-divider{color:#a5bbae !important}
/* Keep forms and navigation usable on laptops/tablets/phones. */
@media(max-width:1320px){
 .sidebar{width:255px !important;flex-basis:255px !important}
 .brand .brand-mark.yp-logo{width:82px !important;height:95px !important}
 .brand h2{font-size:16px !important}
 .content{padding:25px 22px 60px !important}
 .yp-sources{gap:13px !important}
 .yp-donut{width:152px !important;height:152px !important}
 .yp-donut-hole{width:102px !important;height:102px !important}
}
@media(max-width:1080px){
 .ybdc-analytics{grid-template-columns:1fr !important}
 .stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
 .yp-global-search{max-width:none !important}
}
@media(max-width:900px){
 .sidebar{position:fixed !important;left:-310px !important;top:0 !important;z-index:75 !important;width:275px !important;max-width:85vw !important;flex-basis:275px !important;box-shadow:9px 0 30px #0007 !important;transition:left .18s ease !important}
 .sidebar.open{left:0 !important}
 .topbar{min-height:69px !important;height:auto !important;padding:10px 17px !important}
 .topbar .breadcrumb{display:none !important}
 .yp-today-badge{display:none !important}
 .content{padding:22px 17px 55px !important}
 .heading-row h1{font-size:29px !important}
}
@media(max-width:620px){
 .stats{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:9px !important}
 .stat{min-height:131px !important;padding:14px !important}
 .stat-number{font-size:26px !important}
 .stat-head{font-size:10px !important}
 .stat-icon{width:33px !important;height:33px !important}
 .stat-icon svg{width:17px !important;height:17px !important}
 .heading-row{align-items:flex-start !important;flex-direction:column !important}
 .heading-row h1{font-size:26px !important}
 .yp-global-search{min-width:0 !important;max-width:none !important;flex:1 1 auto !important}
 .yp-global-search input{font-size:11px !important}
 .yp-analytics-card{padding:17px 15px !important}
 .yp-sources{flex-direction:column !important;gap:15px !important;align-items:center !important}
 .yp-source-list{width:100% !important}
 .stat:nth-child(4) .stat-foot{font-size:10px !important}
 .modal-body{padding:17px !important}
}
@media(prefers-reduced-motion:reduce){button.stat,.nav-btn{transition:none !important}}
/* Reference-accurate KPI alignment: icon left, label/value right. */
@media(min-width:621px){
 .stats > .stat{display:grid !important;grid-template-columns:54px minmax(0,1fr) !important;grid-template-rows:auto auto 1fr !important;column-gap:8px !important;align-content:center !important;align-items:start !important}
 .stats > .stat .stat-head{display:contents !important}
 .stats > .stat .stat-head > span{grid-column:2 !important;grid-row:1 !important;align-self:end !important;margin-top:3px !important}
 .stats > .stat .stat-icon{grid-column:1 !important;grid-row:1 / 4 !important;align-self:start !important;margin-top:1px !important}
 .stats > .stat .stat-number{grid-column:2 !important;grid-row:2 !important;margin-top:7px !important}
 .stats > .stat .stat-foot{grid-column:2 !important;grid-row:3 !important;margin-top:7px !important}
}