/* WorkPro CRM 1.1.0 — TecZen IT responsive SaaS skin.
   Intentionally scoped to CRM roots so WordPress themes/Elementor are not restyled globally. */
#workpro-crm,
#workproLogin,
.wpc-boot-loader{
  --wpc-primary:#fb4d01;
  --wpc-primary-dark:#db3e00;
  --wpc-primary-soft:#fff1e9;
  --wpc-sidebar:#191918;
  --wpc-sidebar-2:#211f1d;
  --wpc-bg:#f7f7f6;
  --wpc-panel:#fff;
  --wpc-panel-soft:#fbfaf9;
  --wpc-text:#242321;
  --wpc-muted:#706e69;
  --wpc-muted-2:#9b9892;
  --wpc-line:#ebe8e5;
  --wpc-line-strong:#ddd8d3;
  --wpc-green:#17865b;
  --wpc-green-soft:#eaf8f2;
  --wpc-amber:#bf7410;
  --wpc-amber-soft:#fff5e5;
  --wpc-red:#c94655;
  --wpc-red-soft:#fff0f2;
  --wpc-blue:#326fd3;
  --wpc-blue-soft:#edf4ff;
  --wpc-radius:14px;
  --wpc-shadow:0 10px 34px rgba(41,34,29,.07);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--wpc-text);
}
.wpc-icon-sprite{position:absolute;width:0;height:0;overflow:hidden}
#workpro-crm .wpc-icon,#workproLogin .wpc-icon,.wpc-boot-loader .wpc-icon{width:18px;height:18px;display:inline-block;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}
#workpro-crm button,#workproLogin button{font:inherit}
#workpro-crm button:focus-visible,#workproLogin button:focus-visible,#workpro-crm input:focus-visible,#workproLogin input:focus-visible,#workpro-crm select:focus-visible,#workpro-crm textarea:focus-visible{outline:3px solid rgba(251,77,1,.22);outline-offset:2px}

/* Bootstrap/auth loader */
.wpc-boot-loader{position:fixed;inset:0;z-index:2147482500;background:rgba(247,247,246,.96);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--wpc-text);backdrop-filter:blur(10px)}
.wpc-boot-loader.is-hidden{display:none}
.wpc-loader-mark,.wpc-brand-mark{display:grid;place-items:center;overflow:hidden;background:var(--wpc-primary);box-shadow:0 10px 26px rgba(251,77,1,.24)}
.wpc-loader-mark{width:58px;height:58px;border-radius:17px}.wpc-brand-mark{width:42px;height:42px;border-radius:12px;flex:0 0 auto}
.wpc-loader-mark img,.wpc-brand-mark img{display:block;width:100%;height:100%;object-fit:cover}
.wpc-loader-spinner{width:28px;height:28px;border:3px solid #eadfd8;border-top-color:var(--wpc-primary);border-radius:50%;animation:wpc-spin .8s linear infinite}
.wpc-boot-loader strong{font-size:12px;color:var(--wpc-muted)}
@keyframes wpc-spin{to{transform:rotate(360deg)}}

/* Login */
#workproLogin.workpro-login-screen{position:fixed;inset:0;z-index:2147482000;background:#fff;padding:0;margin:0;overflow:auto}
#workproLogin .wpc-login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr)}
#workproLogin .wpc-login-art{padding:42px 48px;display:flex;flex-direction:column;position:relative;overflow:hidden;color:#fff;background:radial-gradient(circle at 18% 18%,rgba(251,77,1,.26),transparent 31%),linear-gradient(145deg,#191817 0%,#282420 58%,#171615 100%)}
#workproLogin .wpc-login-art:after{content:"";position:absolute;width:520px;height:520px;border:1px solid rgba(255,255,255,.05);border-radius:50%;right:-180px;top:18%;box-shadow:0 0 0 70px rgba(255,255,255,.018),0 0 0 140px rgba(255,255,255,.011)}
#workproLogin .wpc-login-brand,#workproLogin .wpc-mobile-brand{display:flex;align-items:center;gap:12px;position:relative;z-index:1}
#workproLogin .wpc-login-brand strong,#workproLogin .wpc-mobile-brand strong{display:block;font-size:17px;line-height:1.15}
#workproLogin .wpc-login-brand small,#workproLogin .wpc-mobile-brand small{display:block;margin-top:3px;color:#9c9690;font-size:10px;text-transform:uppercase;letter-spacing:.8px}
#workproLogin .wpc-login-copy{margin:auto 0;position:relative;z-index:1;max-width:620px}
#workproLogin .wpc-eyebrow,#workpro-crm .wpc-eyebrow{display:inline-block;color:var(--wpc-primary);font-size:9px;font-weight:800;letter-spacing:1.25px}
#workproLogin .wpc-login-copy h1{max-width:590px;margin:15px 0 16px;font-size:clamp(38px,4.3vw,60px);line-height:1.02;letter-spacing:-2.4px;color:#fff}
#workproLogin .wpc-login-copy p{max-width:500px;color:#b7b0aa;font-size:14px;line-height:1.7}
#workproLogin .wpc-login-foot{position:relative;z-index:1;color:#78716c;font-size:10px}
#workproLogin .wpc-login-panel{display:flex;align-items:center;justify-content:center;padding:38px;background:#fff}
#workproLogin .login-card{width:min(420px,100%);box-shadow:none;background:transparent;border:0;padding:0;margin:0}
#workproLogin .login-card h2{margin:7px 0 7px;font-size:31px;line-height:1.1;letter-spacing:-1px;color:var(--wpc-text)}
#workproLogin .login-card>p{margin:0 0 24px;color:var(--wpc-muted);font-size:12px}
#workproLogin .role-buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:4px;margin-bottom:20px;background:#f5f3f1;border-radius:12px}
#workproLogin .role-btn{height:38px;padding:0 8px;border:0;border-radius:9px;background:transparent;color:#77726d;font-size:10px;font-weight:750;box-shadow:none;min-width:0}
#workproLogin .role-btn.active{background:#fff;color:var(--wpc-primary);box-shadow:0 5px 14px rgba(39,34,30,.07)}
#workproLogin #workproLoginForm{display:flex;flex-direction:column;gap:15px}
#workproLogin #workproLoginForm>label{font-size:10px;font-weight:750;color:#5e5955}
#workproLogin .wpc-input-icon{height:46px;display:flex;align-items:center;gap:10px;padding:0 12px;margin-top:6px;border:1px solid var(--wpc-line-strong);border-radius:11px;background:#fff;transition:.18s ease}
#workproLogin .wpc-input-icon:focus-within{border-color:rgba(251,77,1,.55);box-shadow:0 0 0 4px rgba(251,77,1,.08)}
#workproLogin .wpc-input-icon .wpc-icon{color:#aaa29b;width:17px;height:17px}
#workproLogin .wpc-input-icon input{width:100%;min-width:0;height:auto;min-height:0;padding:0;border:0;background:transparent;outline:0;box-shadow:none;font-size:12px}
#workproLogin .wpc-login-submit{height:46px;margin-top:3px;border-radius:11px;background:linear-gradient(135deg,var(--wpc-primary),#ff6a27);color:#fff;border:0;font-weight:800;box-shadow:0 10px 22px rgba(251,77,1,.22)}
#workproLogin #loginMsg{min-height:18px;font-size:11px;color:var(--wpc-red)}
#workproLogin .wpc-mobile-brand{display:none;margin-bottom:32px}

/* App shell — scoped, no theme/body takeover */
#workpro-crm.workpro-wrap{position:relative;display:flex;width:100%;max-width:100%;min-height:760px;margin:0;background:var(--wpc-bg);border:1px solid var(--wpc-line);border-radius:18px;overflow:hidden;box-sizing:border-box;isolation:isolate}
#workpro-crm .wpcrm-side{position:relative;display:flex;flex:0 0 264px;flex-direction:column;width:264px;min-height:760px;padding:20px 15px 15px;background:linear-gradient(180deg,var(--wpc-sidebar),#1e1c1a 66%,#171615);color:#d8d3cd;box-sizing:border-box;overflow:hidden}
#workpro-crm .wpcrm-side:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--wpc-primary),#ff7637 67%,transparent)}
#workpro-crm .wpc-sidebar-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 7px 18px}
#workpro-crm .brand{display:flex;align-items:center;gap:11px;min-width:0;margin:0;font-size:inherit}
#workpro-crm .wpc-brand-copy{min-width:0}
#workpro-crm .brand strong{display:block;max-width:158px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#fff;font-size:16px;line-height:1.2;letter-spacing:-.2px}
#workpro-crm .brand small{display:block;margin-top:2px;color:#8f8881;font-size:9px;text-transform:uppercase;letter-spacing:.65px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#workpro-crm .wpc-workspace-card{display:flex;align-items:center;gap:10px;margin:0 1px 21px;padding:11px 12px;background:#242220;border:1px solid #393532;border-radius:13px}
#workpro-crm .wpc-workspace-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border:1px solid rgba(251,77,1,.22);border-radius:9px;background:rgba(251,77,1,.1);color:#ff8751;font-size:10px;font-weight:850}
#workpro-crm .wpc-workspace-card strong,#workpro-crm .wpc-workspace-card small{display:block}
#workpro-crm .wpc-workspace-card strong{color:#eeeae6;font-size:11px}.wpc-workspace-card small{margin-top:2px;color:#827c76;font-size:8px}
#workpro-crm .wpc-nav-label{margin:5px 11px 5px;color:#716b65;font-size:8px;font-weight:800;letter-spacing:1.25px}
#workpro-crm .wpc-nav-label-spaced{margin-top:16px}
#workpro-crm .wpc-nav-list{display:flex;flex-direction:column;gap:4px}
#workpro-crm .nav{display:flex;align-items:center;gap:11px;width:100%;min-width:0;min-height:44px;margin:0;padding:0 12px;border:0;border-radius:10px;background:transparent;color:#aaa49e;font-size:11.5px;font-weight:700;line-height:1;text-align:left;box-shadow:none;transition:.18s ease}
#workpro-crm .nav .wpc-nav-icon{width:18px;height:18px;color:#817b75}
#workpro-crm .nav:hover{background:#272421;color:#fff}
#workpro-crm .nav.active{background:linear-gradient(90deg,rgba(251,77,1,.19),rgba(251,77,1,.045));color:#fff;box-shadow:inset 3px 0 var(--wpc-primary)}
#workpro-crm .nav.active .wpc-nav-icon{color:#ff7a3d}
#workpro-crm .wpc-sidebar-footer{display:flex;align-items:center;gap:9px;margin-top:auto;padding:12px 9px 5px;border-top:1px solid #302e2b}
#workpro-crm .wpc-security-dot{width:7px;height:7px;flex:0 0 auto;border-radius:50%;background:#3ec08a;box-shadow:0 0 0 4px rgba(62,192,138,.09)}
#workpro-crm .wpc-sidebar-footer strong,#workpro-crm .wpc-sidebar-footer small{display:block}.wpc-sidebar-footer strong{color:#ccc6c0;font-size:9px}.wpc-sidebar-footer small{margin-top:2px;color:#716c66;font-size:8px}
#workpro-crm .sidebar-close{position:static;display:none;place-items:center;width:34px;height:34px;min-width:34px;padding:0;border:0;border-radius:9px;background:transparent;color:#fff;box-shadow:none}
#workpro-crm .sidebar-close .wpc-icon{width:17px;height:17px}
#workpro-crm .sidebar-toggle{display:none;place-items:center;position:absolute;left:16px;top:17px;z-index:100;width:38px;height:38px;min-width:38px;padding:0;border:1px solid var(--wpc-line);border-radius:10px;background:#fff;color:#4e4945;box-shadow:0 8px 24px rgba(40,35,31,.1)}

#workpro-crm .wpcrm-main{flex:1;min-width:0;padding:0;background:var(--wpc-bg);overflow:auto}
#workpro-crm .topbar{position:sticky;top:0;z-index:50;min-height:76px;display:flex;align-items:center;gap:18px;margin:0;padding:13px 26px;background:rgba(255,255,255,.95);border-bottom:1px solid var(--wpc-line);backdrop-filter:blur(14px)}
#workpro-crm .wpc-topbar-title{min-width:180px;margin-right:auto}
#workpro-crm .wpc-topbar-title h2{margin:3px 0 0;color:var(--wpc-text);font-size:18px;line-height:1.2;letter-spacing:-.35px}
#workpro-crm .header-calendar{min-width:136px}
#workpro-crm .header-calendar input[type="month"]{height:38px;min-height:38px;padding:0 10px;border:1px solid var(--wpc-line);border-radius:10px;background:var(--wpc-panel-soft);color:#5f5954;font-size:10px;font-weight:750;box-shadow:none}
#workpro-crm .top-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:nowrap}
#workpro-crm .primary,#workpro-crm .wpc-secondary-action,#workpro-crm .logout-btn{min-width:0;height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 13px;border-radius:10px;font-size:10px;font-weight:800;line-height:1;white-space:nowrap;transition:.18s ease}
#workpro-crm .primary{border:1px solid var(--wpc-primary);background:linear-gradient(135deg,var(--wpc-primary),#ff6420);color:#fff;box-shadow:0 8px 18px rgba(251,77,1,.18)}
#workpro-crm .primary:hover{transform:translateY(-1px);background:linear-gradient(135deg,var(--wpc-primary-dark),#f45c1b);color:#fff}
#workpro-crm .wpc-secondary-action,#workpro-crm .logout-btn{border:1px solid var(--wpc-line);background:#fff;color:#5e5853;box-shadow:none}
#workpro-crm .wpc-secondary-action:hover,#workpro-crm .logout-btn:hover{border-color:#ded3cc;background:#fbfaf9;color:var(--wpc-primary)}
#workpro-crm .tab{display:none;padding:25px 26px 40px}
#workpro-crm .tab.active{display:block}
#workpro-crm .wpc-page-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:20px}
#workpro-crm .wpc-page-intro h3{margin:5px 0 4px;font-size:24px;line-height:1.2;letter-spacing:-.65px;color:var(--wpc-text)}
#workpro-crm .wpc-page-intro p{margin:0;color:var(--wpc-muted);font-size:11px}

/* Cards / panels */
#workpro-crm .cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-bottom:17px}
#workpro-crm .card,#workpro-crm .panel,#workpro-crm .table-wrap{border:1px solid var(--wpc-line);border-radius:var(--wpc-radius);background:var(--wpc-panel);box-shadow:0 1px 0 rgba(40,35,31,.015)}
#workpro-crm .wpc-stat-card{min-height:118px;display:flex;align-items:flex-start;gap:13px;padding:16px;box-shadow:none;transition:.18s ease}
#workpro-crm .wpc-stat-card:hover{transform:translateY(-2px);border-color:#e3d9d2;box-shadow:var(--wpc-shadow)}
#workpro-crm .wpc-stat-icon{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:var(--wpc-primary-soft);color:var(--wpc-primary)}
#workpro-crm .wpc-stat-icon.green{background:var(--wpc-green-soft);color:var(--wpc-green)}
#workpro-crm .wpc-stat-icon.amber{background:var(--wpc-amber-soft);color:var(--wpc-amber)}
#workpro-crm .wpc-stat-icon.dark{background:#f0eeec;color:#37332f}
#workpro-crm .wpc-stat-card b{display:block;margin:1px 0 2px;color:var(--wpc-text);font-size:23px;line-height:1.1;letter-spacing:-.6px}
#workpro-crm .wpc-stat-card span:not(.wpc-stat-icon){color:#817b75;font-size:9px}
#workpro-crm .panel{padding:18px;margin-bottom:15px;box-shadow:none}
#workpro-crm .wpc-section-head,#workpro-crm .wpc-settings-head{display:flex;align-items:center;justify-content:space-between;gap:15px}
#workpro-crm .wpc-section-head{margin:19px 0 9px}
#workpro-crm .wpc-section-head h3,#workpro-crm .wpc-settings-head h3{margin:3px 0 0;color:var(--wpc-text);font-size:13px}
#workpro-crm .wpc-settings-head p{margin:3px 0 0;color:var(--wpc-muted-2);font-size:9px}

/* Forms */
#workpro-crm input,#workpro-crm select,#workpro-crm textarea{box-sizing:border-box;width:100%;min-height:42px;padding:9px 11px;border:1px solid var(--wpc-line-strong);border-radius:10px;background:#fff;color:var(--wpc-text);font:inherit;font-size:11px;line-height:1.35;box-shadow:none;transition:.16s ease}
#workpro-crm textarea{min-height:86px;resize:vertical}
#workpro-crm input:focus,#workpro-crm select:focus,#workpro-crm textarea:focus{outline:0;border-color:rgba(251,77,1,.52);box-shadow:0 0 0 3px rgba(251,77,1,.075)}
#workpro-crm label{color:#615b56;font-size:9.5px;font-weight:750}
#workpro-crm .grid{gap:11px}
#workpro-crm .form-actions{display:flex;align-items:center;gap:8px;margin-top:14px}
#workpro-crm .form-actions button:not(.primary),#workpro-crm #resetDashboardColumns,#workpro-crm #resetWorkHistoryColumns{height:36px;min-width:0;padding:0 11px;border:1px solid var(--wpc-line);border-radius:9px;background:#fff;color:#625c57;font-size:9px;font-weight:750;box-shadow:none}

/* Tables */
#workpro-crm .table-wrap{width:100%;max-width:100%;overflow:auto;box-shadow:none}
#workpro-crm table{width:100%;border-collapse:separate;border-spacing:0;background:#fff}
#workpro-crm th{position:sticky;top:0;z-index:2;padding:10px 11px;border-bottom:1px solid var(--wpc-line);background:#fbfaf9;color:#8d8781;font-size:8px;font-weight:850;text-transform:uppercase;letter-spacing:.42px;white-space:nowrap}
#workpro-crm td{padding:11px;border-bottom:1px solid #f0edeb;color:#4c4743;font-size:10px;vertical-align:middle}
#workpro-crm tbody tr:last-child td{border-bottom:0}
#workpro-crm tbody tr:hover td{background:#fdfcfb}
#workpro-crm .main-database-table{min-width:1500px}
#workpro-crm a{color:var(--wpc-primary);font-weight:700;text-decoration:none}
#workpro-crm .badge{border-radius:999px;padding:5px 8px;font-size:8px;font-weight:800}
#workpro-crm .badge.green,#workpro-crm .green{background:var(--wpc-green-soft);color:var(--wpc-green)}
#workpro-crm .badge.yellow,#workpro-crm .yellow{background:var(--wpc-amber-soft);color:var(--wpc-amber)}
#workpro-crm .badge.orange,#workpro-crm .orange{background:#fff0e8;color:#d85717}
#workpro-crm .badge.red,#workpro-crm .red{background:var(--wpc-red-soft);color:var(--wpc-red)}
#workpro-crm .badge.neutral,#workpro-crm .neutral{background:#f1f0ef;color:#756f69}
#workpro-crm .progress{height:6px;min-width:82px;margin:0;background:#eeeae7;border-radius:999px;overflow:hidden}
#workpro-crm .progress span{display:block;height:100%;background:linear-gradient(90deg,var(--wpc-primary),#ff7b3b);border-radius:inherit}
#workpro-crm .members{display:flex;gap:5px;flex-wrap:wrap}
#workpro-crm .member{padding:5px 8px;border:1px solid #efe1d9;border-radius:999px;background:#fff7f2;color:#b8420d;font-size:8px;font-weight:750;cursor:pointer}
#workpro-crm .message-cell{white-space:nowrap}
#workpro-crm .message-cell button{height:29px;min-width:0;margin-right:4px;padding:0 8px;border:1px solid var(--wpc-line);border-radius:8px;background:#fff;color:#655f5a;font-size:8px;font-weight:750}
#workpro-crm .message-cell .msg{border-color:#ffd7c2;background:#fff5ef;color:#d54a0d}
#workpro-crm .icon-action{width:30px;height:30px;min-width:30px;display:inline-grid;place-items:center;padding:0;border:1px solid var(--wpc-line);border-radius:8px;background:#fff;color:#655f5a;box-shadow:none}
#workpro-crm .icon-action .wpc-icon{width:14px;height:14px}
#workpro-crm .edit-icon{border-color:#f0ddd2;background:#fff8f4;color:#db4a09}
#workpro-crm .delete-icon{border-color:#f4dadd;background:#fff6f7;color:var(--wpc-red)}
#workpro-crm .iconbtn{width:30px;height:30px;min-width:30px;padding:0;display:inline-grid;place-items:center;border:1px solid var(--wpc-line);border-radius:8px;background:#fff;box-shadow:none}
#workpro-crm .iconbtn .wpc-icon{width:14px;height:14px}
#workpro-crm .iconbtn.wa{color:#17865b;background:#f0faf5;border-color:#d9f0e5}
#workpro-crm .iconbtn.mail{color:#d94a0b;background:#fff5ef;border-color:#ffe0cf}
#workpro-crm .no-data-cell{padding:30px;color:var(--wpc-muted);text-align:center}

/* Employees / history / calendar */
#workpro-crm #tab-employees>h3,#workpro-crm #tab-work-history h3,#workpro-crm #tab-calendar h3{color:var(--wpc-text)}
#workpro-crm .employee-photo-preview{background:#f8f6f4;border-color:#dfd9d4;color:#968f89}
#workpro-crm .emp-photo{overflow:hidden;background:#f3f0ed;color:#655f59}
#workpro-crm .emp-photo img{width:100%;height:100%;object-fit:cover}
#workpro-crm .warning-policy-box{margin-top:13px;padding:13px 14px;border:1px solid #f2dfb8;border-radius:12px;background:#fffaf0;color:#8c6c32}
#workpro-crm .warning-policy-box h4{margin:0 0 4px;color:#9a6815}.warning-policy-box p{margin:0;font-size:10px}
#workpro-crm .monthly-calendar{overflow:hidden;border:1px solid var(--wpc-line);border-radius:var(--wpc-radius);background:#fff}
#workpro-crm .cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}
#workpro-crm .cal-week{background:#faf9f8;border-bottom:1px solid var(--wpc-line)}
#workpro-crm .cal-week b{padding:10px;color:#938c86;font-size:8px;text-transform:uppercase;letter-spacing:.4px}
#workpro-crm .cal-day{min-height:104px;padding:8px;border-right:1px solid var(--wpc-line);border-bottom:1px solid var(--wpc-line);background:#fff}
#workpro-crm .cal-day:nth-child(7n){border-right:0}.cal-day>strong{font-size:9px}.cal-day>span{display:block;overflow:hidden;margin-top:5px;padding:4px 6px;border-radius:7px;background:var(--wpc-primary-soft);color:#c64a10;font-size:7px;white-space:nowrap;text-overflow:ellipsis}.cal-day>em{font-size:7px;color:#99918b}

/* Messages */
#workpro-crm .wpc-message-panel{padding:0;overflow:hidden}
#workpro-crm .wpc-message-toolbar{display:flex;align-items:center;justify-content:space-between;gap:9px;padding:13px;border-bottom:1px solid var(--wpc-line)}
#workpro-crm .wpc-search-field{height:38px;min-width:260px;max-width:430px;display:flex;align-items:center;gap:8px;flex:1;padding:0 10px;border:1px solid var(--wpc-line);border-radius:10px;background:#fbfaf9;color:#9c958f}
#workpro-crm .wpc-search-field input{height:auto;min-height:0;padding:0;border:0;background:transparent;box-shadow:none;font-size:10px}
#workpro-crm .wpc-message-toolbar select{width:150px;min-height:38px;height:38px}
#workpro-crm .wpc-message-table{min-width:760px}
#workpro-crm .wpc-channel-pill{display:inline-flex;align-items:center;padding:4px 7px;border-radius:999px;background:var(--wpc-primary-soft);color:var(--wpc-primary);font-size:8px;font-weight:800;text-transform:capitalize}
#workpro-crm .wpc-empty-state{display:none;min-height:240px;align-items:center;justify-content:center;flex-direction:column;gap:7px;text-align:center;color:var(--wpc-muted)}
#workpro-crm .wpc-empty-state .wpc-icon{width:28px;height:28px;color:#c3bbb5}.wpc-empty-state strong{font-size:11px}.wpc-empty-state span{max-width:360px;font-size:9px;color:var(--wpc-muted-2)}

/* Settings + editable brand icon */
#workpro-crm .branding-manager-panel,#workpro-crm .account-manager-panel,#workpro-crm .wpc-trash-panel{padding:17px}
#workpro-crm .wpc-brand-preview{display:flex;align-items:center;gap:10px;min-width:210px;padding:9px 11px;border:1px solid var(--wpc-line);border-radius:12px;background:#fbfaf9}
#workpro-crm .wpc-brand-preview .wpc-brand-mark{width:36px;height:36px;border-radius:10px}
#workpro-crm .wpc-brand-preview strong,#workpro-crm .wpc-brand-preview small{display:block}.wpc-brand-preview strong{font-size:10px}.wpc-brand-preview small{margin-top:2px;color:var(--wpc-muted-2);font-size:8px}
#workpro-crm .wpc-branding-form{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
#workpro-crm .wpc-branding-form>label{display:block}.wpc-branding-form>label input{margin-top:6px}
#workpro-crm .wpc-brand-upload-field{grid-column:1/-1}
#workpro-crm .wpc-brand-upload-row{display:flex;align-items:center;gap:8px;margin-top:7px}
#workpro-crm .wpc-brand-upload-field small{display:block;margin-top:6px;color:var(--wpc-muted-2);font-size:8px;font-weight:500}
#workpro-crm .wpc-link-button{height:38px;min-width:0;padding:0 9px;border:0;background:transparent;color:var(--wpc-primary);font-size:9px;font-weight:800}
#workpro-crm .wpc-brand-actions{grid-column:1/-1;display:flex;align-items:center;gap:10px;padding-top:2px}.wpc-brand-actions #brandingMsg{font-size:9px;color:var(--wpc-green)}
#workpro-crm .account-manager-list{display:flex;flex-direction:column;gap:0;margin-top:13px;border:1px solid var(--wpc-line);border-radius:11px;overflow:hidden}
#workpro-crm .account-manager-item{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0;padding:10px 12px;border-bottom:1px solid var(--wpc-line);background:#fff}
#workpro-crm .account-manager-item:last-child{border-bottom:0}.account-manager-item b{font-size:10px}.account-manager-item span{display:flex;gap:5px}
#workpro-crm .trash-list{margin-top:12px}.trash-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:11px 12px;border:1px solid var(--wpc-line);border-radius:10px;background:#fff;margin-bottom:7px}.trash-item small{display:block;margin-top:3px;color:var(--wpc-muted-2);font-size:8px}.trash-actions{display:flex;gap:5px}.trash-actions button{height:31px;min-width:0;padding:0 9px;border-radius:8px;font-size:8px;font-weight:750}.trash-actions .danger{background:var(--wpc-red-soft);border-color:#f4dadd;color:var(--wpc-red)}

/* Modals */
#workpro-crm .modal{position:fixed;inset:0;z-index:2147481000;display:none;align-items:center;justify-content:center;padding:22px;background:rgba(25,22,20,.58);backdrop-filter:blur(3px)}
#workpro-crm .modal.show{display:flex}
#workpro-crm .modal-box{position:relative;width:min(700px,95vw);max-height:92vh;overflow:auto;padding:20px;border:1px solid rgba(255,255,255,.7);border-radius:17px;background:#fff;box-shadow:0 28px 90px rgba(25,22,20,.26)}
#workpro-crm .project-modal-box{width:min(1000px,96vw)}
#workpro-crm .modal-box>h3{margin:0 42px 17px 0;font-size:17px;letter-spacing:-.3px}
#workpro-crm .close{position:absolute;right:14px;top:14px;width:34px;height:34px;min-width:34px;display:grid;place-items:center;padding:0;border:1px solid var(--wpc-line);border-radius:9px;background:#faf9f8;color:#625c57;box-shadow:none;font-size:0}
#workpro-crm .close .wpc-icon{width:15px;height:15px}
#workpro-crm .whatsapp{background:#159b62;color:#fff;border-color:#159b62}.emailbtn{background:var(--wpc-primary);color:#fff;border-color:var(--wpc-primary)}

/* Auth visibility */
#workpro-crm.crm-auth-hidden,#workproLogin.crm-auth-hidden{display:none}.crm-auth-visible{display:flex}
#workpro-crm.crm-auth-visible{display:flex}

/* Tablet */
@media(max-width:1180px){
  #workpro-crm .wpcrm-side{flex-basis:232px;width:232px}
  #workpro-crm .topbar{padding-left:20px;padding-right:20px}
  #workpro-crm .tab{padding-left:20px;padding-right:20px}
  #workpro-crm .top-actions .wpc-secondary-action span,#workpro-crm .logout-btn span{display:none}
  #workpro-crm .top-actions .wpc-secondary-action,#workpro-crm .logout-btn{width:38px;padding:0}
  #workpro-crm .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  #workproLogin .wpc-login-shell{grid-template-columns:1fr}
  #workproLogin .wpc-login-art{display:none}
  #workproLogin .wpc-login-panel{min-height:100vh;padding:28px}
  #workproLogin .wpc-mobile-brand{display:flex}
  #workpro-crm.workpro-wrap{min-height:720px;overflow:visible}
  #workpro-crm .wpcrm-side{position:fixed;left:0;top:0;bottom:0;z-index:2147480500;width:270px;min-height:100vh;transform:translateX(-104%);transition:transform .24s ease;box-shadow:22px 0 65px rgba(25,22,20,.26)}
  #workpro-crm.sidebar-open .wpcrm-side{transform:none}
  #workpro-crm .sidebar-close{display:grid}
  #workpro-crm .sidebar-toggle{display:grid}
  #workpro-crm.sidebar-open .sidebar-toggle{opacity:0;pointer-events:none}
  #workpro-crm .wpcrm-main{width:100%}
  #workpro-crm .topbar{min-height:68px;padding:11px 14px 11px 64px;gap:9px}
  #workpro-crm .wpc-topbar-title{margin-right:auto}.wpc-topbar-title .wpc-eyebrow{display:none}
  #workpro-crm .wpc-topbar-title h2{font-size:15px}
  #workpro-crm .header-calendar{display:none}
  #workpro-crm .tab{padding:18px 14px 30px}
  #workpro-crm .wpc-page-intro h3{font-size:21px}
  #workpro-crm .grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  #workproLogin .wpc-login-panel{padding:23px 18px}
  #workproLogin .login-card h2{font-size:27px}
  #workproLogin .role-buttons{grid-template-columns:1fr 1fr 1fr}
  #workpro-crm .topbar{padding-right:11px}.wpc-topbar-title{display:none}
  #workpro-crm .top-actions{margin-left:auto}.top-actions #addProjectTop span{display:none}.top-actions #addProjectTop{width:38px;padding:0}
  #workpro-crm .tab{padding:15px 11px 26px}
  #workpro-crm .wpc-page-intro{align-items:flex-start;margin-bottom:15px}.wpc-page-intro h3{font-size:19px}
  #workpro-crm .cards{grid-template-columns:1fr 1fr;gap:8px}
  #workpro-crm .wpc-stat-card{min-height:98px;padding:12px;gap:10px}.wpc-stat-card b{font-size:19px}.wpc-stat-icon{width:31px;height:31px}
  #workpro-crm .panel{padding:14px}.wpc-settings-head{align-items:flex-start;flex-direction:column}
  #workpro-crm .grid,#workpro-crm .wpc-branding-form{grid-template-columns:1fr}
  #workpro-crm .wpc-brand-upload-field,#workpro-crm .wpc-brand-actions{grid-column:1}
  #workpro-crm .wpc-brand-preview{width:100%}
  #workpro-crm .wpc-message-toolbar{align-items:stretch;flex-direction:column}.wpc-search-field{max-width:none;min-width:0;width:100%}.wpc-message-toolbar select{width:100%}
  #workpro-crm .modal{align-items:flex-end;padding:0}.modal-box,#workpro-crm .project-modal-box{width:100%;max-width:100%;max-height:94vh;border-radius:18px 18px 0 0;padding:17px}
  #workpro-crm .trash-item{align-items:flex-start;flex-direction:column}.trash-actions{width:100%}.trash-actions button{flex:1}
}
@media(max-width:390px){
  #workproLogin .role-buttons{grid-template-columns:1fr}.role-btn{height:32px}
  #workpro-crm .cards{grid-template-columns:1fr}.wpc-stat-card{min-height:86px}
}
#workpro-crm .wpc-hidden-field{display:none}

#workpro-crm .wpc-pagination{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:12px 14px;border-top:1px solid var(--wpc-line);font-size:12px;color:var(--wpc-muted)}
#workpro-crm .wpc-pagination button{min-height:36px;padding:0 13px;border:1px solid var(--wpc-line);border-radius:10px;background:var(--wpc-surface);color:var(--wpc-text);font-weight:700}
#workpro-crm .wpc-pagination button:hover:not(:disabled){border-color:var(--wpc-primary);color:var(--wpc-primary)}
#workpro-crm .wpc-pagination button:disabled{opacity:.45;cursor:not-allowed}
@media(max-width:640px){#workpro-crm .wpc-pagination{justify-content:space-between}#workpro-crm .wpc-pagination button{min-height:44px}}

/* === v1.1.1 responsive correction pass ====================================
   Fixes Elementor constrained login viewport, tablet/mobile drawer behavior,
   and card-mode tables without relying on legacy saved column widths. */
#workproLogin.workpro-login-screen{
  width:100vw;
  max-width:none;
  min-width:100vw;
  min-height:100vh;
  min-height:100dvh;
  margin:0;
  transform:none;
}
#workproLogin.workpro-login-screen.crm-auth-visible{display:block}
#workproLogin .wpc-login-shell{width:100%;max-width:none;min-height:100vh;min-height:100dvh;margin:0}
#workproLogin .wpc-login-art,#workproLogin .wpc-login-panel{min-width:0}

#workpro-crm .wpc-sidebar-overlay{
  display:none;
  position:fixed;
  inset:0;
  z-index:2147480400;
  width:100%;
  height:100%;
  margin:0;
  padding:0;
  border:0;
  border-radius:0;
  background:rgba(20,18,17,.46);
  box-shadow:none;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease,visibility .22s ease;
}
#workpro-crm .wpc-topbar-title h2{padding-left:0}

@media(max-width:900px){
  body.workpro-mobile-menu-open{overflow:hidden}
  #workpro-crm.workpro-wrap.crm-auth-visible,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    min-height:720px;
    margin:0;
    padding:0;
    border-radius:14px;
    overflow:hidden;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main{
    width:100%;
    max-width:100%;
    min-width:0;
    margin:0;
    padding:0;
    overflow:visible;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side{
    display:flex;
    position:fixed;
    left:0;
    top:0;
    bottom:0;
    width:min(82vw,292px);
    min-width:0;
    min-height:100vh;
    height:100vh;
    margin:0;
    padding:18px 14px 16px;
    overflow-y:auto;
    overflow-x:hidden;
    z-index:2147480600;
    transition:transform .24s ease;
    box-shadow:22px 0 64px rgba(20,18,17,.3);
  }
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{transform:translateX(-105%)}
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side{transform:translateX(0)}
  .admin-bar #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side{top:46px;height:calc(100vh - 46px);min-height:calc(100vh - 46px)}
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpc-sidebar-overlay{
    display:block;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open::before{content:none;display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible .sidebar-close{
    display:grid;
    position:static;
    width:36px;
    height:36px;
    min-width:36px;
    padding:0;
    border:1px solid #373431;
    border-radius:10px;
    background:#252321;
    color:#fff;
    box-shadow:none;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side .brand{margin:0;padding:0;font-size:inherit}
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar{
    display:flex;
    align-items:center;
    flex-wrap:nowrap;
    gap:10px;
    min-height:66px;
    margin:0;
    padding:10px 14px;
    border-radius:0;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar .sidebar-toggle{
    display:grid;
    place-items:center;
    position:static;
    left:auto;
    top:auto;
    flex:0 0 42px;
    width:42px;
    height:42px;
    min-width:42px;
    margin:0;
    padding:0;
    z-index:auto;
    border:1px solid var(--wpc-line);
    border-radius:11px;
    background:#fff;
    color:#4d4843;
    box-shadow:0 5px 16px rgba(40,35,31,.07);
    opacity:1;
    pointer-events:auto;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .topbar .sidebar-toggle{display:grid;opacity:1;pointer-events:auto}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-title{min-width:0;flex:1;margin:0}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-title h2{padding:0;margin:2px 0 0;white-space:normal}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions{
    display:flex;
    align-items:center;
    justify-content:flex-end;
    flex-wrap:nowrap;
    width:auto;
    max-width:none;
    margin:0 0 0 auto;
    padding:0;
    gap:6px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .add-project-fab{
    grid-column:auto;
    width:38px;
    min-width:38px;
    height:38px;
    min-height:38px;
    padding:0;
    border-radius:10px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions button span{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible .tab{width:100%;max-width:100%;padding:18px 14px 30px;overflow:visible}
  #workpro-crm.workpro-wrap.crm-auth-visible .table-wrap{width:100%;max-width:100%}
}

@media(max-width:720px){
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-title{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar{justify-content:space-between;padding:10px 11px}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions{flex:1;justify-content:flex-end}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .add-project-fab{
    width:42px;
    min-width:42px;
    height:42px;
    min-height:42px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .tab{padding:15px 11px 26px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-page-intro{margin-bottom:14px}

  /* All compact CRM data tables become readable cards instead of squeezed columns. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .table-wrap,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-employees .table-wrap,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .table-wrap,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .table-wrap{
    overflow:visible;
    background:transparent;
    border:0;
    box-shadow:none;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tr,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards td{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards{
    min-width:0;
    table-layout:auto;
    border-collapse:separate;
    border-spacing:0;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards thead{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody tr{
    margin:0 0 11px;
    padding:11px 12px;
    overflow:hidden;
    border:1px solid var(--wpc-line);
    border-radius:13px;
    background:#fff;
    box-shadow:0 7px 22px rgba(38,32,28,.055);
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody tr.carry-row{border-left:3px solid var(--wpc-primary)}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td{
    display:flex;
    align-items:flex-start;
    justify-content:flex-start;
    gap:10px;
    width:100%;
    min-width:0;
    max-width:none;
    height:auto;
    min-height:36px;
    max-height:none;
    margin:0;
    padding:8px 0;
    overflow:visible;
    border:0;
    border-bottom:1px solid #f0ece9;
    background:transparent;
    color:var(--wpc-text);
    font-size:12px;
    line-height:1.35;
    white-space:normal;
    text-align:left;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td:last-child{border-bottom:0}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td::before{
    content:attr(data-label);
    display:block;
    flex:0 0 35%;
    width:35%;
    min-width:92px;
    padding-top:2px;
    color:#596d86;
    font-size:10.5px;
    font-weight:800;
    line-height:1.3;
    letter-spacing:.05px;
    white-space:normal;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td[colspan]{display:block;text-align:center;padding:18px 10px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td[colspan]::before{content:none;display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td > *{
    min-width:0;
    max-width:65%;
    margin-left:auto;
    text-align:right;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .clip{
    display:block;
    width:auto;
    max-width:100%;
    overflow:visible;
    white-space:normal;
    text-overflow:clip;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .members{
    width:auto;
    max-width:65%;
    justify-content:flex-end;
    gap:5px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .member{max-width:100%;font-size:10px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell{display:grid;grid-template-columns:minmax(92px,35%) minmax(0,1fr);column-gap:10px;align-items:center}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell::before{grid-column:1;grid-row:1 / span 2;width:auto;min-width:0;margin:0}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell .progress{grid-column:2;width:100%;max-width:100%;margin:1px 0 3px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell .progress-num{grid-column:2;width:100%;max-width:100%;margin:0;text-align:right}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .message-cell,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .action-cell{align-items:center}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .message-cell button,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .action-cell button{margin-left:0;flex:0 0 auto}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .message-cell button:first-of-type,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .action-cell button:first-of-type{margin-left:auto}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .col-resizer{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible .employee-work-history-wrap{max-height:none;overflow:visible}
}

@media(max-width:480px){
  #workproLogin .wpc-login-panel{padding:22px 16px}
  #workproLogin .login-card{width:100%;max-width:390px}
  #workpro-crm.workpro-wrap.crm-auth-visible .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-stat-card{min-height:102px;padding:12px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td::before{flex-basis:38%;width:38%;min-width:88px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td > *{max-width:62%}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell{grid-template-columns:minmax(88px,38%) minmax(0,1fr)}
}

@media(max-width:370px){
  #workpro-crm.workpro-wrap.crm-auth-visible .cards{grid-template-columns:1fr}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions{gap:4px}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .add-project-fab{width:38px;min-width:38px;height:38px;min-height:38px}
}

@media(min-width:901px){
  #workpro-crm.workpro-wrap.crm-auth-visible,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
    display:flex;
    width:100%;
    max-width:100%;
    margin:0;
    padding:0;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side{
    display:flex;
    position:relative;
    left:auto;
    top:auto;
    bottom:auto;
    width:264px;
    flex:0 0 264px;
    min-height:760px;
    height:auto;
    margin:0;
    padding:20px 15px 15px;
    transform:none;
    overflow:hidden;
    box-shadow:none;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main{
    flex:1 1 auto;
    width:auto;
    min-width:0;
    margin:0;
    padding:0;
    overflow:auto;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .topbar .sidebar-toggle{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .topbar .sidebar-toggle{
    display:grid;
    position:static;
    width:40px;
    min-width:40px;
    height:40px;
    padding:0;
    place-items:center;
  }
}


/* === v1.1.2 desktop viewport anchoring fix ================================
   The authenticated CRM is a viewport application. Keep it out of Elementor/
   theme boxed containers and neutralize legacy full-bleed left/negative-margin
   rules that could shift the dashboard to the right on wide desktop screens. */
#workpro-crm.workpro-wrap.crm-auth-visible,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
  position:fixed;
  inset:0;
  left:0;
  right:0;
  top:0;
  bottom:0;
  width:100vw;
  max-width:100vw;
  min-width:0;
  height:100vh;
  height:100dvh;
  min-height:0;
  margin:0;
  padding:0;
  transform:none;
  border:0;
  border-radius:0;
  overflow:hidden;
  box-sizing:border-box;
  z-index:2147480000;
  background:var(--wpc-bg);
}
.admin-bar #workpro-crm.workpro-wrap.crm-auth-visible,
.admin-bar #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
.admin-bar #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
  top:32px;
  bottom:0;
  height:calc(100vh - 32px);
  height:calc(100dvh - 32px);
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side{
  position:relative;
  left:auto;
  top:auto;
  bottom:auto;
  flex:0 0 264px;
  width:264px;
  min-width:264px;
  height:100%;
  min-height:0;
  transform:none;
  z-index:2;
  box-shadow:none;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main{
  position:relative;
  flex:1 1 auto;
  width:auto;
  max-width:none;
  min-width:0;
  height:100%;
  min-height:0;
  margin:0;
  padding:0;
  overflow:auto;
  box-sizing:border-box;
}
#workpro-crm.workpro-wrap.crm-auth-visible .topbar{
  width:100%;
  max-width:100%;
}

@media(max-width:1180px) and (min-width:901px){
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side{
    flex-basis:232px;
    width:232px;
    min-width:232px;
  }
}

@media(max-width:900px){
  .admin-bar #workpro-crm.workpro-wrap.crm-auth-visible,
  .admin-bar #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
  .admin-bar #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
    top:46px;
    height:calc(100vh - 46px);
    height:calc(100dvh - 46px);
  }
  #workpro-crm.workpro-wrap.crm-auth-visible,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
    display:block;
    width:100vw;
    max-width:100vw;
    min-width:0;
    margin:0;
    padding:0;
    border-radius:0;
    overflow:hidden;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main{
    width:100%;
    height:100%;
    min-height:0;
    margin:0;
    padding:0;
    overflow:auto;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side{
    display:flex;
    position:fixed;
    left:0;
    top:0;
    bottom:0;
    width:min(82vw,292px);
    min-width:0;
    height:100vh;
    height:100dvh;
    min-height:0;
    margin:0;
    padding:18px 14px 16px;
    overflow-y:auto;
    overflow-x:hidden;
    z-index:2147480600;
    transition:transform .24s ease;
    box-shadow:22px 0 64px rgba(20,18,17,.3);
  }
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{transform:translateX(-105%)}
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side{transform:translateX(0)}
  .admin-bar #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side{
    top:46px;
    height:calc(100vh - 46px);
    height:calc(100dvh - 46px);
  }
}


/* === v1.1.3 universal off-canvas navigation ===============================
   Keep the CRM navigation hidden by default on desktop, laptop, tablet and
   mobile. The dashboard always owns the full viewport; the sidebar opens as
   an overlay drawer from the topbar menu button. */
body.workpro-menu-open{overflow:hidden}
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main{
  flex:1 1 100%;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  margin:0;
  padding:0;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
  display:flex;
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  z-index:2147480600;
  flex:0 0 auto;
  width:264px;
  min-width:264px;
  height:100%;
  min-height:0;
  margin:0;
  padding:20px 15px 15px;
  overflow-y:auto;
  overflow-x:hidden;
  transform:translateX(-105%);
  transition:transform .24s ease;
  box-shadow:22px 0 64px rgba(20,18,17,.30);
}
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side{transform:translateX(0)}
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{transform:translateX(-105%)}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-sidebar-overlay,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpc-sidebar-overlay{
  display:block;
  position:absolute;
  inset:0;
  z-index:2147480500;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpc-sidebar-overlay{
  display:block;
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
#workpro-crm.workpro-wrap.crm-auth-visible .sidebar-close{
  display:grid;
  position:static;
  place-items:center;
  width:36px;
  height:36px;
  min-width:36px;
  padding:0;
  border:1px solid #373431;
  border-radius:10px;
  background:#252321;
  color:#fff;
  box-shadow:none;
}
#workpro-crm.workpro-wrap.crm-auth-visible .topbar .sidebar-toggle,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .topbar .sidebar-toggle,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .topbar .sidebar-toggle{
  display:grid;
  place-items:center;
  position:static;
  left:auto;
  top:auto;
  flex:0 0 40px;
  width:40px;
  height:40px;
  min-width:40px;
  margin:0;
  padding:0;
  z-index:auto;
  border:1px solid var(--wpc-line);
  border-radius:10px;
  background:#fff;
  color:#4d4843;
  box-shadow:0 5px 16px rgba(40,35,31,.07);
  opacity:1;
  pointer-events:auto;
}
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .topbar .sidebar-toggle{opacity:1;pointer-events:auto}

@media(max-width:1180px){
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
    width:250px;
    min-width:250px;
  }
}
@media(max-width:900px){
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
    position:absolute;
    top:0;
    bottom:0;
    width:min(82vw,292px);
    min-width:0;
    height:100%;
    min-height:0;
    padding:18px 14px 16px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar .sidebar-toggle,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .topbar .sidebar-toggle,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .topbar .sidebar-toggle{
    flex-basis:42px;
    width:42px;
    min-width:42px;
    height:42px;
  }
}

/* === v1.1.4 Elementor editor + live styling ===============================
   Editor preview stays inside Elementor's render tree so live controls and
   rerenders remain visible. Frontend native/shortcode hosts may be detached
   to <body>, but the Elementor widget wrapper is preserved for {{WRAPPER}}
   generated styles. */
body > .workpro-viewport-host{
  position:static;
  width:0;
  min-width:0;
  height:0;
  min-height:0;
  margin:0;
  padding:0;
  border:0;
}
body.workpro-elementor-editor-preview{overflow:auto}
body.workpro-elementor-editor-preview #workproBootLoader.workpro-editor-preview{
  position:absolute;
  inset:0;
  width:100%;
  min-height:620px;
  z-index:50;
  border:1px solid var(--wpc-line);
  border-radius:12px;
}
body.workpro-elementor-editor-preview #workproLogin.workpro-editor-preview{
  position:relative;
  inset:auto;
  width:100%;
  min-width:0;
  max-width:100%;
  min-height:720px;
  height:auto;
  overflow:hidden;
  z-index:1;
  border:1px solid var(--wpc-line);
  border-radius:12px;
}
body.workpro-elementor-editor-preview #workproLogin.workpro-editor-preview .wpc-login-shell{
  min-height:720px;
}
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.crm-auth-visible,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-open,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-collapsed{
  position:relative;
  inset:auto;
  left:auto;
  right:auto;
  top:auto;
  bottom:auto;
  width:100%;
  max-width:100%;
  min-width:0;
  height:min(900px,calc(100vh - 28px));
  min-height:720px;
  margin:0;
  padding:0;
  overflow:hidden;
  z-index:1;
  border:1px solid var(--wpc-line);
  border-radius:12px;
}
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .wpcrm-main{
  height:100%;
  min-height:0;
}
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .wpcrm-side{
  position:absolute;
  top:0;
  bottom:0;
  height:100%;
}
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .modal{
  position:absolute;
}
.wpc-editor-preview-notice{
  position:absolute;
  right:18px;
  bottom:18px;
  z-index:2147481200;
  max-width:min(420px,calc(100% - 36px));
  padding:11px 14px;
  border:1px solid #f3d7c8;
  border-radius:11px;
  background:#fff7f2;
  color:#a94414;
  box-shadow:0 12px 34px rgba(48,38,31,.14);
  font-size:11px;
  font-weight:750;
  opacity:0;
  transform:translateY(8px);
  visibility:hidden;
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;
}
.wpc-editor-preview-notice.show{opacity:1;transform:none;visibility:visible}

@media(max-width:900px){
  body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.crm-auth-visible,
  body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-open,
  body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-collapsed{
    height:min(860px,calc(100vh - 20px));
    min-height:680px;
  }
  body.workpro-elementor-editor-preview #workproLogin.workpro-editor-preview,
  body.workpro-elementor-editor-preview #workproLogin.workpro-editor-preview .wpc-login-shell{
    min-height:680px;
  }
}


/* === v1.1.8 container-native shell + transparent workspace =================
   WorkPro no longer forces a viewport/full-bleed app. The shortcode/native
   Elementor widget remains inside its parent container and inherits the width
   the site owner gives that container. The workspace background is transparent
   by default; cards/panels keep their own surfaces for readability. */
.workpro-instance-shell{
  position:relative;
  width:100%;
  max-width:100%;
  min-width:0;
  margin:0;
  padding:0;
  background:transparent;
  box-sizing:border-box;
}
body > .workpro-viewport-host{
  width:auto;
  height:auto;
  min-width:0;
  min-height:0;
}
body.workpro-menu-open{overflow:auto}

.wpc-boot-loader{
  position:absolute;
  inset:0;
  width:100%;
  min-width:0;
  min-height:420px;
  background:rgba(255,255,255,.78);
  border-radius:inherit;
  backdrop-filter:blur(6px);
}

#workproLogin.workpro-login-screen,
#workproLogin.workpro-login-screen.crm-auth-visible{
  position:relative;
  inset:auto;
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:680px;
  height:auto;
  margin:0;
  padding:0;
  overflow:hidden;
  background:transparent;
  z-index:auto;
}
#workproLogin .wpc-login-shell{
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:680px;
  height:auto;
  margin:0;
}

#workpro-crm.workpro-wrap,
#workpro-crm.workpro-wrap.crm-auth-visible,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed,
.admin-bar #workpro-crm.workpro-wrap.crm-auth-visible,
.admin-bar #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
.admin-bar #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
  position:relative;
  inset:auto;
  left:auto;
  right:auto;
  top:auto;
  bottom:auto;
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  height:auto;
  min-height:0;
  margin:0;
  padding:0;
  transform:none;
  border:0;
  border-radius:0;
  overflow:hidden;
  box-sizing:border-box;
  z-index:auto;
  background:transparent;
}
#workpro-crm .wpcrm-main,
#workpro-crm.crm-auth-visible .wpcrm-main,
#workpro-crm.crm-auth-visible.sidebar-open .wpcrm-main,
#workpro-crm.crm-auth-visible.sidebar-collapsed .wpcrm-main{
  position:relative;
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  height:auto;
  min-height:0;
  margin:0;
  padding:0;
  overflow:visible;
  background:transparent;
  box-sizing:border-box;
}
#workpro-crm .topbar{width:100%;max-width:100%}
#workpro-crm .tab{max-width:100%;box-sizing:border-box}

/* Drawer remains an overlay, but is now constrained to the CRM container. */
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
  display:flex;
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:min(264px,88%);
  min-width:0;
  height:100%;
  min-height:100%;
  margin:0;
  z-index:120;
  transform:translateX(-105%);
}
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side{transform:translateX(0)}
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{transform:translateX(-105%)}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-sidebar-overlay,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpc-sidebar-overlay,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpc-sidebar-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:110;
}

/* Elementor editor gets exactly the same container sizing model. */
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.crm-auth-visible,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-open,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-collapsed{
  position:relative;
  inset:auto;
  width:100%;
  max-width:100%;
  min-width:0;
  height:auto;
  min-height:0;
  background:transparent;
  border:0;
  border-radius:0;
  overflow:hidden;
}
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .wpcrm-main{
  height:auto;
  min-height:0;
  background:transparent;
}
body.workpro-elementor-editor-preview #workproLogin.workpro-editor-preview,
body.workpro-elementor-editor-preview #workproLogin.workpro-editor-preview .wpc-login-shell{
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:680px;
  height:auto;
  background:transparent;
}

@media(max-width:900px){
  #workproLogin.workpro-login-screen,
  #workproLogin .wpc-login-shell{min-height:620px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
    width:min(292px,88%);
    height:100%;
    min-height:100%;
  }
}

/* === v1.1.9 Elementor non-blocking editor preview =========================
   Elementor can temporarily keep an old widget DOM while mounting the new one.
   Never let the auth/bootstrap overlay block the editor canvas. Frontend keeps
   the normal secure loader; this rule applies only inside Elementor edit mode. */
body.workpro-elementor-editor-preview #workproBootLoader.workpro-editor-preview,
body.elementor-editor-active #workproBootLoader.workpro-editor-preview,
body.elementor-editor-preview #workproBootLoader.workpro-editor-preview{
  display:none;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
}
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview{
  background:transparent;
}


/* === v1.1.10 clean shadow-free navigation edge ============================
   The off-canvas sidebar must not cast a visible shadow while hidden or open.
   This prevents the faded vertical strip beside the menu in contained layouts. */
#workpro-crm .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
  box-shadow:none;
}

/* === v1.1.12 contained 100% height ========================================
   WorkPro CRM must fill the height supplied by its page/Elementor container
   without taking over the viewport. The parent remains in control of sizing. */
#workpro-crm.workpro-wrap,
#workpro-crm.workpro-wrap.crm-auth-visible,
#workpro-crm.workpro-wrap.sidebar-open,
#workpro-crm.workpro-wrap.sidebar-collapsed{
  height:100%;
  min-height:100%;
  align-self:stretch;
}
#workpro-crm .wpcrm-main{
  height:100%;
  min-height:100%;
  align-self:stretch;
}
#workpro-crm .tab.active{
  min-height:100%;
}
/* Native Elementor widget: inherit the parent container height instead of
   introducing a fixed viewport height. */
.elementor-widget-workpro_crm_app,
.elementor-widget-workpro_crm_app > .elementor-widget-container{
  height:100%;
  min-height:100%;
  align-self:stretch;
}
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.crm-auth-visible,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-open,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-collapsed,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .wpcrm-main{
  height:100%;
  min-height:100%;
  align-self:stretch;
}


/* === v1.1.13 full-height contained CRM =====================================
   Width remains fully controlled by the shortcode/Elementor container.
   Vertically, the CRM always fills the available screen/canvas height and
   can grow beyond it when its content is taller. This avoids the dashboard
   ending halfway down the Elementor canvas while keeping the workspace
   contained horizontally. */
.workpro-instance-shell{
  min-height:100vh;
  min-height:100dvh;
  height:100%;
  display:flex;
  flex-direction:column;
}
#workpro-crm.workpro-wrap,
#workpro-crm.workpro-wrap.crm-auth-visible,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
  min-height:100vh;
  min-height:100dvh;
  height:100%;
  display:flex;
  flex-direction:column;
}
#workpro-crm .wpcrm-main,
#workpro-crm.crm-auth-visible .wpcrm-main,
#workpro-crm.crm-auth-visible.sidebar-open .wpcrm-main,
#workpro-crm.crm-auth-visible.sidebar-collapsed .wpcrm-main{
  min-height:100vh;
  min-height:100dvh;
  height:100%;
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
}
#workpro-crm .tab.active{
  flex:1 1 auto;
}
.elementor-widget-workpro_crm_app,
.elementor-widget-workpro_crm_app > .elementor-widget-container,
.workpro-crm-height-host,
.workpro-crm-height-host > .elementor-widget-container{
  min-height:100%;
  height:100%;
  align-self:stretch;
}
body.workpro-elementor-editor-preview .workpro-instance-shell,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.crm-auth-visible,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-open,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-collapsed,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .wpcrm-main{
  min-height:100vh;
  min-height:100dvh;
  height:100%;
}

/* === v1.1.14 Elementor flex-height chain fix ===============================
   Elementor containers commonly use min-height + flexbox instead of a fixed
   height. Percentage/vh heights therefore stop at the CRM's natural content
   height. Grow the actual widget host through the full Elementor flex chain,
   then let the CRM root and drawer stretch to that computed height. Width is
   still owned entirely by Elementor/the shortcode container. */
.workpro-crm-height-host{
  display:flex;
  flex:1 1 auto;
  align-self:stretch;
  width:auto;
  max-width:100%;
  min-height:0;
  height:auto;
}
.workpro-crm-height-host > .elementor-widget-container{
  display:flex;
  flex:1 1 auto;
  align-self:stretch;
  width:100%;
  min-width:0;
  min-height:0;
  height:auto;
}
.workpro-crm-height-host .workpro-instance-shell,
.elementor-widget-workpro_crm_app .workpro-instance-shell{
  display:flex;
  flex:1 1 auto;
  align-self:stretch;
  width:100%;
  min-width:0;
  min-height:0;
  height:auto;
}
.workpro-crm-height-host #workpro-crm.workpro-wrap,
.workpro-crm-height-host #workpro-crm.workpro-wrap.crm-auth-visible,
.workpro-crm-height-host #workpro-crm.workpro-wrap.sidebar-open,
.workpro-crm-height-host #workpro-crm.workpro-wrap.sidebar-collapsed,
.elementor-widget-workpro_crm_app #workpro-crm.workpro-wrap{
  display:flex;
  flex:1 1 auto;
  align-self:stretch;
  width:100%;
  min-width:0;
  min-height:0;
  height:auto;
}
.workpro-crm-height-host #workpro-crm .wpcrm-main,
.elementor-widget-workpro_crm_app #workpro-crm .wpcrm-main{
  display:flex;
  flex:1 1 auto;
  align-self:stretch;
  flex-direction:column;
  min-height:0;
  height:auto;
}
.workpro-crm-height-host #workpro-crm .wpcrm-side,
.elementor-widget-workpro_crm_app #workpro-crm .wpcrm-side{
  top:0;
  bottom:0;
  height:auto;
  min-height:0;
}
.workpro-crm-height-host #workpro-crm .wpc-sidebar-overlay,
.elementor-widget-workpro_crm_app #workpro-crm .wpc-sidebar-overlay{
  top:0;
  bottom:0;
  height:auto;
}
body.workpro-elementor-editor-preview .workpro-crm-height-host,
body.workpro-elementor-editor-preview .workpro-crm-height-host > .elementor-widget-container,
body.workpro-elementor-editor-preview .workpro-crm-height-host .workpro-instance-shell,
body.workpro-elementor-editor-preview .workpro-crm-height-host #workpro-crm.workpro-wrap,
body.workpro-elementor-editor-preview .workpro-crm-height-host #workpro-crm .wpcrm-main{
  flex:1 1 auto;
  align-self:stretch;
  min-height:0;
  height:auto;
}

/* === v1.1.15 authoritative full-height contained workspace =================
   v1.1.14 accidentally ended with min-height:0 on the Elementor host/root,
   which overrode the earlier full-height rules and let the CRM collapse to
   content height. Keep width 100% of the parent (never 100vw), but guarantee
   that the workspace, main area and off-canvas drawer fill the available
   browser/editor canvas vertically. Content may grow beyond this minimum. */
.workpro-crm-height-host,
.elementor-widget-workpro_crm_app,
.workpro-crm-height-host > .elementor-widget-container,
.elementor-widget-workpro_crm_app > .elementor-widget-container,
.workpro-crm-height-host .workpro-instance-shell,
.elementor-widget-workpro_crm_app .workpro-instance-shell,
.workpro-instance-shell{
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:100vh;
  min-height:100dvh;
  height:auto;
  align-self:stretch;
  box-sizing:border-box;
}

.workpro-crm-height-host #workpro-crm.workpro-wrap,
.workpro-crm-height-host #workpro-crm.workpro-wrap.crm-auth-visible,
.workpro-crm-height-host #workpro-crm.workpro-wrap.sidebar-open,
.workpro-crm-height-host #workpro-crm.workpro-wrap.sidebar-collapsed,
.elementor-widget-workpro_crm_app #workpro-crm.workpro-wrap,
#workpro-crm.workpro-wrap.crm-auth-visible{
  position:relative;
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:100vh;
  min-height:100dvh;
  height:auto;
  margin:0;
  box-sizing:border-box;
  overflow:hidden;
}

#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main,
.workpro-crm-height-host #workpro-crm .wpcrm-main,
.elementor-widget-workpro_crm_app #workpro-crm .wpcrm-main{
  width:100%;
  min-width:0;
  min-height:100vh;
  min-height:100dvh;
  height:auto;
  align-self:stretch;
  box-sizing:border-box;
}

/* Drawer is absolutely positioned inside the contained CRM. Top + bottom is
   the reliable way to match the root's final min-height, even when the parent
   Elementor container itself only supplies min-height instead of height. */
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
  top:0;
  bottom:0;
  height:auto;
  min-height:100%;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-sidebar-overlay,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpc-sidebar-overlay,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpc-sidebar-overlay{
  top:0;
  bottom:0;
  height:auto;
  min-height:100%;
}

/* WordPress admin-bar frontend: fill the visible viewport, not 32/46px beyond
   it. Elementor editor preview is excluded because its iframe has its own
   canvas viewport. */
body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-instance-shell,
body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-crm-height-host,
body.admin-bar:not(.workpro-elementor-editor-preview) #workpro-crm.workpro-wrap.crm-auth-visible{
  min-height:calc(100vh - 32px);
  min-height:calc(100dvh - 32px);
}
body.admin-bar:not(.workpro-elementor-editor-preview) #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main{
  min-height:calc(100vh - 32px);
  min-height:calc(100dvh - 32px);
}

body.workpro-elementor-editor-preview .workpro-crm-height-host,
body.workpro-elementor-editor-preview .workpro-crm-height-host > .elementor-widget-container,
body.workpro-elementor-editor-preview .workpro-instance-shell,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.crm-auth-visible,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .wpcrm-main{
  min-height:100vh;
  min-height:100dvh;
  height:auto;
}

@media(max-width:782px){
  body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-instance-shell,
  body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-crm-height-host,
  body.admin-bar:not(.workpro-elementor-editor-preview) #workpro-crm.workpro-wrap.crm-auth-visible,
  body.admin-bar:not(.workpro-elementor-editor-preview) #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main{
    min-height:calc(100vh - 46px);
    min-height:calc(100dvh - 46px);
  }
}

/* === v1.1.16 fixed app viewport + internal database scrolling ==============
   The CRM is a contained-width application, but its height is the available
   browser/editor canvas. The WordPress/theme page never scrolls while WorkPro
   is active. Main content stays visible when the off-canvas navigation opens;
   only CRM-internal areas scroll. */
html.workpro-crm-scroll-locked,
html.workpro-crm-scroll-locked body,
body.workpro-crm-scroll-locked{
  height:100%;
  max-height:100%;
  overflow:hidden;
  overscroll-behavior:none;
}

.workpro-instance-shell,
.workpro-crm-height-host,
.workpro-crm-height-host > .elementor-widget-container,
.elementor-widget-workpro_crm_app,
.elementor-widget-workpro_crm_app > .elementor-widget-container{
  width:100%;
  max-width:100%;
  min-width:0;
  height:100vh;
  height:100dvh;
  min-height:100vh;
  min-height:100dvh;
  max-height:100vh;
  max-height:100dvh;
  overflow:hidden;
  box-sizing:border-box;
}

#workpro-crm.workpro-wrap.crm-auth-visible,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.crm-auth-visible,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-open,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview.sidebar-collapsed{
  position:relative;
  inset:auto;
  display:flex;
  width:100%;
  max-width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  max-height:100%;
  margin:0;
  overflow:hidden;
  border-radius:inherit;
  background:transparent;
}

#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main,
body.workpro-elementor-editor-preview #workpro-crm.workpro-editor-preview .wpcrm-main{
  position:relative;
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  width:100%;
  min-width:0;
  height:100%;
  min-height:0;
  max-height:100%;
  overflow:hidden;
  background:transparent;
}

#workpro-crm.workpro-wrap.crm-auth-visible .topbar{
  position:relative;
  top:auto;
  flex:0 0 auto;
  width:100%;
}

#workpro-crm.workpro-wrap.crm-auth-visible .tab{
  min-width:0;
  min-height:0;
  max-width:100%;
}
#workpro-crm.workpro-wrap.crm-auth-visible .tab.active{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
}

/* Dashboard keeps the overview/cards fixed while the database itself owns the
   remaining height and scrolling. Horizontal and vertical scrollbars both
   live inside .table-wrap, never on the page. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard.tab.active{
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-page-intro,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .cards,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .table-title-row{
  flex:0 0 auto;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard > .table-wrap{
  flex:1 1 auto;
  min-height:120px;
  max-height:none;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  background:var(--wpc-panel);
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard > .table-wrap > table{
  margin:0;
}

/* Other data-heavy screens scroll inside the CRM canvas, never the document. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-employees.tab.active,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history.tab.active,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-calendar.tab.active,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports.tab.active,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-settings.tab.active{
  overflow:auto;
  overscroll-behavior:contain;
}

/* Navigation is a true overlay drawer. Opening it never changes main width or
   height. Keep the outside click target, but make it visually transparent so
   the database remains fully visible instead of being greyed/hidden. */
#workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
  position:absolute;
  top:0;
  bottom:0;
  left:0;
  height:100%;
  min-height:0;
  max-height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  box-shadow:none;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-sidebar-overlay,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpc-sidebar-overlay,
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpc-sidebar-overlay{
  position:absolute;
  inset:0;
  background:transparent;
  box-shadow:none;
}
#workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main{
  width:100%;
  max-width:100%;
  min-width:0;
  transform:none;
  filter:none;
  opacity:1;
}

/* WordPress admin bar occupies real viewport height on frontend. Elementor's
   iframe has its own viewport and therefore uses the normal 100dvh rule. */
body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-instance-shell,
body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-crm-height-host,
body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-crm-height-host > .elementor-widget-container,
body.admin-bar:not(.workpro-elementor-editor-preview) .elementor-widget-workpro_crm_app,
body.admin-bar:not(.workpro-elementor-editor-preview) .elementor-widget-workpro_crm_app > .elementor-widget-container{
  height:calc(100vh - 32px);
  height:calc(100dvh - 32px);
  min-height:calc(100vh - 32px);
  min-height:calc(100dvh - 32px);
  max-height:calc(100vh - 32px);
  max-height:calc(100dvh - 32px);
}
@media(max-width:782px){
  body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-instance-shell,
  body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-crm-height-host,
  body.admin-bar:not(.workpro-elementor-editor-preview) .workpro-crm-height-host > .elementor-widget-container,
  body.admin-bar:not(.workpro-elementor-editor-preview) .elementor-widget-workpro_crm_app,
  body.admin-bar:not(.workpro-elementor-editor-preview) .elementor-widget-workpro_crm_app > .elementor-widget-container{
    height:calc(100vh - 46px);
    height:calc(100dvh - 46px);
    min-height:calc(100vh - 46px);
    min-height:calc(100dvh - 46px);
    max-height:calc(100vh - 46px);
    max-height:calc(100dvh - 46px);
  }
}

/* === v1.1.17 mobile hardening ============================================
   Dedicated phone/tablet overrides. The goal is a true mobile-first CRM:
   - login screen remains isolated from the app
   - sidebar is a clean off-canvas drawer
   - topbar actions stay inside the viewport
   - data tables become readable stacked cards (label on top, value below)
   - forms/panels/cards use single-column spacing on small screens */
#workproLogin.crm-auth-hidden,
#workpro-crm.crm-auth-hidden{display:none}

@media (max-width: 767px){
  .workpro-instance-shell,
  .workpro-crm-height-host,
  .workpro-crm-height-host > .elementor-widget-container,
  .elementor-widget-workpro_crm_app,
  .elementor-widget-workpro_crm_app > .elementor-widget-container{
    height:100dvh;
    min-height:100dvh;
    max-height:100dvh;
    overflow:hidden;
  }

  #workproLogin.workpro-login-screen{
    position:fixed;
    inset:0;
    width:100%;
    height:100dvh;
    min-height:100dvh;
    overflow:auto;
    overscroll-behavior:contain;
    background:#fff;
    z-index:2147483000;
  }
  #workproLogin .wpc-login-shell{display:block;min-height:100dvh}
  #workproLogin .wpc-login-art{display:none}
  #workproLogin .wpc-login-panel{display:flex;align-items:flex-start;justify-content:center;padding:28px 18px 36px}
  #workproLogin .login-card{width:100%;max-width:100%}
  #workproLogin .wpc-mobile-brand{display:flex}
  #workproLogin .role-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  #workproLogin .role-btn{min-width:0}
  #workproLogin label{display:block}
  #workproLogin .wpc-input-icon{width:100%}
  #workproLogin .primary.wpc-login-submit{width:100%;min-height:52px}

  #workpro-crm.workpro-wrap.crm-auth-visible,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed{
    display:flex;
    flex-direction:column;
    width:100%;
    min-width:0;
    height:100dvh;
    min-height:100dvh;
    max-height:100dvh;
    border-radius:0;
    overflow:hidden;
    background:#f7f5f3;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-main,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-main{
    display:flex;
    flex-direction:column;
    flex:1 1 auto;
    min-height:0;
    width:100%;
    overflow:hidden;
    background:#f7f5f3;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
    position:fixed;
    left:0;
    top:0;
    bottom:0;
    width:min(86vw,320px);
    min-width:0;
    max-width:320px;
    height:100dvh;
    min-height:100dvh;
    padding:18px 14px 14px;
    z-index:2147483100;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-sidebar-overlay,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpc-sidebar-overlay{
    position:fixed;
    inset:0;
    z-index:2147483050;
    background:rgba(17,16,15,.26);
  }

  #workpro-crm.workpro-wrap.crm-auth-visible .topbar{
    display:grid;
    grid-template-columns:44px 1fr;
    align-items:center;
    gap:10px;
    padding:12px 12px 10px;
    background:#f7f5f3;
    border-bottom:1px solid var(--wpc-line);
    flex:0 0 auto;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar .sidebar-toggle{
    grid-column:1;
    grid-row:1;
    position:relative;
    left:auto;top:auto;
    width:44px;height:44px;min-width:44px;
    margin:0;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-title,
  #workpro-crm.workpro-wrap.crm-auth-visible .header-calendar{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions{
    grid-column:2;
    grid-row:1;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    flex-wrap:nowrap;
    gap:8px;
    min-width:0;
    overflow-x:auto;
    overflow-y:hidden;
    padding-bottom:2px;
    -webkit-overflow-scrolling:touch;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .add-project-fab{
    flex:0 0 44px;
    width:44px;height:44px;min-width:44px;min-height:44px;
    padding:0;
    border-radius:12px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions button span{display:none}

  #workpro-crm.workpro-wrap.crm-auth-visible .tab{
    flex:1 1 auto;
    min-height:0;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
    padding:16px 12px 24px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-page-intro{margin-bottom:14px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-page-intro h3,
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-page-intro h2{font-size:18px;line-height:1.2}

  #workpro-crm.workpro-wrap.crm-auth-visible .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-stat-card{min-height:96px;padding:14px;gap:10px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-stat-card b{font-size:20px}

  #workpro-crm.workpro-wrap.crm-auth-visible .table-title-row{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    flex-wrap:wrap;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .table-title-row h3{margin:0;font-size:16px}
  #workpro-crm.workpro-wrap.crm-auth-visible .table-title-row button{margin-left:auto}
  #workpro-crm.workpro-wrap.crm-auth-visible .table-wrap{
    width:100%;
    max-width:100%;
    overflow:visible;
    border:0;
    background:transparent;
    box-shadow:none;
  }

  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards thead,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tr,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards th,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards td{
    display:block;
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards thead{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards{
    min-width:0;
    border-collapse:separate;
    border-spacing:0;
    background:transparent;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody tr{
    margin:0 0 12px;
    padding:12px;
    border:1px solid var(--wpc-line);
    border-radius:16px;
    background:#fff;
    box-shadow:0 8px 22px rgba(32,28,24,.05);
    overflow:hidden;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td{
    display:block;
    margin:0;
    padding:8px 0 10px;
    min-height:0;
    border:0;
    border-bottom:1px solid #efebe8;
    background:transparent;
    color:var(--wpc-text);
    font-size:14px;
    line-height:1.4;
    text-align:left;
    white-space:normal;
    overflow-wrap:anywhere;
    word-break:break-word;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td:last-child{border-bottom:0;padding-bottom:0}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td::before{
    content:attr(data-label);
    display:block;
    width:100%;
    min-width:0;
    margin:0 0 4px;
    color:#62748a;
    font-size:11px;
    font-weight:800;
    letter-spacing:.02em;
    line-height:1.3;
    white-space:normal;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td > *{
    display:block;
    width:auto;
    max-width:100%;
    margin:0;
    text-align:left;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td[colspan]{text-align:center;padding:16px 10px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards tbody td[colspan]::before{content:none}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .members,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .member{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    max-width:100%;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .clip{white-space:normal;overflow:visible;text-overflow:clip}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell{
    display:block;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell::before{margin-bottom:8px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell .progress{width:100%;max-width:100%;margin:0 0 6px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .progress-cell .progress-num{text-align:left}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .message-cell,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .action-cell{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .message-cell::before,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .action-cell::before{width:100%;margin-bottom:2px}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .message-cell > *,
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards .action-cell > *{margin:0;text-align:center}
  #workpro-crm.workpro-wrap.crm-auth-visible table.wpc-responsive-cards button{min-height:40px}

  #workpro-crm.workpro-wrap.crm-auth-visible .grid,
  #workpro-crm.workpro-wrap.crm-auth-visible .two-grid,
  #workpro-crm.workpro-wrap.crm-auth-visible .form-grid,
  #workpro-crm.workpro-wrap.crm-auth-visible .employee-edit-grid{grid-template-columns:1fr}
  #workpro-crm.workpro-wrap.crm-auth-visible .panel,
  #workpro-crm.workpro-wrap.crm-auth-visible .card,
  #workpro-crm.workpro-wrap.crm-auth-visible .modal-box{padding:16px}
  #workpro-crm.workpro-wrap.crm-auth-visible input,
  #workpro-crm.workpro-wrap.crm-auth-visible select,
  #workpro-crm.workpro-wrap.crm-auth-visible textarea,
  #workpro-crm.workpro-wrap.crm-auth-visible .employee-picker,
  #workpro-crm.workpro-wrap.crm-auth-visible #employeePickerBtn{max-width:100%}
  #workpro-crm.workpro-wrap.crm-auth-visible .form-actions{display:flex;flex-wrap:wrap;gap:10px}
  #workpro-crm.workpro-wrap.crm-auth-visible .form-actions > button,
  #workpro-crm.workpro-wrap.crm-auth-visible .form-actions > .primary{flex:1 1 auto}
}

@media (max-width: 420px){
  #workpro-crm.workpro-wrap.crm-auth-visible .cards{grid-template-columns:1fr}
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar{grid-template-columns:42px 1fr;gap:8px;padding:10px}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions{gap:6px}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .add-project-fab{flex-basis:42px;width:42px;height:42px;min-width:42px;min-height:42px}
  #workpro-crm.workpro-wrap.crm-auth-visible .tab{padding:14px 10px 22px}
}

/* === v1.1.18 approved mobile database redesign ============================
   Phone layouts use purpose-built cards instead of collapsing desktop table
   cells. Desktop/tablet tables remain unchanged. The visual direction follows
   the approved TecZen mobile dashboard mockup. */
#workpro-crm .wpc-mobile-data-list,
#workpro-crm .wpc-mobile-section-title{display:none}

@media (max-width:767px){
  /* Preserve the fixed app canvas. Only CRM-internal panes scroll. */
  html.workpro-crm-scroll-locked,
  html.workpro-crm-scroll-locked body,
  body.workpro-crm-scroll-locked{overflow:hidden}
  #workpro-crm.workpro-wrap.crm-auth-visible{background:#f8f7f5}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-main{background:#f8f7f5}
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar{
    min-height:70px;
    padding:12px 14px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid #ebe7e3;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar .sidebar-toggle,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions .add-project-fab{
    width:48px;height:48px;min-width:48px;min-height:48px;border-radius:13px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions{gap:9px;overflow:visible}
  #workpro-crm.workpro-wrap.crm-auth-visible .tab{padding:20px 14px 24px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-page-intro{margin-bottom:18px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-page-intro h3,
  #workpro-crm.workpro-wrap.crm-auth-visible .work-history-head h3,
  #workpro-crm.workpro-wrap.crm-auth-visible .calendar-head h3{font-size:24px;line-height:1.15;letter-spacing:-.45px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-page-intro p,
  #workpro-crm.workpro-wrap.crm-auth-visible .work-history-head p,
  #workpro-crm.workpro-wrap.crm-auth-visible .calendar-head p{font-size:13px;line-height:1.5}

  /* KPI cards: readable two-column mobile dashboard. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .cards{
    grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:22px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card{
    min-height:118px;padding:16px;gap:12px;border-radius:18px;background:#fff;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-icon{width:42px;height:42px;border-radius:12px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-icon svg{width:20px;height:20px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card b{font-size:25px;line-height:1.05;letter-spacing:-.55px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card span:not(.wpc-stat-icon){font-size:11px}
  #workpro-crm.workpro-wrap.crm-auth-visible .table-title-row{margin:0 0 12px}
  #workpro-crm.workpro-wrap.crm-auth-visible .table-title-row h3{font-size:20px;line-height:1.2}
  #workpro-crm.workpro-wrap.crm-auth-visible #resetDashboardColumns,
  #workpro-crm.workpro-wrap.crm-auth-visible #resetWorkHistoryColumns{display:none}

  /* Never stack desktop rows on phones. Dedicated card renderers own mobile. */
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-desktop-data{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-mobile-data-list{display:flex;flex-direction:column;gap:12px;min-width:0}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-mobile-section-title{display:block;margin:18px 0 10px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-mobile-section-title h3{margin:3px 0 0;font-size:21px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-mobile-empty-card{padding:28px 18px;border:1px dashed #ded8d3;border-radius:16px;background:#fff;text-align:center;color:#887f78}

  /* Dashboard project database owns the remaining scrollable height. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard.tab.active{display:flex;flex-direction:column;overflow:hidden}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-page-intro,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .cards,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .table-title-row{flex:0 0 auto}
  #workpro-crm.workpro-wrap.crm-auth-visible #projectMobileCards{
    flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;padding:1px 2px 14px;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;
  }

  /* Approved Project Card */
  #workpro-crm .wpc-project-card{
    flex:0 0 auto;min-width:0;padding:16px;border:1px solid #e7e2de;border-radius:18px;background:#fff;box-shadow:0 7px 22px rgba(35,31,28,.055)
  }
  #workpro-crm .wpc-project-card.is-carry{border-color:#ead9ff}
  #workpro-crm .wpc-project-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
  #workpro-crm .wpc-project-identity{display:flex;align-items:center;gap:11px;min-width:0;flex:1}
  #workpro-crm .wpc-project-avatar{display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:50%;background:#eaf2ff;color:#2f6dca;font-size:17px;font-weight:850}
  #workpro-crm .wpc-project-identity>div{min-width:0}
  #workpro-crm .wpc-project-title-line{display:flex;align-items:center;gap:7px;min-width:0;flex-wrap:wrap}
  #workpro-crm .wpc-project-title-line h4{min-width:0;margin:0;color:#211f1d;font-size:17px;line-height:1.2;letter-spacing:-.25px;overflow-wrap:anywhere}
  #workpro-crm .wpc-project-identity p{margin:4px 0 0;color:#817a74;font-size:11px;line-height:1.3}
  #workpro-crm .wpc-project-identity p b{color:#5b554f;font-weight:750}
  #workpro-crm .wpc-mobile-status{display:inline-flex;align-items:center;gap:5px;min-height:24px;padding:0 9px;border-radius:999px;background:#f2f0ee;color:#6b655f;font-size:9px;font-weight:800;white-space:nowrap}
  #workpro-crm .wpc-mobile-status.success{background:#e9f8f1;color:#168658}
  #workpro-crm .wpc-mobile-status.info{background:#edf4ff;color:#376fc0}
  #workpro-crm .wpc-mobile-status.warning{background:#fff4e5;color:#bd7210}
  #workpro-crm .wpc-mobile-status.danger{background:#fff0f1;color:#c74958}
  #workpro-crm .wpc-mobile-status.carry{background:#f4edff;color:#754db2}
  #workpro-crm .wpc-project-deadline{display:flex;align-items:flex-end;gap:5px;flex-direction:column;flex:0 0 auto;color:#625c56;font-size:10px;text-align:right}
  #workpro-crm .wpc-project-deadline .wpc-icon{width:15px;height:15px;align-self:flex-end}
  #workpro-crm .wpc-deadline-pill{display:inline-flex;align-items:center;min-height:25px;padding:0 9px;border-radius:999px;background:#e9f8f1;color:#168658;font-size:9px;white-space:nowrap}
  #workpro-crm .wpc-deadline-pill.red,#workpro-crm .wpc-deadline-pill.late{background:#fff0f1;color:#c74958}
  #workpro-crm .wpc-deadline-pill.orange,#workpro-crm .wpc-deadline-pill.yellow{background:#fff4e5;color:#bd7210}
  #workpro-crm .wpc-project-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border:1px solid #eee9e5;border-radius:13px;overflow:hidden;background:#fdfcfb}
  #workpro-crm .wpc-project-metrics>div{min-width:0;padding:10px 12px;border-right:1px solid #eee9e5;border-bottom:1px solid #eee9e5}
  #workpro-crm .wpc-project-metrics>div:nth-child(2n){border-right:0}
  #workpro-crm .wpc-project-metrics>div:nth-last-child(-n+2){border-bottom:0}
  #workpro-crm .wpc-project-metrics span,#workpro-crm .wpc-project-card-link>span,#workpro-crm .wpc-progress-meta span{display:block;margin-bottom:4px;color:#8a837d;font-size:9px;font-weight:650}
  #workpro-crm .wpc-project-metrics b{display:block;min-width:0;color:#2e2a27;font-size:12px;line-height:1.3;overflow-wrap:anywhere}
  #workpro-crm .wpc-mobile-members{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
  #workpro-crm .wpc-mobile-member{display:grid;place-items:center;width:28px;height:28px;padding:0;border:1px solid #ffd6bf;border-radius:999px;background:#fff5ef;color:#d85318;font-size:9px;font-weight:850}
  #workpro-crm .wpc-mobile-muted{color:#aaa29b;font-weight:600}
  #workpro-crm .wpc-project-links{display:grid;grid-template-columns:1fr 1fr;margin-top:10px;border:1px solid #eee9e5;border-radius:13px;overflow:hidden;background:#fff}
  #workpro-crm .wpc-project-card-link{min-width:0;padding:10px 12px;border-right:1px solid #eee9e5}
  #workpro-crm .wpc-project-card-link:nth-child(2){border-right:0}
  #workpro-crm .wpc-project-card-link.full{grid-column:1/-1;border-top:1px solid #eee9e5;border-right:0}
  #workpro-crm .wpc-mobile-link{display:block;min-width:0;color:#2371c9;font-size:11px;font-weight:750;line-height:1.35;overflow-wrap:anywhere}
  #workpro-crm .wpc-project-progress{padding:11px 12px 2px}
  #workpro-crm .wpc-progress-meta{display:flex;align-items:center;justify-content:space-between;gap:12px}
  #workpro-crm .wpc-progress-meta span{margin:0}
  #workpro-crm .wpc-progress-meta b{font-size:10px;color:#69625c}
  #workpro-crm .wpc-mobile-progress{height:7px;margin-top:7px;overflow:hidden;border-radius:999px;background:#ebe8e5}
  #workpro-crm .wpc-mobile-progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#1fab72,#20b47a)}
  #workpro-crm .wpc-project-card.is-carry .wpc-mobile-progress>span{background:linear-gradient(90deg,#fb4d01,#ff7a38)}
  #workpro-crm .wpc-project-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin-top:12px}
  #workpro-crm .wpc-mobile-action{display:flex;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:42px;padding:0 8px;border:1px solid #e7e3df;border-radius:10px;background:#fff;color:#5f5a55;font-size:10px;font-weight:800}
  #workpro-crm .wpc-mobile-action .wpc-icon{width:15px;height:15px}
  #workpro-crm .wpc-mobile-action.send{border-color:#d7eee4;background:#f0faf5;color:#15925e}
  #workpro-crm .wpc-mobile-action.update{border-color:#dce8f7;background:#f3f8ff;color:#2e72c4}
  #workpro-crm .wpc-mobile-action.delete{border-color:#f7d9dd;background:#fff4f5;color:#d64e5c}

  /* Employee cards */
  #workpro-crm .wpc-employee-mobile-list{padding-bottom:12px}
  #workpro-crm .wpc-employee-card{padding:15px;border:1px solid #e7e2de;border-radius:18px;background:#fff;box-shadow:0 6px 20px rgba(35,31,28,.045)}
  #workpro-crm .wpc-employee-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding-bottom:12px;border-bottom:1px solid #eeeae7}
  #workpro-crm .wpc-employee-card-person{display:flex;align-items:center;gap:11px;min-width:0}
  #workpro-crm .wpc-employee-card .emp-photo{width:46px;height:46px;flex:0 0 46px}
  #workpro-crm .wpc-employee-card h4{margin:0 0 3px;font-size:17px;line-height:1.2}
  #workpro-crm .wpc-employee-card p{margin:0;color:#837c76;font-size:11px}
  #workpro-crm .wpc-employee-card-meta{display:grid;grid-template-columns:1fr 1fr;margin-top:12px;border:1px solid #eeeae7;border-radius:12px;overflow:hidden}
  #workpro-crm .wpc-employee-card-meta>div{padding:10px 12px}.wpc-employee-card-meta>div+div{border-left:1px solid #eeeae7}
  #workpro-crm .wpc-employee-card-meta span,#workpro-crm .wpc-employee-contact-row>span{display:block;color:#8a837d;font-size:9px;font-weight:700}
  #workpro-crm .wpc-employee-card-meta b{display:block;margin-top:4px;font-size:12px;color:#2d2926}
  #workpro-crm .wpc-employee-contact-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 2px 0}
  #workpro-crm .wpc-employee-contact-row>div{display:flex;gap:7px}
  #workpro-crm .wpc-employee-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px}

  /* Work history cards */
  #workpro-crm .wpc-history-card{padding:15px;border:1px solid #e7e2de;border-radius:18px;background:#fff;box-shadow:0 6px 20px rgba(35,31,28,.045)}
  #workpro-crm .wpc-history-card header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid #eeeae7}
  #workpro-crm .wpc-history-person{display:flex;align-items:center;gap:10px;min-width:0}.wpc-history-person .emp-photo{width:44px;height:44px;flex:0 0 44px}
  #workpro-crm .wpc-history-person h4{margin:0 0 3px;font-size:17px}.wpc-history-person p{margin:0;color:#857e78;font-size:10px}
  #workpro-crm .wpc-history-rank{text-align:right}.wpc-history-rank b{display:block;color:#a66b00;font-size:15px}.wpc-history-rank span{font-size:9px;color:#918983}
  #workpro-crm .wpc-history-kpis{display:grid;grid-template-columns:1fr 1fr;margin-top:12px;border:1px solid #eeeae7;border-radius:12px;overflow:hidden}
  #workpro-crm .wpc-history-kpis>div{padding:10px 12px;border-right:1px solid #eeeae7;border-bottom:1px solid #eeeae7}.wpc-history-kpis>div:nth-child(2n){border-right:0}.wpc-history-kpis>div:nth-last-child(-n+2){border-bottom:0}
  #workpro-crm .wpc-history-kpis span,#workpro-crm .wpc-current-project>span,#workpro-crm .wpc-history-progress-row span{display:block;color:#8a837d;font-size:9px;font-weight:700}
  #workpro-crm .wpc-history-kpis b{display:block;margin-top:3px;font-size:12px}
  #workpro-crm .wpc-current-project{margin-top:10px;padding:11px 12px;border:1px solid #eeeae7;border-radius:12px;background:#fdfcfb}.wpc-current-project>b{display:block;margin-top:4px;font-size:12px;overflow-wrap:anywhere}
  #workpro-crm .wpc-current-project-money{display:flex;gap:12px;margin-top:6px;color:#77706a}
  #workpro-crm .wpc-history-progress-row{margin-top:11px}.wpc-history-progress-row>div:first-child{display:flex;justify-content:space-between;gap:12px}.wpc-history-progress-row b{font-size:10px}
  #workpro-crm .wpc-history-flags{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:13px}.wpc-history-flags button{min-height:34px}.wpc-fine-chip{display:inline-flex;align-items:center;min-height:34px;padding:0 10px;border-radius:999px;background:#fff4e5;color:#a76811;font-size:9px;font-weight:800}
  #workpro-crm .warning-policy-box{margin-top:12px;border-radius:15px}

  /* Messages: compact cards with a pagination footer that never overlaps rows. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-reports.tab.active{display:flex;flex-direction:column;overflow:hidden}
  #workpro-crm #tab-reports .wpc-page-intro{flex:0 0 auto}
  #workpro-crm #tab-reports .wpc-message-panel{display:flex;flex:1 1 auto;min-height:0;flex-direction:column;padding:0;overflow:hidden;border-radius:18px}
  #workpro-crm #tab-reports .wpc-message-toolbar{flex:0 0 auto;padding:12px;background:#fff}
  #workpro-crm #messageMobileCards{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px;background:#faf9f8;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  #workpro-crm .wpc-message-card{padding:14px;border:1px solid #e7e2de;border-radius:15px;background:#fff;box-shadow:0 4px 15px rgba(35,31,28,.035)}
  #workpro-crm .wpc-message-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding-bottom:10px;border-bottom:1px solid #eeeae7}
  #workpro-crm .wpc-message-project{display:block;margin-bottom:4px;color:#8a837d;font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.5px}
  #workpro-crm .wpc-message-card h4{margin:0;font-size:15px;color:#26221f}
  #workpro-crm .wpc-message-card-grid{display:grid;grid-template-columns:1fr 1fr}.wpc-message-card-grid>div{padding:11px 0}.wpc-message-card-grid>div+div{padding-left:12px;border-left:1px solid #eeeae7}
  #workpro-crm .wpc-message-card-grid span{display:block;color:#8b847e;font-size:9px;font-weight:700}.wpc-message-card-grid b{display:block;margin-top:4px;font-size:11px;overflow-wrap:anywhere}
  #workpro-crm .wpc-message-card footer{display:flex;align-items:center;gap:6px;padding-top:10px;border-top:1px solid #eeeae7;color:#7b746e;font-size:10px}.wpc-message-card footer .wpc-icon{width:14px;height:14px}
  #workpro-crm .wpc-channel-pill{white-space:nowrap}.wpc-channel-pill.whatsapp{background:#fff1e9;color:#de4c0b}.wpc-channel-pill.email{background:#edf4ff;color:#3c73bd}.wpc-channel-pill.daily_update{background:#eaf8f2;color:#168658}
  #workpro-crm #messageLogPagination{position:relative;z-index:2;display:grid;grid-template-columns:minmax(86px,auto) 1fr minmax(86px,auto);align-items:center;gap:8px;flex:0 0 auto;padding:10px 12px;border-top:1px solid #e7e2de;background:#fff}
  #workpro-crm #messageLogPagination.wpc-is-hidden{display:none}
  #workpro-crm #messageLogPagination button{min-height:42px;margin:0;border-radius:10px}
  #workpro-crm #messageLogPageInfo{text-align:center;font-size:10px;color:#77706a;white-space:nowrap}

  /* Settings: compact, readable mobile cards rather than giant stacked boxes. */
  #workpro-crm #tab-settings .panel{padding:15px;border-radius:18px;margin-bottom:12px}
  #workpro-crm #tab-settings .wpc-settings-head{align-items:flex-start;gap:12px;margin-bottom:14px}
  #workpro-crm #tab-settings .wpc-settings-head h3{font-size:18px}
  #workpro-crm #tab-settings .wpc-brand-preview{padding:9px 10px;border-radius:12px}
  #workpro-crm #tab-settings .wpc-branding-form{gap:11px}
  #workpro-crm #tab-settings .wpc-brand-upload-row{display:flex;gap:7px;flex-wrap:wrap}
  #workpro-crm #tab-settings .wpc-brand-upload-row>button{min-height:42px}
  #workpro-crm #tab-settings .wpc-brand-actions .primary{width:100%}
  #workpro-crm #tab-settings .account-manager-item{padding:11px;border-radius:11px}
  #workpro-crm #tab-settings #settingsAddAccount{min-height:42px}

  /* Calendar remains functional without squeezing seven columns into 360px. */
  #workpro-crm #tab-calendar .monthly-calendar{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
  #workpro-crm #tab-calendar .cal-grid{min-width:720px}
  #workpro-crm #tab-calendar .calendar-summary{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
  #workpro-crm #tab-calendar .calendar-summary .card{min-height:82px;padding:11px}

  /* Sidebar remains an overlay and never resizes/hides the database canvas. */
  #workpro-crm.workpro-wrap.crm-auth-visible .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpcrm-side,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-collapsed .wpcrm-side{
    width:min(84vw,310px);max-width:310px;box-shadow:none;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-sidebar-overlay,
  #workpro-crm.workpro-wrap.crm-auth-visible.sidebar-open .wpc-sidebar-overlay{background:rgba(17,16,15,.22)}
}

@media(max-width:430px){
  #workpro-crm.workpro-wrap.crm-auth-visible .tab{padding:16px 10px 20px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card{min-height:106px;padding:13px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card b{font-size:22px}
  #workpro-crm .wpc-project-card{padding:13px;border-radius:16px}
  #workpro-crm .wpc-project-card-head{gap:8px}
  #workpro-crm .wpc-project-avatar{width:42px;height:42px;flex-basis:42px;font-size:15px}
  #workpro-crm .wpc-project-title-line h4{font-size:15px}
  #workpro-crm .wpc-project-deadline{font-size:9px;max-width:112px}
  #workpro-crm .wpc-project-metrics>div,#workpro-crm .wpc-project-card-link{padding:9px 10px}
  #workpro-crm .wpc-project-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
  #workpro-crm .wpc-mobile-action{min-height:44px;font-size:10px}
  #workpro-crm #messageLogPagination{grid-template-columns:80px 1fr 80px;padding:9px}
  #workpro-crm #messageLogPageInfo{font-size:9px}
}

#workpro-crm .wpc-desktop-data.wpc-is-hidden{display:none}

/* === v1.1.19 login isolation + solid mobile action contrast ===============
   Frontend login is a true viewport layer. If a login layer is visible, the
   app beneath it is forcibly hidden even if a stale class/state survives a
   cached render. Multiple frontend shells are also pruned by app.js.
   Solid blue/red mobile actions always use white text/icons. */
body:not(.workpro-elementor-editor-preview) #workproLogin.workpro-login-screen.crm-auth-visible{
  position:fixed;
  inset:0;
  z-index:2147483000;
  width:100vw;
  max-width:none;
  height:100vh;
  height:100dvh;
  min-height:100vh;
  min-height:100dvh;
  margin:0;
  padding:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  background:#fff;
}
body:not(.workpro-elementor-editor-preview) #workproLogin.workpro-login-screen.crm-auth-visible .wpc-login-shell{
  width:100%;
  max-width:none;
  min-height:100%;
  margin:0;
  background:#fff;
}
body:not(.workpro-elementor-editor-preview) #workproLogin.workpro-login-screen.crm-auth-visible ~ #workpro-crm{
  display:none;
}
#workproLogin.workpro-login-screen.crm-auth-hidden{display:none}

@media(max-width:767px){
  body:not(.workpro-elementor-editor-preview) #workproLogin.workpro-login-screen.crm-auth-visible{
    display:block;
    height:100dvh;
    min-height:100dvh;
  }
  body:not(.workpro-elementor-editor-preview) #workproLogin.workpro-login-screen.crm-auth-visible .wpc-login-shell{
    min-height:100dvh;
  }
  body:not(.workpro-elementor-editor-preview) #workproLogin.workpro-login-screen.crm-auth-visible .wpc-login-panel{
    min-height:100dvh;
    box-sizing:border-box;
  }

  #workpro-crm .wpc-mobile-action.edit,
  #workpro-crm .wpc-mobile-action.edit:hover,
  #workpro-crm .wpc-mobile-action.edit:focus-visible,
  #workpro-crm .wpc-mobile-action.edit:active{
    border-color:var(--wpc-blue);
    background:var(--wpc-blue);
    color:#fff;
  }
  #workpro-crm .wpc-mobile-action.delete,
  #workpro-crm .wpc-mobile-action.delete:hover,
  #workpro-crm .wpc-mobile-action.delete:focus-visible,
  #workpro-crm .wpc-mobile-action.delete:active{
    border-color:var(--wpc-red);
    background:var(--wpc-red);
    color:#fff;
  }
  #workpro-crm .wpc-mobile-action.edit .wpc-icon,
  #workpro-crm .wpc-mobile-action.delete .wpc-icon,
  #workpro-crm .wpc-mobile-action.edit span,
  #workpro-crm .wpc-mobile-action.delete span{
    color:inherit;
  }
}

/* === v1.1.20 compact 4-up mobile KPI + dashboard internal scroll ==========
   The authenticated app remains a fixed CRM canvas: the document/body never
   becomes the scroll surface. On phones the dashboard tab itself is the
   vertical scroll surface, so Overview + KPI cards naturally slide away as
   the user moves into the project database and return when scrolling back.
   Project cards no longer create a second nested vertical scrollbar. */
@media(max-width:767px){
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard.tab.active{
    display:block;
    min-height:0;
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
    scroll-behavior:smooth;
    scrollbar-gutter:stable;
  }

  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-page-intro,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .cards,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .table-title-row{
    flex:none;
  }

  /* Four compact statistics in one row on every phone width. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .cards{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:6px;
    margin-bottom:18px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card{
    min-width:0;
    min-height:78px;
    padding:9px 7px;
    gap:6px;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    border-radius:14px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-icon{
    width:28px;
    height:28px;
    min-width:28px;
    border-radius:9px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-icon svg{
    width:14px;
    height:14px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card > div{
    min-width:0;
    width:100%;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card b{
    margin:0 0 2px;
    font-size:15px;
    line-height:1.05;
    letter-spacing:-.25px;
    white-space:nowrap;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card span:not(.wpc-stat-icon){
    display:block;
    max-width:100%;
    margin:0;
    font-size:7.5px;
    line-height:1.15;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  /* The dashboard tab owns the only vertical scrollbar. Project cards simply
     participate in that flow, preventing nested-scroll trapping on touch. */
  #workpro-crm.workpro-wrap.crm-auth-visible #projectMobileCards{
    flex:none;
    min-height:0;
    height:auto;
    max-height:none;
    overflow:visible;
    padding:1px 2px 22px;
  }
}

@media(max-width:380px){
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .cards{gap:5px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card{
    min-height:72px;
    padding:8px 6px;
    gap:5px;
    border-radius:12px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-icon{
    width:25px;
    height:25px;
    min-width:25px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-icon svg{width:13px;height:13px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card b{font-size:13px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card span:not(.wpc-stat-icon){font-size:7px}
}


/* === v1.1.22 full-width utility tabs + alignment + safe edge spacing ======
   Calendar, Messages and Settings are workspace pages, not narrow articles.
   Keep them at the full width supplied by the Elementor/shortcode container,
   even when the generic Elementor Content Max Width control was previously
   saved for other tabs. The high-specificity tab selectors intentionally win
   over that generic selector without a forced declaration.

   The topbar also keeps a safe inset on both edges so the drawer button and
   the rightmost action never touch the CRM/container border. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-calendar.tab,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports.tab,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-settings.tab{
  width:100%;
  max-width:100%;
  min-width:0;
  margin-left:0;
  margin-right:0;
  box-sizing:border-box;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-calendar .calendar-head,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-calendar .calendar-summary,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-calendar .monthly-calendar,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-settings .wpc-page-intro,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-settings .panel,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-page-intro,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-panel{
  width:100%;
  max-width:100%;
  min-width:0;
  margin-left:0;
  margin-right:0;
  box-sizing:border-box;
}

/* Messages: labels, headings and values share one predictable left-aligned
   grid on desktop. This prevents theme/Elementor alignment inheritance from
   moving values away from their headers. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table{
  width:100%;
  table-layout:fixed;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table th,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table td{
  text-align:left;
  vertical-align:middle;
  white-space:normal;
  overflow-wrap:anywhere;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table th:nth-child(1){width:22%}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table th:nth-child(2){width:17%}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table th:nth-child(3){width:13%}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table th:nth-child(4){width:20%}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table th:nth-child(5){width:12%}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-table th:nth-child(6){width:16%}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card header,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card-grid,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card-grid > div,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card footer{
  text-align:left;
}

/* Safe horizontal inset on both sides of the fixed CRM topbar. */
#workpro-crm.workpro-wrap.crm-auth-visible .topbar{
  padding-left:32px;
  padding-right:32px;
  box-sizing:border-box;
}
#workpro-crm.workpro-wrap.crm-auth-visible .topbar .sidebar-toggle{
  margin-left:0;
}
#workpro-crm.workpro-wrap.crm-auth-visible .top-actions{
  margin-right:0;
  padding-right:0;
}

@media(max-width:900px){
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar{
    padding-left:22px;
    padding-right:22px;
  }
}
@media(max-width:767px){
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar{
    padding-left:18px;
    padding-right:18px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card-grid{
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card-grid > div{
    min-width:0;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card-grid b,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card-grid span,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-reports .wpc-message-card footer{
    text-align:left;
  }
}

/* === v1.1.23 dashboard table corner symmetry ============================
   Keep the horizontal scroller, but clip the database surface to the same
   radius on both sides. Explicit first/last header radii prevent the Actions
   edge from looking square when the table reaches the right boundary. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .table-wrap.wpc-desktop-data{
  border-radius:var(--wpc-radius);
  overflow-x:auto;
  overflow-y:hidden;
  background:var(--wpc-panel);
  clip-path:inset(0 round var(--wpc-radius));
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .main-database-table{
  border-collapse:separate;
  border-spacing:0;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .main-database-table thead th:first-child{
  border-top-left-radius:calc(var(--wpc-radius) - 1px);
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .main-database-table thead th:last-child{
  border-top-right-radius:calc(var(--wpc-radius) - 1px);
}

/* === v1.1.24 consolidated UI polish ======================================
   Approved visual refinements only. Business rules, permissions and stored
   data are unchanged. */

/* Topbar branding: TecZen logo at left; WorkPro text stays compact and aligned. */
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-title{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:315px;
  margin-right:auto;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-logo{
  display:block;
  width:124px;
  max-width:124px;
  height:auto;
  flex:0 0 auto;
  object-fit:contain;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-copy{
  min-width:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:2px;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-copy .wpc-eyebrow{
  margin:0;
  line-height:1.05;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-copy h2{
  margin:0;
  padding:0;
  line-height:1.12;
}

/* Desktop toolbar actions have one balanced footprint. */
@media(min-width:901px){
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn{
    width:106px;
    min-width:106px;
    height:40px;
    padding:0 10px;
    justify-content:center;
  }
}
@media(min-width:901px) and (max-width:1200px){
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-title{min-width:270px;gap:9px}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-logo{width:104px;max-width:104px}
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn{width:92px;min-width:92px}
}

/* Dashboard is intentionally compact: stats -> Recent Projects -> list. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard > .cards{margin-top:0}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .table-title-row{margin-top:8px}

/* Column labels remain double-click editable, without decorative pencil glyphs. */
#workpro-crm table th .col-heading-label:after{content:none}
#workpro-crm table th .col-heading-label{padding-right:0}

/* Table typography polish. */
#workpro-crm .main-database-table .client-feedback .clip{
  font-size:11.5px;
  font-weight:550;
}
#workpro-crm .main-database-table td a{
  font-weight:500;
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:2px;
}
#workpro-crm .main-database-table .badge{
  min-height:24px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 9px;
  font-size:10px;
  line-height:1;
  font-weight:700;
}
#workpro-crm .main-database-table .badge .dot{flex:0 0 auto}

/* Names use a readable size and can be swiped horizontally when very long. */
#workpro-crm .main-database-table .client-feedback,
#workpro-crm .main-database-table .client-feedback .clip,
#workpro-crm .emp-photo-name b,
#workpro-crm .emp-photo-name b .clip,
#workpro-crm .wpc-project-title-line h4,
#workpro-crm .wpc-employee-card h4,
#workpro-crm .wpc-history-person h4,
#workpro-crm .wpc-current-project > b,
#workpro-crm .wpc-message-card h4{
  min-width:0;
  white-space:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  text-overflow:clip;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}
#workpro-crm .main-database-table .client-feedback::-webkit-scrollbar,
#workpro-crm .main-database-table .client-feedback .clip::-webkit-scrollbar,
#workpro-crm .emp-photo-name b::-webkit-scrollbar,
#workpro-crm .emp-photo-name b .clip::-webkit-scrollbar,
#workpro-crm .wpc-project-title-line h4::-webkit-scrollbar,
#workpro-crm .wpc-employee-card h4::-webkit-scrollbar,
#workpro-crm .wpc-history-person h4::-webkit-scrollbar,
#workpro-crm .wpc-current-project > b::-webkit-scrollbar,
#workpro-crm .wpc-message-card h4::-webkit-scrollbar{display:none}
#workpro-crm .emp-photo-name b,
#workpro-crm .emp-photo-name b .clip{font-size:11.5px;font-weight:650}

/* Phone work-history Warning / Chuti / Fine controls are equal. */
@media(max-width:767px){
  #workpro-crm .wpc-history-flags{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:7px;
    align-items:stretch;
    flex-wrap:nowrap;
  }
  #workpro-crm .wpc-history-flags > .warning-pill,
  #workpro-crm .wpc-history-flags > .leave-pill,
  #workpro-crm .wpc-history-flags > .wpc-fine-chip{
    width:100%;
    min-width:0;
    min-height:34px;
    height:34px;
    padding:0 5px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:999px;
    font-size:9px;
    line-height:1;
    white-space:nowrap;
    text-align:center;
  }

  /* Four topbar actions keep the same phone footprint. */
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .add-project-fab{
    width:48px;
    min-width:48px;
    height:48px;
    min-height:48px;
    padding:0;
  }

  /* True seven-column compact month view: no horizontal calendar overflow. */
  #workpro-crm #tab-calendar .monthly-calendar{
    width:100%;
    min-width:0;
    overflow:hidden;
    padding:8px;
  }
  #workpro-crm #tab-calendar .cal-grid{
    width:100%;
    min-width:0;
    grid-template-columns:repeat(7,minmax(0,1fr));
    gap:2px;
  }
  #workpro-crm #tab-calendar .cal-week{margin-bottom:3px}
  #workpro-crm #tab-calendar .cal-week b{
    min-width:0;
    padding:3px 0;
    font-size:7px;
    line-height:1;
    letter-spacing:0;
  }
  #workpro-crm #tab-calendar .cal-day{
    min-width:0;
    min-height:48px;
    height:48px;
    padding:4px 3px;
    border-radius:8px;
    overflow:hidden;
  }
  #workpro-crm #tab-calendar .cal-day strong{
    margin:0 0 3px;
    font-size:8px;
    line-height:1;
  }
  #workpro-crm #tab-calendar .cal-day span{
    display:inline-block;
    width:5px;
    height:5px;
    margin:1px 2px 0 0;
    padding:0;
    border-radius:50%;
    font-size:0;
    line-height:0;
    vertical-align:top;
  }
  #workpro-crm #tab-calendar .cal-day em{display:none}
}

/* === v1.1.25 refresh FOUC + toolbar text fix ============================
   Prevent the large intrinsic TecZen logo from flashing before the CRM auth
   bootstrap/CSS state settles. The HTML width/height attributes are the first
   line of defence; these rules keep the final box deterministic as well. */
#workpro-crm .wpc-topbar-logo{
  width:124px;
  height:24px;
  max-width:124px;
  max-height:24px;
  aspect-ratio:31 / 6;
  object-fit:contain;
  flex:0 0 124px;
}

/* Native hidden is deliberately authoritative during bootstrap. This avoids
   an unstyled authenticated topbar/logo appearing behind the login screen. */
.workpro-instance-shell #workproLogin[hidden],
.workpro-instance-shell #workpro-crm[hidden]{
  display:none;
}

/* Keep all desktop toolbar buttons balanced without clipping Add Project. */
@media(min-width:901px){
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .add-project-fab{
    width:118px;
    min-width:118px;
    height:40px;
    min-height:40px;
    padding:0 10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    white-space:nowrap;
    overflow:visible;
    text-align:center;
    font-size:12.5px;
    line-height:1;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary > span,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action > span,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn > span,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .add-project-fab > span{
    min-width:0;
    white-space:nowrap;
    overflow:visible;
    text-overflow:clip;
    line-height:1;
  }
}
@media(min-width:901px) and (max-width:1200px){
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .add-project-fab{
    width:108px;
    min-width:108px;
    font-size:11.5px;
    gap:5px;
  }
}


/* === v1.1.26 work-history/topbar alignment polish =======================
   Presentation only: remove the redundant secondary topbar title and keep
   the two Work History actions visually identical. */
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-copy{
  justify-content:center;
  gap:0;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-copy .wpc-eyebrow{
  display:block;
  margin:0;
  line-height:1;
}
#workpro-crm.workpro-wrap.crm-auth-visible .work-history-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}
#workpro-crm.workpro-wrap.crm-auth-visible .work-history-actions > .nav-link-dashboard,
#workpro-crm.workpro-wrap.crm-auth-visible .work-history-actions > #resetWorkHistoryColumns{
  width:110px;
  min-width:110px;
  height:38px;
  min-height:38px;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  font-size:10px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  text-align:center;
}
@media(max-width:767px){
  #workpro-crm.workpro-wrap.crm-auth-visible .work-history-actions{
    gap:10px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .work-history-actions > .nav-link-dashboard,
  #workpro-crm.workpro-wrap.crm-auth-visible .work-history-actions > #resetWorkHistoryColumns{
    width:104px;
    min-width:104px;
    height:36px;
    min-height:36px;
    font-size:9.5px;
  }
}


/* === v1.1.27 Projects KPI Gross Revenue tooltip =========================
   Keep the four-card dashboard unchanged. Gross Revenue is contextual info
   revealed from the Projects KPI on hover/focus, and by tap on touch devices. */
#workpro-crm .wpc-projects-stat{position:relative;cursor:default;z-index:3}
#workpro-crm .wpc-projects-stat:focus-visible{outline:2px solid rgba(255,83,20,.34);outline-offset:3px}
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip{
  position:absolute;
  z-index:80;
  left:50%;
  top:calc(100% + 10px);
  width:max-content;
  min-width:164px;
  max-width:min(230px,calc(100vw - 28px));
  padding:11px 13px;
  border:1px solid #eadfd8;
  border-radius:13px;
  background:#fff;
  box-shadow:0 12px 28px rgba(28,23,20,.14);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate(-50%,-5px);
  transition:opacity .16s ease,transform .16s ease,visibility .16s ease;
  text-align:left;
}
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip::before{
  content:"";
  position:absolute;
  left:50%;
  top:-6px;
  width:10px;
  height:10px;
  border-left:1px solid #eadfd8;
  border-top:1px solid #eadfd8;
  background:#fff;
  transform:translateX(-50%) rotate(45deg);
}
#workpro-crm .wpc-projects-stat:hover .wpc-gross-tooltip,
#workpro-crm .wpc-projects-stat:focus-visible .wpc-gross-tooltip,
#workpro-crm .wpc-projects-stat.wpc-tooltip-open .wpc-gross-tooltip{
  opacity:1;
  visibility:visible;
  transform:translate(-50%,0);
}
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip span,
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip strong,
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip small{
  display:block;
  width:auto;
  max-width:none;
  margin:0;
  overflow:visible;
  white-space:nowrap;
  text-overflow:clip;
}
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip span{font-size:10px;line-height:1.2;font-weight:600;color:#81766f}
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip strong{margin-top:3px;font-size:18px;line-height:1.15;font-weight:700;color:#171717;letter-spacing:-.25px}
#workpro-crm .wpc-projects-stat .wpc-gross-tooltip small{margin-top:3px;font-size:9px;line-height:1.2;color:#a09791}

@media(max-width:767px){
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat .wpc-gross-tooltip{
    left:0;
    top:calc(100% + 7px);
    min-width:145px;
    padding:9px 10px;
    transform:translate(0,-4px);
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat .wpc-gross-tooltip::before{left:22px;transform:rotate(45deg)}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat:hover .wpc-gross-tooltip,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat:focus-visible .wpc-gross-tooltip,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat.wpc-tooltip-open .wpc-gross-tooltip{transform:translate(0,0)}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat .wpc-gross-tooltip span{font-size:9px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat .wpc-gross-tooltip strong{font-size:16px}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-projects-stat .wpc-gross-tooltip small{font-size:8px}
}


/* === v1.1.28 authoritative toolbar/work-history button fix ==============
   Resolve two previously reported visual regressions by overriding the
   accumulated historical toolbar rules at the end of the stylesheet. */
@media (min-width:1201px){
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .add-project-fab{
    box-sizing:border-box;
    flex:0 0 124px;
    width:124px;
    min-width:124px;
    max-width:124px;
    height:40px;
    min-height:40px;
    padding:0 12px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    overflow:visible;
    white-space:nowrap;
    text-align:center;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > button > span{
    display:inline-block;
    flex:0 0 auto;
    width:auto;
    min-width:max-content;
    max-width:none;
    margin:0;
    overflow:visible;
    white-space:nowrap;
    text-overflow:clip;
    text-align:center;
  }
}
@media (min-width:901px) and (max-width:1200px){
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .add-project-fab{
    box-sizing:border-box;
    flex:0 0 116px;
    width:116px;
    min-width:116px;
    max-width:116px;
    height:40px;
    min-height:40px;
    padding:0 10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    overflow:visible;
    white-space:nowrap;
    text-align:center;
    font-size:11.5px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > button > span{
    display:inline-block;
    flex:0 0 auto;
    width:auto;
    min-width:max-content;
    max-width:none;
    overflow:visible;
    white-space:nowrap;
    text-overflow:clip;
    text-align:center;
  }
}

#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-head{
  box-sizing:border-box;
  padding-right:12px;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  column-gap:10px;
  row-gap:0;
  flex-wrap:nowrap;
  box-sizing:border-box;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > .nav-link-dashboard,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > #resetWorkHistoryColumns{
  box-sizing:border-box;
  flex:0 0 116px;
  width:116px;
  min-width:116px;
  max-width:116px;
  height:38px;
  min-height:38px;
  max-height:38px;
  margin:0;
  padding:0 10px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  text-align:center;
}

/* === v1.1.30 final UI/security UX polish =================================
   Authoritative presentation fixes for the remaining reported items. */

/* Desktop/laptop toolbar: equal footprint, no text clipping, true centering. */
@media (min-width:901px){
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions{
    display:flex;
    align-items:center;
    gap:8px;
    min-width:0;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .primary,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .wpc-secondary-action,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .logout-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > .add-project-fab{
    box-sizing:border-box;
    flex:0 0 124px;
    width:124px;
    min-width:124px;
    max-width:124px;
    height:40px;
    min-height:40px;
    max-height:40px;
    padding:0 10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    overflow:visible;
    white-space:nowrap;
    text-align:center;
    line-height:1;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .top-actions > button > span{
    display:inline-block;
    flex:0 0 auto;
    width:auto;
    min-width:max-content;
    max-width:none;
    overflow:visible;
    white-space:nowrap;
    text-overflow:clip;
    text-align:center;
    line-height:1;
  }
}

/* Work History has balanced safe-area padding and equal actions with 10px gap. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history{
  box-sizing:border-box;
  padding-left:12px;
  padding-right:12px;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-head{
  width:100%;
  box-sizing:border-box;
  padding-left:0;
  padding-right:0;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  column-gap:10px;
  flex-wrap:nowrap;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > .nav-link-dashboard,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > #resetWorkHistoryColumns{
  box-sizing:border-box;
  flex:0 0 116px;
  width:116px;
  min-width:116px;
  max-width:116px;
  height:38px;
  min-height:38px;
  max-height:38px;
  margin:0;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  text-align:center;
}

/* The last desktop data row keeps the same bottom rule as all preceding rows. */
@media (min-width:768px){
  #workpro-crm.workpro-wrap.crm-auth-visible .table-wrap table tbody tr:last-child td{
    border-bottom:1px solid var(--wpc-line);
  }
}

/* Phone: logo remains, redundant WorkPro title copy is hidden. */
@media (max-width:767px){
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-topbar-copy{display:none}

  /* Work History heading/description is intentionally omitted on phone. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history:not(.wpc-show-history-intro-mobile) .work-history-head > div:first-child{display:none}
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-head{
    justify-content:flex-end;
    margin-bottom:10px;
  }

  /* Four dashboard KPI objects are centered horizontally and vertically. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card{
    align-items:center;
    justify-content:center;
    text-align:center;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card > div,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card .wpc-stat-copy{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:100%;
    text-align:center;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card b,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card span:not(.wpc-stat-icon){
    width:100%;
    text-align:center;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-icon{margin-left:auto;margin-right:auto}

  #workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history{
    padding-left:10px;
    padding-right:10px;
  }
}

/* === v1.1.30 unresolved UI fixes =========================================
   Final authoritative rules for toolbar clipping, Work History action
   alignment, employee-name readability, and mobile KPI centering. */

/* Desktop/laptop action toolbar: equal button footprint and readable labels. */
@media (min-width:901px){
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar .top-actions{
    display:grid;
    grid-auto-flow:column;
    grid-auto-columns:132px;
    align-items:center;
    justify-content:end;
    gap:8px;
    column-gap:8px;
    width:max-content;
    max-width:100%;
    margin-left:auto;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar .top-actions > button{
    box-sizing:border-box;
    width:132px;
    min-width:132px;
    max-width:132px;
    height:40px;
    min-height:40px;
    max-height:40px;
    margin:0;
    padding:0 10px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    overflow:visible;
    white-space:nowrap;
    text-align:center;
    font-size:11.5px;
    line-height:1;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible .topbar .top-actions > button > span{
    display:inline-block;
    flex:0 0 auto;
    width:auto;
    min-width:0;
    max-width:none;
    margin:0;
    overflow:visible;
    white-space:nowrap;
    text-overflow:clip;
    text-align:center;
    font-size:inherit;
    line-height:1;
  }
}

/* Work History controls: structural grid guarantees a real 10px gap. */
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions{
  display:grid;
  grid-template-columns:116px 116px;
  grid-auto-flow:column;
  align-items:center;
  justify-content:end;
  column-gap:10px;
  row-gap:0;
  gap:0 10px;
  width:max-content;
  max-width:100%;
  margin-left:auto;
  box-sizing:border-box;
}
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > .wpc-history-action-btn,
#workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > button.wpc-history-action-btn{
  box-sizing:border-box;
  width:116px;
  min-width:116px;
  max-width:116px;
  height:38px;
  min-height:38px;
  max-height:38px;
  margin:0;
  padding:0 8px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  font-size:10px;
  font-weight:700;
  line-height:1;
  white-space:nowrap;
  text-align:center;
}

/* Employee names are intentionally more readable without changing row height. */
#workpro-crm.workpro-wrap.crm-auth-visible .emp-photo-name b,
#workpro-crm.workpro-wrap.crm-auth-visible .emp-photo-name b .clip{
  font-size:13.5px;
  line-height:1.25;
  font-weight:650;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-employee-card h4,
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-history-person h4{
  font-size:18px;
  line-height:1.2;
}

@media (max-width:767px){
  /* Mobile KPI objects stay centered in both axes. */
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card .wpc-stat-icon{
    margin:0 auto 3px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card > div,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card .wpc-stat-copy{
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card b,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-dashboard .wpc-stat-card span:not(.wpc-stat-icon){
    width:100%;
    margin-left:auto;
    margin-right:auto;
    text-align:center;
  }

  #workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions{
    grid-template-columns:104px 104px;
    column-gap:10px;
    gap:0 10px;
  }
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > .wpc-history-action-btn,
  #workpro-crm.workpro-wrap.crm-auth-visible #tab-work-history .work-history-actions > button.wpc-history-action-btn{
    width:104px;
    min-width:104px;
    max-width:104px;
    height:36px;
    min-height:36px;
    max-height:36px;
    font-size:9.5px;
  }
}


/* === v1.1.31 data-table / leave UX polish ================================ */
/* Dashboard Instruction Sheet remains in the data model/project form, but is
   intentionally not a Recent Projects database column. Keeping the hidden DOM
   cell avoids breaking stored column-order indexes from older releases. */
#workpro-crm.workpro-wrap.crm-auth-visible .main-database-table .wpc-instruction-column{display:none}

/* Responsible employee names need to be readable at normal desktop zoom. */
#workpro-crm.workpro-wrap.crm-auth-visible .main-database-table .member{
  font-size:11.5px;
  line-height:1.2;
  font-weight:650;
  padding:5px 10px;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-employee-table .emp-photo-name b,
#workpro-crm.workpro-wrap.crm-auth-visible .employee-work-history-table .emp-photo-name b{
  font-size:14px;
  line-height:1.25;
}

/* Warning policy body copy: readable without competing with the heading. */
#workpro-crm.workpro-wrap.crm-auth-visible .warning-policy-box p{
  font-size:13px;
  line-height:1.55;
}

/* Chuti modal actions: equal baseline and footprint. */
#workpro-crm.workpro-wrap.crm-auth-visible #leaveModal .wpc-leave-actions{
  display:flex;
  align-items:center;
  gap:10px;
}
#workpro-crm.workpro-wrap.crm-auth-visible #leaveModal .wpc-leave-actions .wpc-leave-action-btn{
  box-sizing:border-box;
  flex:0 0 96px;
  width:96px;
  min-width:96px;
  max-width:96px;
  height:38px;
  min-height:38px;
  max-height:38px;
  margin:0;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  font-size:11px;
  font-weight:700;
}

/* Lightweight success/error toast for mutations such as Chuti save. */
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-toast-stack{
  position:absolute;
  top:76px;
  right:18px;
  z-index:10080;
  display:flex;
  flex-direction:column;
  gap:8px;
  pointer-events:none;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-toast{
  min-width:220px;
  max-width:min(360px,calc(100vw - 36px));
  padding:11px 14px;
  border:1px solid #bfe8d6;
  border-radius:12px;
  background:#f0fbf6;
  color:#08724c;
  font-size:12px;
  font-weight:700;
  box-shadow:0 12px 28px rgba(15,23,42,.12);
  opacity:0;
  transform:translateY(-6px);
  transition:opacity .18s ease,transform .18s ease;
}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-toast.show{opacity:1;transform:translateY(0)}
#workpro-crm.workpro-wrap.crm-auth-visible .wpc-toast.is-error{border-color:#fecaca;background:#fff5f5;color:#b42318}

/* Auto Adjust is a compact utility action; table widths themselves persist via
   the stable v2 localStorage key even after refresh. */
#workpro-crm.workpro-wrap.crm-auth-visible #resetDashboardColumns.wpc-auto-adjust-btn{
  min-width:92px;
  height:36px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  white-space:nowrap;
}

@media (max-width:767px){
  #workpro-crm.workpro-wrap.crm-auth-visible .warning-policy-box p{font-size:12px;line-height:1.5}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-toast-stack{position:fixed;top:92px;left:14px;right:14px;align-items:stretch}
  #workpro-crm.workpro-wrap.crm-auth-visible .wpc-toast{min-width:0;max-width:none;width:100%;box-sizing:border-box}
  #workpro-crm.workpro-wrap.crm-auth-visible .main-database-table .member{font-size:11px}
}
