body{margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.login-container{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;justify-content:center;min-height:100vh;overflow:hidden;padding:20px;position:relative}.login-container:before{animation:float 20s ease-in-out infinite;background:radial-gradient(circle,#ffffff1a 0,#0000 70%);border-radius:50%;content:"";height:600px;left:-300px;position:absolute;top:-300px;width:600px}.login-container:after{animation:float 15s ease-in-out infinite reverse;background:radial-gradient(circle,#ffffff14 0,#0000 70%);border-radius:50%;bottom:-200px;content:"";height:400px;position:absolute;right:-200px;width:400px}.login-box{animation:slideUp .6s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffffffa;border:1px solid #fff3;border-radius:24px;box-shadow:0 30px 80px #0000004d;max-width:480px;padding:48px;position:relative;width:100%;z-index:1}.login-header{margin-bottom:40px;text-align:center}.login-header h1{-webkit-text-fill-color:#0000;animation:fadeIn .6s ease-out .2s both;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;font-size:36px;font-weight:800;letter-spacing:-.5px;margin-bottom:12px}.login-header p{animation:fadeIn .6s ease-out .3s both;color:#7f8c8d;font-size:16px;font-weight:500}.login-form{margin-bottom:32px}.login-form .form-group{animation:fadeIn .6s ease-out .4s both;margin-bottom:24px}.login-form label{color:#2c3e50;display:block;font-size:14px;font-weight:700;letter-spacing:.3px;margin-bottom:10px;text-transform:uppercase}.login-form input{background:#fff;border:2px solid #e9ecef;border-radius:14px;color:#2c3e50;font-size:16px;padding:16px 20px;transition:all .3s ease;width:100%}.login-form input:focus{border-color:#667eea;box-shadow:0 0 0 6px #667eea1a;outline:none;transform:translateY(-2px)}.login-form input::placeholder{color:#bdc3c7;font-size:15px}.login-form input:hover{border-color:#ced4da}.login-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:14px;box-shadow:0 8px 20px #667eea66;color:#fff;cursor:pointer;font-size:17px;font-weight:700;letter-spacing:1px;overflow:hidden;padding:18px;position:relative;text-transform:uppercase;transition:all .3s ease;width:100%}.login-button:before{background:#fff3;border-radius:50%;content:"";height:0;left:50%;position:absolute;top:50%;transform:translate(-50%,-50%);transition:width .6s,height .6s;width:0}.login-button:hover:before{height:300px;width:300px}.login-button:hover:not(:disabled){box-shadow:0 12px 28px #667eea80;transform:translateY(-3px)}.login-button:active:not(:disabled){box-shadow:0 6px 16px #667eea66;transform:translateY(-1px)}.login-button:disabled{cursor:not-allowed;opacity:.7;transform:none}.demo-credentials{animation:fadeIn .6s ease-out .5s both;background:linear-gradient(135deg,#f8f9fa,#e9ecef);border:2px solid #e9ecef;border-radius:16px;overflow:hidden;padding:24px;position:relative}.demo-credentials:before{background:linear-gradient(90deg,#667eea,#764ba2);content:"";height:3px;left:0;position:absolute;right:0;top:0}.demo-credentials p{color:#495057;font-size:14px;line-height:1.6;margin:10px 0}.demo-credentials strong{color:#2c3e50;display:block;font-size:15px;font-weight:700;letter-spacing:.5px;margin-bottom:12px;text-transform:uppercase}.demo-credentials code{background:#fff;border:1px solid #e9ecef;border-radius:8px;color:#667eea;display:inline-block;font-family:Consolas,Monaco,Courier New,monospace;font-size:13px;font-weight:600;padding:4px 10px;transition:all .3s ease}.demo-credentials code:hover{background:#667eea;box-shadow:0 2px 8px #667eea4d;color:#fff;transform:scale(1.05)}.error-message{align-items:center;animation:shake .5s ease;background:linear-gradient(135deg,#f8d7da,#f5c6cb);border:2px solid #f5c6cb;border-radius:12px;color:#721c24;display:flex;font-size:14px;font-weight:600;gap:12px;margin-bottom:20px;padding:16px 20px}.error-message:before{content:"⚠️";font-size:20px}.success-modal-overlay{align-items:center;animation:fadeIn .3s ease;background:#00000080;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:2000}.success-modal{animation:slideUp .3s ease;background:#fff;border-radius:20px;box-shadow:0 20px 60px #0000004d;max-width:400px;padding:40px;text-align:center;width:90%}.success-modal-icon{align-items:center;background:linear-gradient(135deg,#28a745,#20c997);border-radius:50%;box-shadow:0 10px 30px #28a74566;color:#fff;display:flex;font-size:40px;height:80px;justify-content:center;margin:0 auto 24px;width:80px}.success-modal p{color:#2c3e50;font-size:18px;font-weight:600;margin:0 0 24px}.success-modal-btn{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 8px 20px #667eea66;color:#fff;cursor:pointer;font-size:16px;font-weight:700;padding:14px 40px;transition:all .3s ease}.success-modal-btn:hover{box-shadow:0 12px 28px #667eea80;transform:translateY(-2px)}.form-row{display:flex;gap:16px}.form-row .form-group{flex:1 1}.auth-toggle{border-top:1px solid #e9ecef;margin-top:24px;padding-top:24px;text-align:center}.auth-toggle p{color:#7f8c8d;font-size:14px;margin:0}.toggle-link{background:none;border:none;color:#667eea;cursor:pointer;font-size:14px;font-weight:700;margin-left:8px;transition:color .3s}.toggle-link:hover{color:#764ba2;text-decoration:underline}.service-provider-link{border-top:1px solid #e9ecef;margin-top:16px;padding-top:16px;text-align:center}.service-provider-link p{color:#95a5a6;font-size:13px;margin:0}.vin-history-link{border-top:1px solid #e9ecef;margin-top:16px;padding-top:16px;text-align:center}.vin-history-link p{color:#95a5a6;font-size:13px;margin:0}.login-box.wide{max-width:600px}.login-form select{-webkit-appearance:none;appearance:none;background:#fff;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23667eea' d='M6 8 1 3h10z'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;border:2px solid #e9ecef;border-radius:14px;color:#2c3e50;cursor:pointer;font-size:16px;padding:16px 20px;transition:all .3s ease;width:100%}.login-form select:focus{border-color:#667eea;box-shadow:0 0 0 6px #667eea1a;outline:none}.login-form textarea{background:#fff;border:2px solid #e9ecef;border-radius:14px;color:#2c3e50;font-family:inherit;font-size:16px;min-height:80px;padding:16px 20px;resize:vertical;transition:all .3s ease;width:100%}.login-form textarea:focus{border-color:#667eea;box-shadow:0 0 0 6px #667eea1a;outline:none}.login-form textarea::placeholder{color:#bdc3c7;font-size:15px}@media (max-width:480px){.login-box{border-radius:20px;padding:32px 24px}.login-header h1{font-size:30px}.login-header p{font-size:14px}.login-button{font-size:16px;padding:16px}.demo-credentials{padding:20px}.demo-credentials p{font-size:13px}.form-row{flex-direction:column;gap:0}}@media (max-width:360px){.login-container{padding:12px}.login-box{padding:24px 16px}.login-header h1{font-size:26px}}.login-button.loading{color:#0000;position:relative}.login-button.loading:after{animation:spin .8s linear infinite;border:3px solid #ffffff4d;border-radius:50%;border-top-color:#fff;content:"";height:20px;left:50%;margin-left:-10px;margin-top:-10px;position:absolute;top:50%;width:20px}.login-box:before{background:radial-gradient(circle,#667eea1a 0,#0000 70%);height:100%;right:-50%;top:-50%;width:100%}.login-box:after,.login-box:before{content:"";pointer-events:none;position:absolute}.login-box:after{background:radial-gradient(circle,#764ba214 0,#0000 70%);bottom:-30%;height:80%;left:-30%;width:80%}.landing-page{background:#f8f9fa;min-height:100vh}.test-mode-banner{align-items:center;animation:pulse-banner 2s ease-in-out infinite;background:linear-gradient(135deg,#f39c12,#e74c3c);color:#fff;display:flex;font-size:15px;font-weight:600;gap:12px;justify-content:center;padding:12px 20px;text-align:center}.test-mode-banner .test-icon{animation:shake 2s ease-in-out infinite;font-size:18px}@keyframes pulse-banner{0%,to{opacity:1}50%{opacity:.9}}@keyframes shake{0%,to{transform:rotate(0deg)}25%{transform:rotate(-10deg)}75%{transform:rotate(10deg)}}.landing-nav{background:#fff;box-shadow:0 2px 10px #0000000d;justify-content:space-between;padding:20px 60px;position:-webkit-sticky;position:sticky;top:0;z-index:100}.landing-nav,.nav-logo{align-items:center;display:flex}.nav-logo{color:#2c3e50;font-size:24px;font-weight:700;gap:12px}.logo-icon{color:#667eea;font-size:32px}.nav-actions{gap:20px}.nav-actions,.nav-link{align-items:center;display:flex}.nav-link{border-radius:8px;color:#495057;font-weight:500;gap:8px;padding:10px 20px;text-decoration:none;transition:all .3s}.nav-link:hover{background:#f1f3f5;color:#667eea}.nav-btn{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;color:#fff;display:flex;font-weight:600;gap:8px;padding:12px 24px;text-decoration:none;transition:all .3s}.nav-btn:hover{box-shadow:0 4px 12px #667eea66;transform:translateY(-2px)}.landing-hero{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;justify-content:space-between;min-height:500px;padding:80px 60px}.hero-content{max-width:600px}.hero-content h1{font-size:48px;font-weight:800;line-height:1.2;margin-bottom:20px}.hero-content p{font-size:20px;line-height:1.6;margin-bottom:40px;opacity:.9}.hero-buttons{display:flex;flex-wrap:wrap;gap:20px}.btn-primary-large{align-items:center;background:#fff;border-radius:12px;color:#667eea;display:flex;font-size:18px;font-weight:600;gap:10px;padding:16px 32px;text-decoration:none;transition:all .3s}.btn-primary-large:hover{box-shadow:0 8px 20px #0003;transform:translateY(-3px)}.btn-secondary-large{align-items:center;background:#0000;border:2px solid #fff;border-radius:12px;color:#fff;display:flex;font-size:18px;font-weight:600;gap:10px;padding:14px 30px;text-decoration:none;transition:all .3s}.btn-secondary-large:hover{background:#fff;color:#667eea}.hero-image{flex-shrink:0}.hero-graphic{align-items:center;animation:float 3s ease-in-out infinite;background:#ffffff1a;border-radius:50%;display:flex;height:300px;justify-content:center;width:300px}.hero-car-icon{color:#ffffffe6;font-size:150px}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-20px)}}.features-section{background:#fff;padding:80px 60px}.features-section h2{color:#2c3e50;font-size:36px;margin-bottom:60px;text-align:center}.features-grid{grid-gap:30px;display:grid;gap:30px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));margin:0 auto;max-width:1200px}.feature-card{background:#f8f9fa;border-radius:16px;padding:40px 30px;text-align:center;transition:all .3s}.feature-card:hover{background:#fff;box-shadow:0 12px 30px #0000001a;transform:translateY(-8px)}.feature-icon{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;color:#fff;display:flex;font-size:32px;height:80px;justify-content:center;margin:0 auto 24px;width:80px}.feature-card h3{color:#2c3e50;font-size:22px;margin-bottom:16px}.feature-card p{color:#6c757d;line-height:1.7}.feature-icon.provider-icon{background:linear-gradient(135deg,#f093fb,#f5576c)}.how-it-works-section{background:#f8f9fa;padding:80px 60px}.how-it-works-section h2{color:#2c3e50;font-size:36px;margin-bottom:60px;text-align:center}.steps-grid{grid-gap:30px;display:grid;gap:30px;grid-template-columns:repeat(4,1fr);margin:0 auto;max-width:1200px}.step-card{background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;padding:40px 25px;position:relative;text-align:center;transition:all .3s}.step-card:hover{box-shadow:0 12px 30px #00000026;transform:translateY(-8px)}.step-number{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 12px #667eea66;color:#fff;font-size:18px;font-weight:700;height:40px;left:50%;position:absolute;top:-15px;transform:translateX(-50%);width:40px}.step-icon,.step-number{align-items:center;border-radius:50%;display:flex;justify-content:center}.step-icon{background:#f1f3f5;color:#667eea;font-size:28px;height:70px;margin:20px auto;width:70px}.step-card h3{color:#2c3e50;font-size:18px;margin-bottom:12px}.step-card p{color:#6c757d;font-size:14px;line-height:1.6}.providers-info-section{background:linear-gradient(135deg,#2c3e50,#34495e);padding:80px 60px}.providers-content{margin:0 auto;max-width:900px}.providers-text{color:#fff;text-align:center}.providers-text h2{align-items:center;display:flex;font-size:32px;gap:15px;justify-content:center;margin-bottom:20px}.providers-text>p{font-size:18px;margin-bottom:30px;opacity:.9}.providers-benefits{grid-gap:16px;display:grid;gap:16px;grid-template-columns:repeat(2,1fr);list-style:none;margin-bottom:40px;margin-left:auto;margin-right:auto;max-width:600px;padding:0;text-align:left}.providers-benefits li{align-items:center;background:#ffffff1a;border-radius:8px;display:flex;font-size:16px;gap:12px;padding:12px 16px}.providers-benefits li:before{align-items:center;background:#27ae60;border-radius:50%;color:#fff;content:"✓";display:flex;flex-shrink:0;font-size:12px;font-weight:700;height:24px;justify-content:center;width:24px}.btn-provider{align-items:center;background:linear-gradient(135deg,#f093fb,#f5576c);border-radius:12px;color:#fff;display:inline-flex;font-size:18px;font-weight:600;gap:10px;padding:16px 32px;text-decoration:none;transition:all .3s}.btn-provider:hover{box-shadow:0 8px 20px #f093fb66;transform:translateY(-3px)}.cta-section{background:linear-gradient(135deg,#11998e,#38ef7d);color:#fff;padding:80px 60px;text-align:center}.cta-section h2{font-size:36px;margin-bottom:16px}.cta-section p{font-size:18px;margin-bottom:40px;opacity:.9}.cta-buttons .btn-primary-large{display:inline-flex}.landing-footer{background:#2c3e50;color:#ffffffb3;padding:30px 60px;text-align:center}@media (max-width:1024px){.landing-hero{flex-direction:column;padding:60px 40px;text-align:center}.hero-content{margin-bottom:40px}.hero-buttons{justify-content:center}.hero-graphic{height:200px;width:200px}.hero-car-icon{font-size:100px}.steps-grid{grid-template-columns:repeat(2,1fr)}.providers-benefits{grid-template-columns:1fr}}@media (max-width:768px){.landing-nav{flex-wrap:wrap;gap:15px;padding:15px 20px}.nav-logo{font-size:20px}.nav-actions{gap:10px}.nav-link{font-size:14px;padding:8px 12px}.nav-btn{font-size:14px;padding:10px 16px}.landing-hero{min-height:auto;padding:40px 20px}.hero-content h1{font-size:32px}.hero-content p{font-size:16px}.btn-primary-large,.btn-secondary-large{font-size:16px;padding:14px 24px}.cta-section,.features-section,.how-it-works-section,.providers-info-section{padding:60px 20px}.cta-section h2,.features-section h2,.how-it-works-section h2{font-size:28px}.feature-card{padding:30px 20px}.steps-grid{gap:40px;grid-template-columns:1fr}.step-card{padding:30px 20px}.providers-text h2{font-size:26px}.btn-provider{font-size:16px;padding:14px 24px}.landing-footer{padding:20px}}@media (max-width:480px){.hero-buttons{flex-direction:column;width:100%}.btn-primary-large,.btn-secondary-large{justify-content:center;width:100%}.hero-graphic{display:none}}.dashboard{max-width:1400px}.dashboard-header{margin-bottom:30px}.dashboard-header h1{color:#2c3e50;font-size:32px;margin-bottom:8px}.dashboard-header p{color:#7f8c8d;font-size:16px}.stats-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:40px}.stat-card{align-items:center;background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;display:flex;gap:20px;padding:24px;transition:transform .3s,box-shadow .3s}.stat-card:hover{box-shadow:0 8px 20px #00000026;transform:translateY(-4px)}.stat-card.clickable{cursor:pointer}.stat-card.clickable:active{transform:translateY(-2px)}.stat-icon{align-items:center;border-radius:12px;color:#fff;display:flex;font-size:28px;height:60px;justify-content:center;width:60px}.stat-card.blue .stat-icon{background:linear-gradient(135deg,#667eea,#764ba2)}.stat-card.green .stat-icon{background:linear-gradient(135deg,#f093fb,#f5576c)}.stat-card.purple .stat-icon{background:linear-gradient(135deg,#4facfe,#00f2fe)}.stat-card.orange .stat-icon{background:linear-gradient(135deg,#fa709a,#fee140)}.stat-details h3{color:#2c3e50;font-size:32px;font-weight:700;margin:0}.stat-details p{color:#7f8c8d;font-size:14px;margin:4px 0 0}.dashboard-content{grid-gap:24px;display:grid;gap:24px;grid-template-columns:2fr 1fr}.alerts-section,.recent-section{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;padding:24px}.alerts-section h2,.recent-section h2{color:#2c3e50;font-size:20px;margin-bottom:20px}.maintenance-list{display:flex;flex-direction:column;gap:12px}.maintenance-item{background:#f8f9fa;border-left:4px solid #3498db;border-radius:10px;overflow:hidden;transition:box-shadow .2s,border-color .2s}.maintenance-item:hover{box-shadow:0 2px 8px #0000001a}.maintenance-item.expanded{border-left-color:#667eea;box-shadow:0 4px 12px #667eea33}.maintenance-header{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:16px;transition:background .2s}.maintenance-header:hover{background:#e9ecef}.maintenance-info h4{color:#2c3e50;font-size:15px;margin:0 0 4px}.maintenance-info p{color:#7f8c8d;font-size:13px;margin:0 0 4px}.maintenance-date{color:#95a5a6;font-size:12px}.maintenance-right{align-items:center;display:flex;gap:16px}.maintenance-cost{color:#27ae60;font-size:18px;font-weight:700}.expand-icon{transition:color .2s}.maintenance-item.expanded .expand-icon{color:#667eea}.maintenance-details{animation:slideDown .2s ease-out;border-top:1px solid #e9ecef;padding:0 16px 16px}.maintenance-details .detail-row{border-bottom:1px solid #e9ecef;display:flex;padding:12px 0}.maintenance-details .detail-row:last-child{border-bottom:none}.maintenance-details .detail-row strong{color:#6c757d;font-weight:500;min-width:160px}.maintenance-details .detail-row span{color:#2c3e50;flex:1 1}.maintenance-details .status-badge{border-radius:12px;display:inline-block;font-size:12px;font-weight:500;padding:4px 10px}.maintenance-details .status-badge.completed{background:#d4edda;color:#155724}.maintenance-details .status-badge.pending{background:#fff3cd;color:#856404}.maintenance-details .status-badge.in_progress{background:#cce5ff;color:#004085}.alert{align-items:center;border-radius:8px;display:flex;gap:12px;margin-bottom:12px;padding:16px}.alert svg{flex-shrink:0;font-size:24px}.alert.warning{background:#fff3cd;border:1px solid #ffc107;color:#856404}.alert.info{background:#d1ecf1;border:1px solid #17a2b8;color:#0c5460}.alert p{font-size:14px;margin:0}.no-data{color:#7f8c8d;font-size:15px;padding:40px}@media (max-width:1024px){.dashboard-content{grid-template-columns:1fr}}@media (max-width:768px){.stats-grid{grid-template-columns:1fr}.dashboard-header h1{font-size:24px}.maintenance-details .detail-row{flex-direction:column;gap:4px}.maintenance-details .detail-row strong{min-width:auto}}.pending-approvals-section{background:#fff;border:2px solid #f39c12;border-radius:12px;box-shadow:0 2px 8px #0000001a;grid-column:1/-1;margin-bottom:24px;padding:24px}.pending-approvals-section .section-header h2{align-items:center;color:#2c3e50;display:flex;font-size:20px;gap:10px;margin-bottom:20px}.pending-approvals-section .section-header h2 svg{color:#f39c12}.pending-count{align-items:center;background:#e74c3c;border-radius:12px;color:#fff;display:inline-flex;font-size:14px;font-weight:600;height:24px;justify-content:center;margin-left:8px;min-width:24px;padding:0 8px}.pending-list{display:flex;flex-direction:column;gap:12px}.pending-item{background:#fffbf0;border-left:4px solid #f39c12;border-radius:10px;overflow:hidden;transition:box-shadow .2s,border-color .2s}.pending-item:hover{box-shadow:0 2px 8px #f39c1233}.pending-item.expanded{border-left-color:#e67e22;box-shadow:0 4px 12px #f39c124d}.pending-header{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:16px;transition:background .2s}.pending-header:hover{background:#fff3cd}.pending-info h4{color:#2c3e50;font-size:15px;margin:0 0 4px}.pending-info p{color:#7f8c8d;font-size:13px;margin:0 0 4px}.pending-date{color:#95a5a6;font-size:12px}.pending-right{align-items:center;display:flex;gap:16px}.pending-cost{color:#e67e22;font-size:18px;font-weight:700}.pending-details{animation:slideDown .2s ease-out;border-top:1px solid #f5e6c8;padding:0 16px 16px}.pending-details .detail-row{border-bottom:1px solid #f5e6c8;display:flex;padding:12px 0}.pending-details .detail-row:last-child{border-bottom:none}.pending-details .detail-row strong{color:#6c757d;font-weight:500;min-width:160px}.pending-details .detail-row span{color:#2c3e50;flex:1 1}.approval-actions{border-top:1px solid #f5e6c8;display:flex;gap:12px;margin-top:8px;padding-top:16px}.btn-approve,.btn-reject{align-items:center;border:none;border-radius:8px;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;padding:10px 20px;transition:all .2s}.btn-approve{background:linear-gradient(135deg,#27ae60,#2ecc71);color:#fff}.btn-approve:hover{box-shadow:0 4px 12px #27ae6066;transform:translateY(-2px)}.btn-reject{background:linear-gradient(135deg,#e74c3c,#c0392b);color:#fff}.btn-reject:hover{box-shadow:0 4px 12px #e74c3c66;transform:translateY(-2px)}@media (max-width:768px){.approval-actions{flex-direction:column}.pending-details .detail-row{flex-direction:column;gap:4px}.pending-details .detail-row strong{min-width:auto}}.vehicles-page{max-width:1400px}.vehicles-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(min(350px,100%),1fr))}.vehicle-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;overflow:visible;transition:transform .3s,box-shadow .3s}.vehicle-card:hover{box-shadow:0 8px 20px #00000026;transform:translateY(-4px)}.vehicle-header{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;gap:12px;padding:20px}.vehicle-icon{font-size:28px}.vehicle-header h3{flex:1 1;font-size:20px;margin:0}.vehicle-body{padding:20px}.vehicle-body p{color:#495057;display:flex;font-size:14px;justify-content:space-between;margin:10px 0}.vehicle-body strong{color:#2c3e50}.vehicle-actions{background:#f8f9fa;border-top:1px solid #e9ecef;display:flex;flex-wrap:wrap;gap:10px;padding:16px}.vehicle-actions button{flex:1 1 auto;font-size:13px;min-width:120px;padding:8px 12px;white-space:nowrap}@media (max-width:1400px){.vehicle-actions{flex-direction:column;gap:8px}.vehicle-actions button{justify-content:center;min-width:0;min-width:auto;width:100%}}@media (max-width:768px){.vehicles-page{padding:10px}.vehicles-page .page-header{align-items:stretch;flex-direction:column;gap:16px}.vehicles-page .page-header h1{font-size:22px;text-align:center}.vehicles-page .header-actions{flex-direction:column;gap:12px}.vehicles-page .search-box{width:100%}.vehicles-page .header-actions .btn-primary{justify-content:center;width:100%}.vehicles-grid{gap:16px;grid-template-columns:1fr}.vehicle-header{padding:16px}.vehicle-header h3{font-size:16px}.vehicle-icon{font-size:22px}.vehicle-body{padding:16px}.vehicle-actions{padding:12px}}@media (max-width:480px){.vehicle-header{flex-wrap:wrap;gap:8px}.vehicle-header h3{flex:1 1;font-size:14px;order:1}.vehicle-icon{font-size:20px}.status-badge{font-size:11px;padding:4px 8px}.vehicle-body p{flex-direction:column;font-size:13px;gap:2px}}.btn-service-history{align-items:center;background:linear-gradient(135deg,#11998e,#38ef7d);border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:14px;gap:8px;padding:10px 16px;transition:transform .2s,box-shadow .2s}.btn-service-history:hover{box-shadow:0 4px 12px #11998e66;transform:translateY(-2px)}.service-history-modal{display:flex;flex-direction:column;max-height:80vh;max-width:700px}.service-history-header{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px 12px 0 0;color:#fff;padding:20px;position:relative}.service-history-header h2{align-items:center;display:flex;font-size:22px;gap:10px;margin:0}.service-history-header .vehicle-info{font-size:14px;margin:8px 0 0;opacity:.9}.service-history-header .close-btn{align-items:center;background:#fff3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;height:32px;justify-content:center;position:absolute;right:15px;top:15px;transition:background .2s;width:32px}.service-history-header .close-btn:hover{background:#ffffff4d}.service-history-content{flex:1 1;overflow-y:auto;padding:20px}.no-services{color:#6c757d;padding:40px 20px;text-align:center}.no-services-icon{font-size:48px;margin-bottom:16px;opacity:.5}.no-services p{font-size:16px;margin:0}.service-records-list{display:flex;flex-direction:column;gap:12px}.service-record-item{background:#f8f9fa;border:1px solid #e9ecef;border-radius:10px;overflow:hidden;transition:box-shadow .2s}.service-record-item:hover{box-shadow:0 2px 8px #0000001a}.service-record-item.expanded{border-color:#667eea;box-shadow:0 4px 12px #667eea33}.service-record-header{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:16px;transition:background .2s}.service-record-header:hover{background:#e9ecef}.record-main-info{align-items:center;display:flex;flex-wrap:wrap;gap:16px}.service-type-badge{font-size:13px;font-weight:500}.service-date{color:#495057;font-size:14px}.service-cost{color:#2c3e50;font-size:15px;font-weight:600}.expand-icon{color:#6c757d;font-size:14px;transition:transform .2s}.service-record-item.expanded .expand-icon{color:#667eea}.service-record-details{animation:slideDown .2s ease-out;border-top:1px solid #e9ecef;margin-top:0;padding:0 16px 16px}.detail-row{border-bottom:1px solid #e9ecef}.detail-row strong{color:#6c757d;font-weight:500;min-width:160px}.detail-row span{color:#2c3e50;flex:1 1}.detail-row .status-badge{border-radius:12px;display:inline-block;font-size:12px;font-weight:500;padding:4px 10px}.detail-row .status-badge.completed{background:#d4edda;color:#155724}.detail-row .status-badge.pending{background:#fff3cd;color:#856404}.detail-row .status-badge.in_progress{background:#cce5ff;color:#004085}@media (max-width:576px){.record-main-info{align-items:flex-start;flex-direction:column;gap:8px}.detail-row{flex-direction:column;gap:4px}.detail-row strong{min-width:auto}.service-history-modal{border-radius:12px;margin:10px;max-height:90vh;max-width:100%}.service-history-header{padding:16px}.service-history-header h2{font-size:18px;padding-right:30px}.service-history-content,.service-record-header{padding:12px}.service-type-badge{font-size:12px;padding:4px 10px}.vehicles-page .modal-content{margin:10px;max-height:90vh;overflow-y:auto}.vehicles-page .modal-content h2{font-size:20px}.vehicles-page .form-row{flex-direction:column;gap:0}.vehicles-page .modal-actions{flex-direction:column;gap:10px}.vehicles-page .modal-actions button{width:100%}}.vehicle-search-select{position:relative;width:100%}.search-input-container,.search-input-wrapper{position:relative}.search-icon{color:#999;font-size:1rem;left:12px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.vehicle-search-input{background:#fff;border:2px solid #e0e0e0;border-radius:8px;font-size:15px;padding:12px 16px 12px 40px;transition:all .3s;width:100%}.vehicle-search-input:focus{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;outline:none}.vehicle-search-input::placeholder{color:#999}.selected-vehicle-display{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;color:#fff;display:flex;gap:12px;padding:12px 16px;position:relative}.selected-vehicle-display .vehicle-icon{flex-shrink:0;font-size:1.5rem}.selected-vehicle-info{flex:1 1;min-width:0}.selected-plate{font-size:1.1rem;font-weight:700;margin-bottom:4px}.selected-details{font-size:.85rem;opacity:.9;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.clear-button{align-items:center;background:#fff3;border:none;border-radius:50%;color:#fff;cursor:pointer;display:flex;flex-shrink:0;height:30px;justify-content:center;transition:all .3s;width:30px}.clear-button:hover{background:#ffffff4d;transform:scale(1.1)}.search-dropdown{animation:slideDown .2s ease;background:#fff;border:2px solid #e0e0e0;border-radius:8px;box-shadow:0 8px 24px #00000026;left:0;max-height:400px;overflow-y:auto;position:absolute;right:0;top:calc(100% + 8px);z-index:1000}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.vehicle-list{padding:8px}.vehicle-item{align-items:center;border:1px solid #0000;border-radius:6px;cursor:pointer;display:flex;gap:12px;padding:12px;transition:all .2s}.vehicle-item.highlighted,.vehicle-item:hover{background:linear-gradient(135deg,#667eea1a,#764ba21a);border-color:#667eea}.vehicle-item .vehicle-icon{color:#667eea;flex-shrink:0;font-size:1.5rem}.vehicle-info{flex:1 1;min-width:0}.vehicle-plate{align-items:center;color:#333;display:flex;font-size:1rem;font-weight:700;gap:8px;margin-bottom:4px}.vehicle-status-dot{font-size:1.5rem;line-height:1}.vehicle-status-dot[data-status=AVAILABLE]{color:#28a745}.vehicle-status-dot[data-status=IN_USE]{color:#17a2b8}.vehicle-status-dot[data-status=MAINTENANCE]{color:#ffc107}.vehicle-status-dot[data-status=OUT_OF_SERVICE]{color:#dc3545}.vehicle-details{color:#666;font-size:.9rem;margin-bottom:2px}.vehicle-vin{color:#999;font-family:monospace;font-size:.8rem}.no-results{color:#999;padding:32px 16px}.no-results p{margin:8px 0}.search-hint{color:#666;font-size:.9rem;font-style:italic}.search-dropdown::-webkit-scrollbar{width:8px}.search-dropdown::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.search-dropdown::-webkit-scrollbar-thumb{background:#667eea;border-radius:4px}.search-dropdown::-webkit-scrollbar-thumb:hover{background:#764ba2}@media (max-width:768px){.selected-plate{font-size:1rem}.selected-details{font-size:.8rem}.vehicle-item{padding:10px}.search-dropdown{max-height:300px}}.maintenance-page{max-width:1400px}.tabs{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000000f;margin-top:20px;padding:8px}.tab,.tabs{display:flex;gap:8px}.tab{align-items:center;background:#0000;border:none;border-radius:8px;color:#6c757d;cursor:pointer;font-size:14px;font-weight:600;padding:12px 24px;transition:all .3s ease}.tab:hover{background:#f8f9fa;color:#495057}.tab.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.tab .badge{align-items:center;background:#e74c3c;border-radius:11px;color:#fff;display:inline-flex;font-size:12px;font-weight:700;height:22px;justify-content:center;min-width:22px;padding:0 6px}.tab.active .badge{background:#ffffff4d}.btn-icon.success{color:#27ae60}.btn-icon.success:hover{background:#27ae60;color:#fff}.empty-message{color:#95a5a6;font-style:italic;padding:40px 20px!important;text-align:center}.maintenance-table{background:#fff;border-radius:16px;box-shadow:0 4px 20px #00000014;margin-top:24px;overflow:hidden}.maintenance-table table{border-collapse:initial;border-spacing:0;width:100%}.maintenance-table thead{background:linear-gradient(135deg,#667eea,#764ba2);position:-webkit-sticky;position:sticky;top:0;z-index:10}.maintenance-table th{border:none;color:#fff;font-size:13px;font-weight:600;letter-spacing:.8px;padding:18px 16px;text-align:left;text-transform:uppercase}.maintenance-table th:first-child{border-radius:16px 0 0 0;padding-left:24px}.maintenance-table th:last-child{border-radius:0 16px 0 0;padding-right:24px}.maintenance-table tbody tr{border-bottom:1px solid #f1f3f5;transition:all .3s ease}.maintenance-table tbody tr:hover{background:linear-gradient(90deg,#f8f9fa,#fff);box-shadow:0 4px 12px #0000000d;transform:translateY(-2px)}.maintenance-table tbody tr:last-child{border-bottom:none}.maintenance-table td{color:#495057;font-size:14px;padding:20px 16px;vertical-align:middle}.maintenance-table td:first-child{color:#2c3e50;font-weight:600;padding-left:24px}.maintenance-table td:last-child{padding-right:24px}.service-type-badge{background:linear-gradient(135deg,#667eea,#764ba2);font-size:12px;font-weight:600;gap:6px;letter-spacing:.5px;padding:6px 12px;text-transform:uppercase}.cost-badge,.service-type-badge{align-items:center;display:inline-flex}.cost-badge{background:linear-gradient(135deg,#11998e,#38ef7d);border-radius:25px;box-shadow:0 4px 12px #11998e4d;color:#fff;font-size:15px;font-weight:700;padding:8px 16px}.date-display{display:flex;flex-direction:column;gap:2px}.date-display .date{color:#2c3e50;font-weight:600}.date-display .time{color:#95a5a6;font-size:12px}.vehicle-info{gap:10px}.vehicle-info .license-plate{background:#e9ecef;border-radius:6px;color:#2c3e50;font-size:13px;font-weight:700;letter-spacing:.5px;padding:4px 10px}.vehicle-info .vehicle-name{color:#7f8c8d;font-size:13px}.provider-name{color:#495057}.provider-name svg{color:#3498db;font-size:16px}.actions{display:flex;gap:8px;justify-content:flex-end}.mileage-display{align-items:center;color:#7f8c8d;display:flex;gap:6px}.mileage-display svg{color:#e74c3c}.no-data svg{font-size:64px;margin-bottom:16px;opacity:.3}@media (max-width:1024px){.maintenance-table{background:#0000;box-shadow:none;overflow:visible}.maintenance-table table{display:block}.maintenance-table thead{display:none}.maintenance-table tbody{display:flex;flex-direction:column;gap:16px}.maintenance-table tbody tr{background:#fff;border:none;border-radius:16px;box-shadow:0 4px 20px #00000014;display:flex;flex-direction:column;gap:12px;padding:20px}.maintenance-table tbody tr:hover{box-shadow:0 8px 30px #0000001f;transform:translateY(-4px)}.maintenance-table td{align-items:center;border-bottom:1px solid #f1f3f5;display:flex;justify-content:space-between;padding:8px 0!important}.maintenance-table td:last-child{border-bottom:none;padding-top:12px!important}.maintenance-table td:before{color:#6c757d;content:attr(data-label);flex-shrink:0;font-size:12px;font-weight:600;letter-spacing:.5px;margin-right:16px;text-transform:uppercase}.maintenance-table td:first-child{font-size:16px;padding-left:0!important}.maintenance-table td.actions{border-top:2px solid #f1f3f5;gap:12px;justify-content:flex-end;margin-top:8px;padding-top:16px!important}.maintenance-table td.actions:before{display:none}.actions{flex-direction:row;gap:12px}.tabs{flex-wrap:wrap}.tab{flex:1 1;justify-content:center;min-width:140px}}@media (max-width:480px){.maintenance-table tbody tr{padding:16px}.maintenance-table td{align-items:flex-start;flex-direction:column;gap:4px}.maintenance-table td:before{margin-bottom:4px;margin-right:0}.maintenance-table td.actions{align-items:center;flex-direction:row}.page-header{align-items:flex-start;flex-direction:column;gap:16px}.page-header .btn-primary{justify-content:center;width:100%}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}.maintenance-table.loading tbody tr{animation:shimmer 2s infinite;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:1000px 100%}.maintenance-table tbody tr{cursor:pointer}.maintenance-table tbody tr:hover .cost-badge{box-shadow:0 6px 16px #11998e66;transform:scale(1.05)}.maintenance-table tbody tr:hover .service-type-badge{transform:scale(1.05)}.status-indicator{animation:pulse 2s infinite;border-radius:50%;display:inline-block;height:8px;margin-right:8px;width:8px}.status-indicator.completed{background:#27ae60}.status-indicator.pending{background:#f39c12}.status-indicator.cancelled{background:#e74c3c}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.no-actions{color:#adb5bd;font-style:italic}.approval-badge{align-items:center;display:inline-flex;font-size:12px;padding:6px 12px}.btn-icon.view{color:#3498db}.btn-icon.view:hover{background:#3498db;color:#fff}.detail-view{display:flex;flex-direction:column;gap:16px}.detail-row{align-items:center;border-bottom:1px solid #f1f3f5;display:flex;padding:12px 0}.detail-row.full-width{align-items:flex-start;flex-direction:column}.detail-label{color:#6c757d;font-size:14px;font-weight:600;min-width:160px}.detail-value{color:#2c3e50;font-size:15px}.detail-value.cost{color:#27ae60;font-size:18px;font-weight:700}.detail-description{background:#f8f9fa;border-radius:8px;color:#495057;line-height:1.6;margin:8px 0 0;padding:12px;width:100%}.rejection-reason{color:#dc3545;font-style:italic}.providers-page{max-width:1400px}.providers-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(350px,1fr))}.provider-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden;transition:transform .3s,box-shadow .3s}.provider-card:hover{box-shadow:0 8px 20px #00000026;transform:translateY(-4px)}.provider-header{align-items:center;background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;display:flex;gap:12px;padding:20px}.provider-icon{font-size:28px}.provider-title{flex:1 1}.provider-title h3{font-size:18px;margin:0 0 4px}.rating{align-items:center;display:flex;font-size:14px;gap:4px}.rating svg{color:gold}.provider-body{padding:20px}.provider-body p{color:#495057;font-size:14px;margin:10px 0}.provider-body strong{color:#2c3e50;display:inline-block;min-width:140px}.provider-actions{background:#f8f9fa;border-top:1px solid #e9ecef;display:flex;gap:10px;padding:16px}.provider-actions button{flex:1 1}@media (max-width:768px){.providers-grid{grid-template-columns:1fr}}.users-page{max-width:1400px}.role-filter{background:#fff;border:1px solid #e9ecef;border-radius:8px;cursor:pointer;font-size:14px;min-width:150px;padding:10px 16px}.users-grid{grid-gap:24px;display:grid;gap:24px;grid-template-columns:repeat(auto-fill,minmax(350px,1fr))}.user-card{background:#fff;border-radius:12px;box-shadow:0 2px 8px #0000001a;overflow:hidden;transition:transform .3s,box-shadow .3s}.user-card:hover{box-shadow:0 8px 20px #00000026;transform:translateY(-4px)}.user-card.disabled{opacity:.7}.user-header{align-items:center;color:#fff;display:flex;gap:12px;padding:20px}.user-header.role-admin{background:linear-gradient(135deg,#667eea,#764ba2)}.user-header.role-fleet_manager{background:linear-gradient(135deg,#11998e,#38ef7d)}.user-header.role-driver{background:linear-gradient(135deg,#4facfe,#00f2fe)}.user-header.role-service_provider{background:linear-gradient(135deg,#f093fb,#f5576c)}.user-avatar-large{align-items:center;background:#fff3;border-radius:50%;display:flex;font-size:24px;height:50px;justify-content:center;width:50px}.user-title{flex:1 1}.user-title h3{font-size:18px;margin:0 0 4px}.user-username{font-size:14px;opacity:.9}.user-body{padding:20px}.user-body p{color:#495057;font-size:14px;margin:10px 0}.user-body strong{color:#2c3e50;display:inline-block;min-width:120px}.linked-provider{background:#e8f5e9;border-left:4px solid #4caf50;border-radius:8px;margin-top:12px;padding:12px}.linked-provider strong{display:block;margin-bottom:8px;min-width:auto}.provider-name{align-items:center;color:#2e7d32;display:flex;font-weight:500;gap:8px}.user-actions{background:#f8f9fa;border-top:1px solid #e9ecef;display:flex;gap:10px;padding:16px}.user-actions button{flex:1 1}.btn-toggle{background:#f1f3f4;border:none;border-radius:8px;color:#6c757d;cursor:pointer;flex:0 0 auto!important;font-size:20px;padding:10px;transition:all .3s;width:44px}.btn-toggle:hover{background:#e8eaed}.btn-toggle.active{color:#4caf50}.btn-role{align-items:center;background:#e3f2fd;border:none;border-radius:8px;color:#1976d2;cursor:pointer;display:flex;font-size:14px;gap:6px;padding:10px 16px;transition:all .3s}.btn-role:hover{background:#bbdefb}.warning-text{background:#fff3e0;border-left:4px solid #f57c00;border-radius:8px;color:#f57c00;font-size:14px;margin:16px 0;padding:12px}.status-badge{padding:4px 12px}.status-badge.active{background:#fff3}.status-badge.inactive{background:#0003;color:#fffc}.no-results{color:#6c757d;padding:60px 20px;text-align:center}.no-results p{font-size:18px}.modal-subtitle{color:#6c757d;margin-bottom:20px}.modal-subtitle strong{color:#2c3e50}@media (max-width:768px){.users-grid{grid-template-columns:1fr}.header-actions{flex-direction:column}.role-filter{width:100%}}.vin-history-page{background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;padding:2rem 1rem}.vin-header{color:#fff;margin-bottom:2rem;text-align:center}.vin-header-content h1{font-size:2.5rem;margin-bottom:.5rem;text-shadow:2px 2px 4px #0003}.vin-header-content p{font-size:1.1rem;opacity:.95}.vin-search-section{margin:0 auto 2rem;max-width:800px}.vin-search-form{background:#fff;border-radius:15px;box-shadow:0 10px 30px #0003;padding:2rem}.search-input-group{align-items:center;display:flex;gap:1rem}.vin-search-form .input-wrapper{align-items:center;background:#fff;border:2px solid #e0e0e0;border-radius:10px;display:flex;flex:1 1;padding-left:1rem;transition:border-color .3s,box-shadow .3s}.vin-search-form .input-wrapper:focus-within{border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.vin-search-form .search-icon-wrapper{align-items:center;color:#666;display:flex;flex-shrink:0;font-size:1.1rem;height:100%;justify-content:center}.vin-search-form .vin-input{background:#0000!important;box-sizing:border-box;flex:1 1;font-family:monospace;font-size:1.1rem;height:50px;padding:0 1rem!important;text-transform:uppercase}.vin-search-form .vin-input,.vin-search-form .vin-input:focus{border:none!important;box-shadow:none!important;transform:none!important}.vin-search-form .vin-input:focus{outline:none!important}.vin-search-form .vin-input:hover{border:none!important}.search-button{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:10px;color:#fff;cursor:pointer;font-size:1.1rem;font-weight:600;padding:1rem 2rem;transition:all .3s;white-space:nowrap}.search-button:hover:not(:disabled){box-shadow:0 5px 15px #667eea66;transform:translateY(-2px)}.search-button:disabled{cursor:not-allowed;opacity:.6}.error-message{background:#fee;border-left:4px solid #c33;border-radius:10px;color:#c33;margin-top:1rem;padding:1rem}.vin-results{margin:0 auto;max-width:1200px}.vin-summary{background:#fff;border-radius:15px;box-shadow:0 10px 30px #0003;margin-bottom:2rem;padding:2rem}.vin-summary h2{color:#333;font-family:monospace;font-size:1.8rem;margin-bottom:1.5rem}.summary-stats{grid-gap:1.5rem;display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}.stat-item{align-items:center;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);border-radius:10px;display:flex;gap:1rem;padding:1rem}.stat-icon{color:#667eea;font-size:2rem}.stat-value{color:#333;font-size:2rem;font-weight:700}.stat-label{color:#666;font-size:.9rem}.vehicles-list{display:flex;flex-direction:column;gap:1.5rem}.vehicle-card-detailed{background:#fff;border-radius:15px;box-shadow:0 5px 20px #0000001a;overflow:hidden;transition:all .3s}.vehicle-card-detailed:hover{box-shadow:0 8px 30px #00000026}.vehicle-card-header{align-items:center;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);cursor:pointer;display:flex;justify-content:space-between;padding:1.5rem;transition:background .3s}.vehicle-card-header:hover{background:linear-gradient(135deg,#e0e5ec,#b8c6db)}.vehicle-info{align-items:center;display:flex;gap:1rem}.vehicle-icon{color:#667eea;font-size:2rem}.vehicle-details h3{color:#333;font-size:1.5rem;margin-bottom:.3rem}.vehicle-model{color:#666;font-size:1rem}.vehicle-right{gap:1.5rem}.vehicle-right,.vehicle-stats{align-items:center;display:flex}.vehicle-stats{flex-wrap:wrap;gap:1rem}.vehicle-cost{color:#667eea;font-size:1.3rem;font-weight:700}.records-count{background:#667eea;border-radius:20px;color:#fff;font-size:.9rem;padding:.3rem .8rem}.expand-icon{color:#667eea;font-size:1.2rem}.vehicle-maintenance-history{border-top:2px solid #e0e0e0;padding:1.5rem}.vehicle-extra-info{background:#f8f9fa;border-radius:8px;margin-bottom:1.5rem;padding:1rem}.vehicle-extra-info p{color:#555;margin:.3rem 0}.maintenance-records h4{color:#333;font-size:1.2rem;margin-bottom:1rem}.maintenance-record{background:#f8f9fa;border:1px solid #e0e0e0;border-radius:10px;margin-bottom:1rem;overflow:hidden;transition:all .3s}.maintenance-record.expanded{border-color:#667eea;box-shadow:0 3px 10px #667eea1a}.record-header{align-items:center;cursor:pointer;display:flex;justify-content:space-between;padding:1rem;transition:background .3s}.record-header:hover{background:#e9ecef}.record-main{align-items:center;display:flex;gap:1rem}.service-type-badge{background:#667eea;border-radius:20px;color:#fff;font-size:.9rem;padding:.4rem 1rem;white-space:nowrap}.record-date{color:#666;font-size:.95rem}.record-right{align-items:center;display:flex;gap:1rem}.record-cost{color:#333;font-size:1.1rem;font-weight:700}.expand-icon-small{color:#667eea}.record-details{background:#fff;border-top:1px solid #e0e0e0;padding:1rem 1.5rem 1.5rem}.detail-row{grid-gap:1rem;border-bottom:1px solid #f0f0f0;display:grid;gap:1rem;grid-template-columns:200px 1fr;padding:.8rem 0}.detail-row:last-child{border-bottom:none}.detail-row strong{color:#555}.detail-row span{color:#333}.status-badge{font-size:.85rem;font-weight:600;padding:.3rem .8rem}.status-badge.available{background:#d4edda;color:#155724}.status-badge.in_use{background:#d1ecf1;color:#0c5460}.status-badge.maintenance{background:#fff3cd;color:#856404}.status-badge.out_of_service{background:#f8d7da;color:#721c24}.status-badge.completed{background:#d4edda;color:#155724}.status-badge.scheduled{background:#d1ecf1;color:#0c5460}.status-badge.pending{background:#fff3cd;color:#856404}.approval-badge{border-radius:20px;font-size:.85rem;font-weight:600;padding:.3rem .8rem}.approval-badge.approved{background:#d4edda;color:#155724}.approval-badge.pending{background:#fff3cd;color:#856404}.approval-badge.rejected{background:#f8d7da;color:#721c24}.no-maintenance{color:#666;padding:2rem;text-align:center}.vin-empty-state{color:#fff;margin:4rem auto;max-width:600px;text-align:center}.empty-icon{font-size:5rem;margin-bottom:1rem;opacity:.7}.vin-empty-state h3{font-size:2rem;margin-bottom:1rem}.vin-empty-state p{font-size:1.2rem;opacity:.9}@media (max-width:768px){.vin-header-content h1{font-size:1.8rem}.vin-search-form{padding:1.5rem}.search-input-group{flex-direction:column}.input-wrapper,.search-button,.vin-input{width:100%}.vehicle-card-header{gap:1rem}.vehicle-card-header,.vehicle-right{align-items:flex-start;flex-direction:column}.vehicle-right{width:100%}.detail-row{gap:.3rem}.detail-row,.summary-stats{grid-template-columns:1fr}}.layout{background:#f5f6fa;display:flex;min-height:100vh}.sidebar{background:#2c3e50;color:#fff;display:flex;flex-direction:column;height:100vh;overflow:hidden;position:fixed;transition:width .3s ease;width:260px;z-index:1000}.sidebar.closed{width:70px}.sidebar-header{align-items:center;border-bottom:1px solid #ffffff1a;display:flex;justify-content:space-between;padding:20px}.sidebar-header h2{font-size:22px;margin:0;white-space:nowrap}.sidebar.closed .sidebar-header h2{display:none}.toggle-btn{background:#0000;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:20px;padding:8px;transition:background .3s}.toggle-btn:hover{background:#ffffff1a}.sidebar-header{flex-shrink:0}.sidebar-nav{flex:1 1;overflow-y:auto;padding:20px 0}.nav-item{align-items:center;border-left:3px solid #0000;color:#bdc3c7;display:flex;gap:12px;padding:14px 20px;text-decoration:none;transition:all .3s}.nav-item:hover{background:#ffffff0d;color:#fff}.nav-item.active{background:#3498db33;border-left-color:#3498db;color:#fff}.nav-icon{font-size:20px;min-width:20px}.sidebar.closed .nav-item{justify-content:center;padding:14px}.sidebar.closed .nav-item span{display:none}.sidebar-footer{border-top:1px solid #ffffff1a;flex-shrink:0;padding:20px}.user-info{gap:12px;margin-bottom:12px}.user-avatar,.user-info{align-items:center;display:flex}.user-avatar{background:#3498db;border-radius:50%;flex-shrink:0;font-size:18px;font-weight:700;height:40px;justify-content:center;width:40px}.user-details{flex:1 1;min-width:0}.user-name{font-size:14px;font-weight:600;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.user-role{color:#95a5a6;font-size:12px;margin:2px 0 0}.sidebar.closed .user-details{display:none}.logout-btn{align-items:center;background:#e74c3c33;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:14px;gap:8px;justify-content:center;padding:10px;transition:background .3s;width:100%}.logout-btn:hover{background:#e74c3c66}.sidebar.closed .logout-btn span{display:none}.main-content{flex:1 1;margin-left:260px;min-height:100vh;padding:30px;transition:margin-left .3s ease}.main-content.expanded{margin-left:70px}@media (max-width:768px){.sidebar{width:70px}.sidebar-header h2{display:none}.nav-item{justify-content:center;padding:14px}.logout-btn span,.nav-item span,.user-details{display:none}.main-content{margin-left:70px}}*{box-sizing:border-box;margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f5f6fa;color:#2c3e50;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}input[type=date],input[type=email],input[type=number],input[type=password],input[type=tel],input[type=text],select,textarea{background:#fff;border:2px solid #e9ecef;border-radius:12px;color:#2c3e50;font-family:inherit;font-size:15px;outline:none;padding:14px 16px;transition:all .3s ease;width:100%}input:focus,select:focus,textarea:focus{border-color:#667eea;box-shadow:0 0 0 4px #667eea1a;transform:translateY(-2px)}input:hover,select:hover,textarea:hover{border-color:#ced4da}input::placeholder,textarea::placeholder{color:#adb5bd;font-size:14px}input:disabled,select:disabled,textarea:disabled{background:#f8f9fa;border-color:#e9ecef;color:#adb5bd;cursor:not-allowed}select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23667eea' d='M6 9 1 4h10z'/%3E%3C/svg%3E");background-position:right 16px center;background-repeat:no-repeat;cursor:pointer;padding-right:40px}select:focus{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12'%3E%3Cpath fill='%23667eea' d='m6 3 5 5H1z'/%3E%3C/svg%3E")}textarea{line-height:1.6;min-height:100px;resize:vertical}button,textarea{font-family:inherit}button{border:none;cursor:pointer;outline:none;transition:all .3s ease}.btn-primary,button.btn-primary{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 4px 12px #667eea4d;color:#fff;display:inline-flex;font-size:15px;font-weight:600;gap:8px;padding:14px 28px}.btn-primary:hover{box-shadow:0 8px 20px #667eea66;transform:translateY(-2px)}.btn-primary:active{box-shadow:0 2px 8px #667eea4d;transform:translateY(0)}.btn-primary:disabled{cursor:not-allowed;opacity:.6;transform:none}.btn-secondary{align-items:center;background:#fff;border:2px solid #667eea;border-radius:12px;color:#667eea;display:inline-flex;font-size:15px;font-weight:600;gap:8px;padding:14px 28px}.btn-secondary:hover{background:#667eea;box-shadow:0 4px 12px #667eea33;color:#fff;transform:translateY(-2px)}.btn-edit{align-items:center;background:linear-gradient(135deg,#f093fb,#f5576c);border-radius:10px;box-shadow:0 4px 12px #f093fb4d;color:#fff;display:inline-flex;font-size:14px;font-weight:600;gap:6px;padding:10px 20px}.btn-edit:hover{box-shadow:0 6px 16px #f093fb66;transform:translateY(-2px)}.btn-delete{align-items:center;background:linear-gradient(135deg,#fa709a,#fee140);border-radius:10px;box-shadow:0 4px 12px #fa709a4d;color:#fff;display:inline-flex;font-size:14px;font-weight:600;gap:6px;padding:10px 20px}.btn-delete:hover{box-shadow:0 6px 16px #fa709a66;transform:translateY(-2px)}.btn-icon{align-items:center;background:#e9ecef;border-radius:10px;color:#495057;display:inline-flex;font-size:16px;height:40px;justify-content:center;padding:10px;transition:all .3s ease;width:40px}.btn-icon:hover{background:#667eea;box-shadow:0 4px 12px #667eea4d;color:#fff;transform:translateY(-2px)}.btn-icon.danger{background:#fee;color:#e74c3c}.btn-icon.danger:hover{background:#e74c3c;box-shadow:0 4px 12px #e74c3c4d;color:#fff}.form-group{margin-bottom:20px}.form-group label{color:#2c3e50;display:block;font-size:14px;font-weight:600;letter-spacing:.3px;margin-bottom:8px}.form-group label:after{color:#e74c3c;content:attr(data-required);margin-left:4px}.form-row{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));margin-bottom:20px}input[type=checkbox],input[type=radio]{accent-color:#667eea;cursor:pointer;margin-right:8px;width:auto}.checkbox-group,.radio-group{align-items:center;border:2px solid #e9ecef;border-radius:10px;display:flex;gap:12px;padding:12px;transition:all .3s ease}.checkbox-group:hover,.radio-group:hover{background:#f8f9ff;border-color:#667eea}.status-badge{align-items:center;border-radius:20px;display:inline-flex;font-size:12px;font-weight:700;letter-spacing:.5px;padding:6px 14px;text-transform:uppercase}.status-badge.active{background:linear-gradient(135deg,#11998e,#38ef7d);box-shadow:0 2px 8px #11998e4d;color:#fff}.status-badge.inactive{background:#e9ecef;color:#6c757d}.status-badge.pending{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.status-badge.available{background:linear-gradient(135deg,#4facfe,#00f2fe);color:#fff}.status-badge.in_use{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.status-badge.maintenance{background:linear-gradient(135deg,#fa709a,#fee140);color:#fff}.search-box{max-width:400px;position:relative}.search-box svg{color:#adb5bd;font-size:16px;left:16px;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.search-box input{background:#fff;border:2px solid #e9ecef;padding-left:48px}.search-box input:focus{border-color:#667eea;box-shadow:0 0 0 4px #667eea1a}.page-header{align-items:center;display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;margin-bottom:30px}.page-header h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#2c3e50;font-size:32px;font-weight:700}.header-actions{flex-wrap:wrap;gap:16px}.header-actions,.loading{align-items:center;display:flex}.loading{color:#667eea;font-size:18px;font-weight:600;justify-content:center;padding:80px}.loading:after{animation:spin .8s linear infinite;border:3px solid #e9ecef;border-radius:50%;border-top-color:#667eea;content:"";height:24px;margin-left:12px;width:24px}@keyframes spin{to{transform:rotate(1turn)}}.modal-overlay{align-items:center;animation:fadeIn .3s ease;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0009;bottom:0;display:flex;justify-content:center;left:0;padding:20px;position:fixed;right:0;top:0;z-index:1000}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{animation:slideUp .3s ease;background:#fff;border-radius:20px;box-shadow:0 20px 60px #0000004d;max-height:90vh;max-width:600px;overflow-y:auto;padding:32px;width:100%}@keyframes slideUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modal-content.large{max-width:800px}.modal-content h2{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;background-clip:text;color:#2c3e50;font-size:28px;font-weight:700;margin-bottom:24px}.modal-actions{border-top:2px solid #f1f3f5;display:flex;gap:12px;justify-content:flex-end;margin-top:32px;padding-top:24px}.modal-actions button{min-width:120px}.modal-content::-webkit-scrollbar{width:8px}.modal-content::-webkit-scrollbar-track{background:#f1f3f5;border-radius:10px}.modal-content::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px}.modal-content::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#764ba2,#667eea)}.no-data{background:#fff;border:2px dashed #e9ecef;border-radius:16px;color:#95a5a6;font-size:16px;padding:80px 20px;text-align:center}@media (max-width:768px){.page-header{align-items:flex-start;flex-direction:column}.page-header h1{font-size:24px}.header-actions{width:100%}.search-box{max-width:none;width:100%}.form-row{grid-template-columns:1fr}.modal-content{padding:24px}.modal-content h2{font-size:22px}.modal-actions{flex-direction:column-reverse}.modal-actions button{width:100%}}
/*# sourceMappingURL=main.247ba878.css.map*/