@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');

:root { --navy:#092b5a; --blue:#0b5ed7; --blue-2:#1a8cff; --ink:#152238; --muted:#667085; --canvas:#f4f7fb; --line:#e6ebf2; --card:#fff; --success:#14b87a; --shadow:0 22px 55px rgba(14, 42, 85, .12); }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; color:var(--ink); background:var(--canvas); font:400 15px/1.5 'DM Sans',Arial,sans-serif; }
button,input { font:inherit; }
button { cursor:pointer; }
.login { min-height:100vh; display:grid; grid-template-columns:minmax(360px,1.05fr) minmax(440px,.95fr); }
.login-brand { position:relative; overflow:hidden; color:#fff; padding:clamp(32px,6vw,86px); display:flex; flex-direction:column; justify-content:space-between; background:linear-gradient(145deg,#061e46 0%,#0a4f9f 56%,#1688df 100%); }
.login-brand::before,.login-brand::after { content:''; position:absolute; width:480px; height:480px; border:1px solid rgba(255,255,255,.14); border-radius:50%; }
.login-brand::before { right:-240px; top:-175px; } .login-brand::after { left:-310px; bottom:-330px; border-width:45px; opacity:.23; }
.brand, .brand-copy, .brand-footer { position:relative; z-index:1; }
.brand { display:flex; align-items:center; gap:12px; font:800 17px/1 'Manrope',sans-serif; letter-spacing:.04em; }
.brand img { width:43px; height:43px; }
.brand-copy { max-width:560px; margin:auto 0; padding:70px 0; }
.eyebrow { display:inline-flex; align-items:center; gap:8px; margin:0 0 20px; color:#aee0ff; font-size:12px; font-weight:700; letter-spacing:.13em; text-transform:uppercase; }
.eyebrow::before { content:''; width:28px; height:2px; background:#79d7ff; }
.brand-copy h1 { margin:0; max-width:580px; font:800 clamp(37px,5vw,66px)/1.1 'Manrope',sans-serif; letter-spacing:-.045em; }
.brand-copy p { max-width:475px; margin:20px 0 0; color:#d6eaff; font-size:17px; }
.brand-footer { display:flex; gap:14px; align-items:center; color:#c9e5ff; font-size:13px; }
.status-dot { width:9px; height:9px; border-radius:50%; background:#64e3b2; box-shadow:0 0 0 5px rgba(100,227,178,.17); }
.login-panel { display:grid; place-items:center; padding:40px 24px; background:radial-gradient(circle at 70% 15%,#e4f1ff 0,transparent 28%),#f9fbfe; }
.login-card { width:min(100%,440px); padding:12px; }
.login-card h2 { margin:0; font:800 32px/1.2 'Manrope',sans-serif; letter-spacing:-.035em; }
.intro { margin:10px 0 32px; color:var(--muted); }
.field { display:grid; gap:8px; margin:18px 0; }
.field label { color:#344054; font-size:14px; font-weight:700; }
.input-wrap { position:relative; }
.input-wrap svg { position:absolute; top:50%; left:16px; width:19px; height:19px; color:#8a99ad; transform:translateY(-50%); pointer-events:none; }
.field input { width:100%; height:54px; padding:0 48px; color:var(--ink); border:1px solid #d8e1ee; border-radius:12px; outline:none; background:#fff; transition:border .2s,box-shadow .2s; }
.field input:focus { border-color:var(--blue-2); box-shadow:0 0 0 4px rgba(26,140,255,.14); }
.toggle-pass { position:absolute; right:8px; top:7px; border:0; width:40px; height:40px; color:#6d7d92; background:transparent; border-radius:8px; }
.toggle-pass:hover { background:#eff6ff; color:var(--blue); }
.form-row { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:23px 0; }
.check { display:flex; align-items:center; gap:9px; color:#526174; font-size:14px; cursor:pointer; }
.check input { width:16px; height:16px; accent-color:var(--blue); }
.form-row a { color:var(--blue); font-size:14px; font-weight:700; text-decoration:none; }
.btn-primary { width:100%; min-height:54px; border:0; border-radius:12px; color:#fff; background:linear-gradient(100deg,#0a4da5,#0e75dd); box-shadow:0 12px 22px rgba(11,94,215,.22); font-weight:700; transition:transform .2s,box-shadow .2s; }
.btn-primary:hover { transform:translateY(-1px); box-shadow:0 15px 25px rgba(11,94,215,.3); }
.btn-primary:disabled { cursor:wait; opacity:.75; transform:none; }
.form-message { min-height:23px; margin:15px 0 0; color:#c82e45; font-size:14px; text-align:center; }
.auth-switch { margin:22px 0 0; color:#667085; font-size:14px; text-align:center; }
.text-button { padding:0; border:0; color:var(--blue); background:transparent; font-weight:700; }
.text-button:hover { color:#0849a5; text-decoration:underline; }
.compact-card { padding-top:0; }
.demo { margin-top:28px; padding:14px 16px; color:#4f6177; border:1px solid #dce6f2; border-radius:12px; background:#f7fbff; font-size:13px; text-align:center; }
.demo strong { color:var(--navy); }
.version { margin:24px 0 0; color:#98a5b6; font-size:12px; text-align:center; }

.shell { display:grid; min-height:100vh; grid-template-columns:260px 1fr; }
.sidebar { display:flex; flex-direction:column; padding:26px 16px; color:#b7c9e2; background:#071f43; }
.sidebar .brand { margin:0 10px 38px; color:#fff; }.sidebar .brand img { width:36px;height:36px; }
.nav-label { margin:0 12px 10px; color:#6f88a9; font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.nav { display:grid; gap:4px; }.nav button { display:flex; align-items:center; gap:12px; width:100%; padding:12px; border:0; color:inherit; background:transparent; border-radius:10px; text-align:left; }.nav button svg { width:19px; height:19px; }.nav button:hover,.nav button.active { color:#fff; background:rgba(92,161,247,.18); }.nav button.active { box-shadow:inset 3px 0 #50b5ff; }.nav-settings { margin-top:auto; padding-top:18px; border-top:1px solid rgba(255,255,255,.1); }
.sidebar .view-mode-control{display:flex;margin-top:auto;margin-left:0;padding:12px 10px 10px;color:#a9bfdb;border-top:1px solid rgba(255,255,255,.1);font-size:11px}.sidebar .view-mode-control select{flex:1;min-width:0;border-color:rgba(159,197,239,.32);color:#eef6ff;background:#123564}.sidebar .view-mode-control + .nav-settings{margin-top:0;padding-top:8px;border-top:0}
#app[data-view-mode="phone"] .sidebar .view-mode-control,#app[data-view-mode="tablet"] .sidebar .view-mode-control{display:flex;margin-left:0;font-size:11px}#app[data-view-mode="phone"] .sidebar .view-mode-control select{padding:7px 26px 7px 9px;font-size:12px}
.sidebar-footer { margin:18px 10px 0; padding-top:18px; border-top:1px solid rgba(255,255,255,.1); font-size:12px; }.sidebar-footer strong { display:block; color:#fff; font-size:13px; }
.workspace { min-width:0; }.topbar { height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 clamp(20px,4vw,48px); border-bottom:1px solid var(--line); background:#fff; }.crumb { color:#667085; font-size:13px; }.crumb strong { color:var(--ink); }.profile { display:flex; align-items:center; gap:10px; }.avatar { display:grid; width:38px;height:38px; place-items:center; border-radius:50%; color:#0756b8; background:#dcecff; font-weight:700; }.profile span { display:block; color:var(--muted); font-size:12px; }.profile b { font-size:14px; }.logout { margin-left:8px; padding:8px 11px; border:1px solid #d8e1ee; border-radius:8px; color:#526174; background:#fff; font-size:13px; }.logout:hover { color:#b42338; border-color:#f0c7ce; background:#fff5f6; }
.page { padding:clamp(24px,4vw,48px); }.page-head { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:30px; }.page-head h1 { margin:0; font:800 clamp(27px,3vw,36px)/1.1 'Manrope',sans-serif; letter-spacing:-.04em; }.page-head p { margin:8px 0 0; color:var(--muted); }.date-pill { padding:10px 14px; color:#3b4d63; border:1px solid var(--line); border-radius:9px; background:#fff; font-size:13px; white-space:nowrap; }.quotation-head-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.quotation-head-actions button{width:auto;margin:0}.view-mode-control{display:flex;align-items:center;gap:6px;margin-left:auto;color:#64748b;font-size:11px;font-weight:800}.view-mode-control select{padding:7px 26px 7px 9px;border:1px solid #d7e2ef;border-radius:8px;color:#294665;background:#fff;font:700 12px 'Manrope',sans-serif}@media(max-width:640px){.quotation-head-actions{width:100%}.quotation-head-actions button{flex:1}.view-mode-control{display:none}}
.stats { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:18px; }.stat,.feature { padding:21px; border:1px solid var(--line); border-radius:15px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.stat-title { display:flex; align-items:center; justify-content:space-between; color:var(--muted); font-size:13px; }.stat-icon { display:grid; width:34px;height:34px;place-items:center; border-radius:10px; color:var(--blue); background:#e7f2ff; }.stat-value { margin-top:15px; font:800 28px 'Manrope',sans-serif; letter-spacing:-.05em; }.stat-note { margin-top:3px; color:#8492a6; font-size:12px; }.dashboard-grid { display:grid; grid-template-columns:1.35fr .85fr; gap:18px; margin-top:18px; }.feature h2 { margin:0 0 7px; font:800 18px 'Manrope',sans-serif; }.feature p { margin:0; color:var(--muted); }.empty { display:grid; min-height:175px; place-items:center; margin-top:20px; border:1px dashed #cbd8e8; border-radius:11px; color:#718197; text-align:center; }.empty svg { display:block; width:38px;height:38px;margin:0 auto 9px;color:#77aee4; }
.welcome-card { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:18px; padding:28px; border-radius:16px; color:#fff; background:linear-gradient(110deg,#092b5a,#0d6fd4); box-shadow:var(--shadow); }.welcome-card .eyebrow { color:#bfe5ff; }.welcome-card h2 { margin:0; font:800 27px 'Manrope',sans-serif; letter-spacing:-.04em; }.welcome-card p:not(.eyebrow) { max-width:550px; margin:8px 0 0; color:#dceeff; }.quick-actions { display:flex; gap:10px; flex-wrap:wrap; }.quick-actions button { padding:11px 14px; border:1px solid #fff; border-radius:9px; color:#0759b5; background:#fff; font-weight:700; }.quick-actions .outline-action { color:#fff; background:transparent; }.empty-icon { display:block; margin-bottom:8px; color:#77aee4; font-size:32px; }.progress-item { display:flex; justify-content:space-between; padding:14px 0; border-bottom:1px solid var(--line); color:#526174; }.progress-item:last-child { border-bottom:0; }.progress-item b { color:#10865e; font-size:13px; }.progress-item b.pending { color:#d97706; }.module-placeholder { max-width:650px; }.module-placeholder .btn-primary { width:auto; margin-top:24px; padding:12px 18px; }
.new-customer { padding:12px 16px; border:0; border-radius:10px; color:#fff; background:var(--blue); box-shadow:0 8px 17px rgba(11,94,215,.18); font-weight:700; }.new-customer:hover { background:#0849a5; }.customer-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 18px; }.search-box { position:relative; width:min(100%,460px); }.search-box span { position:absolute; left:14px; top:9px; color:#7f90a6; font-size:22px; }.search-box input { width:100%; height:42px; padding:0 16px 0 40px; border:1px solid #dbe3ee; border-radius:9px; outline:none; background:#fff; }.search-box input:focus { border-color:#3998ef; box-shadow:0 0 0 3px #e5f3ff; }.customer-total { color:#6b7c91; font-size:13px; }.customer-table-card { overflow:hidden; border:1px solid var(--line); border-radius:15px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.table-wrap { overflow-x:auto; }.customer-table { width:100%; min-width:720px; border-collapse:collapse; }.customer-table th { padding:15px 18px; color:#728197; border-bottom:1px solid var(--line); background:#f9fbfd; font-size:11px; letter-spacing:.08em; text-align:left; text-transform:uppercase; }.customer-table td { padding:16px 18px; border-bottom:1px solid var(--line); color:#40516a; vertical-align:top; }.customer-table tr:last-child td { border:0; }.customer-table strong,.customer-table small { display:block; }.customer-table strong { color:#1c2a3e; }.customer-table small { margin-top:3px; color:#8492a6; font-size:12px; }.row-actions { display:flex; gap:8px; }.row-actions button { padding:7px 9px; border:1px solid #d8e2ef; border-radius:7px; color:#426487; background:#fff; font-size:12px; }.row-actions button:last-child:hover { color:#b42338; border-color:#f1c5ce; background:#fff6f7; }.customer-empty { display:grid; min-height:270px; place-content:center; gap:7px; padding:30px; color:#718197; text-align:center; }.customer-empty strong { color:#26354a; font-size:17px; }.customer-empty .new-customer { width:max-content; margin:12px auto 0; }.modal-backdrop { position:fixed; z-index:20; inset:0; display:grid; place-items:center; padding:22px; background:rgba(6,24,52,.57); backdrop-filter:blur(4px); }.customer-modal { width:min(100%,680px); max-height:calc(100vh - 44px); overflow:auto; padding:27px; border-radius:17px; background:#fff; box-shadow:0 28px 70px rgba(0,0,0,.25); }.modal-head { display:flex; justify-content:space-between; gap:16px; margin-bottom:23px; }.modal-head h2 { margin:0; font:800 23px 'Manrope',sans-serif; }.modal-head p { margin:5px 0 0; color:#6c7c91; }.modal-close { width:34px; height:34px; border:0; border-radius:8px; color:#6c7c91; background:#f1f5f9; font-size:23px; line-height:1; }.customer-form { display:grid; grid-template-columns:1fr 1fr; gap:17px; }.customer-form label { display:grid; gap:7px; color:#40516a; font-size:13px; font-weight:700; }.customer-form input,.customer-form textarea { width:100%; padding:11px 12px; border:1px solid #dbe3ee; border-radius:9px; color:#1b2a41; outline:none; resize:vertical; }.customer-form input:focus,.customer-form textarea:focus { border-color:#3998ef; box-shadow:0 0 0 3px #e5f3ff; }.form-span { grid-column:1/-1; }.form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:5px; }.form-actions .btn-primary { width:auto; margin:0; padding:11px 16px; }.secondary-button { padding:11px 16px; border:1px solid #d9e3f0; border-radius:9px; color:#42536a; background:#fff; font-weight:700; }
.integration-card { max-width:760px; }.api-settings { display:grid; gap:17px; margin-top:22px; }.api-settings label { display:grid; gap:8px; color:#40516a; font-size:13px; font-weight:700; }.api-settings input { width:100%; padding:12px; border:1px solid #dbe3ee; border-radius:9px; outline:none; }.api-settings input:focus { border-color:#3998ef; box-shadow:0 0 0 3px #e5f3ff; }.api-settings .form-actions { justify-content:flex-start; }.connection-note { margin-top:17px !important; color:#718197 !important; font-size:13px; }.connection-note code { padding:3px 5px; border-radius:4px; color:#0c5bab; background:#eaf4ff; }
.customer-empty[hidden] { display:none; }
.mobile-menu { display:none; }
.customer-form select { width:100%; padding:11px 12px; border:1px solid #dbe3ee; border-radius:9px; color:#1b2a41; outline:none; background:#fff; }.customer-form select:focus { border-color:#3998ef; box-shadow:0 0 0 3px #e5f3ff; }.status-badge { display:inline-block; padding:5px 8px; border-radius:99px; font-size:12px; font-weight:700; }.status-badge.scheduled { color:#1667b7; background:#e8f4ff; }.status-badge.in-progress { color:#9b6300; background:#fff4d9; }.status-badge.completed { color:#087956; background:#dcf8eb; }.status-badge.cancelled { color:#b42338; background:#ffe8ec; }
.warranty-field { align-content:start; }.warranty-toggle { display:flex; align-items:center; gap:8px; min-height:42px; padding:0 12px; border:1px solid #dbe3ee; border-radius:9px; color:#42536a; background:#f9fbfd; font-weight:500; }.warranty-toggle input { width:17px !important; height:17px; margin:0; accent-color:var(--blue); }.warranty-field small { color:#718197; font-size:11px; font-weight:400; }
.manual-customer[hidden] { display:none !important; }
.field-help { color:#718197; font-size:11px; font-weight:400; }
.technician-settings { max-width:760px; margin-top:18px; }.technician-add { display:flex; gap:10px; margin-top:20px; }.technician-add input { flex:1; min-width:0; padding:12px; border:1px solid #dbe3ee; border-radius:9px; outline:none; }.technician-add input:focus { border-color:#3998ef; box-shadow:0 0 0 3px #e5f3ff; }.technician-add .btn-primary { width:auto; min-height:0; padding:11px 16px; }.technician-list { display:flex; flex-wrap:wrap; gap:9px; margin-top:17px; }.technician-chip { display:flex; align-items:center; gap:9px; padding:7px 8px 7px 11px; border:1px solid #d8e5f3; border-radius:999px; color:#31516f; background:#f5faff; font-size:13px; font-weight:700; }.technician-chip button { padding:4px 7px; border:0; border-radius:7px; color:#b42338; background:#fff0f2; font-size:11px; font-weight:700; }.empty-techs { color:#718197; font-size:13px; }
.calendar-card { overflow:hidden; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.calendar-header { display:flex; align-items:center; justify-content:center; gap:18px; padding:18px; border-bottom:1px solid var(--line); }.calendar-header h2 { margin:0; min-width:210px; font:800 20px 'Manrope',sans-serif; text-align:center; }.calendar-nav { width:35px; height:35px; border:1px solid #d7e2ef; border-radius:8px; color:#315c89; background:#fff; font-size:25px; line-height:1; }.calendar-nav:hover { background:#edf6ff; }.calendar-weekdays,.calendar-grid { display:grid; grid-template-columns:repeat(7,minmax(110px,1fr)); }.calendar-weekdays span { padding:12px; color:#6f8198; border-bottom:1px solid var(--line); background:#f9fbfd; font-size:11px; font-weight:700; letter-spacing:.08em; text-align:center; text-transform:uppercase; }.calendar-day { min-height:133px; padding:9px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); background:#fff; }.calendar-day:nth-child(7n) { border-right:0; }.calendar-date { margin-bottom:6px; color:#31465f; font-size:13px; font-weight:700; }.muted-day { background:#fbfcfe; }.muted-day .calendar-date { color:#bdc8d5; }.today .calendar-date { display:grid; width:25px; height:25px; place-items:center; border-radius:50%; color:#fff; background:var(--blue); }.calendar-event { display:block; width:100%; overflow:hidden; margin:4px 0; padding:5px 6px; border:0; border-radius:6px; color:#145eaa; background:#e8f4ff; font-size:11px; font-weight:700; text-align:left; text-overflow:ellipsis; white-space:nowrap; }.calendar-event span { margin-right:4px; color:#4785bf; font-weight:500; }.calendar-event.in-progress { color:#936000; background:#fff4d9; }.calendar-event.completed { color:#087956; background:#dcf8eb; }.calendar-more { display:block; margin:5px; color:#6d8198; font-size:11px; }.calendar-note { margin:13px 2px; color:#718197; font-size:13px; }
.booking-calendar { overflow:visible; padding:0 18px 16px; }.booking-calendar .calendar-header { justify-content:space-between; padding:20px 0 17px; }.calendar-controls { display:flex; align-items:center; gap:12px; }.calendar-controls h2 { min-width:0; padding:0 16px; font-size:20px; }.calendar-today { padding:9px 14px; border:1px solid #d7e2ef; border-radius:8px; color:#183a68; background:#fff; font-size:12px; font-weight:800; }.calendar-today:hover { background:#edf6ff; }.calendar-bookings { color:#587194; font-size:13px; font-weight:700; }.booking-calendar .calendar-weekdays { margin:0; }.booking-calendar .calendar-weekdays span { border-bottom:0; background:transparent; }.booking-calendar .calendar-day { min-height:108px; margin:3px; padding:8px; border:1px solid #e8eef6; border-radius:11px; background:#fcfdff; }.booking-calendar .calendar-day:nth-child(7n) { border-right:1px solid #e8eef6; }.booking-calendar .calendar-grid { gap:0; }.booking-calendar .today { border-color:#1976ff; background:#eef6ff; box-shadow:inset 0 0 0 1px #1976ff; }.booking-calendar .calendar-event { display:flex; align-items:center; gap:4px; margin:4px 0; padding:4px 6px; border-radius:5px; font-size:10px; line-height:1.2; white-space:normal; }.booking-calendar .calendar-event b { overflow:hidden; max-width:100%; text-overflow:ellipsis; white-space:nowrap; }.booking-calendar .calendar-event span { margin:0 0 0 auto; color:inherit; font-size:9px; font-weight:700; white-space:nowrap; }.booking-calendar .calendar-event.cleaning { color:#096f9f; background:#dff4ff; }.booking-calendar .calendar-event.repair { color:#a35b00; background:#fff0c8; }.booking-calendar .calendar-event.installation { color:#6c41ca; background:#eee7ff; }.booking-calendar .calendar-event.maintenance { color:#08724c; background:#dcf8eb; }.booking-calendar .calendar-event.service { color:#2569a7; background:#e8f0ff; }.calendar-legend { display:flex; flex-wrap:wrap; gap:15px; padding:15px 2px 1px; color:#63758d; font-size:11px; font-weight:700; }.calendar-legend span { display:flex; align-items:center; gap:5px; }.calendar-legend i { width:10px; height:10px; border-radius:3px; background:#dff4ff; }.calendar-legend .legend-repair { background:#fff0c8; }.calendar-legend .legend-installation { background:#eee7ff; }.calendar-legend .legend-maintenance { background:#dcf8eb; }.calendar-legend .legend-service { background:#e8f0ff; }
.booking-calendar .calendar-date { margin:0 0 6px; padding:0; border:0; color:#31465f; background:transparent; font-size:13px; font-weight:700; cursor:pointer; }.booking-calendar .calendar-date:hover { color:var(--blue); }.booking-calendar .today .calendar-date { display:grid; width:25px; height:25px; place-items:center; border-radius:50%; color:#fff; background:var(--blue); }.calendar-more { width:auto; padding:2px 4px; border:0; color:#4d789e; background:transparent; font-size:11px; font-weight:800; cursor:pointer; }.calendar-more:hover { color:var(--blue); text-decoration:underline; }.day-bookings-modal { width:min(100%,600px); }.day-booking-list { display:grid; gap:8px; max-height:420px; overflow:auto; padding:6px 0 18px; }.day-booking-list > button { display:grid; grid-template-columns:82px 1fr auto; align-items:center; gap:12px; width:100%; padding:14px; border:1px solid #dce6f1; border-radius:10px; color:#24364f; background:#fff; text-align:left; }.day-booking-list > button:hover { border-color:#87bded; background:#f5faff; }.day-booking-list b,.day-booking-list small { display:block; }.day-booking-list b { color:#152f53; font-size:14px; }.day-booking-list small { margin-top:3px; color:#6d8098; font-size:12px; }.day-booking-time { color:#126bc7; font-size:12px; font-weight:800; }.day-booking-list i { color:var(--blue); font-size:12px; font-style:normal; font-weight:800; }
.finance-actions { display:flex; align-items:center; gap:12px; }.finance-period { display:flex; align-items:center; gap:7px; color:#60748d; font-size:12px; font-weight:800; }.finance-period select { padding:10px 30px 10px 11px; border:1px solid #d7e2ef; border-radius:9px; color:#294665; background:#fff; font:700 13px 'Manrope',sans-serif; }.finance-stats { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; margin:18px 0; }.finance-stats article { display:grid; gap:7px; padding:18px; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.finance-stats span,.finance-stats small { color:#718197; font-size:12px; }.finance-stats span { font-weight:800; text-transform:uppercase; letter-spacing:.06em; }.finance-stats b { color:#102e5b; font:800 23px 'Manrope',sans-serif; }.finance-stats .profit-card { border-color:#bfe9d8; background:#f7fffb; }.finance-stats .profit-card b { color:#087956; }.finance-stats .profit-card.loss { border-color:#ffd1d9; background:#fff8f9; }.finance-stats .profit-card.loss b { color:#ba2740; }.finance-overview { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(260px,.85fr); gap:15px; margin-bottom:17px; }.finance-chart,.finance-summary { padding:20px; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.finance-chart h2,.finance-summary h2 { margin:0; color:#142e51; font:800 17px 'Manrope',sans-serif; }.finance-chart p { margin:4px 0 0; color:#718197; font-size:12px; }.finance-graph { display:grid; gap:16px; margin-top:24px; }.finance-graph-row { display:grid; grid-template-columns:116px minmax(60px,1fr) 105px; align-items:center; gap:10px; color:#536a84; font-size:12px; font-weight:800; }.finance-graph-row > div { height:12px; overflow:hidden; border-radius:999px; background:#edf2f7; }.finance-graph-row i { display:block; height:100%; border-radius:inherit; background:#1877ea; }.finance-graph-row.expenses i { background:#f09a2b; }.finance-graph-row.profit i { background:#19a872; }.finance-graph-row.loss i { background:#e04a5f; }.finance-graph-row b { color:#213952; text-align:right; }.finance-summary table { width:100%; margin-top:13px; border-collapse:collapse; }.finance-summary td { padding:10px 0; border-bottom:1px solid #edf1f5; color:#65778e; font-size:13px; }.finance-summary td:last-child { color:#203a5c; font-weight:800; text-align:right; }.finance-summary .finance-net td { color:#0c7d5a; font-size:14px; font-weight:800; }.finance-summary small { display:block; margin-top:12px; color:#8290a1; font-size:11px; line-height:1.5; }.finance-tabs { display:flex; gap:4px; width:max-content; margin:4px 0 14px; padding:4px; border-radius:10px; background:#eaf0f7; }.finance-tabs button { padding:9px 18px; border:0; border-radius:7px; color:#61758d; background:transparent; font-size:13px; font-weight:800; }.finance-tabs button.active { color:#fff; background:#1167d8; box-shadow:0 4px 10px rgba(17,103,216,.25); }.finance-table-card { display:block; margin-bottom:18px; overflow:hidden; border:1px solid var(--line); border-radius:14px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.finance-table-card header { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:19px 20px 14px; border-bottom:1px solid var(--line); }.finance-table-card h2 { margin:0; color:#142e51; font:800 17px 'Manrope',sans-serif; }.finance-table-card p { margin:4px 0 0; color:#718197; font-size:12px; }.finance-table-card header > span { color:#527092; font-size:12px; font-weight:700; }.pending-sales { border-color:#f0dfb0; }.pending-amount { color:#a36d00; font-size:12px; font-weight:800; }.expense-status { display:inline-block; padding:5px 9px; border-radius:999px; font-size:11px; font-weight:800; }.expense-status.paid { color:#087956; background:#dcf8eb; }.expense-status.pending { color:#a35b00; background:#fff0c8; }.expense-modal { width:min(100%,700px); }.finance-fallback-list { display:grid; gap:1px; }.finance-fallback-list button { display:grid; gap:3px; width:100%; padding:14px 20px; border:0; border-bottom:1px solid var(--line); color:#263a55; background:#fff; text-align:left; }.finance-fallback-list button:hover { background:#f4f9ff; }.finance-fallback-list span { color:#718197; font-size:12px; }
.finance-expense-filters { justify-content:flex-start; flex-wrap:wrap; padding:16px 20px 0; }.finance-expense-filters .search-box { flex:1 1 280px; width:auto; }.expense-no-match { padding:28px !important; color:#718197 !important; text-align:center; }
.history-search-card { display:flex; align-items:center; justify-content:space-between; gap:18px; margin:18px 0 14px; }.history-search-card .search-box { width:min(100%,430px); }.history-view-controls { display:flex; align-items:center; flex-wrap:wrap; gap:9px; margin-left:auto; }.history-view-controls .finance-period { white-space:nowrap; }.history-view-controls input[type="month"] { max-width:150px; }.history-table td small { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.history-table th:first-child,.history-table td:first-child { min-width:105px; white-space:nowrap; }
.job-table th:first-child,.job-table td:first-child { min-width:105px; white-space:nowrap; }
.availability-actions,.report-actions { display:flex; align-items:center; gap:10px; }.availability-summary { display:grid; grid-template-columns:repeat(4,minmax(150px,1fr)); gap:14px; margin:0 0 18px; }.availability-summary article { display:flex; flex-direction:column; gap:3px; padding:17px 19px; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.availability-summary b { color:var(--navy); font:800 25px 'Manrope',sans-serif; }.availability-summary span { color:var(--muted); font-size:13px; }.availability-summary .availability-good { border-color:#bfe9d8; background:#f7fffb; }.availability-summary .availability-good b { color:#087956; }.availability-summary .availability-alert { border-color:#ffd7a2; background:#fffaf0; }.availability-summary .availability-alert b { color:#b76500; }.availability-grid { display:grid; grid-template-columns:minmax(0,1.55fr) minmax(260px,.8fr); gap:18px; margin-bottom:18px; }.availability-roster header,.availability-schedule header,.report-card-head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 20px 14px; border-bottom:1px solid var(--line); }.availability-roster h2,.availability-schedule h2,.report-card-head h2 { margin:0; color:#142e51; font:800 17px 'Manrope',sans-serif; }.availability-roster p,.availability-schedule p,.report-card-head p { margin:4px 0 0; color:#718197; font-size:12px; }.availability-schedule header > span { color:#527092; font-size:12px; font-weight:700; }.availability-attention { padding:21px; }.availability-attention h2 { margin:0; color:#142e51; font:800 18px 'Manrope',sans-serif; }.availability-attention > p { margin:8px 0 12px; color:#65758a; font-size:13px; }.availability-attention small { display:block; margin-top:15px; color:#8190a2; font-size:11px; line-height:1.5; }.availability-clear { padding:14px; border-radius:9px; color:#087956 !important; background:#effcf6; font-weight:700; }.availability-conflicts { display:grid; gap:7px; }.availability-conflicts button { display:grid; gap:3px; padding:11px 12px; border:1px solid #f5d5db; border-radius:9px; color:#7c2435; background:#fff8f9; text-align:left; }.availability-conflicts button:hover { border-color:#e69ba9; }.availability-conflicts span { color:#9a6470; font-size:12px; }.availability-muted { color:#8492a6; font-size:12px; }
.report-stats .stat-value { font-size:25px; }.report-profit { color:#087956; }.report-loss { color:#c23b51; }.report-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(255px,.8fr); gap:18px; margin-top:18px; }.report-performance h2,.report-attention h2 { margin:0; color:#142e51; font:800 18px 'Manrope',sans-serif; }.report-performance p { margin:5px 0 0; color:#718197; font-size:13px; }.report-bars { display:grid; gap:15px; margin-top:22px; }.report-bar { display:grid; grid-template-columns:125px minmax(80px,1fr) 110px; align-items:center; gap:10px; color:#536a84; font-size:12px; font-weight:800; }.report-bar > div { height:12px; overflow:hidden; border-radius:999px; background:#edf2f7; }.report-bar i { display:block; height:100%; border-radius:inherit; background:#78a7e9; }.report-bar.revenue i { background:#1976df; }.report-bar.expenses i { background:#f29b36; }.report-bar b { color:#213952; text-align:right; }.report-attention { display:grid; align-content:start; gap:9px; }.report-alert { display:flex; align-items:center; gap:12px; padding:11px 12px; border:1px solid #e8edf4; border-radius:9px; background:#f9fbfd; }.report-alert b { display:grid; min-width:31px; height:31px; place-items:center; border-radius:8px; color:#1268c7; background:#e8f3ff; font:800 15px 'Manrope',sans-serif; }.report-alert span { color:#5b6d83; font-size:12px; line-height:1.35; }.report-attention .text-button { margin-top:5px; text-align:left; }.report-detail-grid { grid-template-columns:1fr 1fr; }.report-table { min-width:0; }
.salary-settings { max-width:900px; margin-top:18px; }.salary-rate-list { display:grid; gap:9px; margin-top:19px; }.salary-rate-row { display:grid; grid-template-columns:minmax(150px,1fr) 175px 105px auto; align-items:center; gap:11px; padding:11px 0; border-bottom:1px solid var(--line); }.salary-rate-row:last-child { border-bottom:0; }.salary-rate-row strong { color:#203a5c; }.salary-rate-row label { display:flex; align-items:center; gap:6px; color:#5c7188; font-weight:800; }.salary-rate-row input { width:100%; padding:9px 10px; border:1px solid #dbe3ee; border-radius:8px; outline:0; }.salary-rate-row input:focus { border-color:#3998ef; box-shadow:0 0 0 3px #e5f3ff; }.salary-rate-row span { color:#718197; font-size:12px; }.salary-rate-row .secondary-button { padding:8px 12px; }
.attendance-workspace,.payroll-section { margin-top:18px; overflow:hidden; border:1px solid var(--line); border-radius:15px; background:#fff; box-shadow:0 6px 22px rgba(18,52,86,.035); }.attendance-head,.payroll-section header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:20px; border-bottom:1px solid var(--line); }.attendance-head h2,.payroll-section h2 { margin:0; color:#142e51; font:800 18px 'Manrope',sans-serif; }.attendance-head p,.payroll-section p { margin:5px 0 0; color:#718197; font-size:12px; }.attendance-controls { display:flex; align-items:center; gap:9px; color:#193d6d; white-space:nowrap; }.attendance-controls .secondary-button { min-width:35px; padding:6px 11px; font-size:20px; line-height:1; }.attendance-legend { display:flex; flex-wrap:wrap; gap:13px; padding:13px 20px; color:#6a7b8f; font-size:11px; font-weight:700; }.attendance-legend span { padding:4px 7px; border-radius:6px; background:#f3f6fa; }.attendance-legend .duty { color:#087956; background:#dcf8eb; }.attendance-legend .absent { color:#b42338; background:#ffe8ec; }.attendance-legend .leave { color:#996100; background:#fff0cc; }.attendance-table-wrap { overflow:auto; }.attendance-table { width:max-content; min-width:100%; border-collapse:collapse; }.attendance-table th,.attendance-table td { padding:8px 5px; border-right:1px solid #edf1f5; border-bottom:1px solid #edf1f5; text-align:center; }.attendance-table th { position:sticky; top:0; color:#728197; background:#f9fbfd; font-size:10px; letter-spacing:.04em; }.attendance-table th:first-child,.attendance-table td:first-child { position:sticky; left:0; z-index:1; min-width:175px; padding:10px 16px; background:#fff; text-align:left; }.attendance-table th:first-child { z-index:2; background:#f9fbfd; }.attendance-name small { display:block; margin-top:2px; color:#8492a6; font-size:10px; }.attendance-cell { display:grid; width:28px; height:28px; place-items:center; border:0; border-radius:7px; color:#9aa7b7; background:#f3f6fa; font-size:11px; font-weight:800; }.attendance-cell:hover { outline:2px solid #8bc5fb; }.attendance-cell.on-duty { color:#087956; background:#dcf8eb; }.attendance-cell.absent { color:#b42338; background:#ffe8ec; }.attendance-cell.leave { color:#9b6300; background:#fff0cc; }
.payroll-section header { border-bottom:1px solid var(--line); }.payroll-actions { display:flex; align-items:center; gap:9px; }.salary-expense-total { display:grid; gap:2px; margin-left:auto; min-width:190px; padding:9px 12px; border:1px solid #b9d7fb; border-radius:10px; background:#eff7ff; color:#50708e; text-align:right; }.salary-expense-total span { color:#52708d; font-size:10px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; }.salary-expense-total strong { color:#0b5fbe; font:800 19px 'Manrope',sans-serif; }.salary-expense-total small { color:#718197; font-size:10px; }.payroll-section .new-customer { white-space:nowrap; }.payroll-table { min-width:760px; }.payroll-net { color:#087956 !important; }.cash-advance-list { margin:0 20px 20px; padding-top:16px; border-top:1px solid var(--line); }.cash-advance-list h3 { margin:0 0 8px; color:#314965; font-size:13px; }.cash-advance-list > div { display:flex; align-items:center; gap:12px; padding:9px 0; border-bottom:1px solid #edf1f5; }.cash-advance-list span { flex:1; }.cash-advance-list strong,.cash-advance-list small { display:block; }.cash-advance-list small,.cash-advance-list > p { color:#7c8ca0; font-size:12px; }.cash-advance-list b { color:#b76500; }.cash-advance-list button { padding:6px 8px; border:1px solid #f0c7ce; border-radius:7px; color:#b42338; background:#fff6f7; font-size:11px; }.attendance-controls label { display:flex; align-items:center; gap:6px; color:#6a7b8f; font-size:11px; font-weight:800; }.attendance-controls select { padding:8px 26px 8px 9px; border:1px solid #d7e2ef; border-radius:8px; color:#294665; background:#fff; font-weight:700; }.attendance-table th small { display:block; margin-bottom:1px; font-size:9px; }.payslip-modal { width:min(100%,620px); }.payslip-paper { padding:25px; border:1px solid #e2eaf3; border-radius:12px; background:#fff; }.payslip-brand { display:flex; justify-content:space-between; gap:16px; padding-bottom:16px; border-bottom:2px solid #0b3e82; }.payslip-brand strong { display:block; color:#092b5a; font:800 20px 'Manrope',sans-serif; }.payslip-brand span { display:block; margin-top:3px; color:#718197; font-size:12px; }.payslip-brand > b { color:#0b3e82; font-size:12px; }.payslip-person { margin:21px 0; }.payslip-person span { color:#718197; font-size:10px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }.payslip-person h3 { margin:3px 0; color:#1c2e4b; font-size:18px; }.payslip-person small { color:#718197; }.payslip-paper table { width:100%; border-collapse:collapse; }.payslip-paper td { padding:11px; border-bottom:1px solid #e4eaf2; }.payslip-paper td:last-child { color:#1d365c; font-weight:800; text-align:right; }.payslip-paper .payslip-net td { color:#fff; background:#0b3e82; font-size:16px; }.payslip-advances { display:grid; gap:7px; margin-top:20px; padding:14px; border-radius:9px; background:#fff8e9; }.payslip-advances > b { color:#8c5c00; font-size:12px; }.payslip-advances span { display:flex; justify-content:space-between; gap:12px; color:#6f5a28; font-size:12px; }.payslip-actions { margin-top:0; padding-top:17px; }.payslip-actions .btn-primary { width:auto; }
.dashboard-title { display:flex; align-items:center; justify-content:space-between; gap:14px; }.schedule-list { display:grid; margin-top:12px; }.schedule-list button { display:grid; gap:3px; padding:13px 0; border:0; border-bottom:1px solid var(--line); color:#22334a; background:transparent; text-align:left; }.schedule-list button:last-child { border-bottom:0; }.schedule-list button:hover b { color:var(--blue); }.schedule-list span { color:var(--muted); font-size:13px; }.dashboard-action { width:auto; margin-top:18px; }
.quote-number { color:var(--blue); }.quote-section { margin-top:22px; }.quote-section:first-of-type { margin-top:0; }.quote-section-head { display:flex; align-items:end; justify-content:space-between; gap:16px; margin:0 0 9px; padding:0 3px; }.quote-section-head .eyebrow { margin:0 0 4px; }.quote-section-head h2 { margin:0; color:#132f54; font:800 19px 'Manrope',sans-serif; }.quote-section-head h2 span { display:inline-grid; min-width:24px; height:24px; place-items:center; margin-left:7px; padding:0 7px; border-radius:999px; color:#1267c6; background:#e6f2ff; font:800 11px 'Manrope',sans-serif; vertical-align:middle; }.quote-section-head p:last-child { margin:4px 0 0; color:#718197; font-size:12px; }.approved-quote-section .quote-section-head h2 span { color:#087956; background:#dcf8eb; }.quote-section-empty { min-height:118px; }.quote-modal { width:min(100%,820px); }.quote-items { padding-top:8px; border-top:1px solid var(--line); }.line-items-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }.line-items-head button { border:0; border-radius:8px; padding:8px 11px; color:var(--blue); background:#eaf4ff; font-weight:700; }.quote-item-labels,.quote-item { display:grid; grid-template-columns:minmax(160px,1.8fr) 70px 105px 110px 34px; gap:9px; align-items:center; }.quote-item-labels { margin-bottom:7px; color:#718197; font-size:10px; font-weight:700; letter-spacing:.07em; text-transform:uppercase; }.quote-item { margin:7px 0; }.quote-item input { width:100%; padding:10px; border:1px solid #dbe3ee; border-radius:8px; outline:0; }.quote-item output { padding:9px 4px; color:#33445a; font-size:13px; font-weight:700; }.quote-item button { width:32px; height:32px; border:0; border-radius:8px; color:#bf2841; background:#ffe7eb; font-size:20px; }.quote-total { display:flex; align-items:center; justify-content:space-between; padding:15px 18px; border-radius:11px; color:#fff; background:#0b2d70; }.quote-total span { color:#bfd7ff; text-transform:uppercase; font-size:11px; font-weight:700; }.quote-total b { font:800 24px 'Manrope',sans-serif; }.quote-preview { width:min(100%,760px); }.quotation-paper { padding:30px; color:#1a2a42; }.quotation-paper header { display:flex; justify-content:space-between; gap:20px; }.quotation-paper header h2 { margin:0; color:#092b5a; font:800 22px 'Manrope',sans-serif; }.quotation-paper header p,.quotation-paper header small,.quotation-paper > p { margin:3px 0; color:#708097; font-size:12px; }.quotation-paper header > div:last-child { color:#092b5a; text-align:right; }.quotation-paper hr { margin:20px 0; border:0; border-top:2px solid #0b3a85; }.quote-for { color:#6f7e91 !important; font-size:10px !important; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }.quotation-paper h3 { margin:3px 0; font-size:17px; }.quotation-paper table { width:100%; margin:20px 0; border-collapse:collapse; }.quotation-paper th { padding:10px 12px; color:#61728b; background:#f2f6fb; font-size:10px; letter-spacing:.06em; text-align:left; text-transform:uppercase; }.quotation-paper td { padding:12px; border-bottom:1px solid #e4eaf2; font-size:13px; }.quotation-paper th:nth-child(n+2),.quotation-paper td:nth-child(n+2) { text-align:right; }.quote-calcs { display:grid; gap:8px; width:min(100%,280px); margin-left:auto; }.quote-calcs span,.quote-calcs strong { display:flex; justify-content:space-between; gap:18px; }.quote-calcs span { color:#67768b; font-size:13px; }.quote-calcs strong { padding:13px; border-radius:9px; color:#fff; background:#0b2d70; }.quotation-paper aside { margin-top:28px; padding:13px 16px; border-left:3px solid #1688df; background:#f5f8fd; }.quotation-paper aside b { color:#596a81; font-size:10px; letter-spacing:.07em; text-transform:uppercase; }.quotation-paper aside p { margin:5px 0 0; color:#65758a; font-size:12px; }.quotation-paper footer { margin-top:28px; padding-top:16px; border-top:1px dashed #d6e0eb; color:#718197; font-size:12px; text-align:center; }.quote-preview-actions { padding:18px 27px; border-top:1px solid var(--line); }.quote-preview-actions .btn-primary { width:auto; }
@media (max-width:900px) { .login{grid-template-columns:1fr}.login-brand{min-height:290px;padding:32px}.brand-copy{padding:38px 0;margin:0}.brand-copy h1{font-size:39px}.brand-footer{display:none}.login-panel{padding:42px 24px}.shell{grid-template-columns:1fr}.sidebar{position:fixed;z-index:5;inset:0 auto 0 0;width:260px;transform:translateX(-101%);transition:transform .25s}.shell.menu-open .sidebar{transform:translateX(0)}.mobile-menu{display:grid;width:38px;height:38px;place-items:center;border:0;border-radius:9px;color:var(--ink);background:#eef4fc}.stats{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.availability-grid,.report-grid,.report-detail-grid{grid-template-columns:1fr}.availability-summary{grid-template-columns:repeat(2,minmax(150px,1fr))}.topbar{height:68px}.profile span{display:none} }
@media (max-width:900px) { .finance-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }.finance-overview { grid-template-columns:1fr; } }
@media (max-width:640px) { .customer-toolbar,.welcome-card,.history-search-card { align-items:stretch; flex-direction:column; }.new-customer { width:100%; }.customer-form { grid-template-columns:1fr; }.form-span { grid-column:auto; }.customer-modal { padding:21px; }.form-actions { flex-direction:column-reverse; }.form-actions button { width:100%; }.logout { display:none; } }

.cash-advance-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:15px; }.cash-advance-heading h3 { margin:0 0 5px; color:#17365f; font:800 17px 'Manrope',sans-serif; }.cash-advance-heading p { margin:0; }.cash-advance-heading > b { display:grid; gap:2px; min-width:130px; padding:10px 12px; border-radius:10px; color:#b76500; background:#fff5df; text-align:right; }.cash-advance-heading > b small,.cash-advance-employee header span,.cash-advance-employee header small,.cash-advance-entry small,.cash-advance-employee footer { color:#75859a; font-size:11px; font-weight:600; }.cash-advance-employee-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(285px,1fr)); gap:14px; }.cash-advance-employee { overflow:hidden; border:1px solid #dce8f5; border-radius:12px; background:#fff; }.cash-advance-employee > header { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 15px; border-left:4px solid #1a75d1; background:#f4f9ff; }.cash-advance-employee header span,.cash-advance-employee header h4,.cash-advance-employee header small,.cash-advance-employee header b small { display:block; }.cash-advance-employee header span { color:#55708f; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }.cash-advance-employee header h4 { margin:3px 0; color:#17365f; font:800 16px 'Manrope',sans-serif; }.cash-advance-employee header > b { color:#087956; font-size:15px; text-align:right; }.cash-advance-employee header > b small { margin-top:2px; color:#5c768f; }.cash-advance-entries { padding:0 15px; }.cash-advance-entry { display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center; padding:11px 0; border-bottom:1px solid #edf2f7; }.cash-advance-entry strong,.cash-advance-entry small { display:block; }.cash-advance-entry strong { color:#304966; font-size:12px; }.cash-advance-entry b { color:#213c63; font-size:13px; text-align:right; }.cash-advance-entry button { padding:6px 8px; border:1px solid #f0c7ce; border-radius:7px; color:#b42338; background:#fff6f7; font-size:11px; }.cash-advance-employee footer { display:flex; justify-content:space-between; gap:10px; padding:10px 15px; color:#5c7189; background:#fbfdff; }.cash-advance-employee footer b { color:#17365f; }.payslip-advance-picker { padding:13px 15px; border:1px solid #d9e7f7; border-radius:10px; background:#f7fbff; }.payslip-advance-picker header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }.payslip-advance-picker header strong,.payslip-advance-picker header small { display:block; }.payslip-advance-picker header strong { color:#17365f; font-size:13px; }.payslip-advance-picker header small { margin-top:3px; color:#718197; font-size:11px; }.payslip-advance-picker header > b { color:#087956; font-size:15px; white-space:nowrap; }.payslip-advance-picker > div { display:grid; gap:7px; margin-top:11px; }.payslip-advance-picker > div span { display:grid; grid-template-columns:95px 1fr auto; gap:9px; align-items:center; padding-top:7px; border-top:1px solid #e5eef7; }.payslip-advance-picker > div strong,.payslip-advance-picker > div small { color:#526a85; font-size:11px; }.payslip-advance-picker > div b { color:#263e60; font-size:12px; }.payslip-advance-picker > p { margin:9px 0 0; color:#718197; font-size:12px; }
@media (max-width:640px) { .cash-advance-heading { align-items:stretch; flex-direction:column; }.cash-advance-heading > b { text-align:left; }.cash-advance-employee-grid { grid-template-columns:1fr; }.payslip-advance-picker > div span { grid-template-columns:84px 1fr auto; } }
@media (max-width:640px) { .finance-stats { grid-template-columns:1fr; }.finance-actions { align-items:stretch; flex-direction:column; }.finance-period { justify-content:space-between; }.finance-period select { flex:1; }.finance-graph-row { grid-template-columns:92px minmax(55px,1fr) 86px; font-size:11px; }.finance-tabs { width:100%; }.finance-tabs button { flex:1; }.finance-table-card header { align-items:flex-start; flex-direction:column; } }
@media (max-width:780px) { .calendar-card { overflow-x:auto; }.calendar-header { position:sticky; left:0; min-width:770px; }.calendar-weekdays,.calendar-grid { min-width:770px; }.calendar-day { min-height:112px; } }
@media (max-width:480px) { .login-brand{min-height:245px}.brand-copy p{font-size:14px}.login-card h2{font-size:28px}.form-row{align-items:flex-start;flex-direction:column}.page-head{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:1fr}.date-pill{width:100%}.page{padding:23px 18px}.topbar{padding:0 18px}.profile b{display:none} }
@media (max-width:640px) { .availability-summary { grid-template-columns:1fr; }.availability-actions,.report-actions { align-items:stretch; flex-direction:column; }.availability-actions > button,.report-actions > button { width:100%; }.attendance-head,.payroll-section header { align-items:flex-start; flex-direction:column; }.attendance-controls { width:100%; justify-content:space-between; }.salary-expense-total { width:100%; margin-left:0; text-align:left; }.payroll-actions { width:100%; flex-direction:column; }.payroll-actions button,.payroll-section .new-customer { width:100%; }.salary-rate-row { grid-template-columns:1fr 1fr; }.salary-rate-row strong { grid-column:1/-1; }.salary-rate-row span { display:none; }.report-bar { grid-template-columns:92px minmax(55px,1fr) 84px; font-size:11px; } }
@media (max-width:640px) { .quote-item-labels { display:none; }.quote-item { grid-template-columns:1fr 62px 88px 34px; }.quote-item output { display:none; }.quotation-paper { padding:20px; }.quotation-paper header h2 { font-size:17px; } }
@media print { body * { visibility:hidden; } .quote-preview-backdrop,.quote-preview-backdrop * { visibility:visible; } .quote-preview-backdrop { position:absolute; inset:0; display:block; padding:0; background:#fff; } .quote-preview { width:100%; max-height:none; box-shadow:none; } .quote-preview .modal-head,.quote-preview-actions { display:none; } .quotation-paper { padding:35px; } }
/* Owner account approval controls */
.account-approvals{margin-top:24px}.account-approvals h3{margin:22px 0 10px;font-size:14px;color:#344a6d}.account-request-list{display:grid;gap:10px}.account-request{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border:1px solid #dce6f4;border-radius:12px;background:#fbfdff}.change-request{align-items:flex-start}.change-request-main{min-width:0;flex:1}.change-summary{margin:10px 0 0;padding:10px 12px;border:1px solid #dbe7f6;border-radius:9px;background:#f6faff;color:#38516f;font-size:12px}.change-summary summary{cursor:pointer;font-weight:800;color:#164f98}.change-summary ul{display:grid;gap:5px;margin:9px 0 0;padding:0;list-style:none}.change-summary li{display:grid;grid-template-columns:minmax(105px,auto) 1fr;gap:10px}.change-summary li b{color:#193b68}.change-summary li span{margin:0;color:#526f91;overflow-wrap:anywhere}.change-summary i{font-style:normal;color:#0f6ed5}.change-summary p{margin:9px 0 0;padding-top:8px;border-top:1px solid #dce8f6;color:#38516f}.delete-summary{border-color:#f4c7ce;background:#fff7f8}.delete-summary b{display:block;color:#b3283e}.delete-summary span{display:block;margin-top:4px;color:#5f4550}.account-request strong,.account-request span{display:block}.account-request strong{color:#102b56}.account-request span{margin-top:3px;font-size:12px;color:#667a9d}.account-request-actions{display:flex;gap:8px;flex-shrink:0}.account-request-actions .btn-primary,.account-request-actions .secondary-button{width:auto;margin:0;padding:9px 13px;font-size:13px}.danger-button{color:#bd3147!important;border-color:#f1bbc4!important}.approval-state{font-weight:700;color:#16835c!important}.approved-account-heading{padding-top:4px;border-top:1px solid #e8eef7}.input-wrap select{width:100%;border:0;outline:0;background:transparent;color:#152b50;font:inherit;padding:0 12px}.compact-card .field select{min-height:24px}@media(max-width:620px){.account-request{align-items:flex-start;flex-direction:column}.account-request-actions{width:100%}.account-request-actions button{flex:1}.change-summary li{grid-template-columns:1fr}}
.dashboard-music{display:grid;grid-template-columns:auto minmax(280px,1fr);align-items:center;gap:12px 18px;margin:0 0 18px;padding:13px 16px;border:1px solid #cfe1f7;border-radius:14px;background:linear-gradient(105deg,#f9fcff,#edf6ff)}.music-copy{display:flex;align-items:center;gap:10px}.music-icon{display:grid;width:35px;height:35px;place-items:center;border-radius:10px;color:#fff;background:#e62117;font-size:19px;font-weight:800}.music-copy strong,.music-copy small{display:block}.music-copy strong{color:#193654;font-size:13px}.music-copy small,.music-message{color:#718197;font-size:11px}.music-controls{display:flex;gap:8px;justify-content:flex-end}.music-controls input{flex:1;min-width:160px;padding:9px 10px;border:1px solid #ccdaea;border-radius:8px;color:#263a55;background:#fff;font:12px 'Manrope',sans-serif}.music-controls button{padding:9px 12px;border:0;border-radius:8px;color:#fff;background:#1167d8;font:700 12px 'Manrope',sans-serif}.music-controls .secondary-button{color:#4b6179;border:1px solid #cedbea;background:#fff}.music-message{grid-column:1/-1;margin:0}.music-player{grid-column:1/-1;overflow:hidden;border-radius:9px;background:#0b1f3e}.music-player-link{display:flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px;color:#fff!important;text-decoration:none;font:800 13px 'Manrope',sans-serif}.music-player-link span{color:#bdd7f5;font:500 11px 'Manrope',sans-serif}@media(max-width:640px){.dashboard-music{grid-template-columns:1fr}.music-controls{justify-content:stretch;flex-wrap:wrap}.music-controls input{min-width:100%}}
/* Built-in workspace radio controls */
.music-controls select{flex:1;min-width:160px;padding:9px 10px;border:1px solid #ccdaea;border-radius:8px;color:#263a55;background:#fff;font:12px 'Manrope',sans-serif}
@media(max-width:640px){.music-controls select{min-width:100%}}
/* Statement of Account and Billing Report */
.statement-actions{display:flex;align-items:end;justify-content:flex-end;flex-wrap:wrap;gap:10px;min-width:0;max-width:100%}.statement-actions .secondary-button{width:auto;margin:0;padding:10px 14px}.statement-selector{display:flex!important;flex:1 1 340px;min-width:260px;max-width:520px}.statement-selector select{width:100%;min-width:0}.statement-actions>button{flex:0 0 auto}.statement-card{overflow:hidden;border:1px solid #dfe8f4;border-radius:16px;background:#fff;box-shadow:0 10px 28px rgba(25,57,102,.06)}.statement-card-head{display:flex;justify-content:space-between;gap:24px;padding:25px 28px;border-bottom:1px solid #e5edf7;background:linear-gradient(120deg,#fbfdff,#f4f8fe)}.statement-card-head .eyebrow{margin:0 0 5px}.statement-card-head h2{margin:0;color:#112e59;font-size:23px}.statement-card-head p{margin:6px 0 0;color:#607492}.statement-card-head small{display:block;margin-top:5px;color:#2b4e78}.statement-card-head>div:last-child{min-width:145px;text-align:right}.statement-card-head>div:last-child p{margin:0;color:#71829c;font-size:12px}.statement-card-head>div:last-child b,.statement-card-head>div:last-child span{display:block;margin-top:6px;color:#153d74}.statement-card-head>div:last-child span{font-size:12px;color:#637997}.statement-note{margin:16px 28px;padding:11px 13px;border-left:3px solid #f2ad26;background:#fff9ed;color:#795b17;font-size:13px}.statement-total{display:flex;align-items:center;justify-content:space-between;padding:19px 28px;background:#0f3371;color:#fff}.statement-total span{font-weight:700;font-size:14px}.statement-total strong{font-size:24px}.billing-stats{margin-bottom:20px}.billing-stats article:last-child{background:linear-gradient(135deg,#0f3474,#1474d5);color:#fff}.billing-stats article:last-child span,.billing-stats article:last-child small{color:#dbeaff}.billing-stats article:last-child b{color:#fff}@media(max-width:760px){.statement-actions{align-items:stretch;flex-direction:column}.statement-selector{min-width:0;width:100%;max-width:none}.statement-card-head{flex-direction:column}.statement-card-head>div:last-child{text-align:left}.statement-total{padding:18px}.statement-total strong{font-size:21px}}
.page-head:has(.statement-actions){align-items:flex-start;flex-wrap:wrap}.page-head:has(.statement-actions)>div:first-child{flex:1 1 330px}.page-head:has(.statement-actions)>.statement-actions{flex:1 1 690px}
#app[data-view-mode="phone"] .view-mode-control{display:flex;margin-left:auto;font-size:0}#app[data-view-mode="phone"] .view-mode-control select{padding:6px 22px 6px 7px;font-size:11px}

/* Workspace view selector: preview layouts without changing browser zoom. */
#app[data-view-mode="tablet"],#app[data-view-mode="phone"]{min-height:100vh;margin:18px auto;overflow:hidden;border:1px solid #cad8e8;border-radius:18px;box-shadow:0 18px 50px rgba(20,49,86,.2)}#app[data-view-mode="tablet"]{width:min(100% - 36px,900px)}#app[data-view-mode="phone"]{width:min(100% - 28px,430px)}#app[data-view-mode="tablet"] .shell,#app[data-view-mode="phone"] .shell{position:relative;grid-template-columns:1fr;min-height:calc(100vh - 36px)}#app[data-view-mode="tablet"] .sidebar,#app[data-view-mode="phone"] .sidebar{position:absolute;z-index:20;inset:0 auto 0 0;width:260px;transform:translateX(-101%);transition:transform .25s}#app[data-view-mode="tablet"] .shell.menu-open .sidebar,#app[data-view-mode="phone"] .shell.menu-open .sidebar{transform:translateX(0)}#app[data-view-mode="tablet"] .mobile-menu,#app[data-view-mode="phone"] .mobile-menu{display:grid;width:38px;height:38px;place-items:center;border:0;border-radius:9px;color:var(--ink);background:#eef4fc}#app[data-view-mode="tablet"] .stats{grid-template-columns:repeat(2,1fr)}#app[data-view-mode="tablet"] .dashboard-grid,#app[data-view-mode="tablet"] .availability-grid,#app[data-view-mode="tablet"] .report-grid,#app[data-view-mode="tablet"] .report-detail-grid{grid-template-columns:1fr}#app[data-view-mode="phone"] .topbar{height:64px;padding:0 14px;gap:10px}#app[data-view-mode="phone"] .crumb{overflow:hidden;max-width:150px;white-space:nowrap;text-overflow:ellipsis;font-size:11px}#app[data-view-mode="phone"] .profile span,#app[data-view-mode="phone"] .profile b,#app[data-view-mode="phone"] .logout{display:none}#app[data-view-mode="phone"] .avatar{width:34px;height:34px;font-size:12px}#app[data-view-mode="phone"] .page{padding:20px 15px}#app[data-view-mode="phone"] .page-head,#app[data-view-mode="phone"] .customer-toolbar,#app[data-view-mode="phone"] .welcome-card,#app[data-view-mode="phone"] .history-search-card,#app[data-view-mode="phone"] .finance-actions{align-items:stretch;flex-direction:column}#app[data-view-mode="phone"] .page-head{gap:14px;margin-bottom:20px}#app[data-view-mode="phone"] .page-head h1{font-size:28px}#app[data-view-mode="phone"] .new-customer,#app[data-view-mode="phone"] .page-head .btn-primary{width:100%}#app[data-view-mode="phone"] .stats,#app[data-view-mode="phone"] .finance-stats,#app[data-view-mode="phone"] .dashboard-grid,#app[data-view-mode="phone"] .availability-grid,#app[data-view-mode="phone"] .report-grid,#app[data-view-mode="phone"] .report-detail-grid,#app[data-view-mode="phone"] .availability-summary{grid-template-columns:1fr}#app[data-view-mode="phone"] .customer-table-card,#app[data-view-mode="phone"] .finance-table-card{overflow-x:auto}#app[data-view-mode="phone"] .customer-table{min-width:640px}#app[data-view-mode="phone"] .form-actions{flex-direction:column-reverse}#app[data-view-mode="phone"] .form-actions button{width:100%}#app[data-view-mode="phone"] .customer-form{grid-template-columns:1fr}#app[data-view-mode="phone"] .form-span{grid-column:auto}#app[data-view-mode="phone"] .quotation-head-actions{width:100%}#app[data-view-mode="phone"] .quotation-head-actions button{flex:1}#app[data-view-mode="phone"] .view-mode-control{display:none}

/* Statement transaction editing and formal document */
.statement-editor{width:min(100%,700px)}.statement-existing-items{display:grid;gap:8px;margin:0 0 18px;padding:12px;border:1px solid #e1eaf5;border-radius:11px;background:#f9fbfe}.statement-existing-items>p{margin:3px;color:#6d7f98;font-size:13px}.statement-existing-items>div{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:9px 3px;border-bottom:1px solid #e5edf7}.statement-existing-items>div:last-child{border-bottom:0}.statement-existing-items b,.statement-existing-items small{display:block}.statement-existing-items b{font-size:13px;color:#19385f}.statement-existing-items small{margin-top:3px;color:#71819a;font-size:11px}.statement-existing-items strong{color:#0b3977;font-size:13px}.statement-existing-items button{padding:6px 9px;border:1px solid #f1bbc4;border-radius:7px;color:#b92f47;background:#fff;font:700 11px 'Manrope',sans-serif}.manual-tag{display:inline-block;padding:5px 8px;border-radius:999px;color:#6f4b06;background:#fff1d2;font-size:11px;font-weight:800}.statement-document-paper{min-height:620px}.statement-document-paper table td:first-child{width:33%;text-align:left}.statement-document-paper table td small{display:block;margin-top:4px;color:#728299;font-size:11px;font-weight:400}.statement-document-total{margin-top:25px}.statement-document-total strong{margin-top:4px}.statement-print-modal{width:min(100%,820px)}@media(max-width:640px){.statement-existing-items>div{grid-template-columns:1fr auto}.statement-existing-items>div button{grid-column:1/-1;width:100%}.statement-document-paper{padding:20px 16px}.statement-document-paper table th,.statement-document-paper table td{padding:9px 7px;font-size:11px}.statement-document-paper table td small{font-size:10px}}

/* Philippine mobile format */
.phone-input{display:flex;align-items:center;overflow:hidden;border:1px solid #dbe3ee;border-radius:9px;background:#fff}.phone-input span{padding:11px 10px;border-right:1px solid #dbe3ee;color:#143c74;background:#f4f8fd;font-weight:800}.phone-input input{flex:1;min-width:0;border:0!important;border-radius:0!important}.phone-input:focus-within{border-color:#0f6ed5;box-shadow:0 0 0 3px rgba(15,110,213,.1)}

/* Payment channel document */
.payment-channel-modal{width:min(100%,760px)}.payment-channel-paper{min-height:670px}.payment-channel-intro{margin:18px 0}.payment-channel-intro h3{margin:4px 0;color:#122f5c;font-size:19px}.payment-channel-intro>p:last-child{max-width:610px;line-height:1.55}.payment-account-card{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;overflow:hidden;border:1px solid #dce6f2;border-radius:12px;background:#dce6f2}.payment-account-card>div{padding:15px 17px;background:#fff}.payment-account-card span{display:block;margin-bottom:5px;color:#728299;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.payment-account-card b{display:block;color:#102e60;font-size:14px}.payment-account-number{font-size:20px!important;letter-spacing:.08em}.payment-qr-wrap{margin:24px auto 0;text-align:center}.payment-qr-image{display:block;width:min(100%,300px);margin:0 auto 10px;border:1px solid #e2e9f2;border-radius:12px}.payment-qr-wrap p{margin:0;color:#65758a;font-size:12px}.payment-channel-modal .quote-preview-actions{justify-content:flex-end}.payment-channel-modal .btn-primary{width:auto}@media(max-width:640px){.payment-channel-paper{padding:20px 16px}.payment-account-card{grid-template-columns:1fr}.payment-account-number{font-size:17px!important}}

/* Per-transaction billing documents */
.billing-transaction-register{margin-top:20px}.billing-row-actions{display:flex;flex-wrap:wrap;gap:6px;min-width:235px}.billing-row-actions button{padding:7px 9px;font-size:11px}.billing-transaction-modal{width:min(100%,820px)}.billing-transaction-paper{min-height:570px}.billing-job-reference{margin:18px 0 8px!important;padding:10px 12px;border-left:3px solid #167cdb;background:#f4f8fd;color:#506983!important;font-size:12px!important;line-height:1.55}.billing-job-reference b{color:#193c6b}.billing-transaction-paper table td:nth-child(1),.billing-transaction-paper table th:nth-child(1){text-align:left}.billing-transaction-paper table td:nth-child(n+3),.billing-transaction-paper table th:nth-child(n+3){text-align:right}.billing-transaction-paper table td small{display:block;margin-top:4px;color:#728299;font-size:11px;font-weight:400}.billing-transaction-total{margin-top:25px}.billing-transaction-total strong{margin-top:4px}@media(max-width:640px){.billing-row-actions{min-width:180px}.billing-transaction-paper{padding:20px 16px}.billing-transaction-paper table th,.billing-transaction-paper table td{padding:9px 7px;font-size:11px}}

/* Formal printable billing report */
.billing-print-modal{width:min(100%,820px)}.billing-print-modal .modal-head p{margin:3px 0 0;color:#718197;font-size:12px}.billing-report-paper{min-height:620px}.billing-report-intro{margin:18px 0 8px}.billing-report-intro h3{margin:4px 0;color:#122f5c;font-size:18px}.billing-report-intro>p:last-child{max-width:610px;line-height:1.5}.billing-report-paper table td:first-child{width:62%;text-align:left}.billing-report-paper table td small{display:block;margin-top:4px;color:#728299;font-size:11px;font-weight:400}.billing-report-total{margin-top:25px}.billing-report-total strong{margin-top:4px}.billing-print-modal .quote-preview-actions{justify-content:flex-end}.billing-print-modal .btn-primary{width:auto}@media(max-width:640px){.billing-report-paper{padding:20px 16px}.billing-report-paper table th,.billing-report-paper table td{padding:9px 7px;font-size:11px}.billing-report-paper table td small{font-size:10px}}

/* Shared company contact details on formal documents */
.quotation-paper .document-contact-details{display:block;max-width:430px;line-height:1.45}.quotation-paper .document-contact-email{margin-top:9px!important}.quotation-paper .document-contact-phones{margin-top:1px!important}
.document-project-details{margin:18px 0;padding:12px 15px;border-left:3px solid #1688df;background:#f5f8fd}.document-project-details b{color:#596a81;font-size:10px;letter-spacing:.07em;text-transform:uppercase}.document-project-details p{margin:5px 0 0;color:#465b76;font-size:12px;line-height:1.5}
.statement-project-detail{display:block;margin-bottom:4px;color:#102f60;font-size:12px}.statement-service-detail{display:block;color:#65758a;font-size:11px;line-height:1.45}
.job-customer-detail{max-width:290px;overflow:hidden;color:#718197!important;white-space:nowrap;text-overflow:ellipsis}.job-schedule-filters,.reminder-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.job-schedule-filters label,.reminder-filter-label{display:flex;align-items:center;gap:6px;color:#63758c;font-size:11px;font-weight:800}.job-schedule-filters select,.job-schedule-filters input,.reminder-filter-label select,.reminder-filter-label input{padding:9px 10px;border:1px solid #d7e2ef;border-radius:8px;color:#294665;background:#fff;font:inherit;font-weight:600}.job-schedule-filters select,.reminder-filter-label select{min-width:150px}

/* Action cells must remain actual table cells, otherwise their borders break away from the row. */
.customer-table td.row-actions{display:table-cell;vertical-align:middle;white-space:nowrap}
.customer-table td.row-actions button + button{margin-left:8px}

/* Customer focus mode for reviewing one job without accidentally changing another. */
.job-table tbody tr{transition:filter .16s ease,opacity .16s ease,background .16s ease}.job-table tbody tr.job-row-focused td{background:#edf6ff}.job-table tbody tr.job-row-focused td:first-child{box-shadow:inset 4px 0 #1976ff}.job-table tbody tr.job-row-dimmed{filter:grayscale(.85);opacity:.42}.job-table tbody tr.job-row-dimmed .row-actions button{cursor:not-allowed}.job-table tbody tr.job-row-dimmed .row-actions button:disabled{color:#9baabd;border-color:#e1e8f0;background:#f6f8fb}
.customer-table tbody tr.reminder-row-focused td{background:#edf6ff}.customer-table tbody tr.reminder-row-focused td:first-child{box-shadow:inset 4px 0 #1976ff}.customer-table tbody tr.reminder-row-dimmed{filter:grayscale(.85);opacity:.42;transition:filter .16s ease,opacity .16s ease}

/* Technician workspace: field-friendly phone controls. */
#app[data-user-role="technician"][data-view-mode="phone"]{touch-action:manipulation}
#app[data-user-role="technician"][data-view-mode="phone"] .mobile-menu{width:46px;height:46px;border-radius:12px;font-size:20px}
#app[data-user-role="technician"][data-view-mode="phone"] button,#app[data-user-role="technician"][data-view-mode="phone"] select,#app[data-user-role="technician"][data-view-mode="phone"] input{min-height:44px}
#app[data-user-role="technician"][data-view-mode="phone"] .topbar{position:sticky;top:0;z-index:10;background:#fff}
#app[data-user-role="technician"][data-view-mode="phone"] .job-schedule-filters,#app[data-user-role="technician"][data-view-mode="phone"] .reminder-filters{width:100%;align-items:stretch}
#app[data-user-role="technician"][data-view-mode="phone"] .job-schedule-filters label,#app[data-user-role="technician"][data-view-mode="phone"] .reminder-filter-label{width:100%;justify-content:space-between}
#app[data-user-role="technician"][data-view-mode="phone"] .job-schedule-filters select,#app[data-user-role="technician"][data-view-mode="phone"] .job-schedule-filters input,#app[data-user-role="technician"][data-view-mode="phone"] .reminder-filter-label select,#app[data-user-role="technician"][data-view-mode="phone"] .reminder-filter-label input{flex:1;min-width:0}
#app[data-user-role="technician"][data-view-mode="phone"] .customer-table{min-width:580px}
#app[data-user-role="technician"][data-view-mode="phone"] .row-actions{white-space:nowrap}

/* Context label for side-scrolling job tables: informative, but never a frozen column. */
.job-scroll-context{display:none}
#app[data-user-role="technician"][data-view-mode="phone"] .job-scroll-context:not([hidden]){display:flex;align-items:center;min-height:36px;margin:9px 10px 0;padding:8px 11px;border:1px solid #cce2fc;border-radius:9px;color:#165da9;background:linear-gradient(90deg,#eaf5ff,#f9fcff);font-size:12px;font-weight:800;box-shadow:0 5px 14px rgba(21,102,187,.08)}

/* A compact weekly agenda avoids the wide seven-column month grid on technician phones. */
.technician-calendar{overflow:hidden;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 6px 22px rgba(18,52,86,.035)}
.technician-calendar-controls{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:10px;padding:14px;border-bottom:1px solid var(--line)}
.technician-calendar-controls>div{min-width:0;text-align:center}.technician-calendar-controls b,.technician-calendar-controls small{display:block}.technician-calendar-controls b{color:#142e51;font-size:14px}.technician-calendar-controls small{margin-top:3px;color:#718197;font-size:11px}.technician-calendar-controls .calendar-nav{width:40px;height:40px}.technician-calendar-days{display:grid;gap:0}.technician-calendar-day{padding:13px 14px;border-bottom:1px solid #e8eef6}.technician-calendar-day:last-child{border-bottom:0}.technician-calendar-day.today{background:#f2f8ff}.technician-calendar-day>header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}.technician-calendar-day>header button{display:flex;align-items:center;gap:7px;padding:0;border:0;color:#193b68;background:transparent;font:800 14px 'Manrope',sans-serif;text-align:left}.technician-calendar-day>header button span{padding:3px 6px;border-radius:999px;color:#1268c5;background:#dcebff;font-size:10px}.technician-calendar-day>header>b{display:grid;min-width:24px;height:24px;place-items:center;border-radius:999px;color:#526d8d;background:#edf3f9;font-size:11px}.technician-calendar-day>p{margin:0;color:#91a0b1;font-size:12px}.technician-day-bookings{display:grid;gap:7px}.technician-day-bookings .calendar-event{display:grid;grid-template-columns:70px 1fr;gap:1px;margin:0;padding:9px 10px;text-align:left}.technician-day-bookings .calendar-event span{grid-row:1/3;margin:0;align-self:center;color:inherit;font-size:11px}.technician-day-bookings .calendar-event strong,.technician-day-bookings .calendar-event small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.technician-day-bookings .calendar-event strong{font-size:12px}.technician-day-bookings .calendar-event small{font-size:10px;font-weight:500}
.auto-expense-label{display:inline-block;padding:6px 8px;border-radius:7px;color:#5c6f85;background:#eef3f8;font-size:11px;font-weight:800}

/* Collapsible daily bookings keep the technician agenda short and easy to scan. */
.technician-calendar-day{padding:0}.technician-calendar-day details{width:100%}.technician-calendar-day summary{display:flex;align-items:center;gap:10px;padding:14px;cursor:pointer;list-style:none}.technician-calendar-day summary::-webkit-details-marker{display:none}.technician-calendar-day summary>span{display:flex;align-items:center;gap:7px;flex:1;min-width:0;color:#193b68;font:800 14px 'Manrope',sans-serif}.technician-calendar-day summary em{padding:3px 6px;border-radius:999px;color:#1268c5;background:#dcebff;font-size:10px;font-style:normal}.technician-calendar-day summary>b{display:grid;min-width:24px;height:24px;place-items:center;border-radius:999px;color:#526d8d;background:#edf3f9;font-size:11px}.technician-calendar-day summary>i{color:#50749d;font-size:17px;font-style:normal;transition:transform .16s ease}.technician-calendar-day details[open] summary{border-bottom:1px solid #e3edf8;background:#f8fbff}.technician-calendar-day details[open] summary>i{transform:rotate(180deg)}.technician-day-dropdown{padding:10px 14px 14px}.technician-day-dropdown>p{margin:0;color:#91a0b1;font-size:12px}

/* Attendance date column focus */
.attendance-table th.attendance-date-hover{color:#075bb5;background:#dceeff;box-shadow:inset 0 -3px #1677e8;transition:background .14s ease,color .14s ease,box-shadow .14s ease}
.warranty-sales{margin-top:20px;border-color:#e6d7a6}.warranty-sales header h2{color:#76580c}.warranty-payment-select{min-width:130px;padding:8px 10px;border:1px solid #dbe3ee;border-radius:8px;background:#fff;color:#19385e;font:inherit;font-size:12px}

/* Month backtracking and annual finance comparison */
.finance-period input[type="month"]{padding:9px 10px;border:1px solid #d7e2ef;border-radius:9px;color:#294665;background:#fff;font:700 13px 'Manrope',sans-serif}.finance-year-card{margin:0 0 18px;padding:20px;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:0 6px 22px rgba(18,52,86,.035)}.finance-year-card header{display:flex;align-items:center;justify-content:space-between;gap:12px}.finance-year-card h2{margin:0;color:#142e51;font:800 17px 'Manrope',sans-serif}.finance-year-card p{margin:4px 0 0;color:#718197;font-size:12px}.finance-year-legend{display:flex;flex-wrap:wrap;gap:14px;margin:17px 0 10px;color:#60748d;font-size:11px;font-weight:800}.finance-year-legend span:before{display:inline-block;width:9px;height:9px;margin-right:5px;border-radius:2px;content:'';background:#1877ea}.finance-year-legend .expenses:before{background:#f09a2b}.finance-year-legend .profit:before{background:#19a872}.finance-month-chart{display:grid;grid-template-columns:repeat(12,minmax(40px,1fr));align-items:end;gap:8px;min-height:210px;padding-top:10px;border-bottom:1px solid #dce5ef}.finance-month-chart article{display:grid;grid-template-rows:145px auto auto;align-items:end;gap:5px;min-width:0;text-align:center}.finance-month-bars{display:flex;align-items:end;justify-content:center;gap:4px;height:145px;padding:0 2px}.finance-month-bars i{display:block;width:40%;min-height:3px;border-radius:5px 5px 0 0;background:#1877ea}.finance-month-bars i.expenses{background:#f09a2b}.finance-month-chart b{overflow:hidden;color:#16815d;font-size:10px;white-space:nowrap;text-overflow:ellipsis}.finance-month-chart b.loss{color:#bd4152}.finance-month-chart span{color:#60748d;font-size:11px;font-weight:800}@media(max-width:640px){.finance-period input[type="month"]{flex:1}.finance-year-card header{align-items:flex-start;flex-direction:column}.finance-month-chart{overflow-x:auto;grid-template-columns:repeat(12,52px);padding-bottom:4px}.finance-month-chart article{min-width:52px}}

/* Dedicated job-update screen for technicians on phones. */
.technician-job-update{max-width:720px;margin:0 auto}.technician-job-back{width:auto;margin:0 0 16px}.technician-job-title{align-items:center;margin-bottom:18px}.technician-job-title .eyebrow{margin-bottom:8px;color:#3778b6}.technician-job-customer,.technician-job-summary,.technician-job-form{margin-bottom:14px;padding:18px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 6px 22px rgba(18,52,86,.035)}.technician-job-customer{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;border-left:4px solid #1976ff}.technician-job-customer span,.job-update-meta span,.job-update-services>span{display:block;color:#718197;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}.technician-job-customer h2{margin:3px 0;color:#102e5d;font:800 21px 'Manrope',sans-serif}.technician-job-customer a{color:#0a68c9;font-size:14px;font-weight:700;text-decoration:none}.technician-job-customer p{max-width:250px;margin:24px 0 0;color:#60748d;font-size:13px;text-align:right}.technician-job-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}.job-update-meta{min-width:0;padding:11px;border-radius:10px;background:#f7faff}.job-update-meta b{display:block;margin-top:5px;color:#18375f;font-size:13px;line-height:1.4;word-break:break-word}.job-update-meta.project,.job-update-services{grid-column:1/-1}.job-update-services{padding-top:4px}.job-update-services ul{display:grid;gap:6px;margin:8px 0 0;padding:0;list-style:none}.job-update-services li{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid #e8eef6;color:#415a78;font-size:13px}.job-update-services li:last-child{border-bottom:0}.technician-job-form{display:grid;gap:16px}.technician-job-form label{display:grid;gap:7px;color:#40516a;font-size:13px;font-weight:800}.technician-job-form select,.technician-job-form textarea{width:100%;border:1px solid #dbe3ee;border-radius:10px;color:#1b2a41;background:#fff;outline:none}.technician-job-form select{min-height:48px;padding:0 12px}.technician-job-form textarea{padding:12px;resize:vertical;line-height:1.45}.technician-job-form select:focus,.technician-job-form textarea:focus{border-color:#3998ef;box-shadow:0 0 0 3px #e5f3ff}.technician-job-form label small{color:#718197;font-size:11px;font-weight:400}.technician-photo-section{display:grid;gap:10px;padding:14px;border:1px dashed #bfd3ec;border-radius:11px;background:#f8fbff}.technician-photo-section strong,.technician-photo-section small{display:block}.technician-photo-section small{margin-top:3px;color:#718197;font-size:12px}.technician-photo-section input{max-width:100%;font-size:12px}.technician-photo-section .secondary-button{width:auto;justify-self:start}.technician-photo-section .form-message{margin:0;text-align:left}.technician-job-actions{display:grid;grid-template-columns:1fr 1.5fr;gap:10px;padding-top:2px}.technician-job-actions .btn-primary{width:auto}.technician-job-actions .secondary-button{width:100%}
#app[data-user-role="technician"][data-view-mode="phone"] .technician-job-update{padding-bottom:20px}#app[data-user-role="technician"][data-view-mode="phone"] .technician-job-title{align-items:flex-start;flex-direction:column}#app[data-user-role="technician"][data-view-mode="phone"] .technician-job-customer{align-items:stretch;flex-direction:column;gap:3px}#app[data-user-role="technician"][data-view-mode="phone"] .technician-job-customer p{max-width:none;margin:6px 0 0;text-align:left}#app[data-user-role="technician"][data-view-mode="phone"] .technician-job-summary{grid-template-columns:1fr 1fr}#app[data-user-role="technician"][data-view-mode="phone"] .job-update-meta.project,#app[data-user-role="technician"][data-view-mode="phone"] .job-update-services{grid-column:1/-1}#app[data-user-role="technician"][data-view-mode="phone"] .technician-photo-section .secondary-button{width:100%}#app[data-user-role="technician"][data-view-mode="phone"] .technician-job-actions{grid-template-columns:1fr}#app[data-user-role="technician"][data-view-mode="phone"] .technician-job-actions .btn-primary{width:100%}

/* Technician reminder list: a daily, no-scroll-table field view. */
.technician-reminders{max-width:720px;margin:0 auto}.technician-reminders .page-head{margin-bottom:16px}.technician-reminders .eyebrow{margin-bottom:8px;color:#3778b6}.technician-reminder-hero{display:grid;grid-template-columns:1fr 1.2fr;gap:11px;margin-bottom:14px}.technician-reminder-hero>div,.technician-reminder-hero>button{display:grid;gap:3px;padding:16px;border:0;border-radius:14px;color:#fff;background:linear-gradient(135deg,#0a3977,#0877d7);text-align:left;box-shadow:0 10px 22px rgba(11,94,215,.18)}.technician-reminder-hero>button{color:#163b69;background:#eaf4ff;box-shadow:none}.technician-reminder-hero span{font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;opacity:.8}.technician-reminder-hero b{font:800 25px/1.1 'Manrope',sans-serif}.technician-reminder-hero button b{font-size:16px}.technician-reminder-hero small{font-size:11px;line-height:1.4}.technician-reminder-list{padding:13px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 6px 22px rgba(18,52,86,.035)}.technician-reminder-controls{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;margin-bottom:13px}.technician-reminder-controls select{min-height:42px;padding:0 28px 0 10px;border:1px solid #dbe3ee;border-radius:9px;color:#294665;background:#fff;font-size:12px;font-weight:700}.technician-reminder-controls .search-box{width:auto}.technician-reminder-controls .search-box input{height:42px}.technician-reminder-day{margin-top:13px}.technician-reminder-day:first-child{margin-top:0}.technician-reminder-day header{display:flex;align-items:center;justify-content:space-between;padding:4px 3px 8px;color:#1b3f70}.technician-reminder-day header b{font:800 14px 'Manrope',sans-serif}.technician-reminder-day header span{padding:3px 7px;border-radius:999px;color:#47708e;background:#edf4fa;font-size:10px;font-weight:800}.technician-reminder-day>div{display:grid;gap:8px}.technician-reminder-card{display:grid;grid-template-columns:72px minmax(0,1fr) 18px;align-items:center;gap:10px;width:100%;padding:12px;border:1px solid #e2eaf3;border-radius:11px;color:#18375f;background:#fbfdff;text-align:left;transition:transform .15s ease,border .15s ease,box-shadow .15s ease}.technician-reminder-card:hover,.technician-reminder-card:focus{border-color:#8cc9ff;background:#f2f9ff;box-shadow:0 6px 16px rgba(18,99,181,.1);outline:none;transform:translateY(-1px)}.technician-reminder-time{padding-right:8px;border-right:1px solid #dce8f4}.technician-reminder-time b,.technician-reminder-time span{display:block}.technician-reminder-time b{color:#0b65ba;font-size:11px;line-height:1.2}.technician-reminder-time span{margin-top:4px;color:#718197;font-size:10px}.technician-reminder-main{min-width:0}.technician-reminder-main strong,.technician-reminder-main span,.technician-reminder-main small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.technician-reminder-main strong{color:#162f56;font-size:14px}.technician-reminder-main span{margin-top:2px;color:#37688f;font-size:12px}.technician-reminder-main small{margin-top:3px;color:#738aa4;font-size:10px}.technician-reminder-go{color:#0b67c4;font-size:26px;line-height:1}.technician-reminder-empty{display:grid;min-height:145px;place-content:center;gap:5px;color:#74869a;text-align:center}.technician-reminder-empty b{color:#35516e}
#app[data-user-role="technician"][data-view-mode="phone"] .technician-reminder-hero{grid-template-columns:1fr}#app[data-user-role="technician"][data-view-mode="phone"] .technician-reminder-controls{grid-template-columns:1fr}#app[data-user-role="technician"][data-view-mode="phone"] .technician-reminder-controls select{width:100%}

/* Editable technician service line items and requested job total. */
.tech-job-items-editor{padding-top:4px}.tech-job-items-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.tech-job-items-head>span{margin:0}.tech-job-items-head button{padding:7px 9px;border:0;border-radius:8px;color:#0965bd;background:#eaf4ff;font-size:11px;font-weight:800}.tech-job-item-labels,.tech-job-item{display:grid;grid-template-columns:minmax(0,1fr) 54px 82px 76px 28px;gap:7px;align-items:center}.tech-job-item-labels{margin:12px 0 5px;color:#718197;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.tech-job-item{margin:7px 0}.tech-job-item input{width:100%;min-width:0;min-height:42px;padding:0 8px;border:1px solid #cfe0f1;border-radius:8px;color:#1d385f;background:#fff;font:inherit;font-size:12px;outline:none}.tech-job-item input:focus{border-color:#2185eb;box-shadow:0 0 0 3px #e5f3ff}.tech-job-item output{overflow:hidden;color:#163a69;font-size:11px;font-weight:800;text-align:right;white-space:nowrap}.tech-job-item button{display:grid;width:26px;height:26px;place-items:center;padding:0;border:0;border-radius:7px;color:#c12f45;background:#ffe7ec;font-size:18px}.tech-job-total{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:12px;padding:13px;border-radius:10px;color:#fff;background:#0b3979}.tech-job-total span{margin:0;color:#dceeff;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}.tech-job-total b{font:800 21px 'Manrope',sans-serif}
#app[data-user-role="technician"][data-view-mode="phone"] .tech-job-item-labels,#app[data-user-role="technician"][data-view-mode="phone"] .tech-job-item{grid-template-columns:minmax(0,1fr) 43px 70px 67px 25px;gap:5px}#app[data-user-role="technician"][data-view-mode="phone"] .tech-job-item input{min-height:42px;padding:0 6px;font-size:11px}#app[data-user-role="technician"][data-view-mode="phone"] .tech-job-item-labels{font-size:8px}#app[data-user-role="technician"][data-view-mode="phone"] .tech-job-item output{font-size:10px}

/* Editable service description displayed inside the Service Details card. */
.job-update-services textarea{width:100%;margin-top:8px;padding:11px 12px;border:1px solid #9bcdfa;border-radius:10px;color:#1b2a41;background:#fff;outline:none;resize:vertical;font:inherit;line-height:1.45}.job-update-services textarea:focus{border-color:#2185eb;box-shadow:0 0 0 3px #e5f3ff}.job-update-services small{display:block;margin-top:5px;color:#718197;font-size:11px;line-height:1.4}

/* Fast, lightweight dashboard for field technicians using phones. */
.tech-phone-dashboard{max-width:720px;margin:0 auto}.tech-dashboard-greeting{margin-bottom:15px}.tech-dashboard-greeting p{margin:0;color:#6080a5;font-size:13px;font-weight:700}.tech-dashboard-greeting h1{margin:3px 0;color:#102e5c;font:800 31px/1.1 'Manrope',sans-serif;letter-spacing:-.045em}.tech-dashboard-greeting span{color:#718197;font-size:12px}.tech-dashboard-hero{display:grid;grid-template-columns:1.4fr 1fr;gap:10px;margin-bottom:14px}.tech-dashboard-hero>div,.tech-dashboard-hero>button{display:grid;gap:4px;padding:18px;border:0;border-radius:15px;color:#fff;background:linear-gradient(135deg,#092e64,#0b78dd);text-align:left;box-shadow:0 10px 22px rgba(11,94,215,.18)}.tech-dashboard-hero>button{align-content:center;color:#123b6c;background:#eaf4ff;box-shadow:none}.tech-dashboard-hero span{font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;opacity:.85}.tech-dashboard-hero b{font:800 30px/1 'Manrope',sans-serif}.tech-dashboard-hero button b{font-size:16px}.tech-dashboard-hero small{font-size:11px;line-height:1.4}.tech-dashboard-route,.tech-dashboard-upcoming{margin-bottom:14px;padding:15px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 6px 22px rgba(18,52,86,.035)}.tech-dashboard-route header,.tech-dashboard-upcoming header{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}.tech-dashboard-route h2,.tech-dashboard-upcoming h2{margin:0;color:#17365f;font:800 17px 'Manrope',sans-serif}.tech-dashboard-route p,.tech-dashboard-upcoming p{margin:2px 0 0;color:#7a8ca2;font-size:11px}.tech-dashboard-route header button,.tech-dashboard-upcoming header button{padding:7px 9px;border:0;border-radius:8px;color:#0b65bd;background:#edf6ff;font-size:11px;font-weight:800}.tech-dashboard-visit{display:grid;grid-template-columns:64px minmax(0,1fr) 16px;align-items:center;gap:9px;width:100%;padding:11px 0;border:0;border-top:1px solid #e7eef6;color:#183b69;background:#fff;text-align:left}.tech-dashboard-route header+.tech-dashboard-visit,.tech-dashboard-route header+div .tech-dashboard-visit:first-child{border-top:0}.tech-dashboard-visit>span{color:#0a69c4;font-size:11px;font-weight:800}.tech-dashboard-visit div{min-width:0}.tech-dashboard-visit b,.tech-dashboard-visit small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tech-dashboard-visit b{color:#16335c;font-size:13px}.tech-dashboard-visit small{margin-top:2px;color:#6f88a5;font-size:11px}.tech-dashboard-visit i{color:#0b70ce;font-size:24px;font-style:normal}.tech-dashboard-empty{padding:22px 8px;color:#768aa1;font-size:12px;text-align:center}.tech-dashboard-upcoming>p{padding:7px 0}.tech-dashboard-upcoming .tech-dashboard-visit:last-child{padding-bottom:0}
#app[data-user-role="technician"][data-view-mode="phone"] .tech-phone-dashboard{padding-bottom:20px}#app[data-user-role="technician"][data-view-mode="phone"] .tech-dashboard-hero{grid-template-columns:1fr}#app[data-user-role="technician"][data-view-mode="phone"] .tech-dashboard-visit{min-height:66px}

/* Reschedule date request on the technician update screen. */
.technician-job-form input{width:100%;min-height:48px;padding:0 12px;border:1px solid #dbe3ee;border-radius:10px;color:#1b2a41;background:#fff;outline:none}.technician-job-form input:focus{border-color:#3998ef;box-shadow:0 0 0 3px #e5f3ff}.technician-reschedule-date{padding:13px!important;border:1px solid #a8d4ff!important;border-radius:11px!important;background:#f1f8ff!important}.technician-reschedule-date[hidden]{display:none!important}.technician-reschedule-date:before{content:'Reschedule request';color:#0a68bd;font-size:11px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}.technician-reschedule-date input{background:#fff}

/* Job-order service photo uploads */
.job-photo-upload{display:grid;grid-template-columns:1fr;gap:11px;padding:14px;border:1px dashed #bfd3ec;border-radius:10px;background:#f8fbff}.job-photo-upload strong,.job-photo-upload small{display:block}.job-photo-upload small{margin-top:3px;color:#718197;font-size:12px}.job-photo-actions{display:flex;align-items:center;flex-wrap:wrap;gap:9px}.job-photo-upload input{max-width:100%;font-size:12px}.job-photo-upload button{width:auto;margin:0}.job-photo-upload .form-message{margin:0}.job-photo-upload .form-message a{color:#0b5ed7;font-weight:700}.job-photo-preview{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}.job-photo-preview:empty{display:none}.job-photo-thumb{position:relative;min-width:0;margin:0;padding:5px;border:1px solid #dce6f3;border-radius:10px;background:#fff}.job-photo-thumb>a{display:block;overflow:hidden;border-radius:7px;background:#eaf1fa}.job-photo-thumb img{display:block;width:100%;height:78px;object-fit:cover}.job-photo-thumb a.image-unavailable{min-height:78px;background:linear-gradient(135deg,#dce8f7,#f6f9fd)}.job-photo-thumb a.image-unavailable:after{display:grid;min-height:78px;place-items:center;content:'Open photo';color:#31577f;font-size:11px;font-weight:700}.job-photo-thumb a.image-unavailable img{display:none}.job-photo-thumb figcaption{overflow:hidden;margin-top:5px;color:#586d86;font-size:10px;white-space:nowrap;text-overflow:ellipsis}.job-photo-remove{position:absolute;top:-6px;right:-6px;display:grid!important;width:22px!important;height:22px!important;place-items:center;padding:0!important;border:1px solid #f2b9c3!important;border-radius:50%!important;color:#b52c42!important;background:#fff!important;font-size:18px!important;line-height:1!important;box-shadow:0 2px 7px rgba(45,66,95,.18)}.job-photo-remove:hover{background:#fff0f2!important}.job-photo-actions .danger-button{margin-left:auto}@media(max-width:640px){.job-photo-actions{align-items:stretch;flex-direction:column}.job-photo-actions button{width:100%}.job-photo-actions .danger-button{margin-left:0}.job-photo-preview{grid-template-columns:repeat(3,minmax(0,1fr))}}
/* Attendance review workflow: entries remain drafts until explicitly saved. */
.attendance-savebar {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin:0 18px 14px;
  padding:10px 12px;
  border:1px solid #d9e5f5;
  border-radius:12px;
  background:#f8fbff;
}
.attendance-savebar > div { display:flex; gap:8px; flex-wrap:wrap; }
.attendance-draft-status { color:#5c718f; font-size:12px; }
.attendance-draft-status.dirty { color:#9a5d00; font-weight:700; }
@media (max-width: 720px) {
  .attendance-savebar { align-items:stretch; flex-direction:column; margin:0 10px 12px; }
  .attendance-savebar > div { display:grid; grid-template-columns:1fr 1fr; }
  .attendance-savebar button { width:100%; }
}

/* Part Orders: a concise operational view of the supplier tracker. */
.part-order-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.part-order-actions .secondary-button,.part-order-actions .new-customer{width:auto;margin:0}.part-order-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin:0 0 18px}.part-order-stats article{padding:16px;border:1px solid #dfe8f4;border-radius:13px;background:#fff;box-shadow:0 6px 18px rgba(18,52,86,.035)}.part-order-stats span,.part-order-stats small{display:block;color:#718197;font-size:11px}.part-order-stats span{font-weight:800;letter-spacing:.06em;text-transform:uppercase}.part-order-stats b{display:block;margin:7px 0 2px;color:#123764;font:800 22px 'Manrope',sans-serif}.part-order-filter{display:flex;align-items:center;gap:8px;color:#58708e;font-size:12px;font-weight:800}.part-order-filter select{min-height:42px;min-width:144px;padding:0 30px 0 10px;border:1px solid #dbe5f0;border-radius:9px;color:#1d385f;background:#fff;font:inherit;font-size:12px}.part-orders-card{overflow:hidden}.part-orders-table{min-width:920px}.part-orders-table td{vertical-align:top}.part-orders-table td strong,.part-orders-table td small{display:block}.part-orders-table td strong{color:#14345e}.part-orders-table td small{margin-top:4px;color:#7385a0;font-size:11px;line-height:1.35}.part-status{display:inline-flex;max-width:145px;padding:5px 8px;border-radius:999px;color:#346282;background:#eef5fb;font-size:11px;font-weight:800;line-height:1.15}.part-status.delivered,.part-status.complete,.part-status.payment-paid{color:#087354;background:#dcf7eb}.part-status.returned,.part-status.cancelled{color:#925164;background:#fbe8ed}.part-status.not-delivered,.part-status.pending,.part-status.incomplete,.part-status.payment-unpaid{color:#946000;background:#fff1d3}.part-status.payment-warranty{color:#0d5fba;background:#e6f1ff}.part-order-modal{width:min(100%,760px)}.part-order-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:3px 0 20px}.part-order-details article{min-width:0;padding:13px;border:1px solid #e0eaf5;border-radius:10px;background:#f9fbfe}.part-order-details span,.part-order-details b,.part-order-details small{display:block}.part-order-details span{color:#71839c;font-size:10px;font-weight:800;letter-spacing:.07em;text-transform:uppercase}.part-order-details b{overflow-wrap:anywhere;margin-top:5px;color:#173a67;font-size:14px}.part-order-details small{overflow-wrap:anywhere;margin-top:5px;color:#6c819a;font-size:11px;line-height:1.45}.part-order-modal textarea{width:100%;padding:10px 12px;border:1px solid #dbe3ee;border-radius:9px;color:#1b2a41;background:#fff;font:inherit;resize:vertical}.part-order-modal textarea:focus{border-color:#3998ef;box-shadow:0 0 0 3px #e5f3ff;outline:none}@media(max-width:860px){.part-order-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.part-orders-toolbar{align-items:stretch;flex-wrap:wrap}.part-orders-toolbar .search-box{flex:1 1 280px}.part-order-filter{justify-content:space-between;flex:1 1 240px}.part-order-filter select{flex:1}}@media(max-width:640px){.part-order-actions{width:100%;display:grid;grid-template-columns:1fr}.part-order-actions .secondary-button,.part-order-actions .new-customer{width:100%}.part-order-stats{grid-template-columns:1fr}.part-order-details{grid-template-columns:1fr}#app[data-view-mode="phone"] .part-orders-card{overflow-x:auto}#app[data-view-mode="phone"] .part-orders-table{min-width:820px}}