:root {
    --navy-950: #0b1b2b;
    --navy-900: #10283f;
    --navy-800: #173852;
    --ink: #142638;
    --ink-soft: #536579;
    --muted: #7d8b99;
    --line: #e4e9ed;
    --line-strong: #d7dfe5;
    --canvas: #f3f6f7;
    --panel: #ffffff;
    --teal: #159b88;
    --teal-dark: #0f7d70;
    --teal-soft: #e4f6f2;
    --blue: #3478c5;
    --blue-soft: #e9f2fc;
    --violet: #7458c4;
    --violet-soft: #f0edfb;
    --amber: #d58a24;
    --amber-soft: #fff4df;
    --danger: #c24d4d;
    --danger-soft: #fcecec;
    --shadow: 0 8px 30px rgba(20, 42, 61, 0.07);
    --shadow-soft: 0 3px 16px rgba(20, 42, 61, 0.055);
    --radius: 16px;
    --radius-small: 10px;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--canvas); }
body { margin: 0; min-height: 100vh; color: var(--ink); font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 14px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
button, input, textarea, select { font: inherit; }
button, summary, select { cursor: pointer; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p { margin-top: 0; }
input, textarea, select { width: 100%; border: 1px solid var(--line-strong); border-radius: 9px; background: #fff; color: var(--ink); padding: 10px 12px; outline: none; transition: border-color .15s, box-shadow .15s; }
input:focus, textarea:focus, select:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(21,155,136,.11); }
input:disabled, textarea:disabled, select:disabled, button:disabled { opacity: .55; cursor: not-allowed; }
textarea { resize: vertical; }
label { display: grid; gap: 6px; color: #34495b; font-size: 12px; font-weight: 700; }
label small { color: var(--muted); font-weight: 500; }
.optional { color: #98a4af; font-weight: 500; }
.muted { color: var(--muted) !important; }
.text-danger { color: var(--danger) !important; font-weight: 700; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }

.brand-lockup { display: inline-flex; align-items: center; gap: 11px; }
.brand-lockup > span:last-child { display: grid; line-height: 1.05; }
.brand-lockup strong { font-size: 17px; letter-spacing: .01em; }
.brand-lockup small { margin-top: 4px; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; opacity: .66; }
.brand-lockup-light { color: #fff; }
.brand-mark { display: inline-grid; place-items: center; width: 39px; height: 39px; border-radius: 11px; background: linear-gradient(145deg, #2cc2a7, #128b7c); color: #fff; font-size: 13px; font-weight: 900; letter-spacing: .04em; box-shadow: inset 0 1px rgba(255,255,255,.25), 0 5px 14px rgba(7,116,100,.25); }
.eyebrow { display: block; margin-bottom: 7px; color: var(--teal-dark); font-size: 10px; line-height: 1.2; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.eyebrow-light { color: #8de0d1; }

.button { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; gap: 7px; border: 1px solid transparent; border-radius: 9px; padding: 9px 16px; font-weight: 750; white-space: nowrap; transition: transform .12s, background .15s, border-color .15s, box-shadow .15s; }
.button:hover { transform: translateY(-1px); }
.button:active { transform: translateY(0); }
.button-primary { border-color: var(--teal); background: var(--teal); color: #fff; box-shadow: 0 5px 14px rgba(21,155,136,.17); }
.button-primary:hover { border-color: var(--teal-dark); background: var(--teal-dark); }
.button-secondary { border-color: var(--line-strong); background: #fff; color: #34485a; }
.button-secondary:hover { border-color: #bbc8d1; background: #f8fafb; }
.button-danger-soft { background: var(--danger-soft); color: var(--danger); border-color: #f3cece; }
.button-large { min-height: 48px; padding: 12px 21px; font-size: 14px; }
.button-small { min-height: 32px; padding: 6px 11px; font-size: 11px; }
.button-full { width: 100%; }
.text-button, .icon-button { border: 0; background: none; color: var(--ink-soft); }

/* Login */
.login-body { display: grid; min-height: 100vh; place-items: center; padding: 28px; background: #eaf0f1; }
.login-shell { display: grid; grid-template-columns: minmax(420px, 1.06fr) minmax(420px, .94fr); width: min(1050px, 100%); min-height: 650px; overflow: hidden; border-radius: 26px; background: #fff; box-shadow: 0 30px 80px rgba(17,40,63,.16); }
.login-brand-panel { position: relative; display: flex; flex-direction: column; overflow: hidden; padding: 50px; color: #fff; background: linear-gradient(155deg, #0d2236 0%, #143653 62%, #0f6f69 145%); }
.login-brand-panel::before { content: ""; position: absolute; right: -100px; bottom: -130px; width: 410px; height: 410px; border: 1px solid rgba(125,224,206,.18); border-radius: 50%; box-shadow: 0 0 0 45px rgba(125,224,206,.035), 0 0 0 105px rgba(125,224,206,.025); }
.login-brand-panel::after { content: ""; position: absolute; top: 130px; right: 25px; width: 190px; height: 190px; border-radius: 52% 48% 64% 36%; background: linear-gradient(145deg, rgba(61,190,168,.13), rgba(61,190,168,0)); transform: rotate(30deg); }
.login-promise { position: relative; z-index: 1; margin: auto 0; max-width: 470px; }
.login-promise h1 { margin-bottom: 22px; font-size: clamp(37px, 4vw, 53px); line-height: 1.06; letter-spacing: -.045em; }
.login-promise p { max-width: 420px; color: #c6d5df; font-size: 16px; line-height: 1.75; }
.login-proof { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 9px; }
.login-proof span { border: 1px solid rgba(255,255,255,.14); border-radius: 30px; padding: 7px 12px; color: #bcd0da; font-size: 11px; }
.login-proof b { color: #7ed9c9; }
.login-form-panel { display: flex; flex-direction: column; padding: 60px 70px 30px; background: #fff; }
.login-form-wrap { width: 100%; max-width: 370px; margin: auto; }
.login-form-wrap h2 { margin-bottom: 8px; font-size: 27px; letter-spacing: -.03em; }
.login-form-wrap > p { margin-bottom: 28px; }
.login-form { gap: 17px; }
.password-field { position: relative; display: block; }
.password-field input { padding-right: 60px; }
.password-toggle { position: absolute; top: 50%; right: 7px; transform: translateY(-50%); padding: 5px 7px; font-size: 11px; font-weight: 800; }
.login-help { margin-top: 23px !important; color: var(--muted); font-size: 11px; text-align: center; }
.login-footer { margin: auto auto 0 !important; color: #9ba6af; font-size: 10px; }

/* Shell */
.app-shell { min-height: 100vh; }
.sidebar { position: fixed; z-index: 30; inset: 0 auto 0 0; display: flex; width: 248px; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; flex-direction: column; padding: 24px 16px 17px; background: linear-gradient(180deg, #10283f 0%, #0c2032 100%); color: #fff; scrollbar-color: rgba(102,216,196,.55) rgba(255,255,255,.04); scrollbar-width: thin; transition: width .2s ease, padding .2s ease; }
.sidebar::-webkit-scrollbar { width: 7px; }.sidebar::-webkit-scrollbar-track { background: rgba(255,255,255,.04); }.sidebar::-webkit-scrollbar-thumb { border-radius: 10px; background: rgba(102,216,196,.48); }
.sidebar-top { display: flex; align-items: center; justify-content: space-between; padding: 0 8px 28px; }
.sidebar-close { display: none; border: 0; background: none; color: #fff; font-size: 28px; }
.sidebar-controls { display: flex; align-items: center; gap: 5px; }.sidebar-collapse { display: grid; width: 28px; height: 28px; flex: 0 0 auto; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 8px; background: rgba(255,255,255,.045); color: #9bb0bf; font-size: 18px; line-height: 1; }.sidebar-collapse:hover { background: rgba(255,255,255,.1); color: #fff; }
.main-nav { display: grid; gap: 2px; }
.nav-section-label { padding: 0 9px 5px; color: #748b9d; font-size: 8px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.nav-item { position: relative; display: flex; min-height: 32px; align-items: center; gap: 9px; border-radius: 8px; padding: 4px 9px; color: #abc0ce; font-size: 11px; font-weight: 650; line-height: 1.15; transition: color .15s, background .15s; }
.nav-item:hover { color: #fff; background: rgba(255,255,255,.05); }
.nav-item.is-active { color: #fff; background: rgba(54,194,169,.13); }
.nav-item.is-active::after { content: ""; position: absolute; top: 5px; right: -16px; bottom: 5px; width: 3px; border-radius: 3px 0 0 3px; background: #40c9b1; }
.nav-icon { display: inline-grid; width: 22px; height: 22px; flex: 0 0 22px; place-items: center; border: 1px solid rgba(255,255,255,.09); border-radius: 6px; color: #7593a7; font-size: 7px; font-weight: 900; letter-spacing: -.03em; }
.nav-item.is-active .nav-icon { border-color: rgba(76,212,187,.3); background: rgba(76,212,187,.11); color: #66d8c4; }
.nav-group { display: grid; gap: 1px; }
.nav-group > summary { list-style: none; }
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group-summary { width: 100%; border: 0; background: transparent; text-align: left; }
.nav-group-caret { margin-left: auto; color: #6f8a9e; font-size: 14px; line-height: 1; transition: transform .15s ease; }
.nav-group[open] .nav-group-caret { transform: rotate(90deg); }
.nav-subitems { display: grid; gap: 1px; margin-left: 12px; border-left: 1px solid rgba(255,255,255,.08); padding-left: 5px; }
.nav-subitem { min-height: 28px; padding-top: 3px; padding-bottom: 3px; }
.nav-subitem .nav-icon { width: 20px; height: 20px; flex-basis: 20px; border-radius: 6px; font-size: 6px; }
.nav-group-badge { margin-left: auto; }
.sidebar-insight { display: flex; gap: 10px; margin: auto 4px 18px; border: 1px solid rgba(255,255,255,.07); border-radius: 12px; padding: 13px; background: rgba(255,255,255,.035); }
.insight-dot { flex: 0 0 auto; width: 7px; height: 7px; margin-top: 5px; border-radius: 50%; background: #43cbb3; box-shadow: 0 0 0 4px rgba(67,203,179,.1); }
.sidebar-insight strong { display: block; margin-bottom: 4px; color: #c8d7e1; font-size: 10px; }
.sidebar-insight p { margin: 0; color: #788fa1; font-size: 9px; line-height: 1.55; }
.sidebar-account { display: flex; align-items: center; gap: 5px; border-top: 1px solid rgba(255,255,255,.08); padding: 15px 3px 0; }
.sidebar-top, .main-nav, .sidebar-insight, .sidebar-account { flex-shrink: 0; }
.account-link { display: flex; min-width: 0; flex: 1; align-items: center; gap: 9px; border-radius: 9px; padding: 4px; }
.account-link.is-active { background: rgba(255,255,255,.05); }
.account-link > span:last-child { display: grid; min-width: 0; }
.account-link strong { overflow: hidden; color: #d9e5eb; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.account-link small { color: #72899c; font-size: 8px; }
.logout-form .icon-button { color: #7e95a6; font-size: 17px; }
.sidebar-logout { display: grid; min-width: 48px; justify-items: center; gap: 1px; border: 0; border-radius: 8px; padding: 6px 5px; background: rgba(255,255,255,.045); color: #8fa4b4; }.sidebar-logout span { font-size: 7px; font-weight: 750; }.sidebar-logout b { font-size: 13px; line-height: 1; }.sidebar-logout:hover { background: rgba(255,255,255,.09); color: #fff; }
.avatar { display: inline-grid; width: 36px; height: 36px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: #dff2ef; color: var(--teal-dark); font-size: 10px; font-weight: 900; }
.avatar-small { width: 32px; height: 32px; border-radius: 9px; background: rgba(53,195,170,.13); color: #53cbb6; }
.main-column { min-height: 100vh; margin-left: 248px; transition: margin-left .2s ease; }
.topbar { position: sticky; z-index: 20; top: 0; display: flex; min-height: 79px; align-items: center; gap: 16px; border-bottom: 1px solid rgba(219,226,231,.9); padding: 13px 36px; background: rgba(255,255,255,.92); backdrop-filter: blur(15px); }
.topbar > div:nth-child(2) { flex: 1; }
.topbar h1 { margin: 0; color: var(--ink); font-size: 17px; letter-spacing: -.015em; }
.topbar-context { display: block; margin-bottom: 2px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.topbar-actions { display: flex; align-items: center; gap: 14px; }
.topbar-comms-toggle { position: relative; display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--navy-800); box-shadow: var(--shadow-soft); }.topbar-comms-toggle:hover, .topbar-comms-toggle[aria-expanded="true"] { border-color: #b9ddd7; background: var(--teal-soft); color: var(--teal-dark); }.chat-bubble-icon { display: grid; width: 18px; height: 18px; place-items: center; }.chat-bubble-icon svg, .team-message-toast-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }.comms-notification-badge { position: absolute; top: -7px; right: -7px; display: grid; min-width: 19px; height: 19px; place-items: center; border: 2px solid #fff; border-radius: 999px; padding: 0 4px; background: var(--danger); color: #fff; font-size: 8px; font-weight: 900; line-height: 1; }.comms-notification-badge[hidden] { display: none; }.topbar-comms-toggle.has-unread { border-color: #e4a9a9; animation: comms-button-pulse 1.1s ease-in-out infinite; }.topbar-comms-toggle.has-unread .comms-notification-badge { animation: comms-badge-blink .8s steps(2, start) infinite; }
.live-clock { color: var(--muted); font-size: 10px; font-weight: 650; }
.topbar-link { border-left: 1px solid var(--line); padding-left: 14px; color: #526678; font-size: 10px; font-weight: 750; }
.mobile-menu { display: none; border: 0; background: none; color: var(--ink); font-size: 22px; }
.nav-scrim { display: none; }
.global-attendance-strip { display: flex; min-height: 46px; align-items: center; justify-content: flex-end; gap: 8px; border-bottom: 1px solid var(--line); padding: 6px 36px; background: #fff; }
.attendance-strip-item { display: flex; min-width: 122px; align-items: center; gap: 8px; border: 1px solid var(--line); border-radius: 10px; padding: 5px 9px; background: #fbfcfc; }
.attendance-strip-item > b { display: grid; width: 25px; height: 25px; flex: 0 0 auto; place-items: center; border-radius: 8px; background: #edf2f4; color: var(--ink-soft); font-size: 9px; font-weight: 900; }
.attendance-strip-item > span { display: flex; min-width: 0; flex: 1; align-items: baseline; justify-content: space-between; gap: 7px; }
.attendance-strip-item small { overflow: hidden; color: var(--muted); font-size: 7px; font-weight: 800; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.attendance-strip-item strong { font-size: 14px; line-height: 1; }
.attendance-strip-item.is-present > b { background: var(--teal-soft); color: var(--teal-dark); }.attendance-strip-item.is-present strong { color: var(--teal-dark); }
.attendance-strip-item.is-leave > b { background: var(--amber-soft); color: #9a651c; }.attendance-strip-item.is-leave strong { color: #9a651c; }
.attendance-strip-item.is-absent > b { background: var(--danger-soft); color: var(--danger); }.attendance-strip-item.is-absent strong { color: var(--danger); }
.page-content { width: 100%; max-width: 1600px; min-height: calc(100vh - 122px); margin: 0 auto; padding: 28px 36px 36px; }
.app-footer { display: flex; justify-content: space-between; border-top: 1px solid var(--line); padding: 15px 36px; color: #92a0ab; font-size: 9px; }

/* Common */
.panel { border: 1px solid rgba(222,229,234,.95); border-radius: var(--radius); background: var(--panel); box-shadow: var(--shadow-soft); }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 20px; }
.panel-header h3 { margin: 0; font-size: 15px; letter-spacing: -.015em; }
.panel-meta { border-radius: 20px; background: #f1f5f6; padding: 5px 9px; color: var(--muted); font-size: 9px; font-weight: 750; }
.inline-link { color: var(--teal-dark); font-size: 10px; font-weight: 800; }
.alert { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; border: 1px solid; border-radius: 11px; padding: 11px 14px; font-size: 11px; font-weight: 650; }
.alert button { border: 0; background: none; color: inherit; font-size: 17px; }
.alert-success { border-color: #bde6dd; background: #e8f7f3; color: #176f62; }
.alert-error { border-color: #efc8c8; background: #fdf0f0; color: #9f3f3f; }
.stack-form { display: grid; gap: 14px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 17px; }
.span-2 { grid-column: span 2; }
.form-actions { display: flex; align-items: end; justify-content: flex-end; }
.inline-notice { margin-bottom: 15px; border-left: 3px solid var(--amber); border-radius: 4px 8px 8px 4px; padding: 9px 11px; background: var(--amber-soft); color: #7f5a20; font-size: 10px; }
.form-readonly { display: grid; gap: 3px; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; background: #f7f9fa; }.form-readonly span { color: #34495b; font-size: 12px; font-weight: 700; }.form-readonly strong { font-size: 11px; }.form-readonly small { color: var(--muted); font-size: 8px; }
.client-lookup { position: relative; display: grid; gap: 6px; }.client-lookup-result { display: flex; min-height: 39px; align-items: center; justify-content: space-between; gap: 9px; border: 1px dashed var(--line-strong); border-radius: 8px; padding: 7px 9px; background: #f8fafb; color: var(--muted); }.client-lookup-result > span { display: grid; min-width: 0; }.client-lookup-result strong { color: var(--ink-soft); font-size: 8px; }.client-lookup-result small { overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }.client-lookup-result .inline-link { flex: 0 0 auto; font-size: 8px; }.client-lookup-result.is-checking { border-color: #c8d8e2; background: #f4f8fb; }.client-lookup-result.is-found { border-style: solid; border-color: #bce2db; background: var(--teal-soft); }.client-lookup-result.is-found strong { color: var(--teal-dark); }.client-lookup-result.is-new { border-style: solid; border-color: #ead6ac; background: var(--amber-soft); }.client-lookup-result.is-new strong { color: #8d621e; }.client-lookup-result.is-error { border-color: #efc8c8; background: var(--danger-soft); }.client-lookup-suggestions { position: absolute; z-index: 45; top: calc(100% + 4px); right: 0; left: 0; display: grid; max-height: 265px; overflow-y: auto; border: 1px solid #b8ccd5; border-radius: 10px; padding: 5px; background: #fff; box-shadow: 0 14px 34px rgba(20, 51, 64, .2); }.client-lookup-suggestions[hidden] { display: none; }.client-lookup-option { display: grid; width: 100%; gap: 2px; border: 0; border-bottom: 1px solid #edf1f3; border-radius: 7px; padding: 9px 10px; background: transparent; color: var(--ink); text-align: left; cursor: pointer; }.client-lookup-option:last-child { border-bottom: 0; }.client-lookup-option:hover, .client-lookup-option:focus-visible { outline: 0; background: var(--teal-soft); }.client-lookup-option strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.client-lookup-option small { color: var(--muted); font-size: 7px; }
.badge { display: inline-flex; align-items: center; width: max-content; border-radius: 20px; padding: 4px 8px; background: #eef2f4; color: #6d7b87; font-size: 8px; font-weight: 850; letter-spacing: .02em; text-transform: uppercase; }
.badge-live, .badge-in_progress { background: var(--teal-soft); color: var(--teal-dark); }
.badge-resolved { background: var(--blue-soft); color: #2d6eaf; }
.badge-pending { background: var(--amber-soft); color: #986516; }
.badge-escalated { background: var(--danger-soft); color: var(--danger); }
.badge-new, .badge-open { background: var(--blue-soft); color: var(--blue); }.badge-waiting { background: var(--amber-soft); color: #986516; }.badge-closed { background: #edf0f2; color: #778590; }
.badge-disabled { background: #edf0f2; color: #9ca6ae; }
.badge-warning { background: var(--amber-soft); color: #956116; }
.empty-state { display: flex; min-height: 180px; align-items: center; justify-content: center; gap: 13px; padding: 30px; color: var(--muted); text-align: left; }
.empty-state strong { display: block; margin-bottom: 2px; color: #536779; }
.empty-state p { margin: 0; font-size: 10px; }
.empty-icon { display: inline-grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border-radius: 11px; background: #eff4f5; color: #81929f; font-size: 10px; font-weight: 900; }
.small-empty { min-height: 110px; flex-direction: column; text-align: center; }
.small-empty span { color: var(--teal); font-size: 20px; }
.compact-empty { min-height: 90px; justify-content: flex-start; padding: 15px 0; }
.summary-pill { display: grid; min-width: 140px; border: 1px solid var(--line); border-radius: 12px; padding: 10px 14px; background: #fff; box-shadow: var(--shadow-soft); }
.summary-pill span { color: var(--muted); font-size: 9px; font-weight: 700; text-transform: uppercase; }
.summary-pill strong { font-size: 17px; }

/* Dashboard */
.welcome-row { display: flex; align-items: center; justify-content: space-between; gap: 25px; margin-bottom: 22px; }
.welcome-row h2, .page-intro h2 { margin-bottom: 6px; font-size: 26px; line-height: 1.18; letter-spacing: -.035em; }
.welcome-row p, .page-intro p { margin: 0; color: var(--ink-soft); font-size: 11px; }
.dashboard-header-controls { display: flex; align-items: stretch; justify-content: flex-end; gap: 10px; }
.auto-refresh-control { display: grid; grid-template-columns: auto auto; min-width: 255px; align-items: center; gap: 5px 12px; border: 1px solid var(--line); border-radius: 13px; padding: 8px 11px; background: #fff; box-shadow: var(--shadow-soft); }
.auto-refresh-toggle { display: flex; align-items: center; gap: 8px; border: 0; padding: 0; background: none; color: var(--ink); text-align: left; }.auto-refresh-toggle > span:last-child { display: grid; }.auto-refresh-toggle small { color: var(--muted); font-size: 8px; font-weight: 700; text-transform: uppercase; }.auto-refresh-toggle strong { color: var(--muted); font-size: 11px; }.auto-refresh-toggle.is-active strong { color: var(--teal-dark); }
.auto-refresh-dot { width: 19px; height: 19px; border: 6px solid #d4dce1; border-radius: 50%; background: #fff; transition: border-color .18s ease, box-shadow .18s ease; }.auto-refresh-toggle.is-active .auto-refresh-dot { border-color: var(--teal); box-shadow: 0 0 0 4px var(--teal-soft); }
.auto-refresh-interval { display: flex; align-items: center; justify-content: flex-end; gap: 4px; color: var(--muted); font-size: 8px; }.auto-refresh-interval input { width: 48px; min-height: 29px; padding: 4px 5px; color: var(--ink); font-size: 10px; font-weight: 800; text-align: center; }
.auto-refresh-status { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 5px; color: var(--muted); font-size: 7px; text-align: right; }
.shift-control { display: flex; min-width: 330px; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 10px; border: 1px solid var(--line); border-radius: 13px; padding: 10px 11px 10px 14px; background: #fff; box-shadow: var(--shadow-soft); }
.shift-control .timer-copy { margin-right: auto; }
.shift-actions { display: flex; align-items: center; gap: 6px; }.shift-actions form { margin: 0; }.shift-actions .button { padding-right: 11px; padding-left: 11px; white-space: nowrap; }
.shift-pause-details { position: relative; }
.shift-pause-details > summary { list-style: none; }
.shift-pause-details > summary::-webkit-details-marker { display: none; }
.pause-workday-form { position: absolute; z-index: 20; top: calc(100% + 8px); right: 0; display: grid; width: 315px; gap: 10px; border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fff; box-shadow: 0 16px 40px rgba(20,42,61,.18); }
.pause-workday-form > small { color: var(--muted); font-size: 8px; line-height: 1.45; }
.timer-copy { display: flex; align-items: center; gap: 10px; }
.timer-copy > span:last-child { display: grid; }
.timer-copy small { color: var(--muted); font-size: 8px; font-weight: 700; text-transform: uppercase; }
.timer-copy strong { font-size: 12px; }
.status-dot { width: 9px; height: 9px; border-radius: 50%; background: #c2ccd3; box-shadow: 0 0 0 5px #f1f4f5; }
.status-dot-live { background: var(--teal); box-shadow: 0 0 0 5px var(--teal-soft); animation: pulse 2s infinite; }
.status-dot-finished { background: var(--blue); box-shadow: 0 0 0 5px var(--blue-soft); }
.finished-day-check { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: var(--blue-soft); color: var(--blue); font-size: 16px; font-weight: 900; }
@keyframes pulse { 50% { box-shadow: 0 0 0 8px rgba(21,155,136,.05); } }
.late-attendance-alert { display: grid; grid-template-columns: minmax(220px, .42fr) minmax(0, 1fr); gap: 12px 18px; margin-bottom: 18px; border: 1px solid #efc6c6; border-radius: 13px; padding: 14px; background: #fff5f5; box-shadow: var(--shadow-soft); }.late-attendance-heading { display: flex; align-items: center; gap: 11px; color: #8f3030; }.late-attendance-heading > span:last-child { display: grid; }.late-attendance-heading strong { font-size: 11px; }.late-attendance-heading small { color: #a96969; font-size: 8px; }.late-attendance-heading .attention-icon { background: #f5d7d7; }.late-attendance-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }.late-attendance-item { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 7px; border: 1px solid #efd4d4; border-radius: 9px; padding: 7px; background: #fff; }.late-attendance-item > a { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; padding: 2px 3px; }.late-attendance-item > a > span { display: grid; min-width: 0; }.late-attendance-item > a > span:last-child { text-align: right; }.late-attendance-item strong { overflow: hidden; color: var(--ink); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.late-attendance-item b { color: var(--danger); font-size: 8px; }.late-attendance-item small { color: var(--muted); font-size: 7px; }.late-attendance-item form { margin: 0; }
.attention-strip { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; border: 1px solid #eed9b6; border-radius: 12px; padding: 11px 13px; background: #fffaf0; color: #714f1b; }
.attention-icon { display: grid; width: 27px; height: 27px; flex: 0 0 auto; place-items: center; border-radius: 8px; background: #f8e4bf; font-weight: 900; }
.attention-strip > span:nth-child(2) { display: grid; flex: 1; }
.attention-strip strong { font-size: 10px; }
.attention-strip small { color: #9b7b49; font-size: 9px; }
.attention-action { font-size: 10px; font-weight: 800; }
.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 18px; }
.metric-card { position: relative; display: block; min-height: 128px; overflow: hidden; border: 1px solid var(--line); border-radius: 14px; padding: 19px; background: #fff; box-shadow: var(--shadow-soft); color: var(--ink); text-decoration: none; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
.metric-card:hover { border-color: #a9d5ce; box-shadow: 0 13px 30px rgba(19,52,72,.11); transform: translateY(-2px); }
.metric-label { position: relative; z-index: 1; display: block; margin-bottom: 15px; color: var(--ink-soft); font-size: 9px; font-weight: 750; text-transform: uppercase; letter-spacing: .04em; }
.metric-card > strong { position: relative; z-index: 1; display: block; margin-bottom: 4px; font-size: 24px; line-height: 1; letter-spacing: -.04em; }
.metric-card > small { position: relative; z-index: 1; color: var(--muted); font-size: 9px; }
.metric-orb { position: absolute; top: -31px; right: -27px; width: 104px; height: 104px; border-radius: 50%; opacity: .65; }
.metric-teal .metric-orb { background: var(--teal-soft); }.metric-teal > strong { color: var(--teal-dark); }
.metric-blue .metric-orb { background: var(--blue-soft); }.metric-blue > strong { color: var(--blue); }
.metric-violet .metric-orb { background: var(--violet-soft); }.metric-violet > strong { color: var(--violet); }
.metric-amber .metric-orb { background: var(--amber-soft); }.metric-amber > strong { color: #b9791e; }
.dashboard-grid { display: grid; min-width: 0; grid-template-columns: minmax(0, 1.65fr) minmax(300px, .75fr); align-items: start; gap: 18px; }
.dashboard-main, .dashboard-side { display: grid; min-width: 0; max-width: 100%; align-content: start; gap: 18px; }
.dashboard-grid .panel { min-width: 0; max-width: 100%; padding: 20px; }
.dashboard-main > .panel, .dashboard-side > .panel { overflow: hidden; }
.chart-panel { min-height: 330px; }
.bar-chart { display: flex; height: 180px; align-items: stretch; justify-content: space-around; gap: 12px; padding: 9px 5px 0; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to bottom, transparent 0, transparent 44px, #edf1f3 45px); }
.bar-column { display: grid; width: 100%; grid-template-rows: 20px 1fr 23px; align-items: end; justify-items: center; }
.bar-value { color: #70818f; font-size: 8px; font-weight: 700; }
.bar-track { position: relative; width: min(31px, 60%); height: 100%; overflow: hidden; border-radius: 6px 6px 0 0; background: rgba(231,237,239,.55); }
.bar-fill { position: absolute; right: 0; bottom: 0; left: 0; min-height: 4px; border-radius: 6px 6px 0 0; background: linear-gradient(180deg, #35bfa7, #159b88); box-shadow: inset 0 1px rgba(255,255,255,.2); }
.bar-label { align-self: center; color: var(--muted); font-size: 8px; font-weight: 700; }
.productivity-chart-header { align-items: flex-start; margin-bottom: 12px; }.productivity-chart-actions { display: flex; align-items: center; gap: 8px; }.chart-view-toggle { display: inline-flex; border: 1px solid var(--line); border-radius: 9px; padding: 2px; background: #f5f8f9; }.chart-view-toggle button { border: 0; border-radius: 7px; padding: 6px 9px; background: transparent; color: var(--muted); font-size: 8px; font-weight: 800; }.chart-view-toggle button.is-active { background: #fff; color: var(--teal-dark); box-shadow: 0 1px 4px rgba(20,42,61,.1); }.productivity-legend { display: flex; flex-wrap: wrap; gap: 6px 13px; margin-bottom: 10px; }.productivity-legend span { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 7px; font-weight: 700; }.productivity-legend i, .productivity-pie-legend i { width: 8px; height: 8px; flex: 0 0 auto; border-radius: 3px; background: var(--series-color); }
.grouped-bar-chart { display: grid; height: 218px; min-width: 0; grid-template-columns: repeat(7, minmax(44px, 1fr)); gap: 7px; border-bottom: 1px solid var(--line); background: repeating-linear-gradient(to bottom, transparent 0, transparent 43px, #edf1f3 44px); }.grouped-bar-day { display: grid; min-width: 0; grid-template-rows: minmax(0, 1fr) 31px; }.grouped-bars { display: flex; min-width: 0; align-items: flex-end; justify-content: center; gap: 3px; padding: 6px 2px 0; }.grouped-bar { display: flex; width: clamp(5px, 13%, 13px); height: 100%; align-items: flex-end; border-radius: 4px 4px 0 0; background: color-mix(in srgb, var(--series-color) 10%, transparent); }.grouped-bar i { display: block; width: 100%; height: var(--bar-height); min-height: 0; border-radius: 4px 4px 0 0; background: var(--series-color); box-shadow: inset 0 1px rgba(255,255,255,.24); }.grouped-bar-label { display: grid; align-content: center; color: var(--muted); text-align: center; }.grouped-bar-label strong { font-size: 8px; }.grouped-bar-label small { font-size: 6px; }
.productivity-pie-view { display: grid; min-height: 218px; grid-template-columns: minmax(170px, .65fr) minmax(260px, 1.35fr); align-items: center; gap: 25px; padding: 4px 24px 0; }.productivity-pie { display: grid; width: 180px; height: 180px; margin: 0 auto; place-items: center; border-radius: 50%; background: var(--pie-background); }.productivity-pie > span { display: grid; width: 104px; height: 104px; place-content: center; border-radius: 50%; background: #fff; text-align: center; box-shadow: 0 0 0 1px rgba(222,229,234,.8); }.productivity-pie strong { font-size: 24px; line-height: 1; }.productivity-pie small { margin-top: 5px; color: var(--muted); font-size: 7px; text-transform: uppercase; }.productivity-pie-legend { display: grid; gap: 8px; }.productivity-pie-legend > strong { font-size: 11px; }.productivity-pie-legend > small { margin-top: -5px; color: var(--muted); font-size: 7px; }.productivity-pie-legend > span { display: grid; grid-template-columns: 9px minmax(0, 1fr) auto 30px; align-items: center; gap: 7px; border-top: 1px solid #edf1f3; padding-top: 7px; }.productivity-pie-legend b { font-size: 9px; }.productivity-pie-legend span > strong { font-size: 11px; }.productivity-pie-legend span > small { color: var(--muted); font-size: 7px; text-align: right; }.chart-scale-note { display: block; margin-top: 8px; color: var(--muted); font-size: 6px; text-align: right; }[data-chart-panel][hidden] { display: none !important; }
.table-wrap { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; white-space: nowrap; }
.data-table th { border-bottom: 1px solid var(--line); padding: 8px 9px; color: #86939e; font-size: 8px; font-weight: 800; text-align: left; text-transform: uppercase; }
.data-table td { border-bottom: 1px solid #edf1f3; padding: 10px 9px; color: #4a5f70; font-size: 10px; }
.data-table tbody tr:last-child td { border-bottom: 0; }
.expense-page-intro { align-items: end; }
.expense-summary { display: flex; gap: 9px; }
.expense-summary > span { display: grid; min-width: 116px; gap: 2px; border: 1px solid var(--line); border-radius: 11px; padding: 9px 12px; background: #fff; }
.expense-summary strong { font-size: 16px; }
.expense-summary small { color: var(--muted); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.expense-entry-panel, .expense-monthly-panel, .expense-breakdown-panel, .expense-register-panel { margin-top: 18px; padding: 22px; }
.expense-entry-panel { border-color: #cce6e1; background: linear-gradient(145deg, #fff, #f7fcfb); }
.expense-field-chip { border-radius: 999px; padding: 5px 9px; background: var(--teal-soft); color: var(--teal-dark); font-size: 8px; font-weight: 850; text-transform: uppercase; }
.expense-entry-form { max-width: 940px; }
.expense-entry-form .form-actions { align-items: center; gap: 12px; }
.expense-entry-form .form-actions small { color: var(--muted); font-size: 9px; }
.expense-entry-form [data-expense-description].is-required > span::after { content: " · required"; color: var(--danger); font-weight: 800; }
.expense-client-link, .expense-category { display: grid; gap: 1px; }
.expense-table { min-width: 900px; }
.expense-client-link { color: var(--teal-dark); }
.expense-client-link small, .expense-category small { color: var(--muted); font-size: 8px; }
.expense-amount { color: var(--ink) !important; font-weight: 850; }
.expense-description { max-width: 280px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.expense-month-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 9px; }
.expense-month-card { display: grid; min-height: 94px; align-content: center; gap: 5px; border: 1px solid #dbe6e9; border-radius: 12px; padding: 13px 15px; background: linear-gradient(145deg, #fff, #f7fbfa); }
.expense-month-card time { color: var(--teal-dark); font-size: 8px; font-weight: 850; letter-spacing: .04em; text-transform: uppercase; }
.expense-month-card strong { color: var(--ink); font-size: 18px; line-height: 1.1; }
.expense-month-card small { color: var(--muted); font-size: 8px; }
.expense-breakdown-list { border: 1px solid var(--line); border-radius: 13px; overflow: hidden; }
.expense-breakdown-heading, .expense-breakdown-summary { display: grid; grid-template-columns: 48px minmax(145px, 1.35fr) minmax(105px, .8fr) minmax(145px, 1fr) 70px 105px 78px; gap: 12px; align-items: center; }
.expense-breakdown-list.is-personal .expense-breakdown-heading, .expense-breakdown-list.is-personal .expense-breakdown-summary { grid-template-columns: 48px minmax(105px, .8fr) minmax(145px, 1fr) 70px 105px 78px; }
.expense-breakdown-heading { min-width: 760px; padding: 9px 14px; background: #f5f8f8; color: var(--muted); font-size: 8px; font-weight: 850; letter-spacing: .02em; text-transform: uppercase; }
.expense-breakdown-record { border-top: 1px solid var(--line); }
.expense-breakdown-record:first-of-type { border-top: 0; }
.expense-breakdown-summary { min-width: 760px; padding: 12px 14px; cursor: pointer; list-style: none; background: #fff; font-size: 10px; transition: background .16s ease; }
.expense-breakdown-summary::-webkit-details-marker { display: none; }
.expense-breakdown-summary:hover, .expense-breakdown-summary:focus-visible, .expense-breakdown-record[open] > .expense-breakdown-summary { background: #f4fbf9; }
.expense-breakdown-summary:focus-visible { outline: 2px solid var(--teal); outline-offset: -2px; }
.expense-breakdown-serial { color: var(--muted); }
.expense-breakdown-toggle { display: inline-flex; align-items: center; justify-content: flex-end; gap: 5px; color: var(--teal-dark); font-size: 9px; font-weight: 850; }
.expense-breakdown-toggle b { font-size: 14px; line-height: 1; transition: transform .16s ease; }
.expense-breakdown-toggle .when-open { display: none; }
.expense-breakdown-record[open] .expense-breakdown-toggle .when-closed { display: none; }
.expense-breakdown-record[open] .expense-breakdown-toggle .when-open { display: inline; }
.expense-breakdown-record[open] .expense-breakdown-toggle b { transform: rotate(180deg); }
.expense-breakdown-details { margin: 0; border-top: 1px solid #d7e9e5; background: #fbfdfd; }
.expense-breakdown-table { min-width: 810px; margin: 0; }
.expense-breakdown-table th, .expense-breakdown-table td { padding-top: 9px; padding-bottom: 9px; }
.expense-breakdown-table tfoot td { border-top: 2px solid #cfe2de; background: #f1f8f6; }
.expense-breakdown-grand-total { display: flex; align-items: center; justify-content: flex-end; gap: 28px; padding: 12px 14px; border-top: 2px solid #cfe2de; background: #edf7f4; color: var(--teal-dark); font-size: 10px; font-weight: 850; }
.expense-breakdown-grand-total strong { color: var(--ink); font-size: 14px; }
.attendance-table-status, .access-table-status { display: grid; gap: 1px; font-size: 8px; font-weight: 800; }.attendance-table-status small, .access-table-status small { color: var(--muted); font-size: 7px; font-weight: 600; }.attendance-table-status.is-on-time, .access-table-status.is-signed-in { color: var(--teal-dark); }.attendance-table-status.is-late { color: var(--danger); }.attendance-table-status.is-leave, .text-leave { color: #986516; font-weight: 800; }.access-table-status.is-signed-out { color: #778590; }
.person-cell { display: flex; align-items: center; gap: 9px; }
.person-cell > span:last-child { display: grid; }
.person-cell strong { color: var(--ink); font-size: 10px; }
.person-cell small { color: var(--muted); font-size: 8px; }
.avatar-table { width: 31px; height: 31px; border-radius: 9px; }
.focus-panel { min-height: 150px; }
.active-focus-list { display: grid; gap: 8px; margin-bottom: 11px; }
.active-focus-card { display: flex; align-items: center; gap: 13px; border: 1px solid #cde9e4; border-radius: 12px; padding: 14px; background: #f5fcfa; }
.active-focus-card.is-paused, .running-banner.is-paused { border-color: #ecd5ab; background: #fffaf0; }
.active-focus-card.is-paused .activity-type-icon, .running-banner.is-paused .running-pulse { background: #f8e4bf; color: #8c611d; }
.active-focus-card.is-paused .focus-copy small, .running-banner.is-paused .running-copy > span, .paused-timer { color: #8c611d; }
.running-banner.is-paused .running-pulse span { background: #d69b3c; animation: none; }
.timer-limit-notice { margin: 10px 0 0; }
.timer-slot-available { border-left-color: var(--teal); background: var(--teal-soft); color: var(--teal-dark); }
.focus-copy { display: grid; flex: 1; }
.focus-copy small { color: var(--teal-dark); font-size: 8px; text-transform: uppercase; }
.focus-copy strong { font-size: 12px; }
.focus-copy .focus-client-name { color: var(--ink); font-size: 14px; font-weight: 900; line-height: 1.25; }
.focus-copy .focus-activity-title { color: var(--ink-soft); font-size: 9px; font-weight: 700; }
.focus-copy > span { color: var(--muted); font-size: 9px; }
.quick-activity-form { display: flex; flex-wrap: wrap; align-items: end; gap: 10px; }
.quick-activity-form label { min-width: 130px; }
.quick-activity-form .grow { flex: 1; }
.quick-client-lookup { width: 225px; flex: 0 0 auto; }.quick-client-lookup label { min-width: 0; }.quick-client-lookup .client-lookup-result { max-width: 225px; }
.activity-type-icon { display: grid; width: 37px; height: 37px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: var(--teal-soft); color: var(--teal-dark); font-size: 9px; font-weight: 900; text-transform: uppercase; }
.followup-mini-list { display: grid; }
.followup-mini-item { display: flex; align-items: center; gap: 10px; border-bottom: 1px solid #edf1f3; padding: 10px 0; }
.followup-mini-item:last-child { border-bottom: 0; }
.followup-mini-link { display: flex; min-width: 0; flex: 1 1 auto; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; transition: background .16s ease, transform .16s ease; }
.followup-mini-link:hover { border-radius: 9px; background: #f4faf9; transform: translateX(2px); }
.followup-mini-link .mini-copy strong { color: var(--blue); text-decoration: underline; text-decoration-color: rgba(49,118,199,.28); text-underline-offset: 2px; }
.followup-mini-complete { flex: 0 0 auto; }
.followup-mini-complete button { display: inline-flex; min-height: 27px; align-items: center; gap: 4px; border: 1px solid #b8dcd5; border-radius: 8px; padding: 4px 7px; background: #effaf8; color: var(--teal-dark); font: inherit; font-size: 7px; font-weight: 850; cursor: pointer; }
.followup-mini-complete button:hover { border-color: #72c4b5; background: #daf4ef; }
.followup-mini-complete button span { font-size: 10px; line-height: 1; }
.date-chip { display: grid; width: 38px; height: 40px; flex: 0 0 auto; place-content: center; border-radius: 9px; background: #edf7f5; color: var(--teal-dark); text-align: center; }
.date-chip strong { font-size: 13px; line-height: 1; }.date-chip small { margin-top: 3px; font-size: 7px; font-weight: 800; text-transform: uppercase; }
.date-chip.is-late { background: var(--danger-soft); color: var(--danger); }
.mini-copy { display: grid; min-width: 0; }
.mini-copy strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.mini-copy small { color: var(--muted); font-size: 8px; }
.timeline-list { display: grid; }
.timeline-item { position: relative; display: grid; grid-template-columns: 8px 1fr auto; gap: 9px; align-items: start; padding: 8px 0; }
.timeline-item::before { content: ""; position: absolute; top: 17px; bottom: -8px; left: 3px; width: 1px; background: var(--line); }
.timeline-item:last-child::before { display: none; }
.timeline-dot { position: relative; z-index: 1; width: 7px; height: 7px; margin-top: 4px; border: 2px solid #cdebe5; border-radius: 50%; background: var(--teal); }
.timeline-item div { display: grid; min-width: 0; }
.timeline-item strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.timeline-item small, .timeline-item time { color: var(--muted); font-size: 7px; }

/* Page layouts */
.page-intro { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 22px; }
.page-intro-actions { align-items: center; }
.content-with-form { display: grid; grid-template-columns: 285px minmax(0, 1fr); gap: 18px; align-items: start; }
.side-form-panel { padding: 20px; }
.list-panel { min-width: 0; padding: 20px; }
.side-form-panel .stack-form > *, .side-form-panel .activity-classification-fields, .side-form-panel .activity-software-fields { min-width: 0; }
.side-form-panel .activity-classification-fields, .side-form-panel .activity-software-fields { grid-template-columns: minmax(0, 1fr); }
.side-form-panel .activity-classification-fields:has(> .activity-hardware-fields:not([hidden])) { grid-template-columns: minmax(0, 1fr); }
.side-form-panel .activity-classification-fields > .activity-hardware-fields:not([hidden]) { display: grid; }
.side-form-panel .activity-classification-fields label, .side-form-panel .activity-software-fields label, .side-form-panel .activity-classification-fields input, .side-form-panel .activity-classification-fields select, .side-form-panel .activity-software-fields input, .side-form-panel .activity-software-fields select { width: 100%; min-width: 0; }
.filter-header { margin-bottom: 12px; }
.inline-filter { width: 145px; }
.inline-filter select { padding: 7px 9px; font-size: 10px; }
.activity-history-panel .filter-header { align-items: flex-start; }
.activity-history-tools { min-width: 0; }
.activity-history-filter { display: flex; width: auto; max-width: 100%; flex-wrap: nowrap; gap: 7px; }
.activity-history-filter select { width: auto; min-width: 145px; min-height: 38px; border-color: #d5e0e4; border-radius: 10px; padding: 7px 30px 7px 10px; background-color: #fff; font-size: 9px; }
.activity-history-filter #employee-filter { min-width: 195px; }
.activity-history-filter #entry-filter { min-width: 155px; }
.activity-history-filter #layout-filter { min-width: 140px; }
.running-banner { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; border: 1px solid #bce2db; border-radius: 14px; padding: 13px 15px; background: linear-gradient(100deg, #ecfaf7, #f9fdfc); box-shadow: var(--shadow-soft); }
.running-pulse { display: grid; width: 38px; height: 38px; place-items: center; border-radius: 50%; background: #d9f3ed; }
.running-pulse span { width: 9px; height: 9px; border-radius: 50%; background: var(--teal); animation: pulse 1.6s infinite; }
.running-copy { display: grid; flex: 1; }
.running-copy > span { color: var(--teal-dark); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.running-copy strong { font-size: 13px; }
.running-copy .running-client-name { margin: 2px 0 1px; color: var(--ink); font-size: 16px; font-weight: 900; line-height: 1.2; }
.running-copy .running-activity-title { color: var(--ink-soft); font-size: 10px; font-weight: 700; text-transform: none; }
.running-copy small { color: var(--muted); font-size: 9px; }
.running-copy b { color: var(--teal-dark); }
.work-token { color: var(--blue) !important; font-size: 7px !important; font-weight: 850 !important; letter-spacing: .035em; overflow-wrap: anywhere; text-transform: uppercase; }
.action-details { position: relative; }
.action-details summary { list-style: none; }
.action-details summary::-webkit-details-marker { display: none; }
.popover-form { position: absolute; z-index: 8; top: calc(100% + 8px); right: 0; display: grid; width: 300px; gap: 12px; border: 1px solid var(--line); border-radius: 12px; padding: 15px; background: #fff; box-shadow: 0 16px 40px rgba(20,42,61,.16); }
.activity-completion-form { width: 390px; max-height: min(650px, calc(100vh - 130px)); overflow-y: auto; }
.activity-list, .record-list { display: grid; }
.activity-row { display: flex; align-items: flex-start; gap: 12px; border-bottom: 1px solid #edf1f3; padding: 13px 4px; }
.activity-row:last-child { border-bottom: 0; }
.activity-main { min-width: 0; flex: 1; }
.activity-main > span { display: flex; min-width: 0; max-width: 100%; flex-wrap: wrap; align-items: center; gap: 8px; }
.activity-main strong { font-size: 11px; }
.activity-main small { display: block; margin-top: 2px; color: var(--muted); font-size: 8px; }
.activity-main p { margin: 6px 0 0; color: var(--ink-soft); font-size: 9px; }
.activity-title-link { min-width: 0; max-width: 100%; overflow-wrap: anywhere; }.activity-client-tag { display: inline-flex !important; overflow: hidden; box-sizing: border-box; width: max-content; max-width: 100%; margin-top: 5px !important; border-radius: 20px; padding: 4px 7px; background: var(--blue-soft); color: var(--blue) !important; font-size: 7px !important; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.duration-cell { display: grid; min-width: 66px; justify-items: end; }
.duration-cell strong { font-size: 11px; }.duration-cell small { color: var(--muted); font-size: 8px; }
.activity-history-tools { display: flex; align-items: stretch; gap: 7px; }.activity-history-panel, .activity-history-panel .activity-list, .activity-history-panel .activity-row, .activity-history-panel .activity-main { min-width: 0; max-width: 100%; }.activity-history-panel { overflow: hidden; }.activity-history-toggle { display: inline-flex; min-width: 108px; align-items: center; justify-content: space-between; gap: 6px; }.activity-history-toggle b { font-size: 15px; line-height: 1; transition: transform .18s ease; }.activity-workspace.is-history-collapsed { grid-template-columns: minmax(420px, 1fr) 220px; }.activity-workspace.is-history-collapsed .activity-history-panel { padding: 13px; }.activity-workspace.is-history-collapsed .activity-history-panel .filter-header { align-items: stretch; flex-direction: column; gap: 8px; }.activity-workspace.is-history-collapsed .activity-history-tools { width: 100%; }.activity-workspace.is-history-collapsed .activity-history-tools .inline-filter { display: none; }.activity-workspace.is-history-collapsed .activity-history-toggle { width: 100%; }.activity-workspace.is-history-collapsed .activity-history-toggle b { transform: rotate(180deg); }.activity-workspace.is-history-collapsed .activity-row { display: block; overflow: hidden; box-sizing: border-box; width: 100%; padding: 10px 2px; }.activity-workspace.is-history-collapsed .activity-row > .activity-type-icon, .activity-workspace.is-history-collapsed .activity-main small, .activity-workspace.is-history-collapsed .activity-main p, .activity-workspace.is-history-collapsed .activity-main .badge, .activity-workspace.is-history-collapsed .duration-cell { display: none; }.activity-workspace.is-history-collapsed .activity-main > span { display: block; overflow: hidden; width: 100%; max-width: 100%; }.activity-workspace.is-history-collapsed .activity-title-link { display: block; overflow: hidden; width: 100%; max-width: 100%; text-overflow: ellipsis; white-space: nowrap; }.activity-workspace.is-history-collapsed .activity-main strong { display: block; overflow: hidden; max-width: 100%; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.activity-workspace.is-history-collapsed .activity-client-tag { display: block !important; overflow: hidden; box-sizing: border-box; width: 100%; max-width: 100%; padding: 3px 6px; text-overflow: ellipsis; white-space: nowrap; }
.type-sales { background: var(--blue-soft); color: var(--blue); }.type-follow_up { background: var(--violet-soft); color: var(--violet); }.type-break { background: var(--amber-soft); color: var(--amber); }

/* Support */
.record-card { border-bottom: 1px solid var(--line); padding: 15px 3px; }
.record-card:first-child { padding-top: 4px; }.record-card:last-child { border-bottom: 0; padding-bottom: 0; }
.record-topline { display: flex; align-items: center; gap: 7px; }
.record-topline time { margin-left: auto; color: var(--muted); font-size: 8px; }
.priority { border-left: 1px solid var(--line); padding-left: 8px; color: var(--muted); font-size: 8px; font-weight: 750; text-transform: uppercase; }
.priority-urgent, .priority-high { color: var(--danger); }
.record-content { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; }
.record-content h4 { margin: 0 0 2px; font-size: 13px; }.record-content p { margin: 0 0 3px; color: var(--ink-soft); font-size: 10px; }.record-content small { color: var(--muted); font-size: 8px; }
.record-duration { display: grid; min-width: 75px; justify-items: end; align-content: center; }
.record-duration span { color: var(--muted); font-size: 7px; text-transform: uppercase; }.record-duration strong { font-size: 13px; }
.record-note { border-radius: 8px; padding: 9px 11px; background: #f5f8f9; }
.record-note strong { font-size: 8px; text-transform: uppercase; }.record-note p { margin: 3px 0 0; color: var(--ink-soft); font-size: 9px; }
.record-action-details { margin-top: 9px; }
.record-action-details summary { color: var(--teal-dark); font-size: 9px; font-weight: 800; }
.inline-close-form { display: grid; grid-template-columns: 120px minmax(180px, 1fr) 180px auto; gap: 10px; align-items: end; margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 12px; background: #f8fafb; }
.call-finish-details { border: 1px solid #bfe3dc; border-radius: 11px; padding: 9px 11px; background: #f4fbf9; }.call-finish-details > summary { font-size: 10px; }.call-completion-form { display: grid; grid-template-columns: 130px minmax(220px, 1fr); gap: 11px 13px; margin-top: 10px; border-top: 1px solid #d6eae6; padding-top: 12px; }.call-completion-form .grow, .call-completion-form .button { grid-column: 1 / -1; }.call-completion-form label { min-width: 0; }.call-completion-form textarea { min-height: 68px; }.forwarding-note { display: block; margin-top: 3px; color: var(--violet) !important; font-weight: 750; }.followup-forward-form { margin-top: 10px; border: 1px solid var(--line); border-radius: 10px; padding: 13px; background: #f8fafb; }
.record-links { display: flex; align-items: center; flex-wrap: wrap; gap: 9px; margin: 2px 0 8px; }

/* Clients */
.client-workspace, .ticket-workspace { grid-template-columns: 330px minmax(0, 1fr); }
.client-search { display: flex; width: min(360px, 100%); gap: 7px; }.client-search input { min-width: 0; padding: 7px 9px; font-size: 10px; }.client-search-autocomplete { position: relative; min-width: 0; flex: 1; }.client-search-autocomplete > input { width: 100%; }.client-name-autocomplete { position: relative; display: grid; min-width: 0; }.client-name-match-status { margin-top: -3px; color: var(--muted); font-size: 7px; }.client-name-match-status.is-checking { color: #56778e; }.client-name-match-status.has-matches { color: #956117; font-weight: 750; }.client-name-match-status.has-no-match { color: var(--teal-dark); }.client-name-match-status.is-error { color: var(--danger); }.client-name-suggestions { z-index: 70; }.client-name-suggestions-heading { display: block; padding: 6px 9px; color: var(--teal-dark); font-size: 7px; font-weight: 850; text-transform: uppercase; }.client-name-suggestions .client-lookup-option { position: relative; padding-right: 70px; text-decoration: none; }.client-name-open-label { position: absolute; top: 50%; right: 9px; color: var(--teal-dark); font-size: 7px; transform: translateY(-50%); }.client-list { display: grid; gap: 12px; }.client-card { border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fff; }.client-card-head { display: flex; align-items: center; gap: 10px; }.client-card-head > div { min-width: 0; flex: 1; }.client-card-head h4 { margin: 0; font-size: 13px; }.client-card-head p { overflow: hidden; margin: 2px 0 0; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.client-contact-row { display: flex; flex-wrap: wrap; gap: 7px 15px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); margin-top: 12px; padding: 9px 1px; }.client-contact-row a { color: var(--teal-dark); font-size: 9px; font-weight: 750; }.client-contact-row span { color: var(--muted); font-size: 8px; }.client-owner-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 11px 0 2px; }.client-owner-grid span { display: grid; }.client-owner-grid small { color: var(--muted); font-size: 7px; text-transform: uppercase; }.client-owner-grid strong { font-size: 9px; }.client-notes { margin-top: 9px; border-radius: 8px; padding: 8px 10px; background: #f7f9fa; }.client-notes p { margin: 3px 0; color: var(--ink-soft); font-size: 8px; }.client-edit { border-top: 1px solid var(--line); margin-top: 11px; padding-top: 9px; }.client-edit-form { margin-top: 10px; border-radius: 10px; padding: 12px; background: #f8fafb; }.permission-note { border-top: 1px solid var(--line); margin: 10px 0 0; padding-top: 8px; color: var(--muted); font-size: 8px; }
.client-work-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 7px; border-top: 1px solid var(--line); margin-top: 10px; padding-top: 10px; }.client-work-actions small { margin-left: auto; color: var(--muted); font-size: 7px; }

/* v42 compact client register, record popup and customer history */
.client-directory-intro { align-items: center; }
.client-directory-actions, .client-register-tools { display: flex; align-items: center; gap: 8px; }
.client-directory-actions .button { gap: 7px; }
.client-create-panel { margin-bottom: 14px; padding: 0; scroll-margin-top: 12px; }
.client-create-panel > summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; padding: 13px 16px; cursor: pointer; }
.client-create-panel > summary::-webkit-details-marker { display: none; }
.client-create-panel > summary > span:first-child { display: grid; gap: 2px; }
.client-create-panel > summary strong { color: var(--ink); font-size: 11px; }
.client-create-panel[open] > summary .button { background: var(--teal-soft); color: var(--teal-dark); }
.client-create-form { grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); padding: 14px 16px 16px; }
.client-create-form .span-2 { grid-column: span 2; }
.client-register-panel { padding: 0; overflow: hidden; scroll-margin-top: 12px; }
.client-register-header { align-items: center; gap: 16px; padding: 14px 16px; }
.client-register-header h3 { margin: 2px 0; }
.client-register-header p { margin: 0; color: var(--muted); font-size: 8px; }
.client-register-tools { min-width: min(620px, 58%); justify-content: flex-end; }
.segmented-control { display: inline-flex; flex: 0 0 auto; gap: 3px; border: 1px solid var(--line); border-radius: 10px; padding: 3px; background: #f4f7f8; }
.segmented-control a { border-radius: 7px; padding: 7px 10px; color: var(--muted); font-size: 8px; font-weight: 800; }
.segmented-control a.is-active { background: #fff; color: var(--teal-dark); box-shadow: 0 2px 7px rgba(24, 59, 72, .09); }
.client-grid-wrap, .client-history-grid-wrap { width: 100%; overflow-x: auto; border-top: 1px solid var(--line); }
.client-compact-grid, .client-history-grid { width: 100%; border-collapse: collapse; background: #fff; }
.client-compact-grid { min-width: 0; table-layout: fixed; }
.client-table-columns .client-col-client { width: 25%; }
.client-table-columns .client-col-relationship { width: 11%; }
.client-table-columns .client-col-staff { width: 19%; }
.client-table-columns .client-col-since { width: 13%; }
.client-table-columns .client-col-category { width: 9%; }
.client-table-columns .client-col-product { width: 16%; }
.client-table-columns .client-col-history { width: 7%; }
.client-compact-grid th, .client-history-grid th { padding: 8px 7px; background: #f5f8f9; color: var(--muted); font-size: 7px; text-align: left; text-transform: uppercase; letter-spacing: .035em; }
.client-compact-grid td, .client-history-grid td { border-top: 1px solid #edf1f3; padding: 9px 7px; color: var(--ink-soft); font-size: 8px; vertical-align: middle; }
.client-compact-grid tbody tr { cursor: pointer; transition: background .15s ease, box-shadow .15s ease; }
.client-compact-grid tbody tr:hover, .client-compact-grid tbody tr:focus-visible { outline: none; background: #f2fbf9; box-shadow: inset 3px 0 0 var(--teal); }
.client-compact-grid td > strong, .client-compact-grid td > small, .client-history-grid td > strong, .client-history-grid td > small { display: block; }
.client-compact-grid td > small, .client-history-grid td > small { margin-top: 2px; color: var(--muted); font-size: 7px; }
.client-grid-name { display: flex; width: 100%; min-width: 0; align-items: center; gap: 7px; color: var(--ink); }
.client-grid-name .avatar { width: 34px; height: 34px; flex: 0 0 34px; }
.client-grid-name > span:last-child { display: grid; min-width: 0; }
.client-grid-name strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.client-grid-name small { overflow: hidden; color: var(--muted); font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.client-relation-tags { display: flex; max-width: 100%; flex-wrap: wrap; gap: 3px; }
.client-relation-tags b, .client-kind-badge { display: inline-flex; max-width: 100%; width: max-content; overflow: hidden; border-radius: 20px; padding: 3px 6px; font-size: 7px; font-weight: 850; text-overflow: ellipsis; white-space: nowrap; }
.client-relation-tags b { background: var(--teal-soft); color: var(--teal-dark); }
.client-kind-badge.is-software { background: var(--blue-soft); color: var(--blue); }
.client-kind-badge.is-hardware { background: var(--amber-soft); color: #916516; }
.client-associated-staff small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.client-product-cell strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.client-grid-actions { display: flex; align-items: center; justify-content: flex-start; gap: 4px; }
.client-grid-actions > span { color: var(--teal); font-size: 18px; line-height: 1; }
.client-record-overlay { position: fixed; z-index: 120; inset: 0; display: grid; place-items: center; padding: 24px; }
.client-record-backdrop { position: absolute; z-index: 0; inset: 0; background: rgba(9, 27, 41, .62); backdrop-filter: blur(4px); }
.client-record-window { position: relative; z-index: 1; display: flex; width: min(1160px, 96vw); max-height: min(850px, 92vh); flex-direction: column; overflow: hidden; border: 1px solid rgba(255, 255, 255, .7); border-radius: 16px; background: #fff; box-shadow: 0 26px 80px rgba(4, 18, 29, .35); }
.client-record-header { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 18px 12px; }
.client-record-header h3 { margin: 2px 0; font-size: 17px; }
.client-record-header p { margin: 0; color: var(--muted); font-size: 8px; }
.client-record-close { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid var(--line); border-radius: 10px; color: var(--ink-soft); font-size: 22px; line-height: 1; }
.client-record-close:hover { border-color: #efcaca; background: var(--danger-soft); color: var(--danger); }
.client-record-tabs { display: flex; flex: 0 0 auto; gap: 4px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 6px 18px; background: #f7f9fa; }
.client-record-tabs a { display: inline-flex; align-items: center; gap: 6px; border-radius: 8px; padding: 7px 11px; color: var(--muted); font-size: 8px; font-weight: 800; }
.client-record-tabs a.is-active { background: #fff; color: var(--teal-dark); box-shadow: 0 2px 8px rgba(26, 58, 70, .09); }
.client-record-tabs span { min-width: 17px; border-radius: 10px; padding: 2px 5px; background: var(--teal-soft); color: var(--teal-dark); text-align: center; }
.client-record-body, .client-history-panel { min-height: 0; overflow-y: auto; padding: 16px 18px 18px; }
.client-record-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.client-record-facts > span { display: grid; min-height: 54px; align-content: center; gap: 3px; border: 1px solid var(--line); border-radius: 10px; padding: 9px 11px; background: #fbfcfc; }
.client-record-facts small { color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.client-record-facts strong { overflow-wrap: anywhere; font-size: 9px; }
.client-record-notes { display: grid; gap: 5px; margin-top: 10px; border-radius: 10px; padding: 10px 12px; background: #f7f9fa; }
.client-record-notes p { margin: 0; color: var(--ink-soft); font-size: 8px; }
.client-record-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 11px; }
.client-record-body .client-edit { margin-top: 12px; }
.client-record-body .client-edit-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.client-history-panel { padding: 0; }
.client-history-heading { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 13px 16px; }
.client-history-heading > div { display: grid; gap: 2px; }
.client-history-heading > div > strong { font-size: 11px; }
.client-history-heading p { margin: 0; color: var(--muted); font-size: 8px; }
.client-history-grid { min-width: 980px; }
.client-history-grid td:nth-child(3) { min-width: 260px; }
.client-history-grid td a { color: var(--teal-dark); }
.history-source-badge { display: inline-flex; width: max-content; border-radius: 20px; padding: 4px 7px; background: var(--violet-soft); color: var(--violet); font-size: 7px; font-weight: 850; }
.client-lookup-links { display: flex !important; flex: 0 0 auto; align-items: center; gap: 7px; }
.client-lookup-option-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; border-bottom: 1px solid #edf1f3; }
.client-lookup-option-row:last-child { border-bottom: 0; }
.client-lookup-option-row .client-lookup-option { border-bottom: 0; }
.client-lookup-history-link { margin-right: 7px; border-radius: 7px; padding: 5px 7px; background: var(--teal-soft); color: var(--teal-dark); font-size: 7px; font-weight: 850; }

@media (max-width: 920px) {
    .client-directory-intro, .client-register-header { align-items: stretch; flex-direction: column; }
    .client-directory-actions, .client-register-tools { width: 100%; min-width: 0; justify-content: flex-start; flex-wrap: wrap; }
    .client-register-tools .client-search { width: 100%; }
    .client-create-form, .client-record-body .client-edit-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .client-record-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .client-compact-grid { min-width: 860px; }
}

@media (max-width: 620px) {
    .client-directory-actions .button { flex: 1; }
    .client-create-form, .client-record-body .client-edit-form { grid-template-columns: 1fr; }
    .client-create-form .span-2, .client-record-body .client-edit-form .span-2 { grid-column: auto; }
    .client-record-overlay { padding: 0; }
    .client-record-window { width: 100vw; max-height: 100vh; min-height: 100vh; border: 0; border-radius: 0; }
    .client-record-facts { grid-template-columns: 1fr 1fr; }
    .client-record-body, .client-history-panel { padding-right: 12px; padding-left: 12px; }
}

/* Tickets */
.ticket-list { display: grid; gap: 11px; }.ticket-card { border: 1px solid var(--line); border-left-width: 4px; border-radius: 11px; padding: 13px; background: #fff; }.priority-border-low { border-left-color: #aebac3; }.priority-border-normal { border-left-color: var(--blue); }.priority-border-high { border-left-color: var(--amber); }.priority-border-urgent { border-left-color: var(--danger); }.ticket-number { color: var(--teal-dark); font-size: 9px; letter-spacing: .02em; }.ticket-main { display: flex; justify-content: space-between; gap: 20px; padding: 10px 0; }.ticket-main > div:first-child { min-width: 0; flex: 1; }.ticket-main h4 { margin: 0 0 4px; font-size: 13px; }.ticket-main p { margin: 0 0 6px; color: var(--ink-soft); font-size: 9px; line-height: 1.5; }.ticket-main small { color: var(--muted); font-size: 8px; }.ticket-assignment { display: grid; min-width: 165px; align-content: center; justify-items: end; }.ticket-assignment small { text-transform: uppercase; }.ticket-assignment strong { font-size: 10px; text-align: right; }.ticket-assignment span { color: var(--muted); font-size: 7px; }.ticket-update-form { display: grid; grid-template-columns: 120px 110px minmax(200px, 1fr) auto; gap: 9px; align-items: end; margin-top: 9px; border-radius: 10px; padding: 11px; background: #f8fafb; }

/* Leads */
.lead-create-panel, .team-add-panel { margin-bottom: 18px; padding: 0; }
.lead-create-panel summary, .team-add-panel summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; padding: 15px 18px; }
.lead-create-panel summary::-webkit-details-marker, .team-add-panel summary::-webkit-details-marker { display: none; }
.lead-create-panel summary > span:first-child, .team-add-panel summary > span:first-child { display: flex; align-items: center; gap: 10px; }
.lead-create-panel summary b, .team-add-panel summary b { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 9px; background: var(--teal-soft); color: var(--teal); font-size: 18px; }
.lead-create-panel summary strong, .team-add-panel summary strong { display: block; font-size: 11px; }.lead-create-panel summary small, .team-add-panel summary small { color: var(--muted); font-size: 9px; }
.lead-form, .team-form { border-top: 1px solid var(--line); padding: 18px; }
.pipeline-board { display: grid; grid-template-columns: repeat(6, minmax(220px, 1fr)); gap: 12px; overflow-x: auto; padding-bottom: 12px; }
.pipeline-column { min-width: 220px; }
.pipeline-column > header { display: flex; align-items: center; justify-content: space-between; min-height: 42px; padding: 0 6px 8px; }
.pipeline-column > header > span { display: flex; align-items: center; gap: 6px; }
.pipeline-column > header i { width: 7px; height: 7px; border-radius: 50%; background: #7d8c98; }.pipeline-column > header strong { font-size: 10px; }.pipeline-column > header b { display: grid; min-width: 18px; height: 18px; place-items: center; border-radius: 6px; background: #e6ecef; color: #71818e; font-size: 8px; }.pipeline-column > header small { color: var(--muted); font-size: 8px; }
.stage-new > header i { background: #6f91b1; }.stage-contacted > header i { background: var(--blue); }.stage-qualified > header i { background: var(--violet); }.stage-proposal > header i { background: var(--amber); }.stage-won > header i { background: var(--teal); }.stage-lost > header i { background: #a0a9b0; }
.pipeline-cards { display: grid; align-content: start; gap: 10px; min-height: 230px; border-radius: 13px; padding: 9px; background: #eaf0f2; }
.pipeline-empty { padding: 28px 0; color: #a0abb3; font-size: 9px; text-align: center; }
.lead-card { position: relative; border: 1px solid #e0e7eb; border-radius: 11px; padding: 12px; background: #fff; box-shadow: 0 3px 10px rgba(20,42,61,.055); }
.lead-card-top { display: flex; align-items: center; gap: 9px; }
.company-initial { display: grid; width: 31px; height: 31px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: #edf4f5; color: #4f6c7c; font-size: 11px; font-weight: 900; }
.lead-card-top h3 { margin: 0; font-size: 10px; }.lead-card-top small { color: var(--muted); font-size: 8px; }
.lead-value { display: grid; margin: 12px 0 9px; border-radius: 8px; padding: 8px; background: #f6f8f9; }.lead-value span { color: var(--muted); font-size: 7px; text-transform: uppercase; }.lead-value strong { font-size: 12px; }
.lead-meta { display: grid; gap: 6px; margin: 0; }.lead-meta div { display: flex; justify-content: space-between; gap: 8px; }.lead-meta dt { color: var(--muted); font-size: 7px; }.lead-meta dd { margin: 0; color: #506474; font-size: 8px; font-weight: 650; text-align: right; }
.lead-contact { overflow: hidden; margin: 9px 0; border-top: 1px solid var(--line); padding-top: 8px; color: var(--ink-soft); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.stage-form { margin-top: 9px; }.stage-form select { padding: 6px 7px; border-color: #e1e7ea; background: #fbfcfc; color: var(--teal-dark); font-size: 8px; font-weight: 750; }
.lead-edit-icon { position: absolute; top: 9px; right: 9px; display: grid; width: 27px; height: 27px; place-items: center; border: 1px solid #cfe0e1; border-radius: 8px; background: #f6fbfa; color: var(--teal-dark); }
.lead-edit-icon:hover { border-color: #8ecdc3; background: var(--teal-soft); transform: translateY(-1px); }.lead-edit-icon svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.lead-card .lead-card-top { padding-right: 27px; }
.lead-editor { margin-bottom: 18px; padding: 0; scroll-margin-top: 20px; overflow: hidden; }
.lead-editor-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); padding: 15px 18px; background: linear-gradient(115deg, #f0faf8, #fff 55%); }
.lead-editor-header h3 { margin: 2px 0; font-size: 15px; }.lead-editor-header p { margin: 0; color: var(--muted); font-size: 9px; }
.lead-editor-layout { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); }
.lead-editor .lead-form { border: 0; border-right: 1px solid var(--line); }
.lead-history { min-width: 0; max-height: 535px; overflow: auto; padding: 18px; background: #fbfcfc; }
.lead-history h4 { margin: 2px 0 13px; font-size: 13px; }.lead-history ol { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.lead-history li { position: relative; display: grid; gap: 2px; margin-left: 7px; border-left: 1px solid #bedbd7; padding: 0 0 16px 18px; }
.lead-history li:last-child { border-left-color: transparent; padding-bottom: 0; }.lead-history li::before { position: absolute; top: 2px; left: -5px; width: 9px; height: 9px; border: 2px solid #fff; border-radius: 999px; background: var(--teal); box-shadow: 0 0 0 1px #9dcec7; content: ''; }
.lead-history time { color: var(--muted); font-size: 7px; }.lead-history strong { font-size: 9px; }.lead-history small { color: var(--teal-dark); font-size: 8px; font-weight: 700; }.lead-history p { margin: 2px 0 0; color: var(--ink-soft); font-size: 8px; line-height: 1.45; white-space: pre-wrap; }

/* Follow-ups */
.followup-layout { display: grid; grid-template-columns: 285px minmax(0, 1fr); gap: 18px; align-items: start; }
.followup-tabs { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--line); margin: -4px 0 5px; }
.followup-tabs a { display: flex; align-items: center; gap: 5px; border-bottom: 2px solid transparent; padding: 11px 10px; color: var(--muted); font-size: 9px; font-weight: 750; white-space: nowrap; }.followup-tabs a.is-active { border-color: var(--teal); color: var(--teal-dark); }.followup-tabs b { display: grid; min-width: 17px; height: 17px; place-items: center; border-radius: 6px; background: #edf2f4; font-size: 7px; }
.followup-list { display: grid; }
.followup-row { display: grid; grid-template-columns: 29px minmax(0, 1fr) 100px auto; gap: 12px; align-items: center; border-bottom: 1px solid var(--line); padding: 13px 3px; cursor: pointer; transition: background .18s ease, box-shadow .18s ease; }
.followup-row:last-child { border-bottom: 0; }
.followup-row.is-overdue { border-left: 3px solid var(--danger); margin-left: -20px; padding-left: 20px; background: linear-gradient(90deg, #fff5f5, transparent 45%); }
.followup-row:hover, .followup-row:focus-visible { outline: 0; background: #f4faf9; }
.followup-row.is-selected { border-radius: 10px; background: #edf9f7; box-shadow: inset 0 0 0 1px #9fd6ce; }
.followup-serial { display: grid; width: 24px; height: 24px; place-items: center; border-radius: 999px; background: #edf2f4; color: #506474; font-size: 9px; font-weight: 900; }
.followup-main { min-width: 0; }.followup-context { display: block; color: var(--ink); font-size: 10px; font-weight: 900; }.followup-main h3 { margin: 1px 0; font-size: 11px; }.followup-main p { margin: 4px 0; color: var(--ink-soft); font-size: 9px; }.followup-main small { color: var(--muted); font-size: 8px; }
.followup-when { display: grid; text-align: right; }.followup-when span { color: var(--ink-soft); font-size: 8px; }.followup-when strong { font-size: 9px; }
.followup-selected-party { position: relative; display: grid; gap: 2px; border: 1px solid #b8dfd8; border-radius: 10px; padding: 10px 36px 10px 11px; background: #edf9f7; }
.followup-selected-party[hidden] { display: none; }
.followup-selected-party span { color: var(--teal-dark); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.followup-selected-party strong { font-size: 11px; }.followup-selected-party small { color: var(--muted); font-size: 8px; }
.followup-clear-selection { position: absolute; top: 8px; right: 8px; display: grid; width: 24px; height: 24px; place-items: center; border: 0; border-radius: 999px; background: #dcefeb; color: var(--teal-dark); cursor: pointer; font-size: 16px; line-height: 1; }

/* Team/Profile */
.team-summary { display: flex; gap: 8px; }.team-summary > span { display: grid; min-width: 82px; border: 1px solid var(--line); border-radius: 11px; padding: 8px 11px; background: #fff; }.team-summary strong { font-size: 14px; }.team-summary small { color: var(--muted); font-size: 7px; text-transform: uppercase; }.team-summary .summary-late { border-color: #efc6c6; background: #fff5f5; }.team-summary .summary-late strong { color: var(--danger); }
.team-page-tools { display: grid; gap: 8px; justify-items: end; }.attendance-date-filter { display: flex; align-items: end; gap: 7px; }.attendance-date-filter label { gap: 3px; font-size: 8px; }.attendance-date-filter input { min-width: 132px; padding: 6px 8px; font-size: 9px; }.attendance-info { display: flex; align-items: flex-start; gap: 11px; margin-bottom: 18px; padding: 14px 16px; }.attendance-info-icon { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: var(--blue-soft); color: var(--blue); font-size: 8px; font-weight: 900; }.attendance-info strong { font-size: 10px; }.attendance-info p { margin: 2px 0 0; color: var(--muted); font-size: 8px; line-height: 1.55; }
.category-panel { display: grid; grid-template-columns: minmax(260px, 1fr) minmax(300px, .8fr); gap: 14px 22px; align-items: end; margin-bottom: 18px; padding: 18px; }.category-panel-copy h3 { margin: 2px 0 3px; font-size: 14px; }.category-panel-copy p { margin: 0; color: var(--muted); font-size: 9px; }.category-add-form { display: flex; align-items: end; gap: 9px; }.category-add-form label { min-width: 0; flex: 1; }.category-chips { display: flex; grid-column: 1 / -1; flex-wrap: wrap; gap: 6px; padding-top: 3px; }.category-chip, .department-label { display: inline-flex; align-items: center; border: 1px solid #cae1de; border-radius: 999px; background: var(--teal-soft); color: var(--teal-dark); font-size: 7px; font-weight: 800; line-height: 1; }.category-chip { padding: 6px 9px; }.department-label { margin-top: 5px; padding: 4px 7px; }
.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.team-card { overflow: hidden; scroll-margin: 20px 0; border: 1px solid var(--line); border-radius: 14px; background: #fff; box-shadow: var(--shadow-soft); transition: border-color .2s ease, box-shadow .2s ease; }.team-card.has-late-attendance { border-color: #e6adad; box-shadow: 0 5px 18px rgba(166,55,55,.11); }.team-card.is-disabled { opacity: .7; filter: grayscale(.3); }.team-card.is-editing { grid-column: 1 / -1; width: min(980px, 100%); justify-self: center; border-color: #9fd5cd; box-shadow: 0 16px 42px rgba(13,86,76,.14); }.team-card.is-editing > :not(.team-card-head):not(.team-actions) { display: none; }.team-card.is-returned { border-color: #59bdae; box-shadow: 0 0 0 4px rgba(31,167,147,.12), var(--shadow-soft); }
.team-directory { display: grid; gap: 12px; }.team-directory-tabs { display: flex; width: max-content; max-width: 100%; gap: 5px; border: 1px solid var(--line); border-radius: 12px; padding: 4px; background: #fff; box-shadow: var(--shadow-soft); }.team-directory-tabs button { display: inline-flex; min-height: 34px; align-items: center; gap: 8px; border: 0; border-radius: 8px; padding: 6px 12px; background: transparent; color: var(--muted); font: inherit; font-size: 9px; font-weight: 850; cursor: pointer; }.team-directory-tabs button b { display: grid; min-width: 20px; height: 20px; place-items: center; border-radius: 999px; padding: 0 5px; background: #edf2f4; font-size: 7px; }.team-directory-tabs button.is-active { background: var(--teal-soft); color: var(--teal-dark); }.team-directory-tabs button.is-active b { background: var(--teal); color: #fff; }.team-directory-panel[hidden] { display: none !important; }.team-directory-empty { grid-column: 1 / -1; min-height: 100px; border: 1px dashed var(--line); border-radius: 12px; background: #fff; }
.team-card.has-employment-exit { border-color: #e6c18b; }.team-card.has-employment-exit.is-disabled { opacity: 1; filter: none; }.employment-exit-summary { display: grid; gap: 1px; margin-top: 5px; border-left: 3px solid var(--amber); padding: 4px 7px; background: #fff8eb; }.employment-exit-summary strong { color: #8a5b18; font-size: 8px; }.employment-exit-summary small { color: #8a6b3b; font-size: 7px; }
.team-card-head { display: flex; align-items: center; gap: 10px; padding: 15px; }.team-card-head > div { min-width: 0; flex: 1; }.team-card-head h3 { margin: 0; font-size: 12px; }.team-card-head p { overflow: hidden; margin: 1px 0 0; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.work-arrangement-label { display: inline-flex; margin: 4px 0 0 5px; border-radius: 20px; padding: 3px 7px; background: #eef2f4; color: var(--muted); font-size: 7px; font-weight: 850; }.work-arrangement-label.is-field { background: #fff0d8; color: #956116; }
.access-status-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fbfcfc; }.access-status-row > span { display: grid; min-width: 0; gap: 2px; border-right: 1px solid var(--line); padding: 10px 14px; }.access-status-row > span:last-child { border-right: 0; }.access-status-row small { color: var(--muted); font-size: 6px; font-weight: 800; text-transform: uppercase; }.access-status-row strong { font-size: 9px; }.access-status-row em { color: var(--muted); font-size: 7px; font-style: normal; }
.avatar-team { width: 40px; height: 40px; border-radius: 11px; }
.team-card-metrics { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #f8fafb; }.team-card-metrics span { display: grid; justify-items: center; border-right: 1px solid var(--line); padding: 10px 4px; }.team-card-metrics span:last-child { border-right: 0; }.team-card-metrics strong { font-size: 11px; }.team-card-metrics small { color: var(--muted); font-size: 7px; }
.attendance-card-row { display: grid; grid-template-columns: repeat(4, 1fr); border-bottom: 1px solid var(--line); }.attendance-card-row span { display: grid; min-width: 0; justify-items: center; border-right: 1px solid var(--line); padding: 9px 4px; text-align: center; }.attendance-card-row span:last-child { border-right: 0; }.attendance-card-row small { color: var(--muted); font-size: 6px; text-transform: uppercase; }.attendance-card-row strong { font-size: 9px; }.text-present { color: var(--teal-dark); }.text-muted { color: var(--muted); }.device-card-row { display: grid; gap: 2px; border-bottom: 1px solid var(--line); padding: 10px 15px; background: #fbfcfc; }.device-card-row small { color: var(--muted); font-size: 6px; text-transform: uppercase; }.device-card-row strong { color: var(--ink-soft); font-size: 9px; }.device-card-row span { color: var(--muted); font-size: 7px; }
.attendance-override-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid #efcaca; padding: 9px 12px; background: #fff6f6; }.attendance-override-row > span { display: grid; }.attendance-override-row strong { color: var(--danger); font-size: 8px; }.attendance-override-row small { color: var(--muted); font-size: 7px; }.attendance-override-row form { margin: 0; }
.team-card-foot { display: grid; padding: 11px 15px; }.team-card-foot span { color: var(--ink-soft); font-size: 9px; }.team-card-foot small { color: var(--muted); font-size: 7px; }
.team-actions { border-top: 1px solid var(--line); }.team-actions summary { padding: 9px 15px; color: var(--teal-dark); font-size: 8px; font-weight: 800; cursor: pointer; list-style: none; }.team-actions summary::-webkit-details-marker { display: none; }.team-actions summary::before { content: '›'; display: inline-block; margin-right: 5px; transition: transform .18s ease; }.team-actions[open] summary::before { transform: rotate(90deg); }.team-actions summary:hover { background: var(--teal-soft); }.team-action-body { display: grid; gap: 10px; border-top: 1px solid #cae1de; padding: 12px 14px; background: linear-gradient(145deg, #f3faf8 0%, #f7f9fb 52%, #edf5f7 100%); }.edit-member-form { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 7px 9px; }.edit-member-form label { gap: 3px; color: #425a6c; font-size: 8px; }.edit-member-form label:nth-of-type(1), .edit-member-form label:nth-of-type(2) { grid-column: auto; }.edit-member-form input:not([type="checkbox"]), .edit-member-form select { min-height: 34px; border-color: #c7dcd9; border-radius: 8px; padding: 6px 9px; background: rgba(255,255,255,.9); color: var(--ink); font-size: 9px; box-shadow: inset 0 1px 2px rgba(15,45,61,.035); }.edit-member-form input:focus, .edit-member-form select:focus { border-color: #54b8a8; box-shadow: 0 0 0 3px rgba(31,167,147,.12); }.edit-member-form label > small { margin-top: 0; font-size: 7px; line-height: 1.3; }.edit-member-submit { display: flex; grid-column: 1 / -1; justify-content: flex-end; }.edit-member-submit .button { min-width: 128px; }.edit-member-form .checkbox-label { min-height: 46px; align-items: center; border-color: #c7dcd9; padding: 6px 9px; background: rgba(255,255,255,.72); }.edit-member-form .checkbox-label strong { font-size: 8px; }.edit-member-form .checkbox-label small { font-size: 7px; }.account-tool-row { display: grid; grid-template-columns: auto minmax(320px, 1fr); gap: 9px; align-items: end; border-top: 1px solid #cfe1df; padding-top: 9px; }.reset-form { display: flex; align-items: end; gap: 8px; }.reset-form label { flex: 1; font-size: 8px; }.reset-form input { min-height: 34px; padding: 6px 9px; border-color: #c7dcd9; border-radius: 8px; background: rgba(255,255,255,.9); font-size: 9px; }
.employee-exit-module { display: grid; gap: 8px; border: 1px solid #e7c999; border-radius: 10px; padding: 10px; background: #fffaf1; scroll-margin-top: 100px; }.employee-exit-module.is-ended { border-color: #e7b5b5; background: #fff6f6; }.employee-exit-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.employee-exit-heading > span { display: grid; gap: 1px; }.employee-exit-heading strong { color: #79501a; font-size: 9px; }.employee-exit-heading small { color: var(--muted); font-size: 7px; }.employee-exit-heading > b { border-radius: 999px; padding: 4px 7px; background: var(--amber-soft); color: #8a5b18; font-size: 7px; }.employee-exit-module.is-ended .employee-exit-heading > b { background: var(--danger-soft); color: var(--danger); }.employee-exit-form { display: grid; grid-template-columns: minmax(165px, .5fr) minmax(250px, 1.3fr) auto; align-items: end; gap: 8px; }.employee-exit-form label { gap: 3px; color: #5c4a32; font-size: 8px; }.employee-exit-form input, .employee-exit-form textarea { min-height: 34px; border-color: #ddc79f; border-radius: 8px; padding: 6px 8px; background: #fff; font-size: 8px; }.employee-exit-form textarea { min-height: 50px; resize: vertical; }.employee-exit-form label small { color: #8a7658; font-size: 6px; }.employee-exit-clear { display: flex; justify-content: flex-end; border-top: 1px solid #ead7b6; padding-top: 7px; }
.two-column-grid { display: grid; grid-template-columns: minmax(260px, .65fr) minmax(350px, 1fr); gap: 18px; align-items: start; }
.profile-grid .panel { padding: 24px; }.profile-card { text-align: center; }.avatar-profile { width: 72px; height: 72px; margin: 0 auto 12px; border-radius: 20px; font-size: 19px; }.profile-card h3 { margin-bottom: 2px; font-size: 18px; }.profile-card > p { color: var(--muted); font-size: 10px; }
.profile-details { display: grid; margin: 20px 0 0; text-align: left; }.profile-details div { display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); padding: 10px 0; }.profile-details dt { color: var(--muted); font-size: 9px; }.profile-details dd { margin: 0; color: var(--ink-soft); font-size: 9px; font-weight: 650; text-align: right; }
.team-card-foot a { color: var(--teal-dark); font-weight: 750; }.checkbox-label { display: flex; align-items: flex-start; gap: 9px; border: 1px solid var(--line); border-radius: 9px; padding: 10px 11px; background: #fbfcfc; }.checkbox-label input { width: 16px; height: 16px; flex: 0 0 auto; margin: 2px 0 0; accent-color: var(--teal); }.checkbox-label span { display: grid; gap: 2px; }.checkbox-label strong { font-size: 10px; }.checkbox-label small { font-size: 8px; }.team-form .consent-field { grid-column: 1 / -1; }.edit-member-form .consent-field { grid-column: 1 / -1; }.profile-privacy-note { margin: 13px 0 0; border-radius: 8px; padding: 9px 10px; background: var(--teal-soft); color: var(--teal-dark); font-size: 8px; line-height: 1.5; text-align: left; }
.employee-document-archive { border-top: 1px solid var(--line); background: #fff; scroll-margin-top: 95px; }
.employee-document-archive > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 9px 15px; color: var(--teal-dark); cursor: pointer; list-style: none; }
.employee-document-archive > summary::-webkit-details-marker { display: none; }
.employee-document-archive > summary > span:first-child { display: grid; gap: 1px; }
.employee-document-archive > summary strong { font-size: 9px; }
.employee-document-archive > summary small { color: var(--muted); font-size: 7px; }
.employee-document-open { display: inline-flex; align-items: center; gap: 5px; font-size: 7px; font-weight: 850; text-transform: uppercase; }
.employee-document-open b { font-size: 13px; line-height: 1; transition: transform .16s ease; }
.employee-document-archive[open] > summary { border-bottom: 1px solid #cfe2de; background: #f2faf8; }
.employee-document-archive[open] .employee-document-open b { transform: rotate(180deg); }
.employee-document-body { padding: 12px 14px 14px; background: linear-gradient(145deg, #f8fcfb, #f5f8fa); }
.employee-document-upload { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; align-items: end; border: 1px solid #cfe2de; border-radius: 10px; padding: 10px; background: rgba(255,255,255,.9); }
.employee-document-upload label { gap: 3px; font-size: 8px; }
.employee-document-upload input, .employee-document-upload select { min-height: 33px; padding: 6px 8px; border-radius: 7px; font-size: 8px; }
.employee-document-upload input[type="file"] { padding: 5px 7px; }
.employee-document-upload small { font-size: 7px; line-height: 1.25; }
.employee-document-file { grid-column: 1 / -1; }
.employee-document-upload > .button { grid-column: 1 / -1; min-width: 132px; justify-self: end; }
.employee-document-empty { margin-top: 9px; border: 1px dashed #cfdcdf; border-radius: 9px; padding: 11px; color: var(--muted); font-size: 8px; text-align: center; }
.employee-document-list { display: grid; gap: 6px; margin-top: 9px; }
.employee-document-row { display: grid; grid-template-columns: 27px minmax(105px, .7fr) minmax(200px, 1.7fr) auto; gap: 9px; align-items: center; border: 1px solid var(--line); border-radius: 9px; padding: 8px 9px; background: #fff; }
.employee-document-number { color: var(--muted); font-size: 8px; text-align: center; }
.employee-document-tag { width: fit-content; border-radius: 999px; padding: 4px 7px; background: var(--amber-soft); color: #875a18; font-size: 7px; font-weight: 850; }
.employee-document-copy { display: grid; min-width: 0; gap: 1px; }
.employee-document-copy strong { overflow: hidden; color: var(--ink); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.employee-document-copy small { color: var(--muted); font-size: 7px; }
.employee-document-actions { display: flex; gap: 5px; }
.employee-document-actions .button { min-height: 28px; padding: 4px 8px; font-size: 7px; }

/* Team communication */
.team-comms { position: fixed; z-index: 80; top: 78px; right: 18px; }.team-comms-panel { display: none; width: min(720px, calc(100vw - 28px)); height: min(720px, calc(100vh - 96px)); overflow: hidden; flex-direction: column; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 18px 55px rgba(11,27,43,.24); }.team-comms.is-open .team-comms-panel { display: flex; }.team-comms-panel[hidden] { display: none !important; }.team-comms-header { display: grid; grid-template-columns: minmax(125px, auto) minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 10px 12px; background: var(--navy-900); color: #fff; }.team-comms-header-meta { display: grid; }.team-comms-header-meta strong { font-size: 10px; }.team-comms-header small { display: flex; align-items: center; gap: 5px; color: #b9c9d4; font-size: 6px; }.team-comms-header .status-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--amber); }.team-comms-header > .team-comms-header-person { overflow: hidden; color: #fff; font-size: 12px; font-weight: 850; text-align: center; text-overflow: ellipsis; white-space: nowrap; }.team-comms-header-actions { display: flex; gap: 5px; }.team-comms-header-actions button { display: grid; width: 28px; height: 28px; place-items: center; border: 0; border-radius: 8px; background: rgba(255,255,255,.1); color: #fff; font-size: 17px; }.team-comms-header-actions button:hover { background: rgba(255,255,255,.18); }
.team-comms-workspace { display: grid; min-height: 0; flex: 1; grid-template-columns: 155px minmax(0, 1fr); }.team-comms-people { display: flex; min-width: 0; min-height: 0; flex-direction: column; border-right: 1px solid var(--line); background: #f9fbfb; }.team-comms-people-title { border-bottom: 1px solid var(--line); padding: 7px 8px; color: var(--muted); font-size: 6px; letter-spacing: .08em; text-transform: uppercase; }.team-comms-people-list { min-height: 0; overflow-y: auto; padding: 4px; }.team-comms-person { display: grid; width: 100%; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; gap: 5px; border: 1px solid transparent; border-radius: 8px; padding: 5px; background: transparent; color: var(--ink); text-align: left; }.team-comms-person:hover { background: #eef5f4; }.team-comms-person.is-active { border-color: #b6ddd6; background: var(--teal-soft); }.team-comms-person .avatar { width: 24px; height: 24px; font-size: 7px; }.team-comms-person-copy { display: grid; min-width: 0; gap: 1px; }.team-comms-person-copy strong { overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }.team-comms-person-copy small { overflow: hidden; color: var(--muted); font-size: 5.5px; text-overflow: ellipsis; white-space: nowrap; }.team-comms-person-unread { display: inline-grid; min-width: 18px; height: 18px; place-items: center; border-radius: 999px; padding: 0 4px; background: #20a36f; color: #fff; font-size: 6px; font-weight: 900; }.team-comms-person-unread[hidden] { display: none; }
.team-comms-conversation { display: flex; min-width: 0; min-height: 0; flex-direction: column; }.team-comms-messages { display: flex; min-height: 0; flex: 1; flex-direction: column; gap: 8px; overflow-y: auto; padding: 10px; background: #f3f6f7; }.team-comms-empty { display: grid; margin: auto; justify-items: center; color: var(--muted); font-size: 9px; text-align: center; }.team-comms-empty strong { color: var(--ink-soft); font-size: 11px; }.team-message { display: grid; max-width: 86%; border: 1px solid var(--line); border-radius: 11px 11px 11px 3px; padding: 8px 10px; background: #fff; box-shadow: var(--shadow-soft); }.team-message.is-sent { align-self: flex-end; border-color: #c9e7e1; border-radius: 11px 11px 3px 11px; background: var(--teal-soft); }.team-message small { color: var(--teal-dark); font-size: 7px; font-weight: 800; }.team-message p { margin: 2px 0; color: var(--ink); font-size: 9px; line-height: 1.45; overflow-wrap: anywhere; white-space: pre-wrap; }.team-message time { color: var(--muted); font-size: 6px; text-align: right; }
.team-comms-form { display: grid; gap: 5px; border-top: 1px solid var(--line); padding: 7px 9px; background: #fff; }.team-comms-form textarea { padding: 7px 9px; font-size: 9px; min-height: 54px; max-height: 82px; }.team-comms-compose-field { display: block; }.team-comms-form-actions { display: flex; align-items: center; justify-content: flex-end; gap: 6px; }.team-comms-attachment-button { display: grid; position: relative; width: 31px; height: 31px; flex: 0 0 31px; place-items: center; border: 1px solid var(--line); border-radius: 9px; background: #fff; color: var(--teal-dark); cursor: pointer; }.team-comms-attachment-button:hover, .team-comms-attachment-button:focus-within { border-color: #9ecfc6; background: var(--teal-soft); }.team-comms-attachment-button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.9; }.team-comms-attachment-button:has(input:disabled) { opacity: .5; cursor: not-allowed; }.team-comms-form-actions .button { min-height: 31px; }
.team-message-toast { display: flex; width: min(350px, calc(100vw - 28px)); align-items: center; gap: 10px; border: 1px solid #b9ddd7; border-radius: 14px; padding: 11px 12px; background: #fff; color: var(--ink); box-shadow: 0 15px 42px rgba(11,27,43,.24); text-align: left; cursor: pointer; animation: message-toast-arrive .24s ease-out; }.team-message-toast[hidden], .team-comms.is-open .team-message-toast { display: none; }.team-message-toast-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 10px; padding: 8px; background: var(--teal-soft); color: var(--teal-dark); }.team-message-toast-copy { display: grid; min-width: 0; flex: 1; gap: 2px; }.team-message-toast-copy strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.team-message-toast-copy small { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }.team-message-toast-open { color: var(--teal-dark); font-size: 8px; font-weight: 850; text-transform: uppercase; }
@keyframes comms-button-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(194,77,77,.15); } 50% { box-shadow: 0 0 0 7px rgba(194,77,77,.16); } } @keyframes comms-badge-blink { 0%, 48% { opacity: 1; } 49%, 100% { opacity: .28; } }
@keyframes message-toast-arrive { from { opacity: 0; transform: translateY(-8px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (prefers-reduced-motion: reduce) { .topbar-comms-toggle.has-unread, .topbar-comms-toggle.has-unread .comms-notification-badge, .team-message-toast { animation: none; } }
@media (max-width: 620px) { .team-comms { top: 70px; right: 7px; }.team-comms-panel { width: calc(100vw - 14px); height: calc(100vh - 78px); }.team-comms-header { grid-template-columns: 88px minmax(0, 1fr) auto; gap: 6px; padding: 8px; }.team-comms-header-meta small { display: none; }.team-comms-header > .team-comms-header-person { font-size: 10px; }.team-comms-workspace { grid-template-columns: 1fr; grid-template-rows: 76px minmax(0, 1fr); }.team-comms-people { border-right: 0; border-bottom: 1px solid var(--line); }.team-comms-people-title { display: none; }.team-comms-people-list { display: flex; gap: 4px; overflow-x: auto; overflow-y: hidden; padding: 4px; }.team-comms-person { width: 132px; min-width: 132px; }.team-comms-form { gap: 4px; padding: 6px; } }

.late-attendance-actions, .attendance-override-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.late-attendance-actions form, .attendance-override-actions form { margin: 0; }

/* Compact attendance decisions */
.attendance-compact { overflow: hidden; margin-bottom: 12px; border: 1px solid #dce7e4; border-radius: 12px; background: #fff; box-shadow: var(--shadow-soft); }
.attendance-compact > summary { display: flex; min-height: 42px; align-items: center; gap: 12px; padding: 7px 11px; cursor: pointer; list-style: none; }
.attendance-compact > summary::-webkit-details-marker { display: none; }
.attendance-compact-title { display: flex; min-width: 145px; align-items: center; gap: 8px; }
.attendance-compact-title .attention-icon { width: 26px; height: 26px; background: var(--teal-soft); color: var(--teal); font-size: 7px; }
.attendance-compact-title > span:last-child { display: grid; }
.attendance-compact-title strong { color: var(--ink); font-size: 9px; }
.attendance-compact-title small { color: var(--muted); font-size: 7px; }
.attendance-counts { display: flex; flex: 1; flex-wrap: wrap; gap: 6px; }
.attendance-count { display: inline-flex; align-items: baseline; gap: 4px; border-radius: 20px; padding: 4px 8px; font-size: 7px; font-weight: 800; white-space: nowrap; }
.attendance-count strong { font-size: 10px; }
.attendance-count.is-ok { background: #e4f5ed; color: #24734f; }
.attendance-count.is-late { background: #fde8e8; color: #a33737; }
.attendance-count.is-leave { background: #fff1dc; color: #966017; }
.attendance-expand-label { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 7px; font-weight: 800; white-space: nowrap; }
.attendance-compact[open] .attendance-expand-label { color: var(--teal); }
.attendance-expand-label .when-open { display: none; }
.attendance-compact[open] .attendance-expand-label .when-open { display: inline; }
.attendance-compact[open] .attendance-expand-label .when-closed { display: none; }
.attendance-compact-body { border-top: 1px solid var(--line); padding: 8px; background: #fbfdfd; }
.attendance-all-clear { display: grid; justify-items: center; gap: 2px; padding: 9px; text-align: center; }
.attendance-all-clear strong { color: #24734f; font-size: 9px; }
.attendance-all-clear small { color: var(--muted); font-size: 7px; }
.attendance-decision-form { width: 112px; margin: 0; }
.attendance-decision-form select { width: 100%; min-height: 29px; padding: 5px 24px 5px 7px; border-color: #d5dfde; background-color: #fff; font-size: 7px; font-weight: 800; }
.attendance-override-row .attendance-decision-form { width: min(175px, 100%); }

/* Linked activity and customer details */
.timeline-copy { gap: 2px; }
.timeline-activity-link { min-width: 0; color: var(--ink); }
.timeline-activity-link strong { display: block; }
.timeline-activity-link:hover strong { color: var(--teal); text-decoration: underline; }
.timeline-client-link { width: max-content; max-width: 100%; overflow: hidden; color: var(--blue); font-size: 7px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.timeline-time { display: grid; justify-items: end; gap: 1px; text-align: right; }
.timeline-time time, .timeline-time small { color: var(--muted); font-size: 7px; }
.timeline-time strong { color: var(--ink); font-size: 8px; white-space: nowrap; }
.activity-title-link:hover { color: var(--teal); text-decoration: underline; }
.activity-detail-panel { margin-bottom: 14px; scroll-margin-top: 82px; border-color: #beddd7; }
.activity-detail-meta { display: grid; grid-template-columns: repeat(auto-fit, minmax(90px, 1fr)); border: 1px solid var(--line); border-radius: 10px; background: #fbfdfd; }
.activity-detail-meta > span { display: grid; min-width: 0; gap: 3px; border-right: 1px solid var(--line); padding: 9px; }
.activity-detail-meta > span:last-child { border-right: 0; }
.activity-detail-meta small, .activity-detail-client small, .activity-detail-notes small { color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.activity-detail-meta strong { overflow: hidden; color: var(--ink); font-size: 8px; text-overflow: ellipsis; }
.activity-detail-notes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.activity-detail-notes > div { border: 1px solid var(--line); border-radius: 10px; padding: 9px; }
.activity-detail-notes p { margin: 4px 0 0; color: var(--ink-soft); font-size: 8px; line-height: 1.55; }
.activity-detail-client { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 8px; border-radius: 10px; padding: 9px; background: var(--blue-soft); }
.activity-detail-client > span { display: grid; }
.activity-detail-client-copy { min-width: 0; gap: 3px; }
.activity-detail-client-heading { display: flex; min-width: 0; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.activity-detail-client-heading strong { color: var(--teal-dark); font-size: 15px; font-weight: 900; line-height: 1.2; overflow-wrap: anywhere; }
.activity-detail-client-phone { color: var(--ink-soft) !important; font-size: 9px !important; font-weight: 750 !important; letter-spacing: .01em !important; text-transform: none !important; }
.client-card.is-selected { border-color: var(--teal); box-shadow: 0 0 0 2px rgba(30, 143, 127, .13), var(--shadow-soft); scroll-margin-top: 12px; }

/* Retrospective activities and post-call maintenance */
.page-intro-summary-group { display: flex; gap: 8px; }
.manual-summary-pill { border-color: #e7d7a8; background: #fff9e9; }
.manual-summary-pill strong { color: #9a651c; }
.manual-activity-entry { margin-bottom: 14px; padding: 0; border-color: #e4d39f; }
.manual-activity-entry > summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 13px 15px; cursor: pointer; list-style: none; }
.manual-activity-entry > summary::-webkit-details-marker { display: none; }
.manual-activity-entry > summary > span:first-child { display: flex; align-items: center; gap: 10px; }
.manual-activity-entry > summary > span:first-child > span:last-child { display: grid; }
.manual-activity-entry summary strong { color: var(--ink); font-size: 10px; }
.manual-activity-entry summary small { color: var(--muted); font-size: 8px; }
.manual-entry-icon { display: grid; width: 31px; height: 31px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: #fff0c8; color: #91601e; font-size: 8px; font-weight: 900; }
.manual-activity-form { border-top: 1px solid #eadcb6; padding: 15px; background: #fffdf7; }
.manual-activity-form .client-lookup-result { max-width: none; }
.manual-new-client { display: grid; gap: 11px; margin-top: 3px; border: 1px solid #dfc987; border-radius: 11px; padding: 11px 12px; background: #fff9e9; }
.manual-new-client[hidden], .manual-new-client-fields[hidden] { display: none; }
.manual-new-client-toggle { display: flex; align-items: flex-start; gap: 9px; cursor: pointer; }
.manual-new-client-toggle > input { width: 17px; height: 17px; flex: 0 0 auto; margin-top: 1px; accent-color: var(--teal); }
.manual-new-client-toggle > span { display: grid; gap: 2px; }
.manual-new-client-toggle strong { color: #78531a; font-size: 10px; }
.manual-new-client-toggle small { color: #89754f; font-size: 8px; }
.manual-new-client-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 14px; border-top: 1px solid #ead8a8; padding-top: 11px; }
.manual-new-client-fields label { min-width: 0; }
.badge-manual { border: 1px solid #e1c574; background: #fff1c5; color: #875712; }
.activity-row.is-manual { margin: 4px 0; border: 1px solid #ead9a9; border-radius: 10px; padding: 11px; background: #fffdf6; }
.activity-summary-wrap { overflow-x: auto; margin: 0 -4px 8px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.activity-summary-table { width: 100%; min-width: 870px; border-collapse: collapse; table-layout: auto; }
.activity-summary-table th { border-bottom: 1px solid #dbe4e8; background: #f5f8f9; text-align: left; }
.activity-summary-table th button { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 7px; border: 0; padding: 10px 11px; background: transparent; color: #607484; font-size: 7px; font-weight: 850; letter-spacing: .045em; text-align: left; text-transform: uppercase; cursor: pointer; }
.activity-summary-table th button:hover, .activity-summary-table th button:focus-visible { background: var(--teal-soft); color: var(--teal-dark); outline: none; }
.activity-summary-table th button span { color: #93a3ae; font-size: 10px; }
.activity-summary-table td { border-bottom: 1px solid #edf1f3; padding: 9px 11px; color: var(--ink-soft); font-size: 8px; vertical-align: middle; }
.activity-summary-table tbody tr:last-child td { border-bottom: 0; }
.activity-summary-table tbody tr { cursor: pointer; transition: background .14s ease, box-shadow .14s ease; }
.activity-summary-table tbody tr:hover { background: #f1faf8; box-shadow: inset 3px 0 0 var(--teal); }
.activity-summary-table tbody tr:focus { background: #edf8f6; outline: 2px solid rgba(31,167,147,.35); outline-offset: -2px; }
.activity-summary-table td:first-child { width: 82px; }
.activity-summary-table td:nth-last-child(-n+4) { white-space: nowrap; }
.activity-summary-table td:last-child { text-align: right; }
.summary-type-badge { display: inline-grid; width: 27px; height: 27px; margin-right: 6px; place-items: center; border-radius: 8px; background: var(--teal-soft); color: var(--teal-dark); font-size: 8px; font-weight: 900; }
.activity-summary-table td:first-child > small { color: var(--muted); font-size: 7px; }
.summary-activity-link { display: grid; min-width: 185px; color: var(--ink); }
.summary-activity-link strong { overflow-wrap: anywhere; font-size: 9px; }
.summary-activity-link small { color: var(--muted); font-size: 7px; }
.summary-activity-link:hover strong { color: var(--teal-dark); text-decoration: underline; }
.summary-running { color: var(--teal-dark); font-size: 8px; font-weight: 800; }
.summary-duration { color: var(--ink); font-size: 9px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.manual-entry-reason { border-left: 2px solid #d8b95d; padding-left: 7px; color: #725a2c !important; }
.manual-reason-note { border-color: #e5cf8d !important; background: #fffaf0; }
.manual-review-strip { border-color: #e7d092; background: #fffbef; }
.manual-review-strip .attention-icon { background: #f8e6ae; color: #815718; font-size: 7px; }
.call-followup-link { border-radius: 20px; padding: 4px 7px; background: var(--amber-soft); color: #8d5b17; font-size: 7px; font-weight: 850; }
.record-card.has-followup { border-color: #e4cf9c; }
.record-edit-history { border-top: 1px dashed var(--line); padding: 7px 13px; color: var(--muted); font-size: 7px; }
.call-maintenance-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.call-maintenance-actions > details { min-width: 0; border-top: 0; }
.call-maintenance-actions > details + details { border-left: 1px solid var(--line); }
.call-maintenance-actions > details > summary { padding: 10px 13px; color: var(--teal-dark); font-size: 8px; font-weight: 850; }
.call-maintenance-actions > details[open] { grid-column: 1 / -1; }
.call-edit-form, .call-followup-form { border-top: 1px solid var(--line); padding: 13px; background: #fbfdfd; }

/* Structured activity classification and owner daily reporting */
.activity-classification-fields { display: grid; grid-template-columns: minmax(160px, .65fr) minmax(0, 1.35fr); gap: 12px; border: 1px solid #cfe4e0; border-radius: 10px; padding: 11px; background: #f5fbfa; }
.activity-software-fields { display: grid; grid-template-columns: minmax(140px, .75fr) minmax(180px, 1.25fr); gap: 12px; }
.activity-classification-fields:has(> .activity-hardware-fields:not([hidden])) { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.activity-classification-fields > .activity-hardware-fields:not([hidden]) { display: contents; }
.activity-classification-fields:has(> .activity-hardware-fields:not([hidden])) > label,
.activity-classification-fields:has(> .activity-hardware-fields:not([hidden])) > .activity-hardware-fields > label { align-self: start; margin: 0; }
.field-label-line { display: flex; align-items: baseline; gap: 5px; }.field-required { color: var(--danger); font-size: 7px; font-style: normal; font-weight: 800; text-transform: uppercase; }.field-help { display: block; margin-top: 3px; color: var(--muted); font-size: 7px; font-weight: 500; }.activity-form-error { border: 1px solid #efc5c5; border-radius: 8px; padding: 8px 10px; background: var(--danger-soft); color: #a12d2d; font-size: 8px; font-weight: 750; }.field-invalid { border-radius: 8px; padding: 5px; background: var(--danger-soft); color: #9f2929; }.field-invalid input, .field-invalid select, input:invalid:focus, select:invalid:focus, textarea:invalid:focus { border-color: var(--danger); box-shadow: 0 0 0 3px rgba(201, 61, 61, .12); }
[data-installation-fields][hidden], [data-software-fields][hidden], [data-software-product-field][hidden], [data-software-remarks-field][hidden], [data-hardware-fields][hidden], [data-hardware-remarks-field][hidden] { display: none !important; }
.quick-classification { width: 100%; grid-template-columns: minmax(160px, .4fr) minmax(0, 1fr); }
.quick-classification .activity-software-fields { grid-template-columns: repeat(2, minmax(160px, 1fr)); }
.daily-team-report { margin-bottom: 16px; overflow: hidden; scroll-margin-top: 90px; }
.chronological-work-log { margin-bottom: 16px; padding: 0; overflow: hidden; scroll-margin-top: 90px; }
.chronological-log-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; padding: 17px 19px 13px; }.chronological-log-header h3 { margin: 2px 0 4px; }.chronological-log-header p { margin: 0; color: var(--muted); font-size: 8px; }.chronological-log-filter { display: flex; align-items: flex-end; gap: 8px; }.chronological-log-filter label { display: grid; gap: 3px; color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }.chronological-log-filter input, .chronological-log-filter select { min-width: 145px; padding: 7px 8px; font-size: 9px; }
.chronological-log-summary { display: flex; align-items: center; gap: 14px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 8px 19px; background: #f8fafb; color: var(--muted); font-size: 8px; }.chronological-log-summary strong { color: var(--ink); }.chronological-log-summary .inline-link { margin-left: auto; }
.chronological-log-list { display: grid; padding: 4px 19px 10px; }.chronological-log-item { display: grid; grid-template-columns: 58px 9px minmax(0, 1fr) 68px; gap: 10px; align-items: start; border-bottom: 1px solid #edf1f3; padding: 12px 0; }.chronological-log-item:last-child { border-bottom: 0; }.chronological-log-item > time { display: grid; }.chronological-log-item > time strong { font-size: 9px; }.chronological-log-item > time small { color: var(--muted); font-size: 7px; }.chronological-log-dot { width: 8px; height: 8px; margin-top: 4px; border: 2px solid #cce9e4; border-radius: 50%; background: var(--teal); }.chronological-log-item.is-running { border-radius: 8px; background: linear-gradient(90deg, rgba(228,246,242,.6), transparent 72%); }.chronological-log-item.is-running .chronological-log-dot { animation: live-work-breathe 1.35s ease-in-out infinite; }.chronological-log-item.is-paused .chronological-log-dot { border-color: #eed9b6; background: #d69b3c; }.chronological-log-copy { display: grid; min-width: 0; gap: 2px; }.chronological-log-copy > span { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }.chronological-log-copy a > strong { color: var(--ink); font-size: 10px; }.chronological-log-copy > small { color: var(--muted); font-size: 7px; }.chronological-log-copy p { margin: 5px 0 0; border-left: 2px solid var(--line); padding-left: 7px; color: var(--ink-soft); font-size: 8px; line-height: 1.45; }.chronological-followup { width: max-content; margin-top: 5px; border-radius: 20px; padding: 4px 7px; background: var(--violet-soft); color: var(--violet); font-size: 7px; font-weight: 800; }.chronological-log-duration { display: grid; justify-items: end; }.chronological-log-duration strong { font-size: 10px; }.chronological-log-duration small { color: var(--muted); font-size: 7px; }
.chronological-log-copy .chronological-client-name { width: fit-content; max-width: 100%; overflow-wrap: anywhere; color: var(--teal-dark); font-size: 13px; font-weight: 900; line-height: 1.2; }.chronological-log-copy .chronological-client-name.is-internal { color: var(--ink); }.chronological-log-copy .chronological-product-line { margin-top: 1px; color: var(--ink-soft); font-size: 8px; font-weight: 750; }.chronological-activity-subject { margin-top: 4px; }.chronological-log-copy .chronological-activity-subject a > strong { font-size: 9px; }
.client-duplicate-warning { display: grid; gap: 4px; border: 1px solid #efd49c; border-radius: 10px; padding: 9px 11px; background: #fff9eb; color: #7c571c; }.client-duplicate-warning[hidden] { display: none; }.client-duplicate-warning.is-blocking { border-color: #e6aaaa; background: #fff2f2; color: #9c3131; }.client-duplicate-warning > strong { font-size: 9px; }.client-duplicate-warning > small { font-size: 8px; }.client-duplicate-matches { display: grid; gap: 3px; margin-top: 3px; }.client-duplicate-matches > span { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 7px; border-top: 1px solid rgba(120,90,40,.15); padding-top: 4px; font-size: 8px; }
.client-create-form .client-duplicate-warning, .client-edit-form .client-duplicate-warning { grid-column: 1 / -1; }
.daily-report-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 17px 19px 14px; }
.daily-report-header h3 { margin: 0 0 3px; font-size: 16px; }
.daily-report-header p { max-width: 660px; margin: 0; color: var(--muted); font-size: 9px; }
.daily-report-filter { display: flex; align-items: end; flex-wrap: wrap; gap: 8px; }
.daily-report-filter label { min-width: 135px; font-size: 8px; }
.daily-report-filter select { min-width: 160px; }
.daily-report-filter input, .daily-report-filter select { min-height: 33px; padding: 6px 8px; font-size: 9px; }
.daily-report-totals { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #f7faf9; }
.daily-report-totals > span { display: grid; border-right: 1px solid var(--line); padding: 10px 18px; }
.daily-report-totals > span:last-child { border-right: 0; }
.daily-report-totals small { color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.daily-report-totals strong { color: var(--ink); font-size: 17px; }
.daily-employee-list { display: grid; }
.daily-employee-report { border-bottom: 1px solid var(--line); }
.daily-employee-report:last-child { border-bottom: 0; }
.daily-employee-report > summary { display: grid; grid-template-columns: minmax(210px, 1fr) minmax(430px, 1.3fr); align-items: center; gap: 18px; padding: 11px 18px; list-style: none; }
.daily-employee-report > summary::-webkit-details-marker { display: none; }
.daily-employee-report > summary:hover { background: #fbfdfd; }
.daily-employee-report[open] > summary { border-bottom: 1px solid var(--line); background: #f5fbfa; }
.daily-employee-person { display: flex; min-width: 0; align-items: center; gap: 10px; }
.daily-employee-person > span:last-child { display: grid; min-width: 0; }
.daily-employee-person strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.daily-employee-person small { color: var(--muted); font-size: 8px; }
.member-avatar { display: grid; width: 32px; height: 32px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: var(--teal-soft); color: var(--teal-dark); font-size: 10px; font-weight: 900; }
.daily-employee-metrics { display: grid; grid-template-columns: repeat(5, minmax(58px, 1fr)) auto; align-items: center; gap: 5px; }
.daily-employee-metrics > span { display: grid; min-width: 0; border-left: 1px solid var(--line); padding-left: 9px; }
.daily-employee-metrics small { color: var(--muted); font-size: 6px; font-weight: 800; text-transform: uppercase; }
.daily-employee-metrics strong { font-size: 12px; }
.daily-employee-metrics .has-pending strong { color: #a86b16; }
.daily-expand-label { min-width: 49px; color: var(--teal-dark); font-size: 7px; text-align: right; text-transform: uppercase; }
.daily-employee-report[open] .daily-expand-label { font-size: 0; }
.daily-employee-report[open] .daily-expand-label::after { content: "Collapse"; font-size: 7px; }
.daily-employee-body { padding: 13px 18px 16px 59px; background: #fff; }
.daily-breakdown-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.daily-breakdown-grid > div { border: 1px solid var(--line); border-radius: 9px; padding: 9px; }
.daily-breakdown-grid > div > small { display: block; margin-bottom: 6px; color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.daily-breakdown-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.daily-breakdown-chips span { display: inline-flex; align-items: center; gap: 5px; border-radius: 20px; padding: 4px 7px; background: #eef4f4; color: #526777; font-size: 7px; font-weight: 750; }
.daily-breakdown-chips strong { color: var(--ink); font-size: 9px; }
.daily-breakdown-chips.software-chips span { background: var(--blue-soft); color: #356c9d; }
.application-product-mark { display: inline-grid; width: 48px; height: 48px; flex: 0 0 48px; place-items: center; vertical-align: middle; }
.application-product-icon { display: block; width: 48px; height: 48px; object-fit: contain; }
.application-product-mark.is-inline { margin: 0 2px; }
.application-product-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.application-meta-line, .chronological-product-line { display: inline-flex; align-items: center; flex-wrap: wrap; gap: 3px; }
.client-product-cell .application-product-mark, .licensing-application-cell .application-product-mark { margin-inline: auto; }
.daily-breakdown-chips.software-chips .application-product-mark { margin: -2px 0; }
.licensing-app-breakdown > :is(span, a) .application-product-mark { grid-column: 1; grid-row: 1 / span 2; }
.licensing-app-breakdown > :is(span, a).has-application-icon { grid-template-columns: 48px minmax(0, 1fr) auto; }
.licensing-app-breakdown > :is(span, a).has-application-icon strong { grid-column: 3; }
.licensing-app-breakdown > :is(span, a).has-application-icon small { grid-column: 2; grid-row: 2; }
.daily-breakdown-chips .is-muted { background: #f3f5f6 !important; color: var(--muted) !important; font-weight: 600; }
.employee-activity-grid-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 10px; background: #fff; }
.employee-activity-grid { width: 100%; min-width: 1160px; border-collapse: collapse; table-layout: fixed; }
.employee-activity-grid th { border-right: 1px solid #e6ecef; border-bottom: 1px solid #d8e3e6; padding: 8px 9px; background: #f4f8f8; color: #6f8190; font-size: 6px; font-weight: 850; letter-spacing: .045em; text-align: left; text-transform: uppercase; }
.employee-activity-grid th:last-child, .employee-activity-grid td:last-child { border-right: 0; }
.employee-activity-grid td { border-right: 1px solid #edf1f3; border-bottom: 1px solid #edf1f3; padding: 8px 9px; color: var(--ink-soft); font-size: 7px; vertical-align: top; }
.employee-activity-grid tbody tr:last-child td { border-bottom: 0; }
.employee-activity-grid tbody tr:hover { background: #f6fbfa; }
.employee-activity-grid th:nth-child(1) { width: 48px; }.employee-activity-grid th:nth-child(2) { width: 120px; }.employee-activity-grid th:nth-child(3) { width: 145px; }.employee-activity-grid th:nth-child(4) { width: 115px; }.employee-activity-grid th:nth-child(5) { width: 285px; }.employee-activity-grid th:nth-child(6) { width: 125px; }.employee-activity-grid th:nth-child(7) { width: 95px; }.employee-activity-grid th:nth-child(8) { width: 82px; }.employee-activity-grid th:nth-child(9) { width: 75px; }
.employee-activity-grid td strong { color: var(--ink); font-size: 8px; }.employee-activity-grid td small { display: block; margin-top: 2px; color: var(--muted); font-size: 6px; line-height: 1.4; }.employee-grid-serial { color: var(--muted) !important; text-align: center; }.employee-grid-date, .employee-grid-duration { white-space: nowrap; }.employee-grid-details { display: table-cell; }.employee-grid-details > a { display: block; color: var(--ink); font-size: 8px; font-weight: 850; line-height: 1.35; }.employee-grid-details > a:hover { color: var(--teal-dark); text-decoration: underline; }.employee-grid-details .work-token { display: inline-block; margin-top: 4px; font-size: 6px; }.employee-grid-product .application-product-mark { max-width: 118px; }.employee-grid-status .badge { margin: 0 3px 3px 0; font-size: 6px; }.employee-grid-actions { text-align: center; }.employee-grid-actions .ticket-chat-button { margin: 6px auto 0; }.muted-value { color: var(--muted); }
.daily-timeline { display: grid; border-top: 1px solid var(--line); }
.daily-timeline-row { display: grid; grid-template-columns: 62px 9px minmax(0, 1fr) auto; align-items: start; gap: 9px; border-bottom: 1px solid #edf1f3; padding: 9px 2px; }
.daily-timeline-row:last-child { border-bottom: 0; }
.daily-timeline-row > time { display: grid; text-align: right; }
.daily-timeline-row > time strong { font-size: 8px; }
.daily-timeline-row > time small { color: var(--muted); font-size: 6px; }
.daily-timeline-dot { width: 8px; height: 8px; margin-top: 4px; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft); }
.daily-timeline-dot.type-support_call { background: var(--blue); box-shadow: 0 0 0 3px var(--blue-soft); }
.daily-timeline-dot.type-follow_up { background: var(--violet); box-shadow: 0 0 0 3px var(--violet-soft); }
.daily-timeline-copy { display: grid; min-width: 0; }
.daily-timeline-copy > span { display: flex; align-items: center; gap: 6px; }
.daily-timeline-copy b { color: var(--muted); font-size: 7px; text-transform: uppercase; }
.daily-timeline-copy a { overflow: hidden; color: var(--ink); font-size: 9px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; }
.daily-timeline-copy a:hover { color: var(--teal-dark); text-decoration: underline; }
.daily-timeline-copy small { color: var(--muted); font-size: 7px; }

/* Grouped live activity feed */
.employee-feed-panel { min-width: 0; }
.employee-live-feed { display: grid; }
.employee-feed-group { border-top: 1px solid var(--line); }
.employee-feed-group:first-child { border-top: 0; }
.employee-feed-group > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 9px 2px; list-style: none; }
.employee-feed-group > summary::-webkit-details-marker { display: none; }
.employee-feed-group.has-live-work > summary { color: var(--teal-dark); }
.employee-feed-group.has-paused-work > summary, .employee-feed-count b.is-paused { color: #9a681d; }
.employee-feed-person { display: flex; min-width: 0; align-items: center; gap: 9px; }
.employee-feed-person > span:last-child { display: grid; min-width: 0; }
.employee-feed-person strong { overflow: hidden; color: var(--ink); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.employee-feed-person small { color: var(--muted); font-size: 7px; }
.employee-feed-count { display: grid; flex: 0 0 auto; justify-items: end; }
.employee-feed-count b { color: var(--teal-dark); font-size: 7px; text-transform: uppercase; }
.employee-feed-count small { color: var(--muted); font-size: 7px; }
.live-work-pulse, .paused-work-dot, .completed-work-dot, .feed-item-dot { width: 11px; height: 11px; flex: 0 0 auto; border-radius: 50%; }
.live-work-pulse { background: #20c997; box-shadow: 0 0 0 3px rgba(32,201,151,.18), 0 0 10px rgba(32,201,151,.55); animation: live-work-breathe 1.35s ease-in-out infinite; }
.paused-work-dot { background: #d69b3c; box-shadow: 0 0 0 3px rgba(214,155,60,.18); }
.completed-work-dot { width: 8px; height: 8px; margin: 0 1px; background: #c5d0d6; }
.employee-feed-items { display: grid; margin: 0 0 6px 5px; border-left: 1px solid #dce7e5; padding-left: 10px; }
.employee-feed-item { display: grid; grid-template-columns: 7px minmax(0, 1fr) auto; gap: 8px; align-items: start; border-top: 1px solid #eef2f3; padding: 8px 0; }
.employee-feed-item:first-child { border-top: 0; }
.employee-feed-item.is-live { border-radius: 7px; background: linear-gradient(90deg, rgba(228,246,242,.7), transparent 70%); }
.employee-feed-item.is-paused { border-radius: 7px; background: linear-gradient(90deg, rgba(255,246,228,.9), transparent 70%); }
.small-pulse { width: 7px; height: 7px; margin-top: 4px; box-shadow: 0 0 0 2px rgba(32,201,151,.17), 0 0 7px rgba(32,201,151,.5); }
.small-paused-dot { width: 7px; height: 7px; margin-top: 4px; box-shadow: 0 0 0 2px rgba(214,155,60,.15); }
.feed-item-dot { width: 6px; height: 6px; margin-top: 4px; background: #b8c5cc; }
.employee-feed-more { padding: 7px 0; color: var(--teal-dark); font-size: 7px; font-weight: 800; }
@keyframes live-work-breathe { 0%, 100% { opacity: .45; transform: scale(.78); box-shadow: 0 0 0 2px rgba(32,201,151,.12), 0 0 4px rgba(32,201,151,.28); } 50% { opacity: 1; transform: scale(1.08); box-shadow: 0 0 0 5px rgba(32,201,151,.18), 0 0 14px rgba(32,201,151,.75); } }

/* ERP clients & module subscriptions */
.erp-client-intro { align-items: center; }
.erp-client-summary { display: grid; grid-template-columns: repeat(4, minmax(92px, 1fr)); gap: 8px; }
.erp-client-summary span { display: grid; min-width: 92px; border: 1px solid var(--line); border-radius: 11px; padding: 9px 12px; background: #fff; }
.erp-client-summary strong { font-size: 16px; }
.erp-client-summary small { color: var(--muted); font-size: 7px; text-transform: uppercase; }
.erp-foundation-note { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 18px; border-color: #c9e6e0; padding: 15px 17px; background: linear-gradient(100deg, #edfaf7, #fff); }
.erp-foundation-icon { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: var(--teal); color: #fff; font-size: 8px; font-weight: 900; }
.erp-foundation-note strong { font-size: 11px; }.erp-foundation-note p { margin: 3px 0 0; color: var(--muted); font-size: 9px; }
.erp-client-create { margin-bottom: 18px; padding: 0; }
.erp-client-create > details > summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; list-style: none; padding: 16px 18px; }
.erp-client-create summary::-webkit-details-marker { display: none; }
.erp-client-create summary > span:first-child { display: flex; align-items: center; gap: 11px; }
.erp-client-create summary b { display: grid; width: 32px; height: 32px; place-items: center; border-radius: 9px; background: var(--teal-soft); color: var(--teal); font-size: 18px; }
.erp-client-create summary strong { display: block; font-size: 11px; }.erp-client-create summary small { color: var(--muted); font-size: 9px; }
.erp-client-form { display: grid; gap: 18px; border-top: 1px solid var(--line); padding: 20px; }
.erp-module-picker { display: grid; gap: 14px; border: 1px solid var(--line); border-radius: 13px; padding: 17px; background: #f8fafb; }
.erp-module-picker h3, .erp-module-picker h4 { margin: 0 0 3px; font-size: 14px; }.erp-module-picker p { margin: 0; color: var(--muted); font-size: 8px; }
.erp-module-picker fieldset { min-width: 0; margin: 0; border: 0; border-top: 1px solid var(--line); padding: 12px 0 0; }
.erp-module-picker legend { padding: 0 8px 0 0; color: var(--ink-soft); font-size: 9px; font-weight: 800; }
.erp-module-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.erp-module-option { display: flex; align-items: flex-start; gap: 9px; border: 1px solid var(--line); border-radius: 10px; padding: 11px; background: #fff; cursor: pointer; }
.erp-module-option:has(input:checked) { border-color: #abd9d0; background: var(--teal-soft); }
.erp-module-option.is-core { border-color: #b8d7ed; background: var(--blue-soft); }
.erp-module-option input { width: 16px; height: 16px; flex: 0 0 auto; margin: 2px 0 0; accent-color: var(--teal); }
.erp-module-option span { display: grid; min-width: 0; gap: 2px; }.erp-module-option strong { font-size: 10px; }.erp-module-option small { color: var(--muted); font-size: 8px; font-weight: 500; line-height: 1.4; }
.module-release { width: max-content; border-radius: 20px; padding: 3px 6px; font-size: 6px; font-style: normal; font-weight: 850; text-transform: uppercase; }
.module-release-ready { background: #d9f3ed; color: var(--teal-dark); }.module-release-building { background: var(--amber-soft); color: #9a651c; }.module-release-planned { background: #edf1f4; color: var(--muted); }
.erp-client-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.erp-client-card { overflow: hidden; padding: 0; }
.erp-client-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; padding: 17px; }
.client-code { display: inline-flex; margin-bottom: 5px; border-radius: 20px; padding: 4px 8px; background: var(--navy-900); color: #fff; font-size: 8px; font-weight: 900; letter-spacing: .04em; }
.erp-client-card h3 { margin: 0; font-size: 16px; }.erp-client-card-head p { margin: 2px 0 0; color: var(--muted); font-size: 9px; }
.organization-status { border-radius: 20px; padding: 5px 8px; font-size: 7px; font-weight: 850; text-transform: uppercase; }
.organization-status-active { background: var(--teal-soft); color: var(--teal-dark); }.organization-status-trial { background: var(--amber-soft); color: #9a651c; }.organization-status-suspended { background: var(--danger-soft); color: var(--danger); }
.erp-client-meta { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #f8fafb; }
.erp-client-meta span { display: grid; min-width: 0; border-right: 1px solid var(--line); padding: 10px; }.erp-client-meta span:last-child { border-right: 0; }
.erp-client-meta small { color: var(--muted); font-size: 6px; text-transform: uppercase; }.erp-client-meta strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.erp-client-modules { display: flex; flex-wrap: wrap; gap: 6px; padding: 13px 17px 5px; }.erp-client-modules span { border: 1px solid #cce3df; border-radius: 20px; padding: 4px 7px; background: var(--teal-soft); color: var(--teal-dark); font-size: 7px; font-weight: 800; }
.erp-client-contact { display: flex; flex-wrap: wrap; gap: 7px 15px; padding: 9px 17px 14px; color: var(--muted); font-size: 8px; }
.erp-client-edit { border-top: 1px solid var(--line); }.erp-client-edit > summary { padding: 10px 17px; color: var(--teal-dark); font-size: 8px; font-weight: 850; }.erp-client-edit .erp-client-form { background: #fbfcfc; }
.erp-module-picker.compact { padding: 13px; }.erp-module-picker.compact .erp-module-options { grid-template-columns: repeat(3, minmax(0, 1fr)); }.erp-module-picker.compact .erp-module-option small { display: none; }

/* Advance leave workflow */
.button-danger { border-color: var(--danger); background: var(--danger); color: #fff; }.button-danger:hover { background: #a83e3e; }
.leave-page-intro { margin-bottom: 18px; }.leave-summary { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }.leave-summary > span { display: grid; min-width: 86px; border: 1px solid var(--line); border-radius: 11px; padding: 8px 11px; background: #fff; }.leave-summary > span.has-pending { border-color: #ebd19f; background: var(--amber-soft); }.leave-summary strong { font-size: 15px; }.leave-summary small { color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.leave-layout { display: grid; grid-template-columns: minmax(300px, .72fr) minmax(420px, 1.28fr); gap: 18px; margin-bottom: 18px; }.leave-layout > .panel { min-width: 0; }.leave-route-icon { display: grid; width: 35px; height: 35px; place-items: center; border-radius: 10px; background: var(--teal-soft); color: var(--teal-dark); font-size: 9px; font-weight: 900; }.leave-route { display: grid; gap: 3px; margin: -4px 0 17px; border: 1px solid #cbe4df; border-radius: 11px; padding: 12px; background: #f4fbf9; }.leave-route small { color: var(--teal-dark); font-size: 7px; font-weight: 850; text-transform: uppercase; }.leave-route strong { font-size: 10px; overflow-wrap: anywhere; }.leave-route span { color: var(--muted); font-size: 8px; }.leave-application-form { align-items: end; }.leave-duration-preview { display: flex; min-height: 34px; align-items: center; gap: 7px; border: 1px solid #cbe4df; border-radius: 9px; padding: 7px 10px; background: #f4fbf9; color: var(--teal-dark); font-size: 8px; }.leave-duration-preview strong { font-size: 9px; }.leave-duration-preview .text-danger { font-weight: 850; }.leave-approval-duration { border: 1px solid #cbe4df; border-radius: 9px; padding: 9px; background: #f4fbf9; }.leave-approval-duration small { color: var(--muted); font-size: 7px; font-weight: 500; text-transform: none; }
.leave-record-list { display: grid; max-height: 620px; overflow-y: auto; border-top: 1px solid var(--line); }.leave-record { display: grid; gap: 8px; border-bottom: 1px solid var(--line); padding: 13px 3px; }.leave-record:last-child { border-bottom: 0; }.leave-record-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }.leave-record-head > span:first-child { display: grid; gap: 3px; min-width: 0; }.leave-record-head b { font-size: 10px; }.leave-code { color: var(--blue); font-size: 7px; font-weight: 900; letter-spacing: .04em; overflow-wrap: anywhere; }.leave-status { width: max-content; border-radius: 20px; padding: 4px 7px; font-size: 7px; font-weight: 850; white-space: nowrap; }.leave-status.status-pending { background: var(--amber-soft); color: #97631b; }.leave-status.status-approved { background: var(--teal-soft); color: var(--teal-dark); }.leave-status.status-rejected, .leave-status.status-cancelled { background: var(--danger-soft); color: var(--danger); }.leave-record > p, .leave-employee-comment p { margin: 0; color: var(--ink-soft); font-size: 9px; line-height: 1.5; }.leave-record-meta { display: flex; flex-wrap: wrap; gap: 5px 13px; color: var(--muted); font-size: 7px; }.leave-decision-comment { border-left: 3px solid var(--blue); border-radius: 0 8px 8px 0; padding: 8px 10px; background: var(--blue-soft); }.leave-decision-comment small, .leave-employee-comment small { color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }.leave-decision-comment p { margin: 3px 0 0; color: var(--ink-soft); font-size: 8px; }.leave-audit summary { color: var(--teal-dark); font-size: 8px; font-weight: 800; cursor: pointer; }.leave-audit ol { display: grid; gap: 6px; margin: 8px 0 0; padding-left: 18px; }.leave-audit li { padding-left: 3px; color: var(--muted); font-size: 7px; }.leave-audit li span { color: var(--ink); font-weight: 800; }.leave-audit li strong, .leave-audit li time { margin-left: 5px; }.leave-audit li p { margin: 3px 0 0; color: var(--ink-soft); }
.leave-review-panel, .leave-decisions-panel { margin-bottom: 18px; }.review-count { display: grid; width: 33px; height: 33px; place-items: center; border-radius: 10px; background: #edf2f4; color: var(--muted); font-size: 12px; font-weight: 900; }.review-count.has-pending { background: var(--amber-soft); color: #9b671c; }.compact-empty { min-height: 100px; }.leave-review-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }.leave-review-card { display: grid; min-width: 0; gap: 11px; border: 1px solid var(--line); border-radius: 12px; padding: 14px; background: #fbfcfc; }.leave-review-person { display: flex; min-width: 0; align-items: center; gap: 9px; }.leave-review-person > span:nth-child(2) { display: grid; min-width: 0; flex: 1; }.leave-review-person strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }.leave-review-person small { color: var(--muted); font-size: 7px; }.leave-review-dates { display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; border-radius: 9px; padding: 10px; background: #fff; }.leave-review-dates small { grid-column: 1 / -1; color: var(--muted); font-size: 7px; text-transform: uppercase; }.leave-review-dates strong { font-size: 10px; }.leave-review-dates span { color: var(--muted); font-size: 8px; }.leave-review-dates .leave-submitted-label { grid-column: 1; margin-top: 6px; }.leave-review-dates .leave-submitted-time { grid-column: 2; align-self: end; margin-top: 6px; color: var(--ink); font-size: 8px; font-weight: 800; white-space: nowrap; }.leave-employee-comment { border-left: 3px solid #cbd6dc; padding-left: 10px; }.leave-owner-override, .leave-escalation-note { border-radius: 8px; padding: 8px 9px; font-size: 7px; font-weight: 750; }.leave-owner-override { background: var(--blue-soft); color: #466c87; }.leave-escalation-note { background: var(--amber-soft); color: #8c601c; }.leave-decision-form { display: grid; gap: 9px; }.leave-decision-form > div { display: flex; flex-wrap: wrap; gap: 7px; }.leave-decision-form .button { flex: 1; }.leave-decision-table { display: grid; border-top: 1px solid var(--line); }.leave-decision-table article { display: grid; grid-template-columns: minmax(150px, 1fr) minmax(150px, .8fr) auto minmax(125px, .6fr); align-items: center; gap: 12px; border-bottom: 1px solid var(--line); padding: 10px 2px; font-size: 8px; }.leave-decision-table article:last-child { border-bottom: 0; }.leave-decision-table article > span { display: grid; min-width: 0; }.leave-decision-table strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.leave-decision-table small, .leave-decision-table time { color: var(--muted); font-size: 7px; }
.leave-calendar-panel, .leave-owner-entry-panel { margin-bottom: 18px; }
.leave-calendar-header { align-items: center; }
.leave-calendar-controls, .leave-calendar-controls form { display: flex; align-items: center; gap: 6px; }
.leave-calendar-controls input[type="month"] { width: 145px; height: 32px; border: 1px solid var(--line); border-radius: 8px; padding: 4px 8px; background: #fff; color: var(--ink); font: inherit; font-size: 8px; }
.leave-calendar-legend { display: flex; align-items: center; gap: 7px; border-top: 1px solid var(--line); padding: 8px 18px; }
.leave-calendar-legend span { border-radius: 999px; padding: 4px 7px; font-size: 7px; font-weight: 850; }
.leave-calendar-legend .status-approved { background: var(--teal-soft); color: var(--teal-dark); }
.leave-calendar-legend .status-pending { background: var(--amber-soft); color: #8c601c; }
.leave-calendar-legend small { margin-left: auto; color: var(--muted); font-size: 7px; }
.leave-calendar-scroll { overflow-x: auto; }
.leave-calendar-grid { display: grid; min-width: 770px; grid-template-columns: repeat(7, minmax(105px, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.leave-calendar-weekday { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 6px 8px; background: #f5f8f9; color: var(--muted); font-size: 7px; font-weight: 850; text-align: center; text-transform: uppercase; }
.leave-calendar-day { min-height: 94px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 7px; background: #fff; }
.leave-calendar-day.is-empty { background: #f8fafb; }
.leave-calendar-day.is-today { box-shadow: inset 0 0 0 2px var(--teal); }
.leave-calendar-day > time { display: block; margin-bottom: 5px; color: var(--ink); font-size: 9px; font-weight: 850; }
.leave-calendar-entries { display: grid; gap: 4px; }
.leave-calendar-entry { display: grid; min-width: 0; gap: 1px; border-radius: 6px; padding: 4px 5px; }
.leave-calendar-entry.status-approved { background: var(--teal-soft); color: var(--teal-dark); }
.leave-calendar-entry.status-pending { background: var(--amber-soft); color: #8c601c; }
.leave-calendar-entry strong { overflow: hidden; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.leave-calendar-entry small { font-size: 6px; opacity: .82; }
.leave-owner-entry-panel .panel-header p { margin: 3px 0 0; color: var(--muted); font-size: 8px; }
.leave-owner-entry-form { grid-template-columns: minmax(155px, 1fr) repeat(3, minmax(120px, .65fr)) minmax(220px, 1.2fr) auto; align-items: end; }
.leave-owner-entry-form > .leave-duration-preview { grid-column: 1 / -1; }
.leave-owner-entry-form .form-actions { align-items: flex-start; flex-direction: column; gap: 4px; }
.leave-owner-entry-form .form-actions small { color: var(--muted); font-size: 6px; }

/* v69 owner salary and day-wise attendance register */
.salary-page-intro { align-items: end; }
.salary-filters { display: flex; align-items: end; gap: 8px; }
.salary-filters label { display: grid; gap: 4px; color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.salary-filters input, .salary-filters select { min-width: 145px; height: 34px; border: 1px solid var(--line); border-radius: 9px; padding: 5px 9px; background: #fff; color: var(--ink); font: inherit; font-size: 8px; text-transform: none; }
.salary-summary { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; margin: 0 0 18px; }
.salary-summary > span { display: grid; gap: 4px; min-height: 67px; border: 1px solid var(--line); border-radius: 14px; padding: 12px 14px; background: #fff; box-shadow: var(--shadow-soft); }
.salary-summary small { color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.salary-summary strong { color: var(--ink); font-size: 17px; }
.salary-summary .is-net { border-color: #a9ddd5; background: var(--teal-soft); }.salary-summary .is-net strong { color: var(--teal-dark); }
.salary-register-panel, .salary-attendance-panel { margin-bottom: 18px; }
.salary-register-header { align-items: center; }.salary-register-header p, .salary-attendance-panel .panel-header p { max-width: 660px; margin: 4px 0 0; color: var(--muted); font-size: 8px; }
.salary-table-wrap { overflow-x: auto; }.salary-table { min-width: 960px; }.salary-table th, .salary-table td { padding: 10px 12px; vertical-align: middle; }
.salary-table td:first-child { min-width: 165px; }.salary-table td:first-child strong, .salary-table td:first-child small, .salary-table td:last-child small { display: block; }.salary-table td:first-child small, .salary-table td:last-child small { margin-top: 3px; color: var(--muted); font-size: 7px; }
.salary-amount-form { display: flex; align-items: center; width: 150px; border: 1px solid var(--line); border-radius: 9px; overflow: hidden; background: #fff; }
.salary-amount-form > span { padding-left: 8px; color: var(--muted); font-weight: 850; }.salary-amount-form input { min-width: 0; width: 100%; height: 31px; border: 0; padding: 4px 5px; background: transparent; color: var(--ink); font: inherit; font-size: 8px; font-weight: 800; }.salary-amount-form input:focus { outline: none; }
.salary-save { align-self: stretch; width: 31px; border: 0; border-left: 1px solid var(--line); background: var(--teal-soft); color: var(--teal-dark); font-weight: 900; cursor: pointer; }
.salary-net-cell strong { color: var(--teal-dark); font-size: 10px; }.salary-run-state { display: inline-flex; border-radius: 999px; padding: 4px 7px; background: #eef2f4; color: var(--muted); font-size: 7px; font-weight: 850; white-space: nowrap; }.salary-run-state.is-generated { background: var(--teal-soft); color: var(--teal-dark); }.salary-run-state.is-stale { background: var(--amber-soft); color: #8c601c; }
.salary-register-note { border-top: 1px solid var(--line); padding: 10px 18px; color: var(--muted); font-size: 8px; }.salary-register-note strong { color: var(--ink); }
.salary-month-nav { display: flex; gap: 6px; }.salary-attendance-legend { display: flex; flex-wrap: wrap; gap: 5px; border-top: 1px solid var(--line); padding: 8px 18px; }.salary-attendance-legend span { border-radius: 999px; padding: 4px 7px; background: #eef2f4; color: var(--muted); font-size: 7px; font-weight: 850; }.salary-attendance-legend .status-paid_off { background: #edf3ff; color: #3266a8; }.salary-attendance-legend .status-quarter_day_off, .salary-attendance-legend .status-third_day_off, .salary-attendance-legend .status-half_day_off, .salary-attendance-legend .status-three_quarter_day_off { background: var(--amber-soft); color: #8c601c; }.salary-attendance-legend .status-absent { background: #fdecec; color: #b94444; }.salary-attendance-legend .status-leave { background: var(--teal-soft); color: var(--teal-dark); }
.salary-attendance-scroll-shell { position: relative; max-width: 100%; border-top: 1px solid var(--line); }
.salary-attendance-top-scroll { width: 100%; height: 18px; overflow-x: auto; overflow-y: hidden; border-bottom: 1px solid var(--line); background: #f5f8f9; scrollbar-color: var(--teal) #dfe8e9; scrollbar-width: auto; }
.salary-attendance-top-scroll > div { height: 1px; }
.salary-attendance-scroll { max-width: 100%; max-height: min(68vh, 690px); overflow: auto; overscroll-behavior: contain; scrollbar-gutter: stable; }
.salary-attendance-grid { width: max-content; min-width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; background: #fff; }
.salary-attendance-grid th, .salary-attendance-grid td { width: 62px; min-width: 62px; height: 56px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 3px; text-align: center; }
.salary-attendance-grid thead th { position: sticky; top: 0; z-index: 2; background: #f5f8f9; color: var(--muted); font-size: 7px; }.salary-attendance-grid thead th strong, .salary-attendance-grid thead th small { display: block; }.salary-attendance-grid thead th strong { color: var(--ink); font-size: 9px; }.salary-attendance-grid thead th small { margin-top: 2px; font-size: 6px; text-transform: uppercase; }.salary-attendance-grid thead th.is-today { background: #e3f5f1; box-shadow: inset 0 3px 0 var(--teal); }.salary-attendance-grid thead th.is-today strong { color: var(--teal-dark); }
.salary-attendance-grid .salary-employee-column { position: sticky; left: 0; z-index: 3; width: 170px; min-width: 170px; padding: 7px 10px; background: #fff; text-align: left; box-shadow: 1px 0 0 var(--line); }.salary-attendance-grid thead .salary-employee-column { z-index: 4; background: #f5f8f9; }.salary-attendance-grid .salary-employee-column strong, .salary-attendance-grid .salary-employee-column small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.salary-attendance-grid .salary-employee-column strong { color: var(--ink); font-size: 8px; }.salary-attendance-grid .salary-employee-column small { margin-top: 3px; color: var(--muted); font-size: 6px; }
.salary-attendance-grid .salary-total-column { position: sticky; right: 0; z-index: 3; width: 72px; min-width: 72px; background: #f7fbfa; color: var(--teal-dark); box-shadow: -1px 0 0 var(--line); }.salary-attendance-grid thead .salary-total-column { z-index: 4; }
.salary-attendance-cell form { display: grid; width: 100%; justify-items: center; gap: 1px; }.salary-attendance-cell select { width: 100%; height: 30px; border: 0; border-radius: 6px; padding: 2px; background: transparent; color: var(--ink); font: inherit; font-size: 7px; font-weight: 900; cursor: pointer; }.salary-attendance-cell select:focus { outline: 2px solid var(--teal); outline-offset: 1px; }.attendance-remark-button { display: grid; width: 20px; height: 17px; place-items: center; border: 1px solid #d4dedf; border-radius: 5px; padding: 0; background: rgba(255,255,255,.72); color: var(--muted); font-size: 9px; line-height: 1; }.attendance-remark-button:hover { border-color: var(--teal); color: var(--teal-dark); }.attendance-remark-button.has-remark { border-color: #9dd4ca; background: #dff3ef; color: var(--teal-dark); }.attendance-remark-button:disabled { opacity: .4; cursor: not-allowed; }
.salary-attendance-cell.status-unmarked { background: #fff; }.salary-attendance-cell.status-full_day { background: #f1faf8; }.salary-attendance-cell.status-paid_off { background: #edf3ff; }.salary-attendance-cell.status-quarter_day_off, .salary-attendance-cell.status-third_day_off, .salary-attendance-cell.status-half_day_off, .salary-attendance-cell.status-three_quarter_day_off { background: #fff8e8; }.salary-attendance-cell.status-absent { background: #fff0f0; }.salary-attendance-cell.status-leave { background: #e8f7f4; }.salary-attendance-grid .is-sunday { box-shadow: inset 0 3px 0 #d6deeb; }.salary-attendance-cell.is-today { border-right-color: #6dcbbd; border-left: 1px solid #6dcbbd; }

/* Setup */
.setup-body { min-height: 100vh; padding: 38px 20px 70px; background: #eef3f4; }
.setup-shell { width: min(780px, 100%); margin: 0 auto; }.setup-header { display: flex; align-items: center; gap: 15px; margin-bottom: 25px; }.setup-header h1 { margin: 0; font-size: 25px; }.setup-header p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }
.setup-form { display: grid; gap: 15px; }.setup-section { padding: 22px; }.setup-step { display: flex; gap: 12px; margin-bottom: 18px; }.setup-step > b { display: grid; width: 31px; height: 31px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: var(--teal-soft); color: var(--teal-dark); }.setup-step h2 { margin: 0; font-size: 15px; }.setup-step p { margin: 2px 0 0; color: var(--muted); font-size: 9px; }
.setup-success { padding: 50px; text-align: center; }.success-check { display: grid; width: 64px; height: 64px; margin: 0 auto 18px; place-items: center; border-radius: 50%; background: var(--teal-soft); color: var(--teal); font-size: 30px; }.setup-success h2 { margin-bottom: 8px; }.setup-success p { max-width: 500px; margin: 0 auto 24px; color: var(--ink-soft); }.setup-success code { border-radius: 4px; padding: 2px 5px; background: #edf2f3; }

@media (min-width: 921px) {
    body.sidebar-is-collapsed .sidebar { width: 124px; padding-right: 12px; padding-left: 12px; }
    body.sidebar-is-collapsed .main-column { margin-left: 124px; }
    body.sidebar-is-collapsed .sidebar-top { justify-content: center; gap: 8px; padding-right: 0; padding-left: 0; }
    body.sidebar-is-collapsed .brand-lockup { gap: 0; }
    body.sidebar-is-collapsed .brand-copy, body.sidebar-is-collapsed .nav-label, body.sidebar-is-collapsed .nav-section-label, body.sidebar-is-collapsed .sidebar-insight, body.sidebar-is-collapsed .account-copy, body.sidebar-is-collapsed .logout-label { display: none; }
    body.sidebar-is-collapsed .main-nav { justify-items: stretch; }
    body.sidebar-is-collapsed .nav-item { justify-content: center; padding: 3px 7px; }
    body.sidebar-is-collapsed .nav-unread-badge { position: absolute; top: 4px; right: 8px; min-width: 17px; height: 17px; margin: 0; padding: 0 4px; }
    body.sidebar-is-collapsed .nav-item.is-active::after { right: -12px; }
    body.sidebar-is-collapsed .nav-icon { width: 24px; height: 24px; flex-basis: 24px; font-size: 7px; }
    body.sidebar-is-collapsed .nav-group-caret, body.sidebar-is-collapsed .nav-group-badge { display: none; }
    body.sidebar-is-collapsed .nav-subitems { margin-left: 0; border-left: 0; padding-left: 0; }
    body.sidebar-is-collapsed .nav-subitem { padding-top: 2px; padding-bottom: 2px; }
    body.sidebar-is-collapsed .nav-subitem .nav-icon { width: 21px; height: 21px; flex-basis: 21px; }
    body.sidebar-is-collapsed .sidebar-account { justify-content: center; gap: 7px; }
    body.sidebar-is-collapsed .account-link { flex: 0 0 auto; }
    body.sidebar-is-collapsed .sidebar-logout { min-width: 38px; height: 38px; padding: 4px; }
}

@media (max-width: 1200px) {
    .metric-grid { grid-template-columns: repeat(2, 1fr); }
    .dashboard-grid { grid-template-columns: minmax(0, 1fr); }
    .dashboard-side { grid-template-columns: repeat(2, 1fr); }
    .team-grid { grid-template-columns: repeat(2, 1fr); }
    .inline-close-form { grid-template-columns: 1fr 1fr; }
    .dashboard-header-controls { flex-direction: column; }
    .ticket-update-form { grid-template-columns: 1fr 1fr; }.ticket-update-form .grow { grid-column: 1 / -1; }
}

@media (max-width: 920px) {
    .sidebar { transform: translateX(-100%); transition: transform .2s ease; }.sidebar.is-open { transform: translateX(0); }.sidebar-close { display: block; }.sidebar-collapse { display: none; }
    .nav-scrim { position: fixed; z-index: 25; inset: 0; background: rgba(7,19,29,.55); }.nav-scrim.is-open { display: block; }
    .main-column { margin-left: 0; }.mobile-menu { display: block; }.topbar { padding: 12px 20px; }.global-attendance-strip { padding-right: 20px; padding-left: 20px; }.page-content { padding: 25px 20px 32px; }.app-footer { padding: 15px 20px; }
    .login-shell { grid-template-columns: 1fr; width: min(520px, 100%); }.login-brand-panel { display: none; }.login-form-panel { min-height: 620px; padding: 45px; }
    .content-with-form, .activity-workspace.is-history-collapsed, .followup-layout { grid-template-columns: 1fr; }.side-form-panel { order: 0; }.list-panel { order: 1; }.activity-history-toggle { display: none; }.activity-workspace.is-history-collapsed .activity-history-panel { padding: 20px; }.activity-workspace.is-history-collapsed .activity-history-panel .filter-header { align-items: center; flex-direction: row; }.activity-workspace.is-history-collapsed .activity-history-tools .inline-filter { display: grid; }.activity-workspace.is-history-collapsed .activity-row { display: flex; padding: 13px 4px; }.activity-workspace.is-history-collapsed .activity-row > .activity-type-icon { display: grid; }.activity-workspace.is-history-collapsed .activity-main small, .activity-workspace.is-history-collapsed .activity-main p, .activity-workspace.is-history-collapsed .activity-main .badge, .activity-workspace.is-history-collapsed .duration-cell { display: initial; }.activity-workspace.is-history-collapsed .duration-cell { display: grid; }.activity-workspace.is-history-collapsed .activity-main > span { display: flex; }.activity-workspace.is-history-collapsed .activity-title-link { display: inline; overflow: visible; white-space: normal; }.activity-workspace.is-history-collapsed .activity-main strong { font-size: 11px; }.activity-workspace.is-history-collapsed .activity-client-tag { display: inline-flex !important; width: max-content; max-width: 100%; }
    .category-panel { grid-template-columns: 1fr; }.category-chips { grid-column: 1; }
    .late-attendance-alert { grid-template-columns: 1fr; }
    .erp-client-list { grid-template-columns: 1fr; }.erp-client-summary { grid-template-columns: repeat(2, 1fr); }
    .daily-report-header { align-items: stretch; flex-direction: column; }.daily-report-filter { flex-wrap: wrap; }.daily-employee-report > summary { grid-template-columns: minmax(190px, .8fr) minmax(390px, 1.2fr); }
    .leave-layout { grid-template-columns: 1fr; }.leave-review-grid { grid-template-columns: 1fr; }.leave-owner-entry-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }.leave-owner-entry-form .leave-owner-reason { grid-column: 1 / -1; }
    .expense-page-intro { align-items: stretch; flex-direction: column; }.expense-summary { width: 100%; }.expense-summary > span { flex: 1; }
    .activity-history-panel .filter-header { align-items: stretch; flex-direction: column; }.activity-history-tools, .activity-history-filter { width: 100%; }.activity-history-filter { flex-wrap: wrap; }.activity-history-filter select, .activity-history-filter #employee-filter, .activity-history-filter #entry-filter, .activity-history-filter #layout-filter { min-width: 150px; flex: 1; }
    .salary-page-intro { align-items: stretch; }.salary-filters { flex-wrap: wrap; }.salary-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 680px) {
    .page-content { padding: 20px 13px 28px; }.topbar { min-height: 68px; padding: 10px 13px; }.topbar-actions { gap: 8px; }.live-clock, .topbar-link { display: none; }.global-attendance-strip { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 5px; padding: 6px 13px; }.attendance-strip-item { min-width: 0; justify-content: center; gap: 5px; padding: 5px; }.attendance-strip-item > b { width: 22px; height: 22px; }.attendance-strip-item > span { flex: 0 0 auto; }.attendance-strip-item small { display: none; }.attendance-strip-item strong { font-size: 13px; }.app-footer { padding: 13px; }
    .activity-history-filter { flex-direction: column; }.activity-history-filter select, .activity-history-filter #employee-filter, .activity-history-filter #entry-filter, .activity-history-filter #layout-filter { width: 100%; min-width: 0; }.activity-summary-table { min-width: 760px; }
    .welcome-row, .page-intro { align-items: stretch; flex-direction: column; }.welcome-row h2, .page-intro h2 { font-size: 22px; }.dashboard-header-controls, .auto-refresh-control, .shift-control { width: 100%; min-width: 0; }.dashboard-header-controls { flex-direction: column; }
    .metric-grid { grid-template-columns: 1fr 1fr; gap: 9px; }.metric-card { min-height: 118px; padding: 15px; }.metric-card > strong { font-size: 20px; }
    .dashboard-side { grid-template-columns: 1fr; }.dashboard-grid .panel { padding: 16px; }.bar-chart { gap: 4px; }.bar-track { width: 20px; }.productivity-chart-header { align-items: stretch; flex-direction: column; }.productivity-chart-actions { align-items: stretch; flex-direction: column; }.chart-view-toggle { width: 100%; }.chart-view-toggle button { flex: 1; }.productivity-legend { gap: 5px 9px; }.grouped-bar-chart { height: 200px; grid-template-columns: repeat(7, minmax(32px, 1fr)); gap: 3px; overflow-x: auto; }.grouped-bars { gap: 2px; padding-right: 0; padding-left: 0; }.grouped-bar { width: clamp(4px, 15%, 9px); }.grouped-bar-label small { display: none; }.productivity-pie-view { grid-template-columns: 1fr; gap: 18px; padding: 5px 0; }.productivity-pie { width: 160px; height: 160px; }.productivity-pie > span { width: 92px; height: 92px; }.chart-scale-note { text-align: left; }
    .quick-activity-form { align-items: stretch; flex-direction: column; }.quick-activity-form label { width: 100%; }.quick-client-lookup, .quick-client-lookup .client-lookup-result { width: 100%; max-width: none; }
    .form-grid { grid-template-columns: 1fr; }.span-2 { grid-column: auto; }
    .team-grid { grid-template-columns: 1fr; }.team-page-tools { width: 100%; justify-items: stretch; }.attendance-date-filter { align-items: stretch; }.attendance-date-filter label { flex: 1; }.team-summary { width: 100%; flex-wrap: wrap; }.team-summary > span { min-width: calc(50% - 4px); flex: 1; }.category-add-form, .reset-form { align-items: stretch; flex-direction: column; }.category-add-form .button, .reset-form .button { width: 100%; }.edit-member-form, .account-tool-row, .employee-document-upload, .employee-exit-form { grid-template-columns: 1fr; }.edit-member-form label:nth-of-type(1), .edit-member-form label:nth-of-type(2), .edit-member-submit { grid-column: 1; }.edit-member-submit .button, .employee-document-upload .button, .employee-exit-form .button { width: 100%; }.employee-document-row { grid-template-columns: 25px minmax(95px, .7fr) minmax(180px, 1.3fr) auto; min-width: 620px; }.employee-document-list { overflow-x: auto; }
    .late-attendance-list { grid-template-columns: 1fr; }
    .late-attendance-item { grid-template-columns: 1fr; }.late-attendance-item form, .late-attendance-item .button { width: 100%; }.attendance-override-row { align-items: stretch; flex-direction: column; }.attendance-override-row .button { width: 100%; }
    .attendance-compact > summary { flex-wrap: wrap; }.attendance-compact-title { flex: 1; }.attendance-counts { width: 100%; flex-basis: 100%; order: 3; }.attendance-expand-label { margin-left: auto; }.attendance-decision-form { width: 100%; }.activity-detail-meta { grid-template-columns: repeat(2, minmax(0, 1fr)); }.activity-detail-meta > span:nth-child(2n) { border-right: 0; }.activity-detail-meta > span { border-bottom: 1px solid var(--line); }.activity-detail-meta > span:nth-last-child(-n+2) { border-bottom: 0; }.activity-detail-notes { grid-template-columns: 1fr; }.activity-detail-client { align-items: stretch; flex-direction: column; }.activity-detail-client .button { width: 100%; }.timeline-time { min-width: 54px; }
    .page-intro-summary-group { width: 100%; }.page-intro-summary-group .summary-pill { flex: 1; }.manual-activity-entry > summary { align-items: stretch; flex-direction: column; }.manual-activity-entry > summary > .button { width: 100%; }.call-maintenance-actions { grid-template-columns: 1fr; }.call-maintenance-actions > details + details { border-left: 0; border-top: 1px solid var(--line); }.call-maintenance-actions > details[open] { grid-column: 1; }.activity-detail-meta > span:nth-last-child(-n+2) { border-bottom: 1px solid var(--line); }.activity-detail-meta > span:last-child { grid-column: 1 / -1; border-right: 0; border-bottom: 0; }
    .activity-classification-fields, .activity-software-fields, .quick-classification, .quick-classification .activity-software-fields { grid-template-columns: 1fr; }.activity-classification-fields:has(> .activity-hardware-fields:not([hidden])) { grid-template-columns: 1fr; }.activity-classification-fields > .activity-hardware-fields:not([hidden]) { display: grid; }.daily-report-header { padding: 14px; }.daily-report-filter { align-items: stretch; flex-direction: column; }.daily-report-filter label, .daily-report-filter select { width: 100%; min-width: 0; }.daily-report-totals { grid-template-columns: repeat(2, 1fr); }.daily-report-totals > span:nth-child(2n) { border-right: 0; }.daily-report-totals > span { border-bottom: 1px solid var(--line); }.daily-report-totals > span:last-child { grid-column: 1 / -1; border-bottom: 0; }.daily-employee-report > summary { grid-template-columns: 1fr; gap: 8px; padding: 11px 13px; }.daily-employee-metrics { grid-template-columns: repeat(5, minmax(45px, 1fr)); }.daily-expand-label { grid-column: 1 / -1; text-align: left; }.daily-employee-body { padding: 12px 13px; }.daily-breakdown-grid { grid-template-columns: 1fr; }.daily-timeline-row { grid-template-columns: 50px 8px minmax(0, 1fr); }.daily-timeline-row > .badge { grid-column: 3; }.daily-timeline-copy a { white-space: normal; }.employee-feed-group > summary { align-items: flex-start; }
    .two-column-grid { grid-template-columns: 1fr; }
    .running-banner { align-items: flex-start; flex-wrap: wrap; }.action-details { width: 100%; }.action-details summary { width: 100%; }.popover-form, .pause-workday-form { position: static; width: 100%; margin-top: 9px; }
    .activity-row { flex-wrap: wrap; }.duration-cell { margin-left: 49px; justify-items: start; }
    .record-content { gap: 8px; }.inline-close-form, .call-completion-form { grid-template-columns: 1fr; }.call-completion-form > *, .call-completion-form .grow, .call-completion-form .button { grid-column: 1; }.record-duration { min-width: 58px; }
    .client-search { width: 100%; }.client-owner-grid { grid-template-columns: 1fr; }.client-card-head { align-items: flex-start; flex-wrap: wrap; }.client-card-head .department-label { margin-left: 50px; }.client-work-actions small { width: 100%; margin-left: 0; }.chronological-log-header, .chronological-log-filter { align-items: stretch; flex-direction: column; }.chronological-log-filter input, .chronological-log-filter select { width: 100%; min-width: 0; }.chronological-log-summary { align-items: flex-start; flex-wrap: wrap; }.chronological-log-summary .inline-link { width: 100%; margin-left: 0; }.chronological-log-item { grid-template-columns: 50px 8px minmax(0, 1fr); }.chronological-log-duration { grid-column: 3; justify-items: start; }.ticket-main { flex-direction: column; gap: 8px; }.ticket-assignment { min-width: 0; justify-items: start; }.ticket-assignment strong { text-align: left; }.ticket-update-form { grid-template-columns: 1fr; }.ticket-update-form .grow { grid-column: 1; }.client-lookup-result { align-items: flex-start; flex-direction: column; }
    .lead-create-panel summary, .team-add-panel summary { padding: 13px; }.lead-create-panel summary .button, .team-add-panel summary .button { display: none; }.lead-form, .team-form { padding: 13px; }
    .followup-row { grid-template-columns: 27px 1fr; }.followup-when { grid-column: 2; grid-row: 2; text-align: left; }.followup-row > form { grid-column: 2; }.followup-row.is-overdue { margin-left: -20px; }
    .login-body { padding: 0; }.login-shell { min-height: 100vh; border-radius: 0; }.login-form-panel { min-height: 100vh; padding: 35px 25px; }
    .setup-body { padding: 25px 13px 50px; }.setup-section { padding: 17px; }
    .team-comms { top: 76px; right: 10px; }.team-comms-panel { width: calc(100vw - 20px); height: min(590px, calc(100vh - 86px)); }
    .late-attendance-actions, .attendance-override-actions { display: grid; width: 100%; }.late-attendance-actions form, .late-attendance-actions .button, .attendance-override-actions form, .attendance-override-actions .button { width: 100%; }
    .erp-module-options, .erp-module-picker.compact .erp-module-options { grid-template-columns: 1fr; }.erp-client-create > details > summary .button { display: none; }.erp-client-meta { grid-template-columns: repeat(2, 1fr); }.erp-client-meta span:nth-child(2) { border-right: 0; }.erp-client-summary { width: 100%; }
    .leave-summary { width: 100%; justify-content: stretch; }.leave-summary > span { min-width: 0; flex: 1; }.leave-record-head { align-items: stretch; flex-direction: column; }.leave-review-person { flex-wrap: wrap; }.leave-review-person .leave-code { width: 100%; margin-left: 43px; }.leave-decision-form > div { display: grid; grid-template-columns: 1fr; }.leave-decision-table article { grid-template-columns: 1fr 1fr; gap: 7px; }.leave-decision-table article > span:nth-child(3), .leave-decision-table article > span:nth-child(4) { justify-self: start; }.leave-calendar-header { align-items: stretch; flex-direction: column; }.leave-calendar-controls { width: 100%; }.leave-calendar-controls form { min-width: 0; flex: 1; }.leave-calendar-controls input[type="month"] { min-width: 0; flex: 1; }.leave-calendar-legend { align-items: flex-start; flex-wrap: wrap; }.leave-calendar-legend small { width: 100%; margin-left: 0; }.leave-owner-entry-form { grid-template-columns: 1fr; }.leave-owner-entry-form .leave-owner-reason { grid-column: 1; }.leave-owner-entry-form .form-actions, .leave-owner-entry-form .button { width: 100%; }
    .expense-entry-panel, .expense-monthly-panel, .expense-breakdown-panel, .expense-register-panel { padding: 14px; }.expense-summary { flex-direction: column; }.expense-summary > span { width: 100%; }.expense-entry-form .form-actions { align-items: stretch; flex-direction: column; }.expense-entry-form .form-actions .button { width: 100%; }.expense-month-grid { grid-template-columns: 1fr 1fr; }.expense-breakdown-list { overflow-x: auto; }.expense-breakdown-grand-total { min-width: 760px; }
    .salary-filters { align-items: stretch; flex-direction: column; }.salary-filters label, .salary-filters input, .salary-filters select, .salary-filters .button { width: 100%; }.salary-summary { grid-template-columns: 1fr 1fr; }.salary-summary .is-net { grid-column: 1 / -1; }.salary-register-header, .salary-attendance-panel .panel-header { align-items: stretch; flex-direction: column; }.salary-register-header form, .salary-register-header .button { width: 100%; }.salary-month-nav { width: 100%; }.salary-month-nav .button { flex: 1; }.salary-attendance-grid .salary-employee-column { width: 135px; min-width: 135px; }
}

@media (max-width: 420px) {
    .metric-grid { grid-template-columns: 1fr; }.metric-card { min-height: 105px; }.shift-control { align-items: stretch; flex-direction: column; }.shift-control .button { width: 100%; }.shift-actions { align-items: stretch; flex-direction: column; }.shift-actions form { width: 100%; }.expense-month-grid { grid-template-columns: 1fr; }
}

/* Owned entry corrections, contextual communication and multi-product clients */
.work-token-actions { display: inline-flex; min-width: 0; align-items: center; gap: 6px; }
.entry-edit-link { display: inline-grid !important; width: 20px; height: 20px; flex: 0 0 20px; place-items: center; border: 1px solid #c9d9e5; border-radius: 6px; background: #f4f8fb; color: var(--blue) !important; font-size: 11px !important; line-height: 1; text-decoration: none !important; }
.entry-edit-link:hover { border-color: var(--blue); background: var(--blue-soft); }
.ticket-chat-button { display: inline-grid; width: 24px; height: 24px; flex: 0 0 24px; place-items: center; border: 1px solid #ebbd54; border-radius: 8px; background: #fff1bd; color: #9a6810; font-size: 0; cursor: pointer; transition: transform .16s ease, box-shadow .16s ease, background .16s ease; }
.ticket-chat-button::before, .ticket-chat-button::after { content: none; }
.ticket-chat-button svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.ticket-chat-button:hover { background: #ffe58d; box-shadow: 0 0 0 3px rgba(211,154,37,.15); transform: translateY(-1px); }
.activity-meta-line { display: flex; align-items: center; gap: 7px; min-width: 0; }
.activity-meta-line > small { min-width: 0; }
.force-signout-form { margin-top: 4px; }
.force-signout-form button { border: 0; padding: 0; background: transparent; color: #c84f4f; font: inherit; font-size: 7px; font-weight: 800; text-decoration: underline; cursor: pointer; }
.overtime-table-value { color: #b96022; font-weight: 800; }
.finished-attendance-form { width: 126px; margin: 0; }
.finished-attendance-form select { width: 100%; height: 29px; min-height: 29px; border-color: #b9d4d0; border-radius: 8px; padding: 4px 24px 4px 7px; background-color: #f2faf8; color: var(--teal-dark); font-size: 7px; font-weight: 850; }
.finished-attendance-form.is-quarter-day-leave select, .finished-attendance-form.is-third-day-leave select, .finished-attendance-form.is-half-day-leave select, .finished-attendance-form.is-leave select { border-color: #ebcf92; background-color: #fff8e8; color: #986516; }
.finished-attendance-form.is-absent select { border-color: #efb6b6; background-color: #fff1f1; color: var(--danger); }
.finished-attendance-time { display: block; margin-top: 3px; color: var(--muted); font-size: 7px; }
.attendance-table-status.is-partial-leave { color: #986516; }
.attendance-table-status.is-absent { color: var(--danger); }

.activity-full-history { margin-top: 10px; border: 1px solid #cfe0dd; border-radius: 12px; padding: 12px; background: #fbfdfd; }
.activity-full-history .panel-header { margin-bottom: 8px; }
.activity-full-history h4 { margin: 2px 0; font-size: 12px; }
.activity-full-history .panel-header small { color: var(--muted); font-size: 8px; }
.activity-history-search { display: block; margin-bottom: 9px; }
.activity-history-search input { width: 100%; min-height: 34px; }
.activity-history-timeline { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.activity-history-timeline > li { position: relative; display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; padding: 0 0 10px; }
.activity-history-timeline > li:not(:last-child)::before { content: ''; position: absolute; left: 7px; top: 15px; bottom: -1px; width: 1px; background: #cbdedb; }
.activity-history-dot { position: relative; z-index: 1; width: 15px; height: 15px; border: 3px solid #dcecea; border-radius: 999px; background: #28a993; }
.activity-history-dot.is-message { border-color: #ffe7a8; background: #d79a25; }
.activity-history-dot.is-followup, .activity-history-dot.is-forwarded { border-color: #dfe8fb; background: #4f7fd3; }
.activity-history-dot.is-completed { border-color: #dff0e7; background: #3b9a63; }
.activity-history-timeline article { min-width: 0; border: 1px solid var(--line); border-radius: 10px; padding: 9px; background: #fff; }
.activity-history-timeline header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.activity-history-timeline header > span { display: grid; gap: 2px; }
.activity-history-timeline header strong { color: var(--ink); font-size: 9px; }
.activity-history-timeline header small, .activity-history-timeline time { color: var(--muted); font-size: 7px; }
.activity-history-timeline p { margin: 6px 0 0; color: var(--ink-soft); font-size: 8px; line-height: 1.5; white-space: normal; overflow-wrap: anywhere; }
.activity-history-empty { border: 1px dashed var(--line); border-radius: 10px; padding: 14px; color: var(--muted); text-align: center; }
.manual-entered-time { color: #9b6817 !important; font-weight: 750; }
.daily-party-name { overflow: hidden; margin-top: 2px; color: var(--ink) !important; font-size: 8px; font-weight: 900; text-overflow: ellipsis; white-space: nowrap; }
.daily-timeline-row > time .ticket-chat-button { margin: 6px 0 0 auto; }
.activity-edit-details { margin-top: 10px; scroll-margin-top: 16px; }
.activity-edit-form { margin-top: 10px; border-radius: 11px; padding: 13px; background: #f8fafb; }
.client-product-label { display: inline-flex; width: fit-content; margin-top: 4px; border-radius: 999px; padding: 3px 7px; background: var(--blue-soft); color: var(--blue); font-size: 7px; }
.team-comms-context { display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 1px solid #c9d9ed; border-radius: 8px; padding: 7px 9px; background: var(--blue-soft); color: var(--blue); font-size: 8px; }
.team-comms-context[hidden] { display: none; }
.team-comms-context strong { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 7px; overflow-wrap: anywhere; }
.team-comms-context button { border: 0; background: transparent; color: var(--blue); font-size: 14px; cursor: pointer; }
.team-message-context { width: fit-content; margin: 2px 0; border-radius: 5px; padding: 3px 5px; background: rgba(46,113,181,.1); color: var(--blue) !important; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 6px; font-weight: 850; overflow-wrap: anywhere; }
.team-comms-compose { position: relative; display: block; }
.team-comms-compose textarea { width: 100%; padding-right: 40px; }
.comms-mic-button { position: absolute; right: 7px; bottom: 7px; display: grid; width: 28px; height: 28px; place-items: center; border: 1px solid var(--line); border-radius: 50%; background: #fff; font-size: 12px; cursor: pointer; }
.comms-mic-button.is-listening { border-color: var(--danger); background: #fff0f0; animation: comms-mic-pulse 1s infinite; }
@keyframes comms-mic-pulse { 50% { box-shadow: 0 0 0 5px rgba(205,66,66,.15); } }
.profile-mobile-grid { margin-top: 14px; }
.profile-request-list, .profile-approval-list { display: grid; gap: 9px; }
.profile-request-list > article { display: grid; gap: 4px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; }
.profile-request-list > article > strong { font-size: 9px; }
.profile-request-list small, .profile-approval-list small { color: var(--muted); font-size: 7px; }
.profile-request-list p, .profile-approval-list p { margin: 2px 0; color: var(--ink-soft); font-size: 8px; line-height: 1.45; }
.profile-approval-panel, .profile-password-panel { margin-top: 14px; }
.profile-approval-list > article { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .65fr); gap: 16px; border-top: 1px solid var(--line); padding: 12px 0; }
.profile-review-form { display: grid; gap: 7px; }
.profile-review-form > span { display: flex; gap: 7px; }
.profile-password-form { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 760px) { .daily-party-name { white-space: normal; }.profile-approval-list > article, .profile-password-form { grid-template-columns: 1fr; } }

/* Ticket conversation portal */
.nav-unread-badge { display: inline-grid; min-width: 18px; height: 18px; margin-left: auto; place-items: center; border-radius: 999px; padding: 0 5px; background: var(--danger); color: #fff; font-size: 8px; font-weight: 900; }
.nav-unread-badge[hidden] { display: none; }

/* v35 owner-private leave approvals, ticket register/lifecycle and send-message icon */
.ticket-register-panel { min-width: 0; overflow: hidden; }
.ticket-register { width: 100%; overflow-x: auto; border-top: 1px solid var(--line); }
.ticket-register-head, .ticket-register-row { display: grid; grid-template-columns: minmax(145px, 1.05fr) minmax(150px, 1.1fr) minmax(145px, 1fr) minmax(90px, .7fr) minmax(105px, .72fr) minmax(155px, 1.15fr); min-width: 870px; gap: 12px; align-items: center; }
.ticket-register-head { padding: 9px 10px; background: #f5f8f9; color: var(--muted); font-size: 7px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase; }
.ticket-register-row { border-bottom: 1px solid var(--line); border-left: 3px solid transparent; padding: 12px 10px; background: #fff; }
.ticket-register-row:last-child { border-bottom: 0; }
.ticket-register-row.priority-border-low { border-left-color: #aebac3; }.ticket-register-row.priority-border-normal { border-left-color: var(--blue); }.ticket-register-row.priority-border-high { border-left-color: var(--amber); }.ticket-register-row.priority-border-urgent { border-left-color: var(--danger); }
.ticket-register-row > span { display: grid; min-width: 0; gap: 4px; align-content: center; }
.ticket-register-row strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.ticket-register-row small { overflow: hidden; color: var(--muted); font-size: 7px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.ticket-number-link { color: var(--blue); font-size: 8px; font-weight: 900; overflow-wrap: anywhere; }
.ticket-register-row .badge { width: max-content; }
.ticket-duration { font-variant-numeric: tabular-nums; }
.ticket-closure-preview { max-width: 100%; }
.ticket-register-row .inline-link { width: max-content; font-size: 7px; }
.ticket-detail-panel { margin-top: 18px; scroll-margin-top: 18px; }
.ticket-detail-header h3 { overflow-wrap: anywhere; }
.ticket-detail-facts { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.ticket-detail-facts > span { display: grid; min-width: 0; gap: 3px; border: 1px solid var(--line); border-radius: 10px; padding: 10px; background: #f9fbfb; }
.ticket-detail-facts small, .ticket-detail-copy small { color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.ticket-detail-facts strong { overflow-wrap: anywhere; font-size: 9px; }
.ticket-detail-copy { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 18px; }
.ticket-detail-copy > div { border: 1px solid var(--line); border-radius: 11px; padding: 12px; }
.ticket-detail-copy p { margin: 5px 0 0; color: var(--ink-soft); font-size: 9px; line-height: 1.5; }
.ticket-lifecycle { border-top: 1px solid var(--line); padding-top: 14px; }
.ticket-lifecycle ol { position: relative; display: grid; gap: 0; margin: 0; padding: 0 0 0 19px; list-style: none; }
.ticket-lifecycle ol::before { content: ''; position: absolute; top: 8px; bottom: 8px; left: 6px; width: 2px; background: #d8e5e6; }
.ticket-lifecycle li { position: relative; padding: 0 0 14px 14px; }
.ticket-event-dot { position: absolute; top: 6px; left: -18px; width: 10px; height: 10px; border: 2px solid #fff; border-radius: 50%; background: var(--teal); box-shadow: 0 0 0 2px #d5efea; }
.ticket-lifecycle li article { border: 1px solid var(--line); border-radius: 10px; padding: 11px; background: #fbfcfc; }
.ticket-lifecycle li article > div { display: flex; justify-content: space-between; gap: 12px; }
.ticket-lifecycle li strong { font-size: 9px; }.ticket-lifecycle li time, .ticket-lifecycle li small { color: var(--muted); font-size: 7px; }
.ticket-lifecycle li p { margin: 5px 0 0; color: var(--ink-soft); font-size: 8px; line-height: 1.45; }
.ticket-detail-update { margin-top: 3px; }
.ticket-update-form .span-all { grid-column: 1 / -1; }

@media (max-width: 1180px) {
    .ticket-detail-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .ticket-detail-facts { grid-template-columns: 1fr 1fr; }
    .ticket-detail-copy { grid-template-columns: 1fr; }
    .ticket-lifecycle li article > div { align-items: flex-start; flex-direction: column; gap: 3px; }
    .ticket-update-form .span-all { grid-column: 1; }
}

/* v47 compact licensing toolbar, numbered rows and unfiltered monthly application breakdown */
.licensing-hero { display: grid; grid-template-columns: minmax(185px, .35fr) minmax(0, 1.65fr); align-items: end; gap: 16px; margin-bottom: 12px; }
.licensing-filter-home { min-width: 0; }
.licensing-hero h2 { margin: 4px 0 6px; font-size: 27px; letter-spacing: -.035em; }
.licensing-hero p { max-width: 620px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.55; }
.licensing-filters { display: grid; min-width: 0; grid-template-columns: minmax(118px, .72fr) minmax(130px, 1fr) minmax(130px, 1fr) minmax(98px, auto); align-items: end; gap: 6px; border: 1px solid var(--line); border-radius: 11px; padding: 7px; background: #fff; box-shadow: var(--shadow-soft); }
.licensing-filters label { display: grid; min-width: 0; gap: 2px; color: var(--ink-soft); font-size: 7px; font-weight: 800; }
.licensing-filters input, .licensing-filters select { width: 100%; min-width: 0; height: 29px; min-height: 29px; border-radius: 7px; padding: 3px 7px; font-size: 8px; }
.licensing-filters .button { min-width: 98px; min-height: 29px; height: 29px; border-radius: 7px; padding: 4px 8px; font-size: 8px; white-space: nowrap; }
.licensing-connection-panel { display: flex; min-height: 170px; align-items: flex-start; gap: 15px; border-color: #ecd6ac; padding: 22px; background: #fffaf0; }
.licensing-connection-panel h3 { margin: 4px 0 7px; font-size: 17px; }
.licensing-connection-panel p { max-width: 850px; margin: 0 0 7px; color: #735a32; font-size: 10px; line-height: 1.55; }
.licensing-connection-panel .muted { color: #9a7d50; }
.licensing-summary-grid { display: grid; grid-template-columns: minmax(155px, .7fr) minmax(155px, .7fr) minmax(320px, 1.6fr); gap: 10px; margin-bottom: 12px; }
.licensing-summary-grid .metric-card { min-height: 108px; padding: 16px 18px; }
.licensing-summary-grid .metric-card > span { display: block; margin-bottom: 15px; color: var(--ink-soft); font-size: 8px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.licensing-summary-grid .metric-card.is-positive > strong { color: var(--teal-dark); }
.licensing-summary-grid .metric-card.is-warm > strong { color: #a56b18; }
.licensing-application-card { overflow: visible; }
.licensing-application-card > span { margin-bottom: 8px !important; }
.licensing-app-breakdown { display: flex; min-width: 0; flex-wrap: wrap; gap: 5px; margin-bottom: 7px; }
.licensing-app-breakdown > :is(span, a) { display: grid; min-width: 76px; flex: 1 1 76px; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1px 5px; border: 1px solid #eadbbd; border-radius: 8px; padding: 5px 7px; background: #fffaf0; color: inherit; text-decoration: none; }
.licensing-app-breakdown > a { cursor: pointer; transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease; }
.licensing-app-breakdown > a:hover, .licensing-app-breakdown > a:focus-visible { border-color: #75cbbb; background: #eefaf7; box-shadow: 0 6px 15px rgba(23, 115, 102, .12); outline: 0; transform: translateY(-1px); }
.licensing-app-breakdown > a.is-selected { border-color: #23a58e; background: #e7f8f4; box-shadow: inset 0 -3px 0 #159783; }
.licensing-app-breakdown b { overflow: hidden; color: #75521d; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.licensing-app-breakdown strong { grid-column: 2; grid-row: 1 / span 2; color: #a56b18; font-size: 15px; line-height: 1; }
.licensing-app-breakdown small { color: #a18558; font-size: 6px; }
.licensing-app-empty { color: var(--muted); font-size: 8px; }
.licensing-topbar-filter-slot, .licensing-topbar-product-slot { display: none; }
.licensing-topbar.has-docked-licensing-controls .topbar-title { flex: 0 0 175px; }
.licensing-topbar.has-docked-licensing-controls .licensing-topbar-filter-slot { display: block; min-width: 500px; flex: 1 1 auto; }
.licensing-topbar-filter-slot .licensing-filters { width: 100%; border: 0; border-radius: 0; padding: 0; background: transparent; box-shadow: none; }
.licensing-topbar-product-slot { position: absolute; z-index: 19; top: 100%; right: 24px; left: 24px; }
.licensing-topbar.has-docked-licensing-controls .licensing-topbar-product-slot { display: block; }
.licensing-topbar-product-slot .licensing-application-card { display: grid; min-height: 0; grid-template-columns: max-content minmax(0, 1fr); align-items: center; gap: 10px; border: 1px solid #dfcfaa; border-radius: 0 0 12px 12px; padding: 6px 9px; background: rgba(255, 252, 243, .97); box-shadow: 0 10px 24px rgba(19, 52, 72, .14); backdrop-filter: blur(12px); }
.licensing-topbar-product-slot .licensing-application-card > span { margin: 0 !important; white-space: nowrap; }
.licensing-topbar-product-slot .licensing-app-breakdown { flex-wrap: nowrap; gap: 5px; margin: 0; }
.licensing-topbar-product-slot .licensing-app-breakdown > a { min-width: 94px; padding-top: 3px; padding-bottom: 3px; }
.licensing-topbar-product-slot .licensing-application-card > small { display: none; }
.licensing-register { min-width: 0; margin-bottom: 16px; overflow: visible; padding: 0; }
.licensing-panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; border-bottom: 1px solid var(--line); padding: 16px 18px; }
.licensing-panel-heading h3 { margin: 3px 0 0; font-size: 16px; }
.result-count { flex: 0 0 auto; border-radius: 999px; padding: 6px 9px; background: var(--teal-soft); color: var(--teal-dark); font-size: 8px; font-weight: 850; }
.table-scroll { max-width: 100%; overflow-x: auto; }
.licensing-table { min-width: 920px; }
.licensing-table th:first-child, .licensing-table td:first-child { padding-left: 18px; }
.licensing-table th:last-child, .licensing-table td:last-child { padding-right: 18px; }
.licensing-table td { padding-top: 7px; padding-bottom: 7px; vertical-align: middle; line-height: 1.25; }
.licensing-table .serial-column { width: 34px; padding-right: 4px; color: #87949e; text-align: right; font-variant-numeric: tabular-nums; }
.licensing-table td > small, .licensing-table td > span + small { display: block; margin-top: 3px; color: var(--muted); font-size: 7px; }
.licensing-client-line { display: flex; max-width: 310px; min-width: 0; align-items: baseline; gap: 4px; white-space: nowrap; }
.licensing-client-line strong { overflow: hidden; color: var(--ink); font-size: 9px; text-overflow: ellipsis; }
.licensing-client-line small { flex: 0 1 auto; overflow: hidden; color: var(--muted); font-size: 7px; text-overflow: ellipsis; }
.licensing-client-name { display: block; max-width: 260px; overflow: hidden; color: var(--ink); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.licensing-remarks { max-width: 310px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.licensing-record-details { position: relative; }
.licensing-record-details > summary { list-style: none; color: var(--teal-dark); font-size: 8px; font-weight: 850; cursor: pointer; }
.licensing-record-details > summary::-webkit-details-marker { display: none; }
.licensing-record-details[open] > summary { color: var(--teal-dark); }
.licensing-record-details dl { position: absolute; z-index: 6; top: 23px; right: 0; display: grid; width: min(560px, 74vw); max-height: 380px; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; overflow: auto; border: 1px solid var(--line); border-radius: 12px; padding: 10px; background: #fff; box-shadow: 0 20px 45px rgba(19,52,72,.18); white-space: normal; }
.licensing-record-details dl > div { min-width: 0; border-bottom: 1px solid #edf1f3; padding: 8px; }
.licensing-record-details dt { margin-bottom: 3px; color: var(--muted); font-size: 7px; font-weight: 800; text-transform: uppercase; }
.licensing-record-details dd { margin: 0; overflow-wrap: anywhere; color: var(--ink); font-size: 9px; }
.licensing-table .time-remaining-column { width: 94px; white-space: nowrap; }
.license-time-remaining { display: inline-flex; border-radius: 999px; padding: 4px 7px; background: var(--teal-soft); color: var(--teal-dark); font-size: 7px; font-weight: 850; }
.license-time-remaining.is-soon, .license-time-remaining.is-due { background: #fff0cf; color: #916018; }
.license-time-remaining.is-expired { background: #fde8e8; color: var(--danger); }
.license-time-remaining.is-unknown { background: #eef2f4; color: var(--muted); }
.licensing-table .record-column { width: 48px; white-space: nowrap; }
.licensing-table .amc-column { width: 55px; white-space: nowrap; }
.licensing-amc-details { position: relative; }
.licensing-icon-action { position: relative; display: inline-grid !important; width: 30px; height: 30px; place-items: center; list-style: none; border: 1px solid #bcd8d3; border-radius: 8px; padding: 0 !important; background: #f0faf8; color: var(--teal-dark); cursor: pointer; transition: border-color .15s ease, background .15s ease, transform .15s ease; }
.licensing-icon-action svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.licensing-icon-action:hover { border-color: #7dcabc; background: #dcf5f0; transform: translateY(-1px); }
.licensing-icon-action.is-amc { border-color: #dcc37d; background: #fff7df; color: #7d5918; }
.licensing-icon-action.is-amc:hover { border-color: #bc9429; background: #ffeaa9; }
.licensing-amc-details > summary::-webkit-details-marker { display: none; }
.licensing-icon-count { position: absolute; top: -6px; right: -7px; display: grid; min-width: 16px; height: 16px; place-items: center; border: 2px solid #fff; border-radius: 50%; padding: 0 3px; background: #e0b844; color: #60440e; font-size: 6px; line-height: 1; }
.licensing-record-details[open] > .licensing-icon-action { border-color: #52b6a5; background: #d9f3ee; }
.licensing-amc-details[open] > summary { border-color: #b9942d; background: #ffeaa9; }
.licensing-amc-popover { position: absolute; z-index: 8; top: 31px; right: 0; width: min(720px, 80vw); max-height: 480px; overflow: auto; border: 1px solid var(--line); border-radius: 13px; padding: 11px; background: #fff; box-shadow: 0 22px 52px rgba(19,52,72,.22); white-space: normal; }
.licensing-amc-popover > header { position: sticky; z-index: 1; top: -11px; display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: -11px -11px 10px; border-bottom: 1px solid var(--line); padding: 11px 13px; background: #f9fbfb; }
.licensing-amc-popover > header div { display: grid; min-width: 0; gap: 2px; }
.licensing-amc-popover > header strong { overflow: hidden; color: var(--ink); font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.licensing-amc-popover > header small { overflow: hidden; color: var(--muted); font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.licensing-amc-popover > header > span { flex: 0 0 auto; border-radius: 999px; padding: 4px 7px; background: var(--amber-soft); color: #7d5918; font-size: 7px; font-weight: 850; }
.licensing-amc-empty { margin: 0; padding: 17px; color: var(--muted); font-size: 9px; text-align: center; }
.licensing-amc-table-wrap { overflow: auto; border: 1px solid var(--line); border-radius: 10px; }
.licensing-amc-table { width: 100%; min-width: 620px; border-collapse: collapse; table-layout: fixed; }
.licensing-amc-table th { position: sticky; z-index: 1; top: 0; border-bottom: 1px solid var(--line); padding: 7px 8px; background: #fffaf0; color: #79551a; font-size: 7px; font-weight: 850; text-align: left; text-transform: uppercase; }
.licensing-amc-table td { border-bottom: 1px solid #edf1f3; padding: 8px; color: var(--ink-soft); font-size: 8px; line-height: 1.35; vertical-align: top; }
.licensing-amc-table tbody tr:last-child td { border-bottom: 0; }
.licensing-amc-table th:first-child, .licensing-amc-table td:first-child { width: 42px; color: var(--muted); text-align: right; }
.licensing-amc-table th:nth-child(2), .licensing-amc-table td:nth-child(2) { width: 92px; }
.licensing-amc-table th:nth-child(3), .licensing-amc-table td:nth-child(3) { width: 96px; }
.licensing-amc-table th:nth-child(4), .licensing-amc-table td:nth-child(4) { width: 64px; }
.licensing-amc-table th:nth-child(5), .licensing-amc-table td:nth-child(5) { width: 82px; }
.licensing-amc-table td strong { color: var(--ink); font-weight: 850; }
.licensing-amc-days { color: var(--teal-dark) !important; font-weight: 850; white-space: nowrap; }
.licensing-amc-amount { color: #79551a !important; font-weight: 850; white-space: nowrap; }
.licensing-amc-remarks { overflow-wrap: anywhere; }

@media (max-width: 1050px) {
    .licensing-hero { grid-template-columns: 1fr; align-items: stretch; }
}

@media (max-width: 900px) {
    .licensing-summary-grid { grid-template-columns: 1fr 1fr; }
    .licensing-application-card { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
    .licensing-hero h2 { font-size: 23px; }
    .licensing-filters { grid-template-columns: 1fr; }
    .licensing-filters .button { width: 100%; }
    .licensing-summary-grid { grid-template-columns: 1fr; }
    .licensing-summary-grid .metric-card { min-height: 90px; }
    .licensing-record-details dl { position: fixed; top: 82px; right: 12px; left: 12px; width: auto; max-height: calc(100vh - 105px); }
    .licensing-amc-popover { position: fixed; top: 82px; right: 12px; left: 12px; width: auto; max-height: calc(100vh - 105px); }
    .licensing-amc-table { min-width: 580px; }
}
.team-comms-header small a { color: #7fe0cf; font-weight: 800; text-decoration: underline; }
.activity-detail-actions { display: flex; align-items: center; gap: 10px; }
.message-portal { display: grid; min-height: 610px; grid-template-columns: minmax(250px, .72fr) minmax(420px, 1.55fr); gap: 14px; }
.message-conversation-list, .message-thread-panel { min-width: 0; padding: 0; overflow: hidden; }
.message-conversation-list > .panel-header, .message-thread-header { margin: 0; border-bottom: 1px solid var(--line); padding: 15px 17px; }
.message-staff-inbox { border-bottom: 1px solid var(--line); padding: 8px 7px; background: #fbfdfd; }.message-staff-inbox-heading, .message-ticket-list-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 4px 7px 6px; }.message-staff-inbox-heading strong, .message-ticket-list-heading strong { color: var(--ink); font-size: 8px; }.message-staff-inbox-heading small, .message-ticket-list-heading small { color: var(--muted); font-size: 6px; }.message-staff-inbox-list { display: grid; max-height: 222px; gap: 3px; overflow-y: auto; }.message-staff-inbox-item { display: grid; width: 100%; grid-template-columns: 29px minmax(0, 1fr) auto; align-items: center; gap: 7px; border: 1px solid transparent; border-radius: 9px; padding: 6px 7px; background: transparent; color: var(--ink); text-align: left; text-decoration: none; cursor: pointer; }.message-staff-inbox-item:hover, .message-staff-inbox-item.is-active { border-color: #9dd6cc; background: var(--teal-soft); }.message-staff-inbox-item.is-active { box-shadow: inset 3px 0 var(--teal); }.message-staff-inbox-item.has-unread { border-color: #b9e1d9; background: #f0faf8; }.message-staff-inbox-item > span:nth-child(2) { display: grid; min-width: 0; gap: 1px; }.message-staff-inbox-item strong, .message-staff-inbox-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.message-staff-inbox-item strong { font-size: 8px; }.message-staff-inbox-item small { color: var(--muted); font-size: 6px; }.message-staff-unread-count { display: inline-grid; min-width: 19px; height: 19px; place-items: center; border-radius: 999px; padding: 0 5px; background: #20a36f; color: #fff; font-size: 7px; font-weight: 900; }.message-staff-unread-count[hidden] { display: none; }.message-ticket-list-heading { border-bottom: 1px solid var(--line); padding: 7px 14px; }
.message-live-note { display: flex; align-items: center; gap: 5px; color: var(--teal-dark); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.message-live-note i { width: 7px; height: 7px; border-radius: 50%; background: #3bd0ad; box-shadow: 0 0 0 4px rgba(59,208,173,.13); }
.message-conversation-items { max-height: 650px; overflow-y: auto; padding: 7px; }
.message-conversation-item { position: relative; display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 9px; border: 1px solid transparent; border-radius: 11px; padding: 10px; }
.message-conversation-item:hover { background: #f5f8f9; }
.message-conversation-item.is-active { border-color: #badfd8; background: var(--teal-soft); }
.message-conversation-item > span:nth-child(2) { display: grid; min-width: 0; gap: 2px; }
.message-conversation-item strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.message-conversation-item .work-token { overflow: hidden; color: var(--blue); font-size: 6px; text-overflow: ellipsis; white-space: nowrap; }
.message-conversation-item p { overflow: hidden; margin: 2px 0 0; color: var(--ink-soft); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.message-conversation-item time { color: var(--muted); font-size: 6px; }
.message-unread-count { display: inline-grid; min-width: 20px; height: 20px; place-items: center; border-radius: 999px; padding: 0 5px; background: var(--danger); color: #fff; font-size: 8px; }
.message-thread-panel { display: flex; min-height: 610px; flex-direction: column; }
.message-thread-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.message-thread-header h3 { margin-bottom: 4px; overflow-wrap: anywhere; }
.message-staff-thread-header small { color: var(--muted); font-size: 8px; }
.message-context-token { display: inline-flex; color: var(--blue); font-size: 7px; overflow-wrap: anywhere; }
.message-thread { display: flex; min-height: 280px; flex: 1; flex-direction: column; gap: 9px; overflow-y: auto; padding: 17px; background: #f4f7f8; }
.message-thread-start, .message-thread-empty { display: grid; margin: auto; justify-items: center; max-width: 420px; color: var(--muted); text-align: center; }
.message-thread-start strong, .message-thread-empty h3 { color: var(--ink); }
.message-thread-start p, .message-thread-empty p { margin: 4px 0; font-size: 9px; }
.message-portal.is-empty-thread { min-height: 0; }
.message-portal.is-empty-thread .message-thread-panel { min-height: 0; }
.message-portal.is-empty-thread .message-thread { min-height: 0; flex: 0 0 auto; padding: 9px 16px; }
.message-portal.is-empty-thread .message-thread-start { display: flex; width: 100%; max-width: none; align-items: baseline; justify-content: flex-start; gap: 7px; margin: 0; text-align: left; }
.message-portal.is-empty-thread .message-thread-start strong { flex: 0 0 auto; font-size: 9px; }
.message-portal.is-empty-thread .message-thread-start p { overflow: hidden; margin: 0; font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.portal-message { display: grid; align-self: flex-start; max-width: min(78%, 560px); border: 1px solid var(--line); border-radius: 12px 12px 12px 3px; padding: 10px 12px; background: #fff; box-shadow: var(--shadow-soft); }
.portal-message.is-sent { align-self: flex-end; border-color: #bfe3dc; border-radius: 12px 12px 3px 12px; background: var(--teal-soft); }
.portal-message small { color: var(--teal-dark); font-size: 7px; font-weight: 800; }
.portal-message p { margin: 3px 0; font-size: 10px; line-height: 1.55; overflow-wrap: anywhere; white-space: pre-wrap; }
.portal-message time { color: var(--muted); font-size: 6px; text-align: right; }
.message-reply-form { display: grid; gap: 9px; border-top: 1px solid var(--line); padding: 13px 16px; }
.message-reply-form label { gap: 5px; }
.message-reply-form > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.message-reply-form > div small { color: var(--muted); font-size: 7px; }
.message-reply-buttons { display: flex; align-items: center; justify-content: flex-end; gap: 7px; }
.message-attachment-button { display: grid; width: 38px; height: 38px; flex: 0 0 38px; place-items: center; border: 1px solid var(--line); border-radius: 10px; background: #fff; color: var(--teal-dark); cursor: pointer; }
.message-attachment-button:hover, .message-attachment-button:focus-within { border-color: #9ecfc6; background: var(--teal-soft); }
.message-attachment-button svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.9; }

/* v38 private chat attachments: safe image previews and forced downloads for every other file type */
.message-attachments { display: grid; gap: 7px; margin: 5px 0 4px; }
.message-attachment { display: flex; min-width: 0; align-items: center; gap: 9px; border: 1px solid rgba(29,74,111,.16); border-radius: 10px; padding: 7px; background: rgba(255,255,255,.78); color: var(--ink); text-decoration: none; }
.message-attachment:hover { border-color: #9ecfc6; background: #fff; }
.message-attachment img { width: 112px; height: 78px; flex: 0 0 auto; border-radius: 7px; object-fit: cover; background: #e8eff1; }
.message-attachment > b { display: grid; width: 42px; height: 42px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: #f9df9d; color: #775014; font-size: 9px; letter-spacing: .06em; }
.message-attachment.is-file > b { overflow: hidden; padding: 3px; font-size: 7px; text-align: center; text-overflow: ellipsis; }
.message-attachment > span { display: grid; min-width: 0; gap: 2px; }
.message-attachment strong { overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.message-attachment small { color: var(--muted) !important; font-size: 7px !important; }
.message-attachments.is-compact { gap: 5px; }
.message-attachments.is-compact .message-attachment { gap: 6px; padding: 5px; }
.message-attachments.is-compact .message-attachment img { width: 52px; height: 42px; }
.message-attachments.is-compact .message-attachment > b { width: 34px; height: 34px; font-size: 7px; }
.message-attachments.is-compact .message-attachment strong { max-width: 150px; font-size: 7px; }
.message-attachments.is-compact .message-attachment small { font-size: 6px !important; }
.message-file-picker, .team-comms-file-picker { display: grid; gap: 4px; border: 1px dashed #b9d7d2; border-radius: 10px; padding: 9px 10px; background: #f7fbfa; color: var(--ink-soft); }
.message-file-picker > span, .team-comms-file-picker { font-weight: 800; }
.message-file-picker input[type="file"], .team-comms-file-picker input[type="file"] { width: 100%; min-width: 0; border: 0; padding: 2px 0; background: transparent; color: var(--ink-soft); font-size: 8px; }
.message-file-picker small, .team-comms-file-picker small { color: var(--muted); font-size: 7px; font-weight: 500; }
.message-compose { position: relative; display: block; }
.message-compose textarea { min-height: 76px; padding-right: 46px; }
.message-compose .comms-mic-button { bottom: 9px; }

@media (max-width: 900px) {
    .message-portal { grid-template-columns: 1fr; }
    .message-conversation-items { max-height: 310px; }
    .message-thread-panel { min-height: 560px; }
}

@media (max-width: 620px) {
    .activity-detail-actions, .message-thread-header { align-items: stretch; flex-direction: column; }
    .message-thread-header .button { width: 100%; }
    .message-reply-actions > small { display: none; }
    .message-reply-buttons { width: 100%; }
    .message-reply-buttons .button { min-width: 0; flex: 1; }
    .portal-message { max-width: 91%; }
}

/* v31 compact header and collapsible activity workspace */
.topbar { min-height: 68px; gap: 13px; padding-top: 9px; padding-bottom: 9px; }
.topbar-title { min-width: 175px; flex: 1; }
.global-attendance-strip { display: flex; min-height: 0; flex: 0 1 auto; align-items: center; justify-content: center; gap: 5px; border: 0; padding: 0; background: transparent; }
.attendance-strip-item { min-width: 76px; gap: 6px; border: 0; border-radius: 9px; padding: 3px 5px; background: transparent; }
.attendance-strip-item > b { width: 27px; height: 27px; border-radius: 8px; }
.attendance-strip-item > span { display: grid; flex: 0 1 auto; justify-content: start; gap: 1px; }
.attendance-strip-item strong { grid-row: 1; font-size: 14px; }
.attendance-strip-item small { grid-row: 2; max-width: 76px; font-size: 6px; line-height: 1.05; }
.page-content { min-height: calc(100vh - 68px); }

.manual-summary-pill { position: relative; grid-template-columns: 1fr auto; column-gap: 10px; align-items: center; }
.manual-summary-pill > span { grid-column: 1; }
.manual-summary-pill > strong { grid-column: 1; }
.manual-summary-pill > a { display: inline-flex; grid-column: 2; grid-row: 1 / span 2; align-items: center; gap: 4px; border-radius: 8px; padding: 5px 7px; background: #fff1c9; color: #91601e; font-size: 8px; font-weight: 850; }
.manual-summary-pill > a b { display: grid; width: 18px; height: 18px; place-items: center; border-radius: 6px; background: #e5bd59; color: #fff; font-size: 14px; line-height: 1; }

.activity-quick-actions { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin: -7px 0 14px; }
.activity-quick-actions > a { display: grid; min-width: 0; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 9px; border: 1px solid var(--line); border-radius: 11px; padding: 9px 11px; background: #fff; color: var(--ink); box-shadow: var(--shadow-soft); }
.activity-quick-actions > a:hover { border-color: #a9dcd3; background: #f6fcfb; transform: translateY(-1px); }
.activity-quick-actions > a > span:nth-child(2) { display: grid; min-width: 0; }
.activity-quick-actions strong { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.activity-quick-actions small { overflow: hidden; color: var(--muted); font-size: 7px; text-overflow: ellipsis; white-space: nowrap; }
.activity-quick-actions > a > b { color: var(--muted); font-size: 12px; }
.activity-quick-icon { display: grid; width: 33px; height: 33px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: var(--teal-soft); color: var(--teal-dark); font-size: 13px; font-weight: 900; }
.activity-quick-icon.is-list { background: var(--blue-soft); color: var(--blue); }
.activity-quick-icon.is-log { background: var(--amber-soft); color: #9a651c; }
.activity-quick-icon.is-team { background: var(--violet-soft); color: var(--violet); }

.activity-collapsible-section { margin-bottom: 10px; overflow: hidden; padding: 0; scroll-margin-top: 82px; }
.activity-collapsible-section:not([open]) { display: none; }
.activity-collapsible-section > summary, .manual-quick-entry > summary { list-style: none; }
.activity-collapsible-section > summary::-webkit-details-marker, .manual-quick-entry > summary::-webkit-details-marker { display: none; }
.activity-section-summary { display: grid; min-height: 54px; grid-template-columns: 35px minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 13px; cursor: pointer; }
.activity-section-summary:hover { background: #f8fbfb; }
.activity-section-summary > span:nth-child(2) { display: grid; min-width: 0; }
.activity-section-summary > span:nth-child(2) strong { color: var(--ink); font-size: 10px; }
.activity-section-summary > span:nth-child(2) small { color: var(--muted); font-size: 7px; }
.activity-section-summary > b { display: flex; align-items: center; gap: 6px; color: var(--teal-dark); font-size: 8px; }
.activity-collapsible-section .when-open, .manual-quick-entry .when-open { display: none; }
.activity-collapsible-section[open] > summary .when-open, .manual-quick-entry[open] > summary .when-open { display: inline; }
.activity-collapsible-section[open] > summary .when-closed, .manual-quick-entry[open] > summary .when-closed { display: none; }
.activity-collapsible-section[open] > summary > b { color: var(--muted); }
.activity-collapsible-section[open] > summary > b:last-child { transform: none; }
.activity-section-body { border-top: 1px solid var(--line); }
.activity-collapsible-stack { display: grid; gap: 0; }
.activity-form-body { padding: 0 18px 18px; }
.activity-form-body .panel-header { padding-top: 16px; }
.activity-form-body > .stack-form { max-width: 760px; }
.activity-history-panel .activity-section-body { padding: 0 18px 8px; }
.activity-history-panel .filter-header { padding-top: 14px; }
.chronological-work-log > .activity-section-body, .daily-team-report > .activity-section-body { border-top: 1px solid var(--line); }
.manual-quick-entry:not([open]) { display: none; }
.manual-quick-entry[open] { margin-bottom: 10px; scroll-margin-top: 82px; }
.manual-quick-entry > summary { min-height: 48px; padding: 8px 13px; }

@media (max-width: 1180px) {
    .attendance-strip-item { min-width: 42px; }
    .attendance-strip-item small { display: none; }
    .attendance-strip-item > span { display: block; }
    .activity-quick-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 920px) {
    .topbar { gap: 8px; padding: 9px 20px; }
    .topbar-title { min-width: 145px; }
    .global-attendance-strip { padding: 0; }
    .attendance-strip-item { min-width: 35px; gap: 3px; padding: 2px; }
    .attendance-strip-item > b { width: 23px; height: 23px; }
    .attendance-strip-item strong { font-size: 12px; }
}

@media (max-width: 680px) {
    .topbar { min-height: 62px; flex-wrap: nowrap; padding: 8px 13px; }
    .topbar-title { min-width: 0; }
    .topbar-context { display: none; }
    .topbar h1 { font-size: 14px; }
    .global-attendance-strip { display: flex; width: auto; grid-template-columns: none; gap: 2px; padding: 0; }
    .attendance-strip-item { min-width: 31px; justify-content: center; gap: 2px; padding: 1px; }
    .attendance-strip-item > b { display: grid; width: 15px; height: 15px; border-radius: 5px; font-size: 6px; }
    .attendance-strip-item > span { display: block; }
    .attendance-strip-item strong { font-size: 9px; }
    .topbar-actions { gap: 5px; }
    .activity-quick-actions { grid-template-columns: 1fr 1fr; gap: 7px; }
    .activity-quick-actions > a { grid-template-columns: 29px minmax(0, 1fr); padding: 8px; }
    .activity-quick-actions > a > b { display: none; }
    .activity-quick-icon { width: 29px; height: 29px; }
    .activity-section-summary { grid-template-columns: 31px minmax(0, 1fr) auto; padding: 8px 10px; }
    .activity-section-summary > b span { display: none !important; }
    .activity-form-body, .activity-history-panel .activity-section-body { padding-right: 12px; padding-left: 12px; }
}

/* v34 compact dashboard alerts, precise durations and message action */
.dashboard-compact-alerts { display: grid; grid-template-columns: 1.1fr 1fr 1fr; overflow: hidden; margin-bottom: 14px; border: 1px solid var(--line); border-radius: 13px; background: #fff; box-shadow: var(--shadow-soft); }
.dashboard-attendance-summary { display: contents; }
.dashboard-attendance-summary > summary { grid-column: 1; grid-row: 1; list-style: none; cursor: pointer; }
.dashboard-attendance-summary > summary::-webkit-details-marker { display: none; }
.dashboard-compact-alert { display: flex; min-width: 0; min-height: 64px; align-items: center; gap: 10px; border-right: 1px solid var(--line); padding: 9px 13px; color: var(--ink); }
.dashboard-compact-alert:last-child { border-right: 0; }
.dashboard-compact-alert.is-manual, .dashboard-compact-alert.is-followup { background: #fffaf0; color: #714f1b; }
.dashboard-compact-alert.is-manual { grid-column: 2; grid-row: 1; }
.dashboard-compact-alert.is-followup { grid-column: 3; grid-row: 1; }
.dashboard-compact-alert:hover { background: #f7fbfa; }
.dashboard-compact-alert.is-manual:hover, .dashboard-compact-alert.is-followup:hover { background: #fff5df; }
.dashboard-compact-icon { display: grid; width: 30px; height: 30px; flex: 0 0 auto; place-items: center; border-radius: 9px; background: var(--teal-soft); color: var(--teal-dark); font-size: 7px; font-weight: 900; }
.is-manual .dashboard-compact-icon, .is-followup .dashboard-compact-icon { background: #f8e4bf; color: #8a5d1c; }
.dashboard-compact-copy { display: grid; min-width: 0; flex: 1; gap: 2px; }
.dashboard-compact-copy > strong { overflow: hidden; font-size: 10px; text-overflow: ellipsis; white-space: nowrap; }
.dashboard-compact-copy > small { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.is-manual .dashboard-compact-copy > small, .is-followup .dashboard-compact-copy > small { color: #9b7b49; }
.dashboard-review-link { width: fit-content; color: var(--teal-dark); font-size: 8px; font-weight: 850; white-space: nowrap; }
.is-manual .dashboard-review-link, .is-followup .dashboard-review-link { color: #80561b; text-decoration: underline; text-underline-offset: 2px; }
.dashboard-attendance-summary .when-open { display: none; }
.dashboard-attendance-summary[open] .when-open { display: inline; }
.dashboard-attendance-summary[open] .when-closed { display: none; }
.dashboard-attendance-body { grid-column: 1 / -1; grid-row: 2; padding: 8px; }
.followup-row { grid-template-columns: 29px minmax(0, 1fr) 118px 82px auto; }
.followup-source-duration { display: grid; min-width: 108px; justify-items: end; gap: 2px; text-align: right; }
.followup-source-duration span { color: var(--muted); font-size: 7px; font-weight: 750; text-transform: uppercase; }
.followup-source-duration strong { color: var(--teal-dark); font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; white-space: nowrap; }
.duration-cell strong, .chronological-log-duration strong, .timeline-time strong { font-variant-numeric: tabular-nums; white-space: nowrap; }
.activity-detail-chat-button { display: grid; width: 32px; height: 32px; flex: 0 0 32px; place-items: center; border: 1px solid #e1b94d; border-radius: 10px; background: #ffd86f; color: #5f4813; box-shadow: 0 4px 12px rgba(167,119,24,.14); }
.activity-detail-chat-button svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.activity-detail-chat-button:hover { border-color: #d2a526; background: #ffcc45; transform: translateY(-1px); }

@media (max-width: 760px) {
    .dashboard-compact-alerts { grid-template-columns: 1fr; }
    .dashboard-attendance-summary > summary, .dashboard-compact-alert.is-manual, .dashboard-compact-alert.is-followup { grid-column: 1; }
    .dashboard-attendance-summary > summary { grid-row: 1; }
    .dashboard-compact-alert.is-manual { grid-row: 2; }
    .dashboard-compact-alert.is-followup { grid-row: 3; }
    .dashboard-attendance-body { grid-column: 1; grid-row: 4; }
    .dashboard-compact-alert { border-right: 0; border-bottom: 1px solid var(--line); }
    .followup-row { grid-template-columns: 27px minmax(0, 1fr); }
    .followup-source-duration { grid-column: 2; grid-row: 2; justify-items: start; text-align: left; }
    .followup-when { grid-column: 2; grid-row: 3; text-align: left; }
    .followup-row > form { grid-column: 2; grid-row: 4; }
    .activity-detail-actions { align-items: flex-end; }
    .lead-editor-header { align-items: flex-start; }.lead-editor-layout { grid-template-columns: 1fr; }.lead-editor .lead-form { border-right: 0; border-bottom: 1px solid var(--line); }.lead-history { max-height: none; }
}

/* v76 leave reasons and Sunday-excluding duration totals */
.leave-day-total { color: var(--teal-dark); font-size: 7px; font-weight: 800; }
.leave-decision-table article { grid-template-columns: minmax(145px, .9fr) minmax(155px, .85fr) minmax(190px, 1.25fr) auto minmax(125px, .65fr); }
.leave-decision-dates, .leave-decision-reason { gap: 3px; }
.leave-decision-dates b { font-size: 8px; }
.leave-decision-dates small { color: var(--teal-dark); font-weight: 800; }
.leave-decision-reason b { display: -webkit-box; overflow: hidden; color: var(--ink-soft); font-size: 8px; font-weight: 650; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

@media (max-width: 620px) {
    .leave-decision-table article { grid-template-columns: 1fr 1fr; }
    .leave-decision-table .leave-decision-reason { grid-column: 1 / -1; }
    .leave-decision-table article > span:nth-child(4), .leave-decision-table article > span:nth-child(5) { justify-self: start; }
}

/* v77 private employee attendance and dashboard status */
.my-attendance-today { display: flex; min-width: 0; align-items: center; gap: 11px; margin: -5px 0 14px; border: 1px solid var(--line); border-radius: 13px; padding: 10px 13px; background: #fff; box-shadow: var(--shadow-soft); }
.my-attendance-today:hover { border-color: #a9d9d1; transform: translateY(-1px); }
.my-attendance-today-icon, .my-attendance-current-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border-radius: 10px; background: #edf2f4; color: var(--muted); font-size: 8px; font-weight: 900; }
.my-attendance-today-copy { display: grid; min-width: 0; flex: 1; gap: 1px; }
.my-attendance-today-copy small { color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }
.my-attendance-today-copy strong { color: var(--ink); font-size: 12px; }
.my-attendance-today-copy span { overflow: hidden; color: var(--ink-soft); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.my-attendance-today > b { color: var(--teal-dark); font-size: 8px; white-space: nowrap; }
.my-attendance-today.status-present, .my-attendance-current.status-present { border-color: #bfe3dc; background: #f5fbfa; }.my-attendance-today.status-present .my-attendance-today-icon, .my-attendance-current.status-present .my-attendance-current-icon { background: var(--teal-soft); color: var(--teal-dark); }
.my-attendance-today.status-leave, .my-attendance-current.status-leave { border-color: #ead19b; background: #fffaf0; }.my-attendance-today.status-leave .my-attendance-today-icon, .my-attendance-current.status-leave .my-attendance-current-icon { background: var(--amber-soft); color: #8b5c18; }
.my-attendance-today.status-partial, .my-attendance-current.status-partial { border-color: #ecd4a4; background: #fffaf3; }.my-attendance-today.status-partial .my-attendance-today-icon, .my-attendance-current.status-partial .my-attendance-current-icon { background: var(--amber-soft); color: #8b5c18; }
.my-attendance-today.status-absent, .my-attendance-current.status-absent { border-color: #efc6c6; background: #fff6f6; }.my-attendance-today.status-absent .my-attendance-today-icon, .my-attendance-current.status-absent .my-attendance-current-icon { background: var(--danger-soft); color: var(--danger); }
.my-attendance-intro { align-items: end; margin-bottom: 14px; }
.my-attendance-month-form { display: flex; align-items: end; gap: 7px; }.my-attendance-month-form label { display: grid; gap: 3px; color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }.my-attendance-month-form input { width: 150px; height: 32px; padding: 4px 8px; font-size: 8px; }
.my-attendance-current { display: flex; align-items: center; gap: 11px; margin-bottom: 12px; border: 1px solid var(--line); border-radius: 13px; padding: 12px 14px; background: #fff; box-shadow: var(--shadow-soft); }.my-attendance-current > span:nth-child(2) { display: grid; gap: 2px; }.my-attendance-current small { color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }.my-attendance-current strong { font-size: 14px; }.my-attendance-current b { color: var(--ink-soft); font-size: 8px; font-weight: 650; }
.my-attendance-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 9px; margin-bottom: 14px; }.my-attendance-summary > span { display: grid; gap: 3px; border: 1px solid var(--line); border-radius: 11px; padding: 9px 12px; background: #fff; }.my-attendance-summary small { color: var(--muted); font-size: 7px; font-weight: 850; text-transform: uppercase; }.my-attendance-summary strong { color: var(--ink); font-size: 16px; }.my-attendance-summary .status-present strong { color: var(--teal-dark); }.my-attendance-summary .status-partial strong { color: #986516; }.my-attendance-summary .status-leave strong { color: #a06a17; }.my-attendance-summary .status-absent strong { color: var(--danger); }
.my-attendance-calendar-panel, .my-leave-status-panel { margin-bottom: 18px; overflow: hidden; padding: 0; }.my-attendance-calendar-header, .my-leave-status-panel > .panel-header { margin: 0; padding: 15px 17px; }.my-attendance-calendar-header p, .my-leave-status-panel .panel-header p { margin: 3px 0 0; color: var(--muted); font-size: 8px; }
.my-attendance-legend { display: flex; flex-wrap: wrap; gap: 6px; border-top: 1px solid var(--line); padding: 8px 17px; }.my-attendance-legend span { border-radius: 999px; padding: 4px 7px; background: #eef2f4; color: var(--muted); font-size: 7px; font-weight: 850; }.my-attendance-legend .status-present { background: var(--teal-soft); color: var(--teal-dark); }.my-attendance-legend .status-partial, .my-attendance-legend .status-pending { background: var(--amber-soft); color: #8c601c; }.my-attendance-legend .status-leave { background: #fff0d1; color: #936018; }.my-attendance-legend .status-absent { background: var(--danger-soft); color: var(--danger); }
.my-attendance-calendar-scroll { overflow-x: auto; }.my-attendance-calendar-grid { display: grid; min-width: 805px; grid-template-columns: repeat(7, minmax(110px, 1fr)); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.my-attendance-weekday { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 6px; background: #f5f8f9; color: var(--muted); font-size: 7px; font-weight: 850; text-align: center; text-transform: uppercase; }
.my-attendance-day { display: grid; min-height: 91px; align-content: start; gap: 4px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 7px; background: #fff; }.my-attendance-day.is-empty { background: #f8fafb; }.my-attendance-day.is-sunday { background: #fafafa; }.my-attendance-day.is-today { box-shadow: inset 0 0 0 2px var(--teal); }.my-attendance-day time { display: flex; align-items: baseline; justify-content: space-between; }.my-attendance-day time strong { color: var(--ink); font-size: 10px; }.my-attendance-day time small { color: var(--muted); font-size: 6px; }.my-attendance-day > b { font-size: 8px; }.my-attendance-day > small { color: var(--muted); font-size: 6px; }.my-attendance-day > em { display: -webkit-box; overflow: hidden; color: var(--ink-soft); font-size: 6px; font-style: normal; line-height: 1.3; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.my-attendance-day.status-present > b { color: var(--teal-dark); }.my-attendance-day.status-partial > b, .my-attendance-day.status-pending > b, .my-attendance-day.status-leave > b { color: #966017; }.my-attendance-day.status-absent > b { color: var(--danger); }.my-attendance-day.status-present { background: #f6fbfa; }.my-attendance-day.status-partial, .my-attendance-day.status-pending { background: #fffaf1; }.my-attendance-day.status-leave { background: #fff8e9; }.my-attendance-day.status-absent { background: #fff6f6; }
.my-leave-status-list { display: grid; border-top: 1px solid var(--line); }.my-leave-status-list article { display: grid; grid-template-columns: minmax(165px, 1fr) 90px minmax(220px, 1.4fr) auto minmax(145px, .8fr); align-items: center; gap: 11px; border-bottom: 1px solid var(--line); padding: 10px 17px; }.my-leave-status-list article:last-child { border-bottom: 0; }.my-leave-status-list article > span { display: grid; min-width: 0; gap: 2px; }.my-leave-status-list strong, .my-leave-status-list b { color: var(--ink); font-size: 8px; }.my-leave-status-list small { color: var(--muted); font-size: 7px; }.my-leave-reason b { display: -webkit-box; overflow: hidden; color: var(--ink-soft); font-weight: 650; line-height: 1.35; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }

@media (max-width: 760px) {
    .manual-new-client-fields { grid-template-columns: 1fr; }.manual-new-client-fields .span-2 { grid-column: 1; }
    .my-attendance-today { align-items: flex-start; flex-wrap: wrap; }.my-attendance-today-copy { min-width: calc(100% - 50px); }.my-attendance-today-copy span { white-space: normal; }.my-attendance-today > b { margin-left: 45px; }
    .my-attendance-intro, .my-attendance-calendar-header { align-items: stretch; flex-direction: column; }.my-attendance-month-form, .my-attendance-month-form label, .my-attendance-month-form input, .my-attendance-month-form .button { width: 100%; }.my-attendance-summary { grid-template-columns: 1fr 1fr; }.my-attendance-calendar-header .salary-month-nav { width: 100%; }.my-attendance-calendar-header .salary-month-nav .button { flex: 1; }.my-leave-status-list article { grid-template-columns: 1fr 1fr; }.my-leave-status-list .my-leave-reason { grid-column: 1 / -1; }.my-leave-status-list article > span:nth-child(4), .my-leave-status-list article > span:nth-child(5) { justify-self: start; }
}