/* Shared visual foundation for staff, officer and customer workspaces. */
:root { --workspace-ink:#18342d; --workspace-muted:#65766f; --workspace-line:#e3ebe7; --workspace-surface:#fff; --workspace-shadow:0 4px 20px rgba(25,56,43,.045); }
body { text-rendering:optimizeLegibility; }
.page-title,.portal-card-title,.officer-title { letter-spacing:-.025em; }
.page-sub { line-height:1.6; }
.card,.stat-card,.portal-card,.supporting-card,.summary-strip-card,.member-profile-card,.plot-switch-card,.member-mobile-card { border-color:var(--workspace-line); box-shadow:var(--workspace-shadow); }
.portal-container { padding:24px; max-width:1200px; }
.officer-hero { border-radius:22px; box-shadow:0 12px 30px rgba(6,78,59,.12); }
.summary-strip-card,.supporting-card { border-radius:16px; }
.strip-value,.metric-val,.stat-value { font-variant-numeric:tabular-nums; letter-spacing:-.035em; }
.portal-table,.data-table { font-variant-numeric:tabular-nums; }
.portal-table th,.data-table th { background:#f5f8f6; line-height:1.5; }
.portal-table td,.data-table td { line-height:1.6; }
.portal-tabs { gap:8px; overflow-x:auto; scrollbar-width:thin; }
.portal-tab-btn { white-space:nowrap; min-height:44px; }
.portal-table-wrap,.desktop-table-wrap { overscroll-behavior-x:contain; scrollbar-width:thin; }
.portal-login-card,.auth-card { box-shadow:0 18px 54px rgba(21,59,44,.08); border-color:var(--workspace-line); }
:where(input,select,textarea) { accent-color:#16815f; }
:where(button,a,input,select,textarea,[tabindex]):focus-visible { outline:3px solid #16815f; outline-offset:3px; }
@media(max-width:640px){
  .portal-container { padding:14px; }
  .portal-login-card,.auth-card { padding:26px 20px; }
  .officer-title { font-size:22px; overflow-wrap:anywhere; }
  .portal-table-wrap { max-width:100%; }
  .portal-tab-btn,.page-btn,.action-icon-btn,.pwd-toggle-btn { min-height:44px; min-width:44px; }
  input,select,textarea { font-size:16px; }
}
@media(prefers-reduced-motion:reduce){ .summary-strip-card:hover,.action-clean-card:hover,.member-mobile-card:hover { transform:none; } }

.member-sync-notice {position:fixed;bottom:max(18px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);z-index:180;display:flex;align-items:center;gap:14px;width:max-content;max-width:calc(100% - 28px);padding:12px 16px;background:#fff8e8;border:1px solid #edd39b;border-radius:12px;box-shadow:var(--workspace-shadow);color:#704b12;font-size:13px;}
.member-sync-notice[hidden]{display:none;}
.member-sync-notice button {border:1px solid #d3ae61;border-radius:8px;background:#fff;min-height:40px;padding:6px 12px;color:inherit;white-space:nowrap;cursor:pointer;}

/* Approved slate–teal palette. Preserve existing controls and plot geometry. */
:root {
  --workspace-ink:#244452; --workspace-muted:#71848b;
  --workspace-line:#dfe9ed; --workspace-shadow:0 5px 22px rgba(36,68,82,.045);
  --workspace-gradient:linear-gradient(115deg,#244452 0%,#286b68 100%);
  --green-50:#edf7f4; --green-100:#d9ece7; --green-500:#327b75;
  --green-600:#286b68; --green-700:#245b5c; --green-800:#244452;
  --bg-page:#f5f8f9; --bg-sidebar:#fff; --bg-hover:#edf4f5;
}
body {background:var(--bg-page);}
.sidebar {background:#fff;border-right:1px solid var(--workspace-line);}
.sidebar-brand {background:var(--workspace-gradient);border-radius:0 0 18px 0;}
.sidebar-brand .brand-text h3,.sidebar-brand .brand-text span {color:#fff!important;}
.sidebar-brand img {background:#fff;border-radius:9px;padding:3px;}
.nav-item {font-weight:650;font-size:14px;border-radius:11px;transition:background .16s ease,color .16s ease;}
.nav-item.active {background:var(--workspace-gradient);color:#fff;box-shadow:0 4px 12px #2444521a;}
.nav-item.active .nav-icon {opacity:1;}
.nav-item:hover:not(.active) {background:#edf4f5;color:#244452;}
.card,.stat-card,.portal-card,.supporting-card,.summary-strip-card {border-radius:18px;}
.btn-primary {background:var(--workspace-gradient);box-shadow:0 3px 10px #24445218;}
.officer-hero,.member-profile-card {background:var(--workspace-gradient)!important;color:#fff;border-radius:22px;}
.member-profile-card :is(h2,h3,.member-name) {color:#fff;}
.financial-hero-card {border:1px solid var(--workspace-line);border-radius:22px;box-shadow:var(--workspace-shadow);}
#memberQuickViewModal .modal {border-radius:22px!important;border:1px solid var(--workspace-line);}
#memberQuickViewModal .modal-header {background:var(--workspace-gradient)!important;padding:22px!important;}
#memberQuickViewModal .modal-body {background:#f8fafb!important;}
#memberQuickViewModal .modal-body button {min-height:40px;}
.inbox-wrapper {border-radius:20px;box-shadow:var(--workspace-shadow);}
.portal-tab-btn.active {background:var(--workspace-gradient);color:#fff;}
:where(button,a,input,select,textarea,[tabindex]):focus-visible {outline-color:#286b68;}
@media(max-width:640px) {
  .nav-item {min-height:46px;}
  .officer-hero,.member-profile-card {border-radius:18px;}
  #memberQuickViewModal .modal {width:calc(100vw - 20px)!important;max-height:92dvh!important;}
  #memberQuickViewModal .modal-body {padding:14px!important;}
}
@media(prefers-reduced-motion:reduce) {.nav-item {transition:none;}}
/* Approved workspace finish; existing actions and physical project map remain intact. */
:root{--dash-primary:#286b68;--dash-primary-dark:#244452;--dash-primary-light:#327b75;--dash-primary-grad:var(--workspace-gradient);--dash-primary-soft:#edf7f4;--portal-primary:#286b68;--portal-dark:#244452;}
.top-header{min-height:76px;height:auto;align-items:center;gap:16px;}
.pro-stat-card{border-color:var(--workspace-line);border-radius:20px;box-shadow:var(--workspace-shadow);padding:22px;}
.pro-stat-label{font-size:12px;color:#627b83;}
.pro-stat-value{color:var(--workspace-ink);font-variant-numeric:tabular-nums;}
.pro-search-pill{border-radius:12px;background:#f0f5f6;box-shadow:none;}
.pro-circle-btn{border-color:var(--workspace-line);}
.portal-main-wrap{max-width:1200px;}
.member-profile-card .info-label{color:#d9e9ed!important;}
.member-profile-card .info-value{color:#fff!important;}
.member-profile-card .profile-card-top{border-color:#ffffff26;}
.portal-nav,.portal-modal-card{border-radius:20px;border-color:var(--workspace-line);}
.action-clean-card{border-color:var(--workspace-line);box-shadow:none;}
.portal-table th{color:#647b82;font-size:12px;}
.portal-table td{padding-top:16px;padding-bottom:16px;}
@media(min-width:1100px){
 #memberQuickViewModal{justify-content:flex-end;padding:16px;}
 #memberQuickViewModal .modal{margin:0;width:570px!important;max-width:calc(100vw - 32px);max-height:calc(100dvh - 32px)!important;height:calc(100dvh - 32px);}
}
@media(max-width:640px){
 .pro-stat-card{padding:16px;gap:10px;}
 .top-header{padding-block:14px;}
 .portal-nav{flex-wrap:wrap;gap:12px;}
 .portal-nav-right{flex-wrap:wrap;}
 .member-profile-card .member-info-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;}
 .member-profile-card .info-value{overflow-wrap:anywhere;}
}
.customer-project-tabs{display:flex;gap:8px;background:#eaf1f3;padding:7px;border-radius:15px;margin:0 0 22px;overflow-x:auto;}
.customer-project-tabs button{border:0;background:none;color:#59717a;font-family:inherit;font-size:14px;font-weight:600;padding:12px 22px;min-height:44px;border-radius:10px;white-space:nowrap;cursor:pointer;}
.customer-project-tabs button.active{background:#fff;color:#286b68;box-shadow:0 3px 10px #2444520a;}
.customer-project-tabs{scroll-padding-inline:8px;}
.customer-project-tabs button:focus-visible{outline:2px solid #286b68;outline-offset:2px;}
.portal-main-wrap .action-clean-card{min-height:88px;border-radius:16px;}
.portal-main-wrap :is(.card,.supporting-card){overflow-wrap:anywhere;}
.portal-container .strip-value{font-variant-numeric:tabular-nums;letter-spacing:-.5px;}
@media(max-width:640px){.portal-main-wrap .action-clean-card{min-height:76px;}.portal-main-wrap{padding-inline:12px;}.customer-project-tabs{gap:4px;}.customer-project-tabs button{min-width:100px;}}
.portfolio-empty{border:1px solid var(--workspace-line);border-radius:22px;background:#fff;padding:40px;text-align:center;}
.portfolio-empty[hidden],#portfolioShopno[hidden]{display:none!important;}
.portfolio-empty h2{color:#244452;margin:12px 0;}
.portfolio-empty p{color:#647b83;line-height:1.8;}
.portfolio-empty small{color:#647b83;line-height:1.8;}
.portfolio-empty-icon{display:inline-grid;place-items:center;width:64px;height:64px;border-radius:20px;background:#edf6f3;color:#286b68;font-size:32px;}
.portfolio-future-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:26px;}
.portfolio-future-grid div{padding:20px;background:#f6f9f9;border-radius:14px;color:#647b83;font-size:13px;}
.workspace-nav-icon{display:block;width:21px;height:21px;flex:none;}
.partner-month-status{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 24px;padding:16px 20px;border:1px solid var(--workspace-line);border-radius:18px;background:#fff;}
.partner-month-status>div{margin-right:auto;display:grid;gap:5px;color:#244452;}
.partner-month-status>div span{font-size:12px;color:#647b83;}
.partner-month-status button{display:flex;align-items:center;gap:8px;border:1px solid #dce7e8;border-radius:12px;background:#f6faf9;color:#244452;padding:12px 16px;min-height:44px;font-family:inherit;font-weight:600;font-size:14px;cursor:pointer;}
.partner-month-status button strong{font-size:20px;margin-left:8px;font-variant-numeric:tabular-nums;}
.paid-status-dot,.pending-status-dot{width:8px;height:8px;display:inline-block;border-radius:50%;background:#23856c;}
.pending-status-dot{background:#d88b26;}
.portal-container .wallet-highlight{background:var(--workspace-gradient)!important;}
.portal-container .officer-avatar{background:#dfeddf;color:#244452;border:3px solid #ffffff36;box-shadow:none;}
.portal-container .officer-hero{gap:12px;padding:26px;}
.portal-container .portal-tabs{gap:8px;border:0;background:#eaf1f3;padding:7px;border-radius:15px;overflow-x:auto;}
.portal-container .portal-tab-btn{border:0!important;border-radius:10px;padding:13px 18px;white-space:nowrap;}
.portal-container .member-mobile-card{border-radius:18px;border-color:var(--workspace-line);}
@media(max-width:640px){.partner-month-status{padding:14px;gap:10px;}.partner-month-status>div{width:100%;}.partner-month-status button{flex:1;justify-content:center;padding:10px;font-size:12px;}.portal-container .officer-hero{padding:20px;}.portal-container .portal-tabs{scrollbar-width:thin;}}
.nav-item .nav-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;}
.sidebar-user{border-bottom:1px solid var(--workspace-line);}
.bottom-nav{background:#ffffffed;backdrop-filter:blur(16px);border-top:1px solid var(--workspace-line);padding-bottom:env(safe-area-inset-bottom);}
.bottom-nav-item{font-weight:650;gap:5px;min-width:0;}
.bottom-nav-item .nav-icon{display:flex;align-items:center;justify-content:center;width:42px;height:29px;border-radius:10px;}
.bottom-nav-item.active{color:#286b68;}
.bottom-nav-item.active .nav-icon{background:#e4f0ee;color:#244452;}
.btn,.action-clean-card{transition:background .16s ease,box-shadow .16s ease;}
@media(prefers-reduced-motion:reduce){.btn,.action-clean-card{transition:none;}}
@media(max-width:640px){.portfolio-empty{padding:26px 18px;}.portfolio-future-grid{grid-template-columns:1fr;}.customer-project-tabs button{padding:12px 16px;}}

/* Selected reference: forest navigation, sage accents and warm gray surfaces. */
:root{--workspace-ink:#203d32;--workspace-muted:#78877f;--workspace-line:#e1e8df;--workspace-gradient:linear-gradient(115deg,#203d32,#345f4c);--green-50:#f0f5ec;--green-100:#e5eedf;--green-500:#64866b;--green-600:#345f4c;--green-700:#294e3e;--green-800:#203d32;--bg-page:#f6f7f2;--bg-hover:#edf2e8;--dash-primary:#345f4c;--portal-primary:#345f4c;--portal-dark:#203d32;}
body{background:#f6f7f2;color:#203d32;}
.sidebar{background:#203d32;border-color:#203d32;}
.sidebar-brand{background:none;border-radius:0;}
.sidebar .nav-item{color:#dbe5dd;}
.sidebar .nav-item.active{background:#456451;color:#fff;box-shadow:inset 3px 0 #d6c789;}
.sidebar .nav-item:hover:not(.active){background:#345243;color:#fff;}
.sidebar .sidebar-user{color:#eef3eb;border-color:#ffffff1a;}
.sidebar .user-name,.sidebar .nav-section-title{color:#dbe5dd;}
.sidebar .sidebar-clock{background:#2b493b;color:#e2ebdf;border-color:#ffffff1a;}
.thread-item.active{background:#eaf1e3!important;box-shadow:inset 3px 0 #456451!important;}
.chat-messages{background:#f7f8f2!important;}
.message-row.outgoing .message-bubble,.message-row.outgoing.wa-msg .message-bubble{background:#e6eedc!important;color:#203d32!important;border:1px solid #dae5d3;}
.message-row.incoming .message-bubble{border-color:#e3e8df;box-shadow:none;}
.chat-composer,.chat-input-area{background:#fff;}
.member-profile-card{background:#fff!important;color:#203d32!important;border:1px solid #dfe8da!important;border-left:0!important;}
.member-profile-card :is(h1,h2,h3,.member-name),.member-profile-card .info-value{color:#203d32!important;}
.member-profile-card .info-label{color:#7b877c!important;}
.member-profile-card .profile-card-top{border-color:#e4eadd;}
.profile-name-area{position:relative;padding-left:76px;min-height:62px;display:flex;flex-direction:column;justify-content:center;gap:8px;}
.customer-profile-avatar{position:absolute;left:0;top:0;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:#e4eddc;color:#34513e;font-size:23px;font-weight:800;}
.customer-project-tabs{background:#eaf0e5;}
.customer-project-tabs button.active{color:#345f4c;}
#memberQuickViewModal .modal-header{background:#fff!important;color:#203d32!important;border-bottom:1px solid #e4eadd;}
#memberQuickViewModal .modal-header :is(h2,h3,p,span){color:#203d32!important;}
#memberQuickViewModal .modal-body{background:#fafbf7!important;}
#memberQuickViewModal .modal{box-shadow:0 16px 60px #203d3226;}
@media(max-width:640px){.member-profile-card{padding:20px!important;}.profile-name-area h1{font-size:23px;}.member-info-grid{gap:16px;}.portal-main-wrap .financial-hero-card{border-radius:18px;}}

/* Match all Inbox surfaces to the selected sage/gray palette. */
.sidebar .sidebar-user .user-info .name{color:#f4f3e9;}
.sidebar .sidebar-user .user-info .role{color:#c8d8cb;}
.inbox-wrapper{background:#f3f5ee;border-color:#dbe4d6;}
.inbox-top-bar,.chat-header{background:#edf2e7;border-color:#dce5d7;}
.inbox-threads-panel,.thread-list-scroll{background:#f5f7f0;}
.thread-search-box,.thread-filter-chips{background:#eef2e9;border-color:#dce5d7;}
.thread-search-input-wrapper input{background:#e4ebdf;border:1px solid #d7e1d0;color:#203d32;}
.thread-item{border-color:#e1e7dc;}
.thread-item:hover{background:#eaf0e3;}
.thread-item.active{background:#dde9d4!important;}
.inbox-details-panel{background:#edf2e8;border-color:#dce5d7;}
.inbox-details-panel .details-card{background:#f8faf4;border-color:#dce5d6;border-radius:18px;box-shadow:none;}
.inbox-details-panel :is(select,input),.crm-status-box{background:#edf2e7!important;border-color:#d7e1d0!important;color:#294635;}
.chat-input-bar,.composer-hint{background:#edf2e7;border-color:#dce5d7;}
.chat-input-bar textarea{background:#f8faf4!important;border-color:#cfdcc7!important;color:#203d32;}
.chat-send-btn{background:#345f4c!important;}
.channel-tab-btn.active,.chip-btn.active{background:#dfead5!important;color:#294635!important;border-color:#cfdcc7!important;}
.chat-header-name,.thread-name,.details-title{color:#294635;}
