:root{--staff-bg-app:#f4f7fb;--staff-sidebar-bg:#03172e;--staff-sidebar-nav-hover:#ffffff14;--staff-sidebar-active:#0062ff;--staff-text-navy:#0b1f3a;--staff-text-muted:#64748b;--staff-text-light:#94a3b8;--staff-border-card:#e2e8f0;--staff-border-subtle:#edf2f7;--staff-radius-card:14px;--staff-radius-sm:8px}.staff-body{font-family:var(--font-family-base,"Plus Jakarta Sans", -apple-system, sans-serif);background-color:var(--staff-bg-app);color:var(--staff-text-navy);flex-direction:column;min-height:100vh;margin:0;padding:0;display:flex}.staff-layout{flex-direction:column;width:100%;min-height:100vh;display:flex}.staff-header{z-index:1000;background-color:#fff;border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;height:68px;padding:0 24px;display:flex;position:sticky;top:0;box-shadow:0 1px 3px #0b1f3a08}.staff-header-left{flex:1;align-items:center;gap:16px;max-width:600px;display:flex}.staff-header-logo-link{flex-shrink:0;align-items:center;text-decoration:none;display:flex}.staff-header-logo{object-fit:contain;width:auto;height:42px}.staff-toggle-btn{cursor:pointer;color:#334155;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;transition:background-color .15s;display:flex}.staff-toggle-btn:hover{color:#0b1f3a;background-color:#f1f5f9}.staff-toggle-btn svg{width:22px;height:22px}.staff-search-wrap{width:380px;max-width:100%;position:relative}.staff-search-icon{color:#94a3b8;pointer-events:none;align-items:center;display:flex;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.staff-search-icon svg{width:16px;height:16px}.staff-search-input{color:#0b1f3a;box-sizing:border-box;background-color:#fff;border:1px solid #cbd5e1;border-radius:8px;outline:none;width:100%;padding:8px 14px 8px 36px;font-size:.84rem;transition:border-color .15s,box-shadow .15s}.staff-search-input:focus{border-color:#0062ff;box-shadow:0 0 0 3px #0062ff1f}.staff-search-input::placeholder{color:#94a3b8}.staff-header-right{align-items:center;gap:16px;display:flex}.staff-branch-select-wrap{position:relative}.staff-branch-btn{color:#0b1f3a;cursor:pointer;background-color:#fff;border:1px solid #cbd5e1;border-radius:8px;align-items:center;gap:7px;padding:7px 12px;font-size:.825rem;font-weight:600;transition:all .15s;display:flex}.staff-branch-btn:hover{background-color:#f8fafc;border-color:#0062ff}.staff-branch-icon{color:#0062ff;align-items:center;display:flex}.staff-branch-icon svg{width:15px;height:15px}.staff-bell-wrap{position:relative}.staff-bell-btn{cursor:pointer;color:#334155;background:0 0;border:none;border-radius:8px;justify-content:center;align-items:center;padding:6px;transition:background-color .15s;display:flex;position:relative}.staff-bell-btn:hover{background-color:#f1f5f9}.staff-bell-btn svg{width:20px;height:20px}.staff-badge-red{color:#fff;background-color:#ef4444;border:1.5px solid #fff;border-radius:10px;justify-content:center;align-items:center;min-width:16px;height:16px;padding:1px 4px;font-size:.65rem;font-weight:800;display:flex;position:absolute;top:1px;right:1px}.staff-user-menu-wrap{position:relative}.staff-user-btn{cursor:pointer;background:0 0;border:none;border-radius:8px;align-items:center;gap:10px;padding:4px 6px;transition:background-color .15s;display:flex}.staff-user-btn:hover{background-color:#f1f5f9}.staff-avatar-img{object-fit:cover;border:2px solid #e2e8f0;border-radius:50%;width:38px;height:38px}.staff-user-meta{text-align:left;flex-direction:column;display:flex}.staff-user-name{color:#0b1f3a;font-size:.84rem;font-weight:700;line-height:1.2}.staff-user-role{color:#64748b;font-size:.72rem;line-height:1.2}.staff-chevron-icon{color:#64748b;align-items:center;width:14px;height:14px;display:flex}.btn-phone-preview-toggle{color:#166534;cursor:pointer;background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:1px solid #86efac;border-radius:20px;align-items:center;gap:6px;padding:6px 12px;font-size:.78rem;font-weight:700;transition:all .2s;display:inline-flex}.btn-phone-preview-toggle:hover{background:#bbf7d0;transform:translateY(-1px)}.btn-phone-preview-toggle svg{width:14px;height:14px}.staff-body-wrap{flex:1;min-height:calc(100vh - 68px);display:flex}.staff-sidebar{z-index:900;background-color:#03172e;border-right:1px solid #ffffff14;flex-direction:column;flex-shrink:0;width:240px;height:calc(100vh - 68px);transition:transform .25s,width .25s;display:flex;position:sticky;top:68px;overflow-y:auto}.staff-sidebar-nav{flex-direction:column;flex:1;gap:4px;padding:16px 12px 24px;display:flex}.staff-nav-item{color:#94a3b8;-webkit-user-select:none;user-select:none;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 14px;font-size:.835rem;font-weight:500;text-decoration:none;transition:all .15s;display:flex;position:relative}.staff-nav-left{align-items:center;gap:12px;display:flex}.staff-nav-item:hover{color:#fff;background-color:#ffffff14}.staff-nav-item.active{color:#fff;background-color:#0062ff;font-weight:600;box-shadow:0 4px 12px #0062ff59}.staff-nav-icon{flex-shrink:0;justify-content:center;align-items:center;width:18px;height:18px;display:flex}.staff-nav-icon svg{width:18px;height:18px}.staff-nav-badge{color:#fff;background-color:#ef4444;border-radius:10px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:1px 6px;font-size:.7rem;font-weight:800;display:flex}.staff-content-area{background-color:var(--staff-bg-app);flex-direction:column;flex:1;gap:20px;min-width:0;padding:24px 28px 48px;display:flex}.staff-welcome-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.staff-welcome-left{flex-direction:column;gap:4px;display:flex}.staff-welcome-title{color:#0b1f3a;letter-spacing:-.4px;align-items:center;gap:6px;margin:0;font-size:1.55rem;font-weight:800;display:flex}.staff-welcome-subtitle{color:#64748b;margin:0;font-size:.875rem}.staff-date-pill{color:#334155;background-color:#fff;border:1px solid #e2e8f0;border-radius:10px;align-items:center;gap:8px;padding:8px 16px;font-size:.84rem;font-weight:600;display:inline-flex;box-shadow:0 1px 3px #0b1f3a08}.staff-date-pill svg{color:#0062ff;width:16px;height:16px}.staff-kpi-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.staff-kpi-card{border-radius:var(--staff-radius-card);cursor:pointer;-webkit-user-select:none;user-select:none;background-color:#fff;border:1px solid #e2e8f0;align-items:center;gap:16px;padding:16px 20px;transition:all .18s;display:flex;box-shadow:0 2px 6px #0b1f3a08}.staff-kpi-card:hover{transform:translateY(-2px);box-shadow:0 8px 18px #0b1f3a14}.staff-kpi-card.active-filter{outline:2px solid #0062ff;box-shadow:0 0 0 4px #0062ff26}.staff-kpi-icon-wrap{border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;display:flex}.staff-kpi-icon-wrap svg{width:24px;height:24px}.staff-kpi-content{flex-direction:column;display:flex}.staff-kpi-count{color:#0b1f3a;letter-spacing:-.5px;font-size:1.7rem;font-weight:800;line-height:1.1}.staff-kpi-label{color:#64748b;white-space:nowrap;margin-top:2px;font-size:.825rem;font-weight:600}.staff-kpi-meta{align-items:center;gap:3px;margin-top:4px;font-size:.74rem;font-weight:700;display:flex}.staff-kpi-card.kpi-blue{background-color:#eef6ff;border-color:#dbeafe}.staff-kpi-card.kpi-blue .staff-kpi-icon-wrap{color:#fff;background-color:#0062ff}.staff-kpi-card.kpi-blue .staff-kpi-meta{color:#10b981}.staff-kpi-card.kpi-green{background-color:#eefbf4;border-color:#d1fae5}.staff-kpi-card.kpi-green .staff-kpi-icon-wrap{color:#fff;background-color:#10b981}.staff-kpi-card.kpi-green .staff-kpi-meta{color:#10b981}.staff-kpi-card.kpi-orange{background-color:#fff9f0;border-color:#fed7aa}.staff-kpi-card.kpi-orange .staff-kpi-icon-wrap{color:#fff;background-color:#f97316}.staff-kpi-card.kpi-orange .staff-kpi-meta{color:#64748b}.staff-kpi-card.kpi-purple{background-color:#f7f3ff;border-color:#ede9fe}.staff-kpi-card.kpi-purple .staff-kpi-icon-wrap{color:#fff;background-color:#8b5cf6}.staff-kpi-card.kpi-purple .staff-kpi-meta{color:#64748b}.filter-active-notice{color:#1e40af;background-color:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;justify-content:space-between;align-items:center;padding:8px 14px;font-size:.825rem;display:flex}.btn-clear-filter{color:#0062ff;cursor:pointer;background:0 0;border:none;padding:0;font-size:.825rem;font-weight:700;text-decoration:underline}.staff-main-grid{grid-template-columns:1.62fr 1fr;align-items:start;gap:20px;display:grid}.staff-grid-left,.staff-grid-right{flex-direction:column;gap:20px;min-width:0;display:flex}.staff-panel-card{border:1px solid var(--staff-border-card);border-radius:var(--staff-radius-card);background-color:#fff;overflow:hidden;box-shadow:0 2px 8px #0b1f3a08}.staff-panel-header{border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;padding:18px 22px;display:flex}.staff-panel-title{color:#0b1f3a;margin:0;font-size:1.08rem;font-weight:800}.staff-panel-link{color:#0062ff;cursor:pointer;font-size:.825rem;font-weight:700;text-decoration:none;transition:color .15s}.staff-panel-link:hover{color:#004ecc;text-decoration:underline}.schedule-list{flex-direction:column;padding:12px 20px;display:flex;position:relative}.schedule-item{cursor:pointer;border-radius:10px;align-items:center;gap:16px;padding:14px 10px;transition:background-color .15s;display:flex;position:relative}.schedule-item:hover{background-color:#f8fafc}.schedule-item.selected{background-color:#f1f6fe;border:1px solid #bfdbfe}.schedule-indicator-wrap{flex-shrink:0;justify-content:center;align-items:center;width:28px;display:flex;position:relative}.schedule-timeline-connector{z-index:1;background-color:#e2e8f0;width:2px;position:absolute;top:50%;bottom:-40px;left:50%;transform:translate(-50%)}.schedule-item:last-child .schedule-timeline-connector{display:none}.schedule-dot{z-index:2;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;display:flex;position:relative}.schedule-dot.dot-completed{color:#fff;background-color:#10b981}.schedule-dot.dot-completed svg{width:14px;height:14px}.schedule-dot.dot-progress{background-color:#f97316;box-shadow:0 0 0 3px #f9731633}.schedule-dot.dot-upcoming{background-color:#fff;border:2px solid #3b82f6}.schedule-dot.dot-pending{background-color:#fff;border:2px solid #cbd5e1}.schedule-time-col{color:#475569;letter-spacing:-.2px;flex-shrink:0;width:140px;font-size:.815rem;font-weight:700}.schedule-info-col{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.schedule-thumb-img{object-fit:cover;border:1px solid #e2e8f0;border-radius:8px;flex-shrink:0;width:44px;height:44px}.schedule-info-text{flex-direction:column;min-width:0;display:flex}.schedule-client-name{color:#0b1f3a;white-space:nowrap;text-overflow:ellipsis;font-size:.875rem;font-weight:700;overflow:hidden}.schedule-service-name{color:#64748b;margin-top:1px;font-size:.775rem}.schedule-location-text{color:#94a3b8;align-items:center;gap:3px;margin-top:2px;font-size:.725rem;display:flex}.schedule-badge-col{flex-shrink:0}.status-badge{white-space:nowrap;border-radius:20px;align-items:center;padding:4px 10px;font-size:.735rem;font-weight:700;display:inline-flex}.status-badge.badge-completed{color:#15803d;background-color:#dcfce7}.status-badge.badge-progress{color:#c2410c;background-color:#ffedd5}.status-badge.badge-upcoming{color:#0369a1;background-color:#e0f2fe}.status-badge.badge-pending{color:#64748b;background-color:#f1f5f9}.schedule-actions-col{flex-shrink:0;align-items:center;gap:6px;display:flex}.btn-view-details{color:#0062ff;cursor:pointer;white-space:nowrap;background-color:#fff;border:1px solid #0062ff;border-radius:6px;padding:6px 12px;font-size:.775rem;font-weight:700;transition:all .15s}.btn-view-details:hover{background-color:#eff6ff}.btn-start-job{color:#fff;cursor:pointer;white-space:nowrap;background-color:#0062ff;border:1px solid #0062ff;border-radius:6px;padding:6px 14px;font-size:.775rem;font-weight:700;transition:all .15s;box-shadow:0 2px 6px #0062ff40}.btn-start-job:hover{background-color:#0052d9}.btn-schedule-dots{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:4px;align-items:center;padding:4px;display:flex}.btn-schedule-dots:hover{color:#0b1f3a;background-color:#f1f5f9}.staff-sub-grid{grid-template-columns:1.1fr .9fr;gap:16px;display:grid}.tasks-header-row{border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.tasks-due-label{color:#94a3b8;text-transform:uppercase;letter-spacing:.4px;font-size:.775rem;font-weight:700}.tasks-list{flex-direction:column;gap:8px;padding:8px 16px 16px;display:flex}.task-item{background-color:#f8fafc;border:1px solid #edf2f7;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;transition:all .15s;display:flex}.task-item:hover{background-color:#fff;border-color:#cbd5e1}.task-item.task-completed{opacity:.65;background-color:#f1f5f9}.task-item.task-completed .task-title{color:#94a3b8;text-decoration:line-through}.task-left{flex:1;align-items:center;gap:12px;min-width:0;display:flex}.task-checkbox-custom{cursor:pointer;accent-color:#0062ff;border:2px solid #cbd5e1;border-radius:4px;flex-shrink:0;width:18px;height:18px}.task-title{color:#1e293b;white-space:nowrap;text-overflow:ellipsis;font-size:.8125rem;font-weight:600;overflow:hidden}.task-right{flex-shrink:0;align-items:center;gap:10px;display:flex}.task-due-time{color:#64748b;white-space:nowrap;font-size:.75rem;font-weight:600}.badge-task-pending{color:#a16207;background-color:#fef9c3;border-radius:12px;padding:3px 8px;font-size:.7rem;font-weight:700}.badge-task-done{color:#15803d;background-color:#dcfce7;border-radius:12px;padding:3px 8px;font-size:.7rem;font-weight:700}.quick-actions-grid{grid-template-columns:repeat(4,1fr);gap:12px;padding:16px 20px 22px;display:grid}.quick-action-tile{cursor:pointer;text-align:center;-webkit-user-select:none;user-select:none;border:1px solid #0000;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:14px 8px;transition:all .18s;display:flex}.quick-action-tile:hover{transform:translateY(-2px);box-shadow:0 6px 14px #0b1f3a0f}.quick-action-icon{border-radius:10px;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.quick-action-icon svg{width:22px;height:22px}.quick-action-label{font-size:.775rem;font-weight:700;line-height:1.2}.action-photos{color:#047857;background-color:#ecfdf5;border-color:#a7f3d0}.action-photos .quick-action-icon{color:#fff;background-color:#10b981}.action-report{color:#1d4ed8;background-color:#eff6ff;border-color:#bfdbfe}.action-report .quick-action-icon{color:#fff;background-color:#0062ff}.action-support{color:#c2410c;background-color:#fff7ed;border-color:#fed7aa}.action-support .quick-action-icon{color:#fff;background-color:#f97316}.action-message{color:#6d28d9;background-color:#f5f3ff;border-color:#ddd6fe}.action-message .quick-action-icon{color:#fff;background-color:#8b5cf6}.current-assign-card{padding:0}.current-assign-banner-wrap{background-color:#03172e;width:100%;height:160px;position:relative;overflow:hidden}.current-assign-banner{object-fit:cover;width:100%;height:100%;transition:transform .3s}.current-assign-body{flex-direction:column;gap:16px;padding:20px 22px;display:flex}.current-assign-title-block{flex-direction:column;gap:3px;display:flex}.current-assign-client-name{color:#0b1f3a;letter-spacing:-.3px;margin:0;font-size:1.25rem;font-weight:800}.current-assign-service{color:#64748b;margin:0;font-size:.86rem;font-weight:600}.current-assign-meta-list{background-color:#f8fafc;border:1px solid #edf2f7;border-radius:10px;flex-direction:column;gap:8px;padding:12px 14px;display:flex}.current-meta-row{color:#475569;align-items:center;gap:10px;font-size:.825rem;display:flex}.current-meta-row svg{color:#64748b;flex-shrink:0;width:16px;height:16px}.current-meta-row strong{color:#1e293b}.current-phone-link{color:#0062ff;font-weight:700;text-decoration:none;transition:color .15s}.current-phone-link:hover{color:#004ecc;text-decoration:underline}.current-actions-wrap{flex-direction:column;gap:10px;margin-top:4px;display:flex}.btn-mark-completed-primary{color:#fff;cursor:pointer;background-color:#0062ff;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:12px 18px;font-size:.88rem;font-weight:700;transition:all .15s;display:flex;box-shadow:0 4px 12px #0062ff47}.btn-mark-completed-primary:hover{background-color:#0052d9;transform:translateY(-1px);box-shadow:0 6px 16px #0062ff59}.btn-mark-completed-primary.disabled{cursor:not-allowed;box-shadow:none;background-color:#94a3b8;transform:none}.btn-mark-completed-primary svg{width:18px;height:18px}.current-secondary-actions-row{grid-template-columns:1fr 1fr;gap:10px;display:grid}.btn-action-outline{color:#0062ff;cursor:pointer;box-sizing:border-box;background-color:#fff;border:1px solid #0062ff;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 14px;font-size:.825rem;font-weight:700;text-decoration:none;transition:all .15s;display:inline-flex}.btn-action-outline:hover{background-color:#eff6ff;border-color:#0052d9}.btn-action-outline svg{width:16px;height:16px}.assign-details-table{border-collapse:collapse;width:100%}.assign-details-table tr{border-bottom:1px solid #f1f5f9}.assign-details-table tr:last-child{border-bottom:none}.assign-details-table th{text-align:left;color:#64748b;vertical-align:top;background-color:#fafbfc;width:40%;padding:12px 20px;font-size:.8125rem;font-weight:700}.assign-details-table td{color:#0b1f3a;vertical-align:top;padding:12px 20px;font-size:.825rem;font-weight:600}.staff-mobile-bottom-nav{z-index:999;background-color:#fff;border-top:1px solid #e2e8f0;justify-content:space-around;align-items:center;height:64px;padding:0 8px;display:none;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 10px #0000000d}.staff-mob-nav-btn{color:#64748b;cursor:pointer;background:0 0;border:none;flex-direction:column;justify-content:center;align-items:center;gap:3px;padding:6px 10px;font-size:.68rem;font-weight:600;text-decoration:none;display:flex;position:relative}.staff-mob-nav-btn svg{width:20px;height:20px}.staff-mob-nav-btn.active{color:#0062ff;font-weight:700}.staff-mob-nav-badge{color:#fff;background-color:#ef4444;border-radius:10px;justify-content:center;align-items:center;min-width:14px;height:14px;padding:1px 4px;font-size:.6rem;font-weight:800;display:flex;position:absolute;top:2px;right:14px}.phone-simulator-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:2000;background-color:#0b1f3ab3;justify-content:center;align-items:center;padding:20px;display:none;position:fixed;inset:0}.phone-simulator-overlay.show{display:flex}.phone-simulator-shell{background-color:#000;border-radius:48px;flex-direction:column;width:390px;height:844px;max-height:94vh;padding:12px;display:flex;position:relative;box-shadow:0 25px 60px #0006,0 0 0 2px #475569}.phone-simulator-close{color:#0b1f3a;cursor:pointer;z-index:20;background-color:#fff;border:1px solid #cbd5e1;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:1.2rem;display:flex;position:absolute;top:-16px;right:-16px;box-shadow:0 4px 12px #0003}.phone-screen{background-color:#f4f7fb;border-radius:38px;flex-direction:column;width:100%;height:100%;display:flex;position:relative;overflow-y:auto}.phone-screen::-webkit-scrollbar{width:4px}.phone-screen::-webkit-scrollbar-thumb{background:#00000026;border-radius:4px}.phone-status-bar{color:#0b1f3a;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:100;background-color:#ffffffe6;justify-content:space-between;align-items:center;height:44px;padding:0 24px;font-size:.85rem;font-weight:700;display:flex;position:sticky;top:0}.phone-status-icons{align-items:center;gap:6px;display:flex}.phone-status-icons svg{width:16px;height:16px}.phone-top-bar{background-color:#fff;border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;height:54px;padding:0 16px;display:flex}.phone-top-bar img{height:32px}.staff-modal-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1500;background-color:#0b1f3a99;justify-content:center;align-items:center;padding:16px;display:none;position:fixed;inset:0}.staff-modal-overlay.show{display:flex}.staff-modal-box{background-color:#fff;border-radius:14px;flex-direction:column;width:540px;max-width:100%;max-height:90vh;animation:.2s modalSlideUp;display:flex;overflow:hidden;box-shadow:0 20px 40px #0b1f3a33}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(16px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}.staff-modal-header{border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;padding:18px 24px;display:flex}.staff-modal-title{color:#0b1f3a;margin:0;font-size:1.15rem;font-weight:800}.staff-modal-close-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:4px;font-size:1.4rem;line-height:1}.staff-modal-close-btn:hover{color:#0b1f3a;background-color:#f1f5f9}.staff-modal-body{flex-direction:column;gap:16px;padding:20px 24px;display:flex;overflow-y:auto}.staff-modal-footer{background-color:#f8fafc;border-top:1px solid #f1f5f9;justify-content:flex-end;align-items:center;gap:12px;padding:16px 24px;display:flex}.form-group-custom{flex-direction:column;gap:6px;display:flex}.form-group-custom label{color:#1e293b;font-size:.825rem;font-weight:700}.form-control-custom{color:#0b1f3a;box-sizing:border-box;background-color:#fff;border:1px solid #cbd5e1;border-radius:8px;outline:none;width:100%;padding:10px 14px;font-family:inherit;font-size:.85rem}.form-control-custom:focus{border-color:#0062ff;box-shadow:0 0 0 3px #0062ff1f}textarea.form-control-custom{resize:vertical;min-height:90px}.btn-modal-cancel{color:#475569;cursor:pointer;background-color:#fff;border:1px solid #cbd5e1;border-radius:8px;padding:9px 18px;font-size:.84rem;font-weight:700}.btn-modal-submit{color:#fff;cursor:pointer;background-color:#0062ff;border:none;border-radius:8px;padding:9px 20px;font-size:.84rem;font-weight:700;box-shadow:0 2px 8px #0062ff40}.btn-modal-submit:hover{background-color:#0052d9}.upload-drop-zone{text-align:center;cursor:pointer;background-color:#f8fafc;border:2px dashed #cbd5e1;border-radius:10px;flex-direction:column;align-items:center;gap:8px;padding:24px 16px;transition:all .15s;display:flex}.upload-drop-zone:hover{background-color:#eff6ff;border-color:#0062ff}.upload-drop-zone svg{color:#0062ff;width:36px;height:36px}.upload-preview-img{object-fit:cover;border:1px solid #cbd5e1;border-radius:8px;max-height:180px;margin-top:10px;display:none}.calendar-month-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.calendar-month-title{color:#0b1f3a;font-size:1.05rem;font-weight:800}.calendar-nav-btns{gap:6px;display:flex}.calendar-grid-table{border-collapse:collapse;text-align:center;width:100%}.calendar-grid-table th{color:#94a3b8;padding:8px;font-size:.75rem;font-weight:700}.calendar-grid-table td{cursor:pointer;border-radius:6px;height:38px;padding:8px;font-size:.8rem;font-weight:600}.calendar-grid-table td:hover:not(.empty-day){color:#0062ff;background-color:#eff6ff}.calendar-grid-table td.today-cell{color:#fff;background-color:#0062ff;font-weight:800;box-shadow:0 2px 6px #0062ff4d}.calendar-grid-table td.has-jobs:after{content:"";background-color:#10b981;border-radius:50%;width:4px;height:4px;margin:2px auto 0;display:block}.chat-conversation-thread{flex-direction:column;gap:12px;max-height:300px;padding:4px;display:flex;overflow-y:auto}.chat-bubble{border-radius:12px;max-width:78%;padding:10px 14px;font-size:.825rem;line-height:1.4;position:relative}.chat-bubble.bubble-admin{color:#1e293b;background-color:#f1f5f9;border-bottom-left-radius:2px;align-self:flex-start}.chat-bubble.bubble-staff{color:#fff;background-color:#0062ff;border-bottom-right-radius:2px;align-self:flex-end}.chat-time-tag{opacity:.75;text-align:right;margin-top:4px;font-size:.65rem;display:block}.staff-dropdown-menu{z-index:1200;background-color:#fff;border:1px solid #e2e8f0;border-radius:10px;width:280px;display:none;position:absolute;top:calc(100% + 8px);right:0;overflow:hidden;box-shadow:0 10px 25px #0b1f3a1f}.staff-dropdown-menu.show{display:block}.notif-menu-header{border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;padding:12px 16px;font-size:.85rem;font-weight:800;display:flex}.notif-list{flex-direction:column;max-height:280px;display:flex;overflow-y:auto}.notif-item{color:#334155;cursor:pointer;border-bottom:1px solid #f8fafc;flex-direction:column;gap:2px;padding:10px 14px;font-size:.775rem;transition:background-color .15s;display:flex}.notif-item:hover{background-color:#f8fafc}.notif-time{color:#94a3b8;font-size:.68rem}.user-menu-item{color:#334155;cursor:pointer;align-items:center;gap:10px;padding:10px 16px;font-size:.825rem;font-weight:600;text-decoration:none;transition:background-color .15s;display:flex}.user-menu-item:hover{color:#0062ff;background-color:#f1f5f9}.user-menu-divider{background-color:#f1f5f9;height:1px;margin:4px 0}@media (width<=1200px){.staff-main-grid{grid-template-columns:1.4fr 1fr}.staff-kpi-grid{gap:12px}.staff-kpi-card{padding:14px}.staff-kpi-count{font-size:1.5rem}}@media (width<=1024px){.staff-sidebar{z-index:1100;position:fixed;top:68px;bottom:0;left:0;transform:translate(-100%)}.staff-sidebar.open{transform:translate(0)}.staff-main-grid{grid-template-columns:1fr}.staff-grid-right{order:-1}.staff-search-wrap{width:240px}}@media (width<=768px){.staff-header{height:60px;padding:0 16px}.staff-search-wrap{display:none}.staff-content-area{padding:16px 16px 80px}.staff-kpi-grid{grid-template-columns:repeat(2,1fr);gap:12px}.staff-sub-grid{grid-template-columns:1fr}.quick-actions-grid{grid-template-columns:repeat(2,1fr)}.schedule-item{gap:10px;padding:12px 6px}.schedule-time-col{width:110px;font-size:.75rem}.schedule-actions-col{display:none}.schedule-item:after{content:"›";color:#94a3b8;margin-left:auto;font-size:1.3rem}.staff-mobile-bottom-nav{display:flex}.staff-date-pill{padding:6px 12px;font-size:.775rem}.staff-welcome-title{font-size:1.35rem}}.job-details-page{box-sizing:border-box;flex-direction:column;gap:20px;width:100%;max-width:1440px;margin:0 auto;padding:24px;display:flex}.job-header-card{flex-wrap:wrap;justify-content:space-between;align-items:flex-start;gap:16px;padding:4px 0 8px;display:flex}.job-header-left{flex-direction:column;gap:6px;display:flex}.job-back-link{color:#64748b;align-items:center;gap:6px;font-size:.85rem;font-weight:600;text-decoration:none;transition:color .15s;display:inline-flex}.job-back-link:hover{color:#0062ff}.job-back-link svg{width:16px;height:16px}.job-title-row{align-items:baseline;gap:12px;display:flex}.job-title{color:#0b1f3a;letter-spacing:-.02em;margin:0;font-size:1.6rem;font-weight:800}.job-subtitle{color:#64748b;margin:0;font-size:.88rem;font-weight:500}.job-header-right{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.job-ref-badge{color:#0b1f3a;letter-spacing:-.01em;font-size:1.05rem;font-weight:800}.job-status-pill{border-radius:9999px;align-items:center;gap:6px;padding:6px 14px;font-size:.82rem;font-weight:700;display:inline-flex}.job-status-pill.status-in-progress{color:#15803d;background-color:#dcfce7}.job-status-pill.status-not-started{color:#475569;background-color:#f1f5f9}.job-status-pill.status-completed{color:#166534;background-color:#dcfce7}.job-status-pill.status-on-hold{color:#b45309;background-color:#fef3c7}.job-actions-row{align-items:center;gap:10px;display:flex}.btn-job-action{color:#0062ff;cursor:pointer;background-color:#fff;border:1.5px solid #0062ff;border-radius:8px;align-items:center;gap:8px;padding:8px 16px;font-size:.85rem;font-weight:700;text-decoration:none;transition:all .15s;display:inline-flex}.btn-job-action:hover{background-color:#eff6ff}.btn-job-action svg{width:16px;height:16px}.btn-job-more{color:#475569;cursor:pointer;background-color:#fff;border:1px solid #cbd5e1;border-radius:8px;align-items:center;gap:6px;padding:8px 14px;font-size:.85rem;font-weight:600;transition:all .15s;display:inline-flex;position:relative}.btn-job-more:hover{color:#0b1f3a;background-color:#f8fafc}.timeline-card{background-color:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:22px 28px;box-shadow:0 1px 3px #0b1f3a0a}.progress-timeline{justify-content:space-between;align-items:flex-start;display:flex;position:relative}.progress-step{text-align:center;z-index:2;flex-direction:column;flex:1;align-items:center;display:flex;position:relative}.progress-step-icon-wrap{color:#94a3b8;background-color:#f1f5f9;border:2px solid #e2e8f0;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;margin-bottom:8px;transition:all .2s;display:flex}.progress-step-icon-wrap svg{width:18px;height:18px}.progress-step.step-completed .progress-step-icon-wrap{color:#fff;background-color:#16a34a;border-color:#16a34a}.progress-step.step-active .progress-step-icon-wrap{color:#fff;background-color:#0062ff;border-color:#0062ff;box-shadow:0 0 0 4px #0062ff2e}.progress-step.step-pending .progress-step-icon-wrap{color:#94a3b8;background-color:#f8fafc;border-color:#cbd5e1}.progress-step-label{color:#0b1f3a;margin-bottom:4px;font-size:.85rem;font-weight:700}.progress-step.step-pending .progress-step-label{color:#64748b;font-weight:600}.progress-step-time{color:#64748b;font-size:.74rem;font-weight:500}.progress-line-track{z-index:1;background-color:#e2e8f0;height:3px;position:absolute;top:18px;left:6%;right:6%}.progress-line-fill{background:linear-gradient(90deg,#16a34a 0% 45%,#0062ff 55% 100%);width:50%;height:100%;transition:width .3s;position:absolute;top:0;left:0}.job-content-grid{grid-template-columns:1fr 1fr 1.08fr;align-items:start;gap:20px;display:grid}.job-column{flex-direction:column;gap:20px;display:flex}.job-card{background-color:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:20px;box-shadow:0 1px 3px #0b1f3a0a}.job-card-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.job-card-title{color:#0b1f3a;margin:0;font-size:1.05rem;font-weight:800}.job-card-link{color:#0062ff;cursor:pointer;font-size:.82rem;font-weight:700;text-decoration:none;transition:color .15s}.job-card-link:hover{text-decoration:underline}.client-property-row{align-items:center;gap:14px;margin-bottom:16px;display:flex}.client-prop-thumb{object-fit:cover;border:1px solid #e2e8f0;border-radius:10px;width:54px;height:54px}.client-prop-info{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.client-prop-name{color:#0b1f3a;margin:0;font-size:1.1rem;font-weight:800}.client-status-badge{color:#15803d;background-color:#dcfce7;border-radius:9999px;padding:3px 8px;font-size:.72rem;font-weight:700}.client-meta-list{flex-direction:column;gap:12px;margin-bottom:18px;display:flex}.client-meta-item{color:#334155;align-items:flex-start;gap:12px;font-size:.86rem;display:flex}.client-meta-icon{color:#64748b;flex-shrink:0;width:18px;height:18px;margin-top:2px}.client-meta-person{flex-direction:column;display:flex}.client-person-name{color:#0b1f3a;font-weight:700}.client-person-role{color:#64748b;font-size:.75rem}.client-meta-link{color:#0b1f3a;font-weight:500;text-decoration:none}.client-meta-link:hover{color:#0062ff;text-decoration:underline}.btn-view-client-profile{color:#0062ff;cursor:pointer;box-sizing:border-box;background-color:#fff;border:1.5px solid #0062ff;border-radius:8px;justify-content:center;align-items:center;gap:8px;width:100%;padding:10px;font-size:.85rem;font-weight:700;text-decoration:none;transition:all .15s;display:flex}.btn-view-client-profile:hover{background-color:#eff6ff}.service-details-list{flex-direction:column;gap:12px;margin-bottom:16px;display:flex}.service-meta-item{justify-content:space-between;align-items:center;gap:12px;font-size:.85rem;display:flex}.service-meta-label{color:#64748b;align-items:center;gap:10px;font-weight:600;display:flex}.service-meta-label svg{color:#64748b;width:17px;height:17px}.service-meta-val{color:#0b1f3a;text-align:right;font-weight:700}.special-instructions-box{background-color:#fffbeb;border:1px solid #fef3c7;border-radius:8px;padding:14px 16px}.special-instructions-title{color:#92400e;margin-bottom:8px;font-size:.84rem;font-weight:800}.special-instructions-list{color:#b45309;margin:0;padding-left:18px;font-size:.8rem;line-height:1.6}.special-instructions-list li{margin-bottom:4px}.map-preview-wrap{background-color:#f1f5f9;border:1px solid #e2e8f0;border-radius:10px;width:100%;height:200px;margin-bottom:14px;position:relative;overflow:hidden}.map-svg-canvas{width:100%;height:100%;display:block}.map-location-bottom{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.map-address-text{color:#475569;flex:1;align-items:flex-start;gap:8px;font-size:.82rem;display:flex}.map-address-text svg{color:#ef4444;flex-shrink:0;width:16px;height:16px;margin-top:2px}.btn-open-maps{color:#0062ff;cursor:pointer;white-space:nowrap;background-color:#fff;border:1px solid #0062ff;border-radius:6px;align-items:center;gap:6px;padding:6px 12px;font-size:.78rem;font-weight:700;text-decoration:none;display:inline-flex}.btn-open-maps:hover{background-color:#eff6ff}.team-members-list{flex-direction:column;gap:14px;display:flex}.team-member-item{border-bottom:1px solid #f1f5f9;justify-content:space-between;align-items:center;gap:12px;padding-bottom:12px;display:flex}.team-member-item:last-child{border-bottom:none;padding-bottom:0}.team-member-left{align-items:center;gap:12px;display:flex}.team-avatar-img{object-fit:cover;border:1px solid #e2e8f0;border-radius:8px;width:44px;height:44px}.team-member-info{flex-direction:column;display:flex}.team-member-name{color:#0b1f3a;font-size:.88rem;font-weight:700}.team-member-phone{color:#64748b;font-size:.78rem;text-decoration:none}.team-member-phone:hover{color:#0062ff}.team-member-badges{align-items:center;gap:8px;display:flex}.team-role-badge{border-radius:4px;padding:3px 8px;font-size:.72rem;font-weight:700}.team-role-lead{color:#0062ff;background-color:#eff6ff}.team-role-staff{color:#475569;background-color:#f1f5f9}.team-attendance-badge{color:#15803d;background-color:#dcfce7;border-radius:4px;padding:3px 8px;font-size:.72rem;font-weight:700}.status-tiles-grid{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px;display:grid}.status-tile-btn{cursor:pointer;background-color:#fff;border:1.5px solid #e2e8f0;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:14px 10px;font-family:inherit;transition:all .15s;display:flex}.status-tile-btn svg{width:22px;height:22px;transition:transform .15s}.status-tile-label{font-size:.82rem;font-weight:700}.status-tile-btn[data-status=Not\ Started]{color:#475569}.status-tile-btn[data-status=Not\ Started].active{color:#0b1f3a;background-color:#f1f5f9;border-color:#64748b;box-shadow:0 0 0 2px #64748b33}.status-tile-btn[data-status=In\ Progress]{color:#0062ff;background-color:#eff6ff;border-color:#bfdbfe}.status-tile-btn[data-status=In\ Progress].active{color:#fff;background-color:#0062ff;border-color:#0062ff;box-shadow:0 4px 12px #0062ff4d}.status-tile-btn[data-status=In\ Progress].active svg{color:#fff}.status-tile-btn[data-status=Completed]{color:#15803d;background-color:#f0fdf4;border-color:#bbf7d0}.status-tile-btn[data-status=Completed].active{color:#fff;background-color:#16a34a;border-color:#16a34a;box-shadow:0 4px 12px #16a34a4d}.status-tile-btn[data-status=Completed].active svg{color:#fff}.status-tile-btn[data-status=On\ Hold]{color:#b45309;background-color:#fffbeb;border-color:#fde68a}.status-tile-btn[data-status=On\ Hold].active{color:#fff;background-color:#d97706;border-color:#d97706;box-shadow:0 4px 12px #d977064d}.status-tile-btn[data-status=On\ Hold].active svg{color:#fff}.remarks-section{margin-bottom:20px}.remarks-header-row{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.remarks-label{color:#0b1f3a;font-size:.86rem;font-weight:700}.remarks-char-counter{color:#94a3b8;font-size:.74rem;font-weight:600}.remarks-textarea{color:#0b1f3a;box-sizing:border-box;resize:vertical;border:1px solid #cbd5e1;border-radius:8px;width:100%;height:90px;padding:10px 14px;font-family:inherit;font-size:.85rem;transition:border-color .15s,box-shadow .15s}.remarks-textarea:focus{border-color:#0062ff;outline:none;box-shadow:0 0 0 3px #0062ff1f}.photos-upload-section{margin-bottom:24px}.photos-section-header{justify-content:space-between;align-items:center;margin-bottom:10px;display:flex}.photos-label{color:#0b1f3a;font-size:.86rem;font-weight:700}.photo-type-toggle{background-color:#f1f5f9;border-radius:6px;padding:2px;display:inline-flex}.photo-type-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:3px 8px;font-size:.72rem;font-weight:700;transition:all .15s}.photo-type-btn.active{color:#0b1f3a;background-color:#fff;box-shadow:0 1px 2px #00000014}.photos-dropzone{text-align:center;cursor:pointer;background-color:#f8fafc;border:2px dashed #cbd5e1;border-radius:10px;margin-bottom:14px;padding:18px 12px;transition:all .15s}.photos-dropzone:hover,.photos-dropzone.drag-over{background-color:#eff6ff;border-color:#0062ff}.photos-dropzone-icon{color:#0062ff;width:28px;height:28px;margin-bottom:6px}.photos-dropzone-text{color:#0b1f3a;margin-bottom:2px;font-size:.82rem;font-weight:700}.photos-dropzone-subtext{color:#64748b;font-size:.72rem}.photo-previews-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.photo-preview-card{aspect-ratio:1;background-color:#f1f5f9;border:1px solid #e2e8f0;border-radius:8px;position:relative;overflow:hidden;box-shadow:0 1px 2px #0000000d}.photo-preview-img{object-fit:cover;width:100%;height:100%;display:block}.photo-remove-btn{color:#fff;cursor:pointer;z-index:2;background-color:#0f172abf;border:none;border-radius:50%;justify-content:center;align-items:center;width:20px;height:20px;font-size:11px;line-height:1;transition:background-color .15s;display:flex;position:absolute;top:4px;right:4px}.photo-remove-btn:hover{background-color:#ef4444}.photo-tag-badge{text-align:center;color:#fff;letter-spacing:.02em;z-index:2;padding:3px 0;font-size:.68rem;font-weight:700;position:absolute;bottom:0;left:0;right:0}.photo-tag-badge.tag-before{background-color:#334155}.photo-tag-badge.tag-after{background-color:#16a34a}.job-submit-actions-row{gap:12px;display:flex}.btn-save-update{color:#0062ff;cursor:pointer;background-color:#fff;border:1.5px solid #0062ff;border-radius:8px;flex:1;padding:12px;font-size:.88rem;font-weight:700;transition:all .15s}.btn-save-update:hover{background-color:#eff6ff}.btn-mark-completed-cta{color:#fff;cursor:pointer;background-color:#0062ff;border:1.5px solid #0062ff;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:8px;padding:12px;font-size:.88rem;font-weight:700;transition:all .15s;display:inline-flex;box-shadow:0 2px 6px #0062ff40}.btn-mark-completed-cta:hover{background-color:#0052d6;border-color:#0052d6}.btn-mark-completed-cta svg{width:17px;height:17px}.job-tabs-card{background-color:#fff;border:1px solid #e2e8f0;border-radius:12px;overflow:hidden;box-shadow:0 1px 3px #0b1f3a0a}.job-tab-nav{white-space:nowrap;scrollbar-width:none;border-bottom:1px solid #e2e8f0;align-items:center;gap:8px;padding:0 20px;display:flex;overflow-x:auto}.job-tab-nav::-webkit-scrollbar{display:none}.job-tab-btn{color:#64748b;cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;padding:14px 16px;font-family:inherit;font-size:.86rem;font-weight:600;transition:all .15s}.job-tab-btn:hover{color:#0b1f3a}.job-tab-btn.active{color:#0062ff;border-bottom-color:#0062ff;font-weight:700}.job-tab-content-pane{padding:24px}.tab-timeline-flow{grid-template-columns:repeat(4,1fr);gap:20px;display:grid;position:relative}.tab-timeline-item{flex-direction:column;gap:6px;padding-left:36px;display:flex;position:relative}.tab-timeline-icon-wrap{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:26px;height:26px;display:flex;position:absolute;top:0;left:0}.tab-timeline-icon-wrap svg{width:14px;height:14px}.tab-timeline-icon-wrap.icon-green{background-color:#16a34a}.tab-timeline-icon-wrap.icon-blue{background-color:#0062ff}.tab-timeline-icon-wrap.icon-slate{background-color:#0b1f3a}.tab-timeline-title{color:#0b1f3a;margin:0;font-size:.88rem;font-weight:800}.tab-timeline-time{color:#64748b;font-size:.74rem}.tab-timeline-desc{color:#475569;font-size:.78rem;line-height:1.4}.checklist-container{flex-direction:column;gap:10px;display:flex}.checklist-item-row{cursor:pointer;background-color:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;align-items:center;gap:12px;padding:10px 14px;transition:all .15s;display:flex}.checklist-item-row:hover{background-color:#f1f5f9}.checklist-checkbox{cursor:pointer;accent-color:#0062ff;width:18px;height:18px}.checklist-item-label{color:#0b1f3a;flex:1;font-size:.86rem;font-weight:600}.checklist-item-row.completed .checklist-item-label{color:#94a3b8;text-decoration:line-through}.checklist-item-time{color:#16a34a;font-size:.74rem;font-weight:600}.materials-table{border-collapse:collapse;width:100%;font-size:.85rem}.materials-table th{text-align:left;color:#475569;background-color:#f8fafc;border-bottom:2px solid #e2e8f0;padding:10px 14px;font-weight:700}.materials-table td{color:#334155;border-bottom:1px solid #e2e8f0;padding:12px 14px}.signature-canvas-wrap{background-color:#f8fafc;border:1px dashed #cbd5e1;border-radius:8px;flex-direction:column;align-items:center;gap:12px;padding:16px;display:flex}.signature-canvas{cursor:crosshair;background-color:#fff;border:1px solid #e2e8f0;border-radius:6px;width:100%;max-width:480px;height:140px}.job-more-menu{z-index:100;background-color:#fff;border:1px solid #e2e8f0;border-radius:8px;flex-direction:column;width:220px;margin-top:6px;display:none;position:absolute;top:100%;right:0;overflow:hidden;box-shadow:0 10px 25px #0000001a}.job-more-menu.open{display:flex}.job-more-item{color:#334155;align-items:center;gap:10px;padding:10px 14px;font-size:.82rem;text-decoration:none;transition:background-color .15s;display:flex}.job-more-item:hover{color:#0062ff;background-color:#f1f5f9}@media (width<=1100px){.job-content-grid{grid-template-columns:1fr 1fr}.job-column:nth-child(3){grid-column:span 2}}@media (width<=768px){.job-details-page{gap:16px;padding:14px 12px 90px}.job-header-card{flex-direction:column;gap:12px}.job-header-right{justify-content:space-between;width:100%}.job-actions-row{grid-template-columns:1fr 1fr 1fr;gap:8px;width:100%;display:grid}.btn-job-action,.btn-job-more{justify-content:center;padding:8px 10px;font-size:.8rem}.timeline-card{padding:16px 12px}.progress-step-icon-wrap{width:30px;height:30px}.progress-step-icon-wrap svg{width:15px;height:15px}.progress-step-label{font-size:.74rem}.progress-step-time{font-size:.65rem}.job-content-grid{grid-template-columns:1fr;gap:16px}.job-column:nth-child(3){grid-column:span 1}.tab-timeline-flow{grid-template-columns:1fr;gap:16px}.photo-previews-grid{grid-template-columns:repeat(4,1fr);gap:8px}.btn-mark-completed-cta{width:100%}.job-submit-actions-row{flex-direction:column}}