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

:root { --ink:#23263b; --muted:#7d8495; --line:#e7eaf0; --canvas:#f6f8fb; --card:#fff; --pink:#fa7386; --pink-soft:#fff1f3; --green:#45b9a1; --green-soft:#e9faf5; --amber:#e9a84b; --amber-soft:#fff6e8; --violet:#8a7bea; --violet-soft:#f0edff; --blue:#6c9cf1; --shadow:0 12px 40px rgba(36,43,66,.06); }
* { box-sizing:border-box; }
html,body,#app { margin:0; min-height:100%; }
body { background:var(--canvas); color:var(--ink); font:14px 'DM Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
button,input,select,textarea { font:inherit; }
button { color:inherit; cursor:pointer; }
button,input,select,textarea { outline-color:var(--pink); }
.app-shell { min-height:100vh; display:flex; }
.auth-page { min-height:100vh; display:grid; place-items:center; padding:24px; background:radial-gradient(circle at 15% 10%, #fff1f3 0, transparent 32%), radial-gradient(circle at 85% 80%, #e9faf5 0, transparent 28%), var(--canvas); }
.auth-card { width:min(440px,100%); background:#fff; border:1px solid var(--line); border-radius:24px; padding:34px; box-shadow:0 24px 70px rgba(36,43,66,.12); }
.auth-brand { display:flex; align-items:center; gap:11px; margin-bottom:34px; font:800 22px Manrope,sans-serif; letter-spacing:-.8px; }.auth-brand span { color:var(--pink); }.auth-brand small { display:block; color:var(--muted); font:500 10px 'DM Sans',sans-serif; letter-spacing:1px; text-transform:uppercase; margin-top:2px; }
.auth-card h1 { margin:7px 0 9px; font:800 28px Manrope,sans-serif; letter-spacing:-.8px; }.auth-copy { color:var(--muted); line-height:1.6; margin:0 0 24px; }.auth-card form { display:grid; gap:16px; }.auth-card label { display:grid; gap:7px; color:#555d70; font-weight:700; font-size:12px; }.auth-card input { width:100%; border:1px solid var(--line); border-radius:10px; padding:12px 13px; color:var(--ink); background:#fbfcfd; }.auth-card input:focus { border-color:var(--pink); background:#fff; box-shadow:0 0 0 3px var(--pink-soft); }.auth-error { color:#a23d4c; background:#fff1f3; border:1px solid #ffd1d8; border-radius:10px; padding:11px 12px; margin:0 0 16px; line-height:1.45; }.auth-footnote { color:var(--muted); font-size:11px; line-height:1.5; margin:18px 0 0; text-align:center; }
.sidebar { width:248px; background:#fff; border-right:1px solid var(--line); padding:27px 16px 18px; display:flex; flex-direction:column; flex-shrink:0; }
.brand { display:flex; align-items:center; gap:11px; padding:0 12px 36px; font:800 22px Manrope,sans-serif; letter-spacing:-.8px; }
.brand span,.mobile-brand span { color:var(--pink); }
.brand-mark { width:36px; height:36px; display:grid; place-items:center; color:#fff; background:var(--ink); border-radius:12px; }
.brand-mark.large { width:52px; height:52px; border-radius:17px; }
.workspace-switcher { display:flex; align-items:center; gap:9px; width:100%; background:#f8f9fb; border:1px solid var(--line); border-radius:14px; padding:9px 10px; text-align:left; margin:0 0 28px; }
.workspace-switcher:hover { border-color:#ffc2cc; background:#fffafa; }
.workspace-switcher.locked { cursor:default; }
.workspace-avatar { width:30px; height:30px; border-radius:10px; background:var(--pink-soft); color:var(--pink); display:grid; place-items:center; font-size:10px; font-weight:800; flex:none; }
.workspace-switcher>div:nth-child(2) { min-width:0; flex:1; }
.workspace-switcher b,.workspace-switcher small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.workspace-switcher b { font-size:11px; }.workspace-switcher small { color:var(--muted); font-size:9px; margin-top:3px; }.workspace-switcher>svg { color:#a1a8b5; flex:none; }
.workspace-copy { min-width:0; flex:1; display:flex; flex-direction:column; gap:2px; }
.workspace-copy b { font-size:12px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.workspace-copy small { color:var(--muted); font-size:10px; }
.side-nav { display:flex; flex-direction:column; gap:3px; }
.nav-label { color:#a4a9b5; text-transform:uppercase; font-size:9px; font-weight:700; letter-spacing:1.2px; padding:10px 13px 6px; }
.side-link,.nav-item { border:0; background:transparent; display:flex; align-items:center; gap:12px; color:#818898; padding:11px 13px; border-radius:10px; text-decoration:none; font-weight:600; font-size:13px; width:100%; text-align:left; }
.side-link:hover,.nav-item:hover,.side-link.active,.nav-item.active { color:var(--ink); background:var(--pink-soft); }
.side-link.active svg,.nav-item.active svg { color:var(--pink); }
.sidebar-bottom { margin-top:auto; }
.profile { border-top:1px solid var(--line); margin:14px 4px 0; padding:17px 8px 0; display:flex; align-items:center; gap:9px; }
.profile { width:calc(100% - 8px); border-left:0; border-right:0; border-bottom:0; background:transparent; text-align:left; }
.profile:hover { background:#f8f9fb; border-radius:10px; }
.profile b,.profile small { display:block; font-size:11px; }
.profile small { color:var(--muted); margin-top:3px; font-size:10px; }
.profile svg { margin-left:auto; color:#a4a9b5; }
.main { flex:1; min-width:0; }
.topbar { height:76px; background:#fff; border-bottom:1px solid var(--line); display:flex; align-items:center; justify-content:space-between; padding:0 40px; gap:20px; }
.global-search { width:min(420px,45vw); display:flex; align-items:center; gap:10px; background:#f7f8fa; border:1px solid transparent; border-radius:10px; padding:10px 13px; color:#9da4b1; }
.global-search:focus-within { border-color:#ffc2cc; background:#fff; box-shadow:0 0 0 3px var(--pink-soft); }
.global-search input { border:0; outline:0; background:transparent; min-width:0; flex:1; color:var(--ink); }
.global-search input::placeholder { color:#9da4b1; }
kbd { border:1px solid #dfe3e9; border-bottom-width:2px; padding:2px 5px; border-radius:5px; font-size:10px; color:#a0a6b2; background:#fff; }
.topbar-actions { display:flex; align-items:center; gap:17px; }
.logout-button { padding:8px 11px; font-size:11px; }
.icon-button { border:0; background:transparent; padding:7px; color:#8b92a1; display:grid; place-items:center; border-radius:9px; }
.icon-button:hover { background:#f4f5f8; color:var(--ink); }
.notification { position:relative; }
.notification i { position:absolute; top:5px; right:5px; background:var(--pink); width:5px; height:5px; border-radius:50%; border:1px solid #fff; }
.top-avatar,.avatar { width:32px; height:32px; border-radius:50%; background:var(--avatar,#ffd4dc); color:#fff; display:grid; place-items:center; font-size:11px; font-weight:700; flex:none; }
.top-avatar { background:var(--ink); font-size:10px; }
.mobile-brand { display:none; align-items:center; gap:8px; font:800 17px Manrope,sans-serif; }
.content { padding:34px 40px 65px; max-width:1480px; margin:auto; }
.page-header { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:28px; }
.page-header h1 { font:800 clamp(24px,3vw,32px) Manrope,sans-serif; letter-spacing:-1.1px; margin:0 0 5px; }
.page-header p { margin:0; color:var(--muted); }
.eyebrow { color:var(--pink); text-transform:uppercase; letter-spacing:1.3px; font-weight:700; font-size:10px; margin:0 0 7px; }
.button { border:0; display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:9px; padding:11px 15px; font-weight:700; font-size:12px; min-height:42px; }
.button-primary { color:#fff; background:var(--ink); box-shadow:0 8px 18px rgba(35,38,59,.12); }
.button-primary:hover { background:#30334c; transform:translateY(-1px); }
.button-secondary { color:#626a7b; background:#fff; border:1px solid var(--line); }
.button-secondary:hover { border-color:#c8ccd5; }
.button-danger { color:#b24b5a; background:#fff1f3; border:1px solid #ffd2d9; }
.button-danger:hover { background:#ffe5e9; }
.purchase-panel { margin-top:16px; }.purchase-list { display:grid; gap:0; }.purchase-row { display:flex; align-items:center; gap:10px; padding:11px 0; border-top:1px solid #eef0f3; }.purchase-row:first-child { border-top:0; }.purchase-row>span:nth-child(2) { flex:1; min-width:0; }.purchase-row b,.purchase-row small { display:block; }.purchase-row b { font-size:11px; }.purchase-row small { color:var(--muted); font-size:9px; margin-top:3px; }.purchase-status { border-radius:999px; padding:5px 8px; font-size:9px; font-weight:700; }.purchase-status.ordered { color:#a66d22; background:var(--amber-soft); }.purchase-status.received { color:#22836e; background:var(--green-soft); }
.purchase-draft { margin-top:18px; border:1px solid #eef0f3; border-radius:12px; padding:13px; }.purchase-draft-list { display:grid; gap:0; margin-top:8px; }.purchase-draft-row { display:flex; align-items:center; gap:10px; padding:9px 0; border-top:1px solid #f0f1f4; }.purchase-draft-row:first-child { border-top:0; }.purchase-draft-row>span { flex:1; min-width:0; }.purchase-draft-row b,.purchase-draft-row small { display:block; }.purchase-draft-row b { font-size:11px; }.purchase-draft-row small { color:var(--muted); font-size:9px; margin-top:3px; }.purchase-add-slot { grid-column:1 / -1; display:flex; align-items:center; gap:14px; padding-top:4px; }.purchase-add-slot .text-button { font-size:10px; }
.reference-suggestions { display:grid; gap:4px; margin-top:5px; }.reference-suggestions button { display:flex; align-items:center; justify-content:space-between; gap:10px; border:1px solid #eef0f3; background:#fff; border-radius:8px; padding:8px 10px; text-align:left; }.reference-suggestions button:hover { border-color:#ffc2cc; background:#fffafa; }.reference-suggestions b,.reference-suggestions small { display:block; }.reference-suggestions b { font-size:10px; }.reference-suggestions small { color:var(--muted); font-size:9px; }.stock-check { display:flex; align-items:center; gap:5px; margin-top:7px; padding:8px 9px; border-radius:8px; font-size:10px; }.stock-check.available { color:#22836e; background:var(--green-soft); }.stock-check.missing { color:#a66d22; background:var(--amber-soft); }.stock-check .text-button { margin-left:auto; font-size:10px; }.stock-helper { display:block; color:var(--muted); margin-top:6px; }.cutoff-note { display:flex; align-items:center; gap:6px; color:#a66d22; background:var(--amber-soft); padding:9px 11px; border-radius:9px; font-size:10px; margin-top:14px; }.cutoff-banner { display:flex; align-items:center; gap:10px; margin:0 0 16px; padding:12px 14px; background:#fff8e9; border:1px solid #f5dfad; border-radius:12px; }.cutoff-banner>span:nth-child(2) { flex:1; }.cutoff-banner b,.cutoff-banner small { display:block; }.cutoff-banner b { font-size:11px; color:#8d6423; }.cutoff-banner small { color:#aa8a52; font-size:9px; margin-top:3px; }.cutoff-icon { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; background:#f7e5b9; color:#a66d22; }.cutoff-banner .todo-action { white-space:nowrap; }
.agenda-toolbar { display:flex; align-items:center; gap:12px; margin-bottom:18px; }.agenda-summary { display:flex; align-items:baseline; gap:6px; padding:12px 16px; background:#fff; border:1px solid var(--line); border-radius:11px; }.agenda-summary b { font:800 20px Manrope,sans-serif; }.agenda-summary span { color:var(--muted); font-size:11px; }.agenda-toolbar .button { margin-left:auto; }.agenda-list { display:grid; gap:14px; }.agenda-day { background:#fff; border:1px solid var(--line); border-radius:13px; padding:15px 18px; }.agenda-day-head { display:flex; justify-content:space-between; color:var(--muted); font-size:11px; padding-bottom:10px; }.agenda-day-head b { color:var(--ink); }.agenda-row,.sale-row { display:flex; align-items:center; gap:13px; border-top:1px solid #eef0f3; padding:14px 0; }.agenda-time { width:58px; flex:none; }.agenda-time b,.agenda-time small,.agenda-main b,.agenda-main span,.agenda-main small,.sale-row b,.sale-row small { display:block; }.agenda-time b { font-size:13px; }.agenda-time small,.agenda-main small,.sale-row small { color:var(--muted); font-size:9px; margin-top:4px; }.agenda-main { flex:1; min-width:0; }.agenda-main b { font-size:12px; }.agenda-main span { color:#687082; font-size:10px; margin-top:3px; }.agenda-status { color:#27856e; background:var(--green-soft); border-radius:999px; padding:5px 8px; font-size:9px; font-weight:700; }.sales-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:16px; }.sales-summary>div { background:#fff; border:1px solid var(--line); border-radius:12px; padding:16px; }.sales-summary span,.sales-summary b { display:block; }.sales-summary span { color:var(--muted); font-size:10px; }.sales-summary b { font:800 22px Manrope,sans-serif; margin-top:8px; }.sale-row>span:nth-child(2) { flex:1; }.sale-row b { font-size:11px; }.sale-row strong { font-size:13px; }
.agenda-row { width:100%; border-left:0; border-right:0; border-bottom:0; background:#fff; text-align:left; color:inherit; }.agenda-row:hover { background:#fffafa; }.inspection-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; margin:14px 0; }.inspection-grid label { display:flex; align-items:center; gap:8px; padding:10px; border:1px solid var(--line); border-radius:9px; color:#687082; font-size:11px; }.inspection-grid input { accent-color:var(--pink); }.appointment-detail { display:grid; gap:12px; }.appointment-detail>div { padding:13px; border:1px solid #eef0f3; border-radius:10px; }.appointment-detail span,.appointment-detail b,.appointment-detail small { display:block; }.appointment-detail span { color:var(--muted); font-size:10px; }.appointment-detail b { font-size:13px; margin-top:5px; }.appointment-detail small { color:#687082; font-size:10px; margin-top:4px; }
.period-row,.toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px; margin:-8px 0 22px; }
.period-tabs { display:flex; gap:4px; background:#eef1f5; border-radius:9px; padding:3px; }
.period { border:0; background:transparent; padding:7px 13px; border-radius:7px; color:#88909f; font-size:11px; }
.period.active { background:#fff; color:var(--ink); box-shadow:0 1px 4px rgba(31,39,61,.08); font-weight:700; }
.date-button { border:1px solid var(--line); background:#fff; border-radius:8px; color:#6f7788; display:flex; align-items:center; gap:7px; padding:8px 10px; font-size:11px; }
.metric-grid { display:grid; grid-template-columns:1.25fr repeat(3,1fr); gap:14px; margin-bottom:18px; }
.metric-card,.panel,.list-card,.clients-highlight,.stock-summary,.finance-kpis>div,.stats-cards>div { background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); }
.metric-card { min-height:140px; padding:18px 19px; position:relative; overflow:hidden; }
.metric-card.metric-main { border-color:#ffd5db; background:linear-gradient(138deg,#fff 0%,#fff7f8 100%); }
.metric-top { display:flex; justify-content:space-between; align-items:center; color:#838b9b; font-size:11px; font-weight:600; }
.metric-icon { width:26px; height:26px; border-radius:8px; display:grid; place-items:center; background:var(--pink-soft); color:var(--pink); }
.metric-icon.green { color:var(--green); background:var(--green-soft); }.metric-icon.violet { color:var(--violet); background:var(--violet-soft); }.metric-icon.amber { color:var(--amber); background:var(--amber-soft); }
.metric-card strong { display:block; font:800 28px Manrope,sans-serif; margin:17px 0 5px; letter-spacing:-1px; }.metric-card p { margin:0; color:#9ba1ad; font-size:10px; }.up { color:var(--green); font-weight:700; }.warn { color:#d79136; font-weight:700; }.highlight { color:var(--pink); font-weight:700; }
.sparkline { position:absolute; left:20px; right:20px; bottom:0; height:31px; display:flex; align-items:flex-end; gap:4px; opacity:.5; }.sparkline i { display:block; flex:1; background:var(--pink); border-radius:4px 4px 0 0; }.sparkline i:nth-child(1){height:32%}.sparkline i:nth-child(2){height:45%}.sparkline i:nth-child(3){height:39%}.sparkline i:nth-child(4){height:70%}.sparkline i:nth-child(5){height:54%}.sparkline i:nth-child(6){height:80%}.sparkline i:nth-child(7){height:61%}.sparkline i:nth-child(8){height:75%}.sparkline i:nth-child(9){height:63%}.sparkline i:nth-child(10){height:90%}.sparkline i:nth-child(11){height:76%}.sparkline i:nth-child(12){height:100%}
.dashboard-grid { display:grid; grid-template-columns:1.55fr 1fr; gap:18px; margin-bottom:18px; }.dashboard-grid.lower { grid-template-columns:1.55fr 1fr; }
.panel,.list-card { padding:20px; }.panel-heading,.list-card-head { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:16px; }.panel-heading h2,.list-card-head h2 { font:800 14px Manrope,sans-serif; margin:0 0 5px; }.panel-heading p,.list-card-head p { margin:0; color:#9aa1ae; font-size:10px; }.text-button { border:0; background:transparent; color:var(--pink); display:inline-flex; gap:5px; align-items:center; font-size:11px; font-weight:700; padding:3px; white-space:nowrap; }.text-button.centered { display:flex; margin:14px auto 0; }
.repair-list { display:flex; flex-direction:column; }.repair-row { display:flex; align-items:center; gap:11px; width:100%; border:0; border-top:1px solid #f0f1f4; background:transparent; text-align:left; padding:12px 0; }.repair-row:first-child { border-top:0; }.repair-row:hover { background:#fcfcfd; }.repair-main { min-width:0; flex:1; }.repair-main b,.repair-main span { display:block; }.repair-main b { font-size:12px; margin-bottom:4px; }.repair-main span { font-size:10px; color:#9097a5; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.repair-main em { font-style:normal; color:#c8ccd2; margin:0 2px; }.repair-meta { min-width:130px; text-align:right; }.repair-meta small { display:block; color:#a5abb7; font-size:9px; margin-top:5px; }.status { display:inline-flex; align-items:center; gap:4px; border-radius:5px; padding:4px 6px; font-size:9px; font-weight:700; white-space:nowrap; }.status i,.doc-status i { width:5px; height:5px; border-radius:50%; background:currentColor; }.status-ready { color:var(--pink); background:var(--pink-soft); }.status-progress { color:var(--green); background:var(--green-soft); }.status-test { color:var(--amber); background:var(--amber-soft); }.status-wait { color:var(--violet); background:var(--violet-soft); }.status-diagnose { color:#7f8a9d; background:#f0f2f5; }.status-delivered { color:#748092; background:#eef1f4; }.row-price { min-width:60px; text-align:right; font-size:12px; }.repair-row>svg { color:#c3c8d1; }.avatar-small { width:30px; height:30px; }
.action-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }.action-grid button { position:relative; border:1px solid var(--line); background:#fff; border-radius:11px; text-align:left; padding:13px 12px; min-height:95px; }.action-grid button:hover { border-color:#ffc2cc; transform:translateY(-1px); }.action-grid b { display:block; font-size:11px; line-height:1.35; margin-top:10px; }.action-arrow { position:absolute; right:10px; bottom:12px; color:#adb3bf; }.action-icon,.choice-icon { width:33px; height:33px; display:grid; place-items:center; border-radius:10px; }.action-icon.pink,.choice-icon.pink { color:var(--pink); background:var(--pink-soft); }.action-icon.green,.choice-icon.green { color:var(--green); background:var(--green-soft); }.action-icon.amber,.choice-icon.amber { color:var(--amber); background:var(--amber-soft); }.action-icon.violet,.choice-icon.violet { color:var(--violet); background:var(--violet-soft); }.action-icon.blue { color:var(--blue); background:#edf3ff; }
.todo-list>div { display:flex; align-items:center; gap:10px; padding:12px 0; border-top:1px solid #f0f1f4; }.todo-list>div:first-child { border-top:0; }.todo-list span:nth-child(2) { min-width:0; flex:1; }.todo-list b,.todo-list small { display:block; }.todo-list b { font-size:11px; }.todo-list small { font-size:10px; color:#9ba1ae; margin-top:3px; }.todo-dot { width:29px; height:29px; display:grid; place-items:center; border-radius:9px; }.todo-dot.amber { color:var(--amber); background:var(--amber-soft); }.todo-dot.pink { color:var(--pink); background:var(--pink-soft); }.todo-dot.violet { color:var(--violet); background:var(--violet-soft); }.todo-action { border:0; color:var(--pink); background:transparent; font-size:10px; font-weight:700; white-space:nowrap; }.donut-wrap { display:flex; align-items:center; gap:28px; padding:6px 12px 8px; }.donut { width:128px; height:128px; border-radius:50%; background:conic-gradient(var(--pink) 0 72%,var(--green) 72% 90%,var(--amber) 90% 100%); display:grid; place-items:center; }.donut:before { content:''; width:80px; height:80px; border-radius:50%; background:#fff; grid-area:1/1; }.donut div { grid-area:1/1; text-align:center; z-index:1; }.donut b,.donut small { display:block; }.donut b { font:800 18px Manrope,sans-serif; }.donut small { color:#9ba1ae; font-size:9px; margin-top:3px; }.legend { display:flex; flex-direction:column; gap:11px; flex:1; }.legend span { display:flex; align-items:center; gap:7px; color:#7c8493; font-size:10px; }.legend b { margin-left:auto; color:var(--ink); }.dot { width:7px; height:7px; display:inline-block; border-radius:50%; }.dot.pink { background:var(--pink); }.dot.green { background:var(--green); }.dot.amber { background:var(--amber); }
.filter-pills,.doc-tabs { display:flex; gap:6px; overflow:auto; }.filter-pill,.doc-tabs button { border:0; background:#fff; color:#858d9c; padding:8px 11px; border-radius:7px; white-space:nowrap; font-size:11px; }.filter-pill.selected,.doc-tabs button.selected { color:var(--ink); background:var(--pink-soft); font-weight:700; }.filter-pill span,.doc-tabs span { margin-left:4px; background:#fff; border-radius:8px; padding:1px 5px; font-size:9px; }.list-card { padding:0; overflow:hidden; }.list-card-head { padding:19px 20px 0; }.full-list { padding:0 20px 9px; }.full-list .repair-row { padding:15px 0; }.empty-state { color:#9ba1ae; padding:30px 0; text-align:center; }.view-toggle { background:#f1f3f6; padding:3px; border-radius:7px; display:flex; }.view-toggle button { border:0; background:transparent; color:#a1a8b5; padding:6px 7px; border-radius:5px; }.view-toggle .selected { background:#fff; color:var(--ink); }
.stock-summary,.finance-kpis,.stats-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:0; overflow:hidden; margin-bottom:20px; }.stock-summary>div,.finance-kpis>div,.stats-cards>div { border:0; border-right:1px solid var(--line); border-radius:0; padding:17px 19px; }.stock-summary>div:last-child,.finance-kpis>div:last-child,.stats-cards>div:last-child { border-right:0; }.stock-summary span,.stock-summary b,.finance-kpis span,.finance-kpis b,.finance-kpis small,.stats-cards span,.stats-cards b,.stats-cards small { display:block; }.stock-summary span,.finance-kpis span,.stats-cards span { color:#858d9b; font-size:10px; }.stock-summary b,.finance-kpis b,.stats-cards b { font:800 22px Manrope,sans-serif; margin-top:8px; }.stock-toolbar { margin-top:0; }.table-head,.stock-row { display:grid; grid-template-columns:2.2fr 1fr .7fr .7fr 34px; align-items:center; gap:15px; }.table-head { padding:12px 20px; background:#fafbfc; color:#9ba2ae; font-size:10px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }.stock-row { padding:13px 20px; border-bottom:1px solid #f0f1f4; font-size:11px; }.stock-row:last-child { border:0; }.stock-product { display:flex; align-items:center; gap:10px; min-width:0; }.product-icon { width:31px; height:31px; border-radius:9px; background:#f2f4f7; display:grid; place-items:center; color:#838b9a; flex:none; }.stock-product span,.stock-product b,.stock-product small { display:block; }.stock-product b { font-size:11px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }.stock-product small { font-size:9px; color:#9ca3b0; margin-top:4px; }.stock-qty { display:block; }.stock-qty.low { color:var(--amber); }.stock-qty small { color:#a0a6b1; font-size:9px; font-weight:400; }.stock-bar { display:block; width:90px; height:4px; background:#edf0f3; border-radius:4px; margin-top:6px; }.stock-bar i { display:block; height:100%; border-radius:inherit; background:var(--green); }.stock-alert { display:block; color:var(--amber); font-size:8px; margin-top:4px; }
.clients-highlight { display:flex; align-items:center; gap:13px; padding:16px 18px; margin-bottom:18px; }.client-big-icon { width:39px; height:39px; background:var(--violet-soft); color:var(--violet); border-radius:11px; display:grid; place-items:center; }.clients-highlight b,.clients-highlight span { display:block; }.clients-highlight b { font-size:12px; }.clients-highlight span { color:#9ba1ae; font-size:10px; margin-top:4px; }.clients-search { margin-left:auto; min-width:260px; display:flex; gap:8px; align-items:center; color:#a4aab6; background:#f7f8fa; padding:9px 11px; border-radius:8px; }.clients-search input { border:0; outline:0; background:transparent; width:100%; }.client-table-head,.client-row { display:grid; grid-template-columns:2fr 1.3fr .9fr 1fr .8fr 20px; align-items:center; gap:14px; }.client-table-head { padding:12px 20px; color:#9ca3ae; font-size:10px; background:#fafbfc; border-block:1px solid var(--line); }.client-row { width:100%; border:0; border-bottom:1px solid #f0f1f4; background:#fff; padding:13px 20px; text-align:left; color:#77808f; font-size:10px; }.client-row:last-child { border:0; }.client-row:hover { background:#fcfcfd; }.client-info { display:flex; align-items:center; gap:10px; }.client-info b,.client-info small { display:block; }.client-info b { color:var(--ink); font-size:11px; }.client-info small { margin-top:3px; color:#9ca3b0; }.kind-dot { display:inline-block; width:5px; height:5px; border-radius:50%; background:var(--green); margin-right:4px; }.client-row strong { color:var(--ink); }.client-row>svg { color:#bec4ce; }
.finance-kpis>div,.stats-cards>div { padding:18px 20px; }.finance-kpis small,.stats-cards small { color:#9ca1ae; font-size:10px; margin-top:7px; }.green-text { color:var(--green) !important; }.finance-grid,.stats-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:18px; }.chart-panel,.payment-panel { min-height:315px; }.chart { height:190px; display:flex; gap:10px; margin-top:25px; }.chart-y { display:flex; flex-direction:column; justify-content:space-between; color:#a8aeb8; font-size:9px; padding-bottom:18px; }.chart-lines { flex:1; position:relative; display:flex; flex-direction:column; justify-content:space-between; border-bottom:1px solid #e9ecf0; }.chart-lines>i { border-top:1px dashed #edf0f3; width:100%; }.chart-bars { position:absolute; inset:0; display:flex; align-items:flex-end; justify-content:space-around; padding:0 10px 0; }.chart-bars span { width:14px; background:var(--pink-soft); border-radius:5px 5px 0 0; position:relative; }.chart-bars span b { position:absolute; left:3px; right:3px; top:0; height:65%; background:var(--pink); opacity:.55; border-radius:4px; }.chart-legend { display:flex; gap:18px; margin:10px 0 0 43px; color:#8c94a1; font-size:10px; }.chart-legend span { display:flex; align-items:center; gap:6px; }.payment-list>div { display:flex; align-items:center; gap:9px; padding:13px 0; border-top:1px solid #f0f1f4; }.payment-list>div:first-child { border:0; }.payment-list span:nth-child(2) { flex:1; }.payment-list b,.payment-list small { display:block; }.payment-list b { font-size:11px; }.payment-list small { font-size:9px; color:#9ca3b0; margin-top:3px; }.payment-list strong { font-size:11px; }.payment-icon { width:28px; height:28px; display:grid; place-items:center; border-radius:8px; }.payment-icon.in { color:var(--green); background:var(--green-soft); }.payment-icon.out { color:var(--pink); background:var(--pink-soft); }.payment-icon.out svg { transform:rotate(180deg); }
.doc-tabs { margin:-8px 0 18px; }.doc-tabs button { background:transparent; }.doc-head { grid-template-columns:1.25fr 1.5fr .8fr .7fr .8fr 20px; }.doc-row { border:0; border-bottom:1px solid #f0f1f4; background:#fff; width:100%; display:grid; grid-template-columns:30px 1.25fr 1.5fr .8fr .7fr .8fr 20px; align-items:center; gap:10px; padding:14px 20px; text-align:left; font-size:10px; color:#7f8794; }.doc-row:last-child { border:0; }.doc-row:hover { background:#fcfcfd; }.doc-row>b,.doc-row>strong { color:var(--ink); font-size:11px; }.doc-icon { width:27px; height:27px; border-radius:8px; display:grid; place-items:center; }.doc-icon.paid { color:var(--green); background:var(--green-soft); }.doc-icon.due { color:var(--amber); background:var(--amber-soft); }.doc-icon.draft { color:var(--violet); background:var(--violet-soft); }.doc-status { width:max-content; display:flex; align-items:center; gap:5px; padding:4px 7px; border-radius:5px; font-size:9px; font-weight:700; }.doc-status.paid { color:var(--green); background:var(--green-soft); }.doc-status.due { color:var(--amber); background:var(--amber-soft); }.doc-status.draft { color:var(--violet); background:var(--violet-soft); }
.status-chart>div { display:grid; grid-template-columns:1fr 40px; align-items:center; gap:10px; margin:16px 0; font-size:10px; }.status-chart span { display:flex; gap:7px; align-items:center; color:#7e8795; }.status-chart span i { width:7px; height:7px; border-radius:50%; }.status-chart b { text-align:right; }.status-chart>div>div { grid-column:1 / -1; height:7px; background:#f0f2f5; border-radius:6px; overflow:hidden; }.status-chart>div>div i { display:block; height:100%; border-radius:inherit; }.top-list>.top-row { display:flex; align-items:center; gap:12px; padding:13px 0; border-top:1px solid #f0f1f4; font-size:11px; }.top-row>b { color:#b0b6c0; font-size:10px; }.top-row>span { flex:1; }.top-row>span i { display:block; height:4px; background:#f0f2f5; border-radius:4px; margin-top:7px; }.top-row>span i em { display:block; height:100%; border-radius:4px; }.top-row>strong { font-size:11px; }
.settings-layout { display:grid; grid-template-columns:200px 1fr; gap:18px; }.settings-menu { display:flex; flex-direction:column; gap:3px; }.settings-menu button { border:0; background:transparent; padding:11px 13px; border-radius:8px; display:flex; align-items:center; gap:9px; color:#88909f; text-align:left; font-size:11px; }.settings-menu button.selected { color:var(--ink); background:var(--pink-soft); font-weight:700; }.settings-panel { min-height:440px; }.logo-setting { display:flex; align-items:center; gap:12px; padding:17px 0; border-block:1px solid #f0f1f4; margin-bottom:20px; }.logo-setting b,.logo-setting span { display:block; }.logo-setting span { color:#9ba1ae; font-size:10px; margin-top:4px; }.logo-setting button { margin-left:auto; }.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.form-grid label { display:flex; flex-direction:column; gap:7px; color:#747d8c; font-size:10px; font-weight:700; }.form-grid .wide { grid-column:1 / -1; }.form-grid input,.form-grid select,.form-grid textarea,.search-field { width:100%; border:1px solid #e0e4ea; background:#fff; border-radius:8px; padding:11px 12px; color:var(--ink); outline:0; font-weight:400; }.form-grid textarea { min-height:72px; resize:vertical; }.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus { border-color:#ffb4c0; box-shadow:0 0 0 3px var(--pink-soft); }.color-input { border:1px solid #e0e4ea; border-radius:8px; padding:9px 11px; display:flex; gap:8px; align-items:center; font-weight:400; }.color-input i { width:19px; height:19px; border-radius:5px; }.color-input span { color:#9ca3ae; }
.modal-backdrop { position:fixed; inset:0; z-index:10; background:rgba(23,27,45,.35); backdrop-filter:blur(3px); display:flex; align-items:center; justify-content:center; padding:20px; }.modal-card,.quick-sheet { background:#fff; border-radius:18px; width:min(620px,100%); max-height:calc(100vh - 40px); overflow:auto; box-shadow:0 25px 80px rgba(22,27,46,.2); padding:24px; }.modal-head,.sheet-title { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin-bottom:22px; }.modal-head h2,.sheet-title h2 { font:800 20px Manrope,sans-serif; letter-spacing:-.5px; margin:0 0 5px; }.modal-head p,.sheet-title p { color:#939aa7; font-size:11px; margin:0; }.modal-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:24px; padding-top:17px; border-top:1px solid #eef0f3; }.quick-sheet { width:min(480px,100%); }.quick-sheet .sheet-handle { display:none; }.quick-options { display:flex; flex-direction:column; gap:7px; }.quick-options button { border:1px solid var(--line); background:#fff; border-radius:11px; display:flex; align-items:center; gap:12px; padding:11px; text-align:left; }.quick-options button:hover { border-color:#ffc2cc; background:#fffafa; }.quick-options button>span:nth-child(2) { flex:1; }.quick-options b,.quick-options small { display:block; }.quick-options b { font-size:12px; }.quick-options small { font-size:10px; color:#9aa1ae; margin-top:3px; }.quick-options>svg { color:#b5bbc5; }.wizard-steps { display:flex; align-items:center; gap:9px; margin:0 0 24px; color:#abb1bc; font-size:10px; font-weight:700; }.wizard-steps span { display:flex; gap:5px; align-items:center; }.wizard-steps .current { color:var(--ink); }.wizard-steps .current:first-letter { color:var(--pink); }.wizard-steps i { height:1px; flex:1; background:#e9ecf0; }.step-copy h3 { font:800 16px Manrope,sans-serif; margin:0 0 5px; }.step-copy p { color:#939aa7; font-size:11px; margin:0 0 19px; }.choice-cards { display:flex; flex-direction:column; gap:7px; margin-bottom:16px; }.choice { display:flex; align-items:center; gap:11px; border:1px solid var(--line); border-radius:10px; padding:10px; background:#fff; text-align:left; }.choice.selected { border-color:#ffb4c0; background:#fffafa; }.choice>span:nth-child(2) { flex:1; }.choice b,.choice small { display:block; }.choice b { font-size:11px; }.choice small { color:#9ba2ae; font-size:9px; margin-top:3px; }.choice>svg { color:var(--pink); }.search-field { display:flex; align-items:center; gap:8px; color:#a0a7b2; }.search-field input { border:0; outline:0; flex:1; }.repair-service { border:1px solid #edf0f3; border-radius:10px; padding:3px 12px; margin:0 0 16px; }.service-line { display:flex; align-items:center; gap:10px; padding:10px 0; border-bottom:1px solid #f0f1f4; }.service-line:last-child { border:0; }.service-line>span:nth-child(2) { flex:1; }.service-line b,.service-line small { display:block; }.service-line b { font-size:11px; }.service-line small { color:#9ba2ae; font-size:9px; margin-top:3px; }.service-line strong { font-size:11px; }.recap-box { display:flex; align-items:center; justify-content:space-between; background:var(--green-soft); color:var(--green); border-radius:9px; padding:11px 12px; margin-top:16px; font-size:11px; }.recap-box span { display:flex; gap:6px; align-items:center; }.recap-box b { font-size:13px; }.recap-box small { font-weight:400; font-size:10px; }.client-type { display:flex; gap:5px; background:#f0f2f5; padding:3px; border-radius:8px; margin-bottom:18px; }.client-type button { border:0; background:transparent; border-radius:6px; padding:8px 10px; color:#8b92a0; font-size:10px; }.client-type button.selected { background:#fff; color:var(--ink); font-weight:700; box-shadow:0 1px 4px rgba(31,39,61,.08); }.toast { position:fixed; z-index:20; right:25px; bottom:25px; display:flex; align-items:center; gap:8px; background:var(--ink); color:#fff; padding:12px 15px; border-radius:10px; box-shadow:0 10px 30px rgba(32,36,56,.22); font-size:11px; font-weight:700; }
.bottom-nav { display:none; }
@media (max-width:1050px) { .sidebar { width:210px; }.content { padding-inline:25px; }.topbar { padding-inline:25px; }.metric-grid { grid-template-columns:1fr 1fr; }.metric-main { grid-column:span 2; }.dashboard-grid,.dashboard-grid.lower,.finance-grid,.stats-grid { grid-template-columns:1fr; }.stock-summary,.finance-kpis,.stats-cards { grid-template-columns:repeat(2,1fr); }.stock-summary>div:nth-child(2),.finance-kpis>div:nth-child(2),.stats-cards>div:nth-child(2) { border-right:0; }.stock-summary>div,.finance-kpis>div,.stats-cards>div { border-bottom:1px solid var(--line); } }
@media (max-width:700px) { body { padding-bottom:72px; }.sidebar { display:none; }.topbar { height:62px; padding:0 16px; position:sticky; top:0; z-index:4; }.mobile-brand { display:flex; }.global-search { width:auto; flex:1; max-width:none; padding:8px 9px; }.global-search kbd { display:none; }.top-avatar { display:none; }.topbar-actions { gap:4px; }.content { padding:23px 15px 28px; }.page-header { align-items:flex-start; flex-direction:column; gap:14px; margin-bottom:22px; }.page-header .button { width:100%; }.page-header h1 { font-size:25px; }.period-row { margin-top:0; overflow:auto; }.date-button { display:none; }.metric-grid { gap:9px; }.metric-card { min-height:126px; padding:14px; }.metric-card strong { font-size:23px; margin-top:13px; }.metric-card p { font-size:9px; }.metric-main { grid-column:span 2; }.dashboard-grid,.dashboard-grid.lower { gap:12px; margin-bottom:12px; }.panel { padding:15px; }.repair-row { flex-wrap:wrap; }.repair-meta { margin-left:auto; min-width:0; }.repair-meta small { display:none; }.row-price { margin-left:43px; }.action-grid button { min-height:85px; }.donut-wrap { justify-content:center; gap:18px; }.stock-summary,.finance-kpis,.stats-cards { grid-template-columns:1fr 1fr; margin-left:-1px; margin-right:-1px; }.stock-summary>div,.finance-kpis>div,.stats-cards>div { padding:14px; }.stock-summary b,.finance-kpis b,.stats-cards b { font-size:18px; }.toolbar { align-items:flex-start; flex-direction:column; }.toolbar .button { align-self:flex-end; }.filter-pills { max-width:100%; width:100%; }.list-card { border-radius:12px; }.table-head { display:none; }.stock-row { grid-template-columns:1fr auto; gap:9px; padding:13px 15px; }.stock-row>span,.stock-row>b { display:none; }.stock-row>button { grid-column:2; grid-row:1; }.stock-product { grid-column:1; }.stock-row>div:nth-child(2) { grid-column:1 / -1; padding-left:41px; }.stock-bar { width:100%; }.clients-highlight { align-items:flex-start; flex-wrap:wrap; padding:14px; }.clients-search { min-width:100%; margin-left:0; }.client-table-head { display:none; }.client-row { grid-template-columns:1fr auto; padding:12px 15px; }.client-row>span,.client-row>strong { display:none; }.client-row>svg { grid-column:2; grid-row:1; }.client-info { grid-column:1; }.doc-head { display:none; }.doc-row { grid-template-columns:30px 1fr 20px; gap:8px; padding:12px 15px; }.doc-row>span,.doc-row>strong,.doc-row>.doc-status { display:none; }.doc-row>b { grid-column:2; grid-row:1; }.doc-row>svg { grid-column:3; grid-row:1; }.settings-layout { grid-template-columns:1fr; }.settings-menu { display:grid; grid-template-columns:1fr 1fr; }.settings-panel { padding:15px; }.form-grid { grid-template-columns:1fr; gap:13px; }.form-grid .wide { grid-column:auto; }.modal-backdrop { align-items:flex-end; padding:0; }.modal-card,.quick-sheet { border-radius:19px 19px 0 0; max-height:93vh; padding:20px 16px calc(20px + env(safe-area-inset-bottom)); }.quick-sheet .sheet-handle { display:block; width:36px; height:4px; border-radius:4px; background:#d9dde3; margin:0 auto 17px; }.quick-sheet .sheet-title { margin-bottom:17px; }.modal-actions { flex-wrap:wrap; }.modal-actions .button { flex:1; }.wizard-steps { gap:5px; }.wizard-steps span b { display:none; }.toast { right:15px; left:15px; bottom:87px; justify-content:center; }.bottom-nav { display:flex; position:fixed; z-index:5; bottom:0; left:0; right:0; height:68px; background:rgba(255,255,255,.96); border-top:1px solid var(--line); justify-content:space-around; align-items:center; padding:0 9px env(safe-area-inset-bottom); backdrop-filter:blur(15px); }.bottom-nav .nav-item { width:25%; height:54px; padding:5px; flex-direction:column; gap:3px; justify-content:center; align-items:center; font-size:9px; }.bottom-nav .nav-item.active { background:transparent; }.bottom-nav .nav-item.active svg { color:var(--pink); }.quick-add { border:0; width:49px; height:49px; border-radius:16px; background:var(--ink); color:#fff; margin-top:-23px; box-shadow:0 8px 18px rgba(35,38,59,.22); display:grid; place-items:center; }.bottom-nav .nav-item:last-child { width:25%; } }

.detail-hero { display:flex; align-items:center; gap:11px; padding:14px; border:1px solid #eef0f3; border-radius:11px; background:#fcfcfd; }
.detail-hero>div:nth-child(2) { flex:1; }.detail-hero b,.detail-hero span { display:block; }.detail-hero b { font-size:12px; }.detail-hero span:not(.status) { color:#9aa1ae; font-size:10px; margin-top:4px; }
.detail-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin:15px 0; }.detail-grid>div { padding:13px; border-radius:10px; background:#f7f8fa; }.detail-grid span,.detail-grid b { display:block; }.detail-grid span { color:#8d95a3; font-size:9px; }.detail-grid b { font:800 16px Manrope,sans-serif; margin-top:7px; }
.detail-section { border-top:1px solid #eef0f3; padding-top:16px; margin-top:16px; }.detail-section-title { display:flex; align-items:baseline; justify-content:space-between; margin-bottom:10px; }.detail-section-title b { font-size:11px; }.detail-section-title small { color:#9aa1ae; font-size:9px; }.status-actions { display:flex; flex-wrap:wrap; gap:6px; }.status-actions button { border:1px solid var(--line); background:#fff; color:#8a92a0; border-radius:7px; padding:8px 9px; font-size:10px; }.status-actions button.selected { color:var(--pink); border-color:#ffb4c0; background:var(--pink-soft); font-weight:700; }.wide-button { width:100%; }.paid-banner { display:flex; align-items:center; gap:7px; color:var(--green); background:var(--green-soft); padding:11px 12px; border-radius:8px; font-size:10px; font-weight:700; }.detail-actions { display:flex; justify-content:space-between; gap:8px; margin-top:20px; }.detail-actions .button { flex:1; }
@media (max-width:700px) { .detail-grid { gap:6px; }.detail-grid>div { padding:10px; }.detail-grid b { font-size:14px; }.detail-hero { align-items:flex-start; flex-wrap:wrap; }.detail-hero .status { margin-left:43px; } }
.client-profile-hero { display:flex; align-items:center; gap:11px; padding:14px; border:1px solid #eef0f3; border-radius:11px; background:#fcfcfd; }.client-profile-hero>div:nth-child(2) { flex:1; }.client-profile-hero b,.client-profile-hero span { display:block; }.client-profile-hero b { font-size:12px; }.client-profile-hero span { color:#9aa1ae; font-size:10px; margin-top:4px; }.device-card,.history-item { display:flex; align-items:center; gap:10px; padding:11px 0; border-top:1px solid #f0f1f4; }.device-card:first-of-type,.history-item:first-of-type { border-top:0; }.device-card>span:nth-child(2),.history-item>span:nth-child(2) { flex:1; }.device-card b,.device-card small,.history-item b,.history-item small { display:block; }.device-card b,.history-item b { font-size:11px; }.device-card small,.history-item small { color:#9aa1ae; font-size:9px; margin-top:4px; }.device-card>svg { color:#b5bbc5; }.history-icon { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; color:var(--pink); background:var(--pink-soft); }.empty-state.compact { padding:13px 0; font-size:10px; }
@media (max-width:700px) { .client-profile-hero { align-items:flex-start; flex-wrap:wrap; }.client-profile-hero .button { width:100%; margin-top:6px; }.history-item .status { display:none; } }
.header-actions { display:flex; align-items:center; gap:8px; }
.import-modal { width:min(820px,100%); }
.import-help { display:flex; flex-direction:column; gap:5px; padding:12px 13px; margin-bottom:17px; border-radius:10px; color:#6f7785; background:#f8fafc; border:1px solid #edf0f3; font-size:10px; line-height:1.45; }
.import-help b { color:var(--ink); font-size:11px; }
.import-checkbox { justify-content:center; flex-direction:row !important; align-items:center; gap:8px !important; padding:10px 12px; background:#f8fafc; border-radius:8px; color:#6f7785 !important; }
.import-checkbox input { width:auto !important; box-shadow:none !important; }
.import-file-name { padding:9px 12px; border-radius:8px; color:#6f7785; background:#f8fafc; font-size:10px; }
.import-file-name b { color:var(--ink); }
.import-errors { display:flex; flex-direction:column; gap:5px; padding:11px 13px; margin-top:16px; border-radius:9px; color:#9a6a12; background:#fff8e9; border:1px solid #f7e4b7; font-size:10px; }
.import-errors b { color:#8b5e08; font-size:11px; margin-bottom:2px; }
.import-preview { margin-top:16px; overflow:hidden; border:1px solid #edf0f3; border-radius:10px; }
.import-preview-head { display:flex; justify-content:space-between; align-items:center; padding:11px 13px; background:#fafbfc; border-bottom:1px solid #edf0f3; font-size:11px; }
.import-preview-head small { color:#9aa1ae; font-size:9px; }
.import-table { overflow:auto; max-height:240px; }
.import-table-row { display:grid; grid-template-columns:repeat(6,minmax(115px,1fr)); gap:10px; min-width:690px; padding:9px 12px; border-bottom:1px solid #f1f2f5; color:#707989; font-size:10px; }
.import-table-row:last-child { border-bottom:0; }
.import-table-row span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.import-table-head { color:#8a92a0; background:#fbfcfd; font-size:9px; font-weight:700; }
@media (max-width:700px) { .header-actions { width:100%; }.header-actions .button { flex:1; }.import-modal .modal-actions .button-secondary { flex-basis:calc(50% - 5px); }.import-modal .modal-actions .button-primary { flex-basis:100%; } }