@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Jura:wght@600;700&display=swap";:root{--brand:#e8601c;--brand-dark:#c04e12;--brand-light:#fef0e8}*,:before,:after{box-sizing:border-box;margin:0;padding:0}body,#root{color:#1a1a18;background:#f4f2ee;min-height:100vh;font-family:DM Sans,sans-serif}.app{flex-direction:column;min-height:100vh;display:flex}.topbar{z-index:100;background:#fff;border-bottom:1px solid #e8e5df;align-items:center;gap:16px;height:64px;padding:0 24px;display:flex;position:sticky;top:0}.topbar-logo{align-items:center;gap:10px;text-decoration:none;display:flex}.logo-icon{background:var(--brand);color:#fff;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;width:40px;height:40px;font-family:Jura,sans-serif;font-size:20px;display:flex}.logo-text{flex-direction:column;line-height:1.15;display:flex}.logo-name{color:#1a1a18;font-size:14px;font-weight:600}.logo-sub{color:#888;font-size:11px;font-weight:400}.topbar-title{color:#1a1a18;flex:1;font-family:Jura,sans-serif;font-size:20px}.topbar-user{color:#555;align-items:center;gap:10px;font-size:14px;font-weight:500;display:flex}.avatar{background:var(--brand);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:36px;height:36px;font-size:13px;font-weight:600;display:flex}.layout{flex:1;display:flex}.sidebar{background:#fff;border-right:1px solid #e8e5df;flex-direction:column;flex-shrink:0;gap:4px;width:200px;padding:24px 0;display:flex}.sidebar-btn-primary{background:var(--brand);color:#fff;cursor:pointer;text-align:center;border:none;border-radius:8px;margin:0 16px 16px;padding:10px 14px;font-family:DM Sans,sans-serif;font-size:13px;font-weight:600;transition:background .15s}.sidebar-btn-primary:hover{background:var(--brand-dark)}.nav-item{color:#666;cursor:pointer;text-align:left;background:0 0;border:none;border-radius:0;align-items:center;gap:8px;width:100%;padding:10px 20px;font-size:13px;font-weight:500;transition:all .12s;display:flex}.nav-item:hover{color:#1a1a18;background:#f4f2ee}.nav-item.active{background:var(--brand-light);color:var(--brand);border-right:3px solid var(--brand);font-weight:600}.main{flex:1;padding:28px 32px;overflow-y:auto}.page-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.page-title{color:#1a1a18;font-family:Jura,sans-serif;font-size:26px}.status-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:28px;display:grid}.status-card{cursor:pointer;background:#fff;border:1px solid #e8e5df;border-radius:12px;padding:16px 18px;transition:all .15s;position:relative}.status-card:hover{border-color:#ccc;transform:translateY(-1px)}.status-card.active{border-color:var(--c);box-shadow:0 0 0 3px color-mix(in srgb, var(--c) 15%, transparent)}.status-card-top{justify-content:space-between;align-items:flex-start;margin-bottom:10px;display:flex}.status-count{background:var(--c);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:13px;font-weight:700;display:flex}.status-label{color:#1a1a18;margin-bottom:6px;font-size:14px;font-weight:600}.status-desc{color:#888;font-size:12px;line-height:1.5}.table-section{background:#fff;border:1px solid #e8e5df;border-radius:12px;overflow:hidden}.table-section-header{border-bottom:1px solid #e8e5df;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.table-section-title{color:#1a1a18;font-size:15px;font-weight:600}table{border-collapse:collapse;width:100%;font-size:13px}thead th{text-align:left;color:#888;text-transform:uppercase;letter-spacing:.04em;background:#fafaf8;border-bottom:1px solid #e8e5df;padding:10px 16px;font-size:12px;font-weight:600}tbody tr{cursor:pointer;border-bottom:1px solid #f0eee9;transition:background .1s}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:#fafaf8}tbody td{color:#1a1a18;padding:12px 16px}.td-muted{color:#888}.badge{border-radius:20px;padding:3px 10px;font-size:11px;font-weight:600;display:inline-block}.overlay{z-index:200;background:#00000059;justify-content:flex-end;display:flex;position:fixed;inset:0}.panel{background:#fff;flex-direction:column;gap:20px;width:460px;max-width:95vw;height:100%;padding:32px 28px;animation:.2s slideIn;display:flex;overflow-y:auto}@keyframes slideIn{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}.panel-header{justify-content:space-between;align-items:flex-start;display:flex}.panel-title{color:#1a1a18;font-family:Jura,sans-serif;font-size:22px}.close-btn{cursor:pointer;color:#888;background:0 0;border:none;padding:4px;font-size:20px;line-height:1}.close-btn:hover{color:#1a1a18}.form-section{flex-direction:column;gap:14px;display:flex}.form-section-title{color:#1a1a18;border-bottom:1px solid #e8e5df;padding-bottom:8px;font-size:15px;font-weight:700}.info-table{border-collapse:collapse;width:100%;font-size:13px}.info-table td{vertical-align:top;padding:7px 0}.info-table td:first-child{color:#888;width:160px;font-weight:500}.info-table tr{border-bottom:1px solid #f0eee9}.info-table tr:last-child{border-bottom:none}label{color:#444;margin-bottom:4px;font-size:13px;font-weight:500;display:block}input[type=text],input[type=email],input[type=password],input[type=date],input[type=number],textarea,select{color:#1a1a18;background:#fff;border:1px solid #ddd;border-radius:8px;outline:none;width:100%;padding:9px 12px;font-family:DM Sans,sans-serif;font-size:13px;transition:border-color .12s}input:focus,textarea:focus,select:focus{border-color:var(--brand)}textarea{resize:vertical;min-height:80px}.checkbox-row{color:#444;cursor:pointer;align-items:flex-start;gap:10px;font-size:13px;display:flex}.checkbox-row input[type=checkbox]{width:16px;height:16px;accent-color:var(--brand);flex-shrink:0;margin-top:2px}.radio-group{gap:20px;display:flex}.radio-row{color:#444;cursor:pointer;align-items:center;gap:6px;font-size:13px;display:flex}.radio-row input[type=radio]{accent-color:var(--brand)}.btn-primary{background:var(--brand);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:11px 20px;font-family:DM Sans,sans-serif;font-size:13px;font-weight:600;transition:background .15s}.btn-primary:hover{background:var(--brand-dark)}.btn-secondary{color:#444;cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:8px;padding:11px 20px;font-family:DM Sans,sans-serif;font-size:13px;font-weight:500;transition:background .15s}.btn-secondary:hover{background:#f4f2ee}.btn-danger{color:#c0392b;cursor:pointer;background:#fff;border:1px solid #c0392b;border-radius:8px;padding:11px 20px;font-family:DM Sans,sans-serif;font-size:13px;font-weight:600;transition:all .15s}.btn-danger:hover{background:#fef0ee}.btn-row{gap:10px;margin-top:8px;display:flex}.log-entry{color:#444;background:#fafaf8;border:1px solid #e8e5df;border-radius:8px;margin-bottom:6px;padding:10px 14px;font-size:13px;line-height:1.5}.travel-table{border-collapse:collapse;width:100%;font-size:13px}.travel-table td{border-bottom:1px solid #f0eee9;padding:7px 0}.travel-table tr:last-child td{border-bottom:none}.travel-total{color:var(--brand);text-align:right;font-weight:700}.search-bar{align-items:center;gap:12px;margin-bottom:20px;display:flex}.search-input{background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23aaa' viewBox='0 0 16 16'%3E%3Cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398l3.85 3.85a1 1 0 0 0 1.415-1.415l-3.868-3.833zm-5.242 1.156a5 5 0 1 1 0-10 5 5 0 0 1 0 10z'/%3E%3C/svg%3E") 10px no-repeat;border:1px solid #ddd;border-radius:8px;outline:none;flex:1;padding:9px 14px 9px 36px;font-family:DM Sans,sans-serif;font-size:13px}.search-input:focus{border-color:var(--brand)}.filter-select{color:#555;cursor:pointer;appearance:none;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' fill='%23aaa' viewBox='0 0 16 16'%3E%3Cpath d='M7.247 11.14L2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3E%3C/svg%3E") right 8px center no-repeat;border:1px solid #ddd;border-radius:8px;outline:none;padding:8px 28px 8px 10px;font-family:DM Sans,sans-serif;font-size:12px;transition:border-color .12s}.filter-select:focus{border-color:var(--brand)}.filter-select.active{border-color:var(--brand);background-color:var(--brand-light);color:var(--brand);font-weight:600}.th-filter{flex-direction:column;gap:4px;min-width:0;display:flex}.th-filter-label{color:#888;text-transform:uppercase;letter-spacing:.04em;font-size:12px;font-weight:600}.selection-bar{background:var(--brand-light);color:var(--brand-dark);border-bottom:1px solid #f5c4b3;align-items:center;gap:12px;padding:10px 16px;font-size:13px;font-weight:500;display:flex}.row-checkbox{width:15px;height:15px;accent-color:var(--brand);cursor:pointer}thead th{vertical-align:bottom;padding-bottom:10px}.users-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.user-card{background:#fff;border:1px solid #e8e5df;border-radius:12px;flex-direction:column;gap:14px;padding:20px;display:flex}.user-card-top{justify-content:space-between;align-items:flex-start;display:flex}.user-name{color:#1a1a18;font-size:16px;font-weight:600}.user-role-badge{border-radius:20px;padding:3px 10px;font-size:11px;font-weight:600}.role-technician{color:#27500a;background:#eaf3de}.role-admin{background:var(--brand-light);color:var(--brand-dark)}.user-info{color:#888;font-size:12px}.edit-btn{cursor:pointer;color:#666;background:0 0;border:1px solid #ddd;border-radius:6px;align-self:flex-end;padding:5px 10px;font-size:12px;transition:all .12s}.edit-btn:hover{border-color:var(--brand);color:var(--brand)}.program-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;display:grid}.program-card{background:#fff;border:1px solid #e8e5df;border-radius:12px;flex-direction:column;gap:16px;padding:24px;display:flex}.program-price{color:#1a1a18;font-size:24px;font-weight:700}.program-price span{color:#888;margin-left:4px;font-size:13px;font-weight:400}.program-name{color:#1a1a18;font-family:Jura,sans-serif;font-size:20px}.program-row{flex-direction:column;gap:4px;display:flex}.program-row label{color:#888;text-transform:uppercase;letter-spacing:.04em;font-size:12px;font-weight:500}.program-row p{color:#444;font-size:13px}.action-checkbox{width:18px;height:18px;accent-color:var(--brand);cursor:pointer}.show-done-link{color:var(--brand);cursor:pointer;background:0 0;border:none;padding:0;font-size:13px;font-weight:500;text-decoration:underline}.support-card{background:#fff;border:1px solid #e8e5df;border-radius:12px;align-items:center;gap:28px;max-width:600px;padding:28px;display:flex}.datadocu-logo{color:#1a5fa8;flex-direction:column;flex-shrink:0;align-items:center;width:100px;font-family:Jura,sans-serif;font-size:20px;display:flex}.footer{text-align:center;color:#aaa;padding:20px;font-size:12px}.login-page{background:#f4f2ee;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:#fff;border:1px solid #e8e5df;border-radius:16px;flex-direction:column;gap:20px;width:100%;max-width:380px;padding:40px 36px;display:flex}.login-logo{justify-content:center;align-items:center;gap:12px;margin-bottom:4px;display:flex}.login-logo-icon{background:var(--brand);color:#fff;border-radius:11px;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;font-family:Jura,sans-serif;font-size:22px;display:flex}.login-logo-text{flex-direction:column;line-height:1.2;display:flex}.login-logo-name{color:#1a1a18;font-size:15px;font-weight:600}.login-logo-sub{color:#aaa;font-size:11px}.login-heading{text-align:center;color:#1a1a18;font-family:Jura,sans-serif;font-size:22px}.login-sub{text-align:center;color:#999;margin-top:-12px;font-size:13px}.login-field{flex-direction:column;gap:6px;display:flex}.login-field label{color:#444;font-size:13px;font-weight:500}.login-field input{color:#1a1a18;border:1px solid #ddd;border-radius:8px;outline:none;width:100%;padding:10px 14px;font-family:DM Sans,sans-serif;font-size:14px;transition:border-color .12s}.login-field input:focus{border-color:var(--brand)}.login-btn{background:var(--brand);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;margin-top:4px;padding:12px;font-family:DM Sans,sans-serif;font-size:14px;font-weight:600;transition:background .15s}.login-btn:hover{background:var(--brand-dark)}.login-btn:disabled{cursor:not-allowed;background:#ccc}.login-forgot{text-align:center;color:var(--brand);cursor:pointer;background:0 0;border:none;font-family:DM Sans,sans-serif;font-size:12px;text-decoration:underline}.login-error{color:#993c1d;text-align:center;background:#fef0ee;border:1px solid #f5c4b3;border-radius:8px;padding:10px 14px;font-size:13px}.login-footer{text-align:center;color:#ccc;margin-top:-8px;font-size:11px}.detail-layout{grid-template-columns:1fr 340px;align-items:start;gap:20px;display:grid}.detail-card{background:#fff;border:1px solid #e8e5df;border-radius:12px;overflow:hidden}.detail-card-header{border-bottom:1px solid #e8e5df;justify-content:space-between;align-items:center;padding:16px 20px;display:flex}.detail-card-title{color:#1a1a18;font-size:15px;font-weight:600}.logbook-entry{border-bottom:1px solid #f0eee9;align-items:flex-start;gap:14px;padding:16px 20px;transition:background .1s;display:flex}.logbook-entry:last-child{border-bottom:none}.logbook-entry:hover{background:#fafaf8}.logbook-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px;margin-top:4px}.logbook-date{color:#1a1a18;margin-bottom:3px;font-size:13px;font-weight:600}.logbook-author{color:#555;margin-bottom:2px;font-size:12px;font-weight:500}.logbook-note{color:#999;font-size:12px}.logbook-photo{color:#ccc;cursor:pointer;background:#f4f2ee;border:1px solid #e8e5df;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:48px;height:48px;margin-left:auto;font-size:18px;display:flex}.customer-info-row{border-bottom:1px solid #f0eee9;gap:12px;padding:10px 20px;font-size:13px;display:flex}.customer-info-row:last-child{border-bottom:none}.customer-info-label{color:#888;flex-shrink:0;width:160px;font-weight:500}.customer-info-value{color:#1a1a18;flex:1}.back-btn{color:#888;cursor:pointer;background:0 0;border:none;align-items:center;gap:6px;margin-bottom:16px;padding:0;font-family:DM Sans,sans-serif;font-size:13px;transition:color .12s;display:flex}.back-btn:hover{color:#1a1a18}.modal-bg{z-index:300;background:#00000059;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:14px;flex-direction:column;gap:16px;width:100%;max-width:480px;padding:28px;animation:.18s slideIn;display:flex}.modal-title{color:#1a1a18;font-family:Jura,sans-serif;font-size:20px}