@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;600&display=swap');html{--lumo-font-family: 'Open Sans',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--lumo-primary-color: hsl(213,100%,48%);--lumo-primary-color-50pct: hsla(213,100%,48%,0.5);--lumo-primary-color-10pct: hsla(213,100%,48%,0.1);--lumo-primary-text-color: hsl(213,100%,43%);--lumo-primary-contrast-color: #fff;--lumo-border-radius-m: 8px;--lumo-border-radius-l: 16px}.login-page{display: flex;align-items: center;justify-content: center;height: 100vh;width: 100%;margin: 0;padding: 0;background: var(--lumo-contrast-5pct)}.login-card{width: 400px;max-width: 90vw;background: var(--lumo-base-color);padding: 36px;border-radius: 16px;border: 1px solid rgba(25,59,103,0.1);box-shadow: rgba(25,59,103,0.12) 0px 4px 12px 0px,rgba(25,59,103,0.08) 0px 2px 4px 0px;display: flex;flex-direction: column;gap: 20px}.login-icon-container{background: rgb(0,106,245);border-radius: 50%;width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;flex-shrink: 0}.login-title{font-size: 15px;font-weight: 600;color: var(--lumo-header-text-color)}.login-subtitle{font-size: 11px;color: var(--lumo-secondary-text-color)}.login-welcome-heading{font-size: 22px;margin: 0}.login-welcome-text{font-size: 13px;color: var(--lumo-secondary-text-color);margin: 4px 0 0 0}.login-remember-me{font-size: 12.5px}.login-forgot-link{font-size: 12.5px;color: rgb(0,95,219);text-decoration: none}.login-sign-in-button{background: rgb(0,106,245);cursor: pointer}.login-footer{font-size: 11.5px;color: var(--lumo-secondary-text-color);text-align: center}.job-card-list{box-sizing: border-box;display: grid !important;gap: var(--lumo-space-m);grid-template-columns: 1fr;align-content: start;width: 100%;max-width: 100%;padding: var(--lumo-space-xs) 1rem var(--lumo-space-xs) var(--lumo-space-xs)}@media (min-width: 768px){.job-card-list{grid-template-columns: repeat(2,1fr) !important}}@media (min-width: 1024px){.job-card-list{grid-template-columns: repeat(4,1fr) !important}}.job-card{transition: box-shadow 0.2s ease,transform 0.2s ease;border: 1px solid var(--lumo-contrast-10pct)}.job-card:hover{box-shadow: var(--lumo-box-shadow-m);transform: translateY(-2px)}.job-chip-bar{display: flex !important;flex-wrap: nowrap !important;gap: 8px;overflow-x: auto;overflow-y: hidden;-webkit-overflow-scrolling: touch;scrollbar-width: none;padding: 2px 0;max-width: 100%;min-width: 0}.job-chip-bar::-webkit-scrollbar{display: none}.job-chip{display: inline-flex;align-items: center;justify-content: center;flex-shrink: 0;padding: 6px 16px;border-radius: 20px;font-size: var(--lumo-font-size-s);font-weight: 500;white-space: nowrap;cursor: pointer;user-select: none;border: 1px solid var(--lumo-contrast-20pct);color: var(--lumo-secondary-text-color);background: var(--lumo-base-color);transition: all 0.15s ease}.job-chip:hover{border-color: var(--lumo-primary-color-50pct);color: var(--lumo-primary-text-color)}.job-chip-active{background: var(--lumo-primary-color) !important;color: var(--lumo-primary-contrast-color) !important;border-color: var(--lumo-primary-color) !important}.customer-card-list{box-sizing: border-box;display: grid !important;gap: var(--lumo-space-m);grid-template-columns: 1fr;align-content: start;width: 100%;padding: var(--lumo-space-xs) 1rem var(--lumo-space-xs) var(--lumo-space-xs)}@media (min-width: 768px){.customer-card-list{grid-template-columns: repeat(3,1fr) !important}}@media (min-width: 1024px){.customer-card-list{grid-template-columns: repeat(4,1fr) !important}}.customer-card{cursor: pointer;transition: box-shadow 0.2s ease,transform 0.2s ease;border: 1px solid var(--lumo-contrast-10pct);display: flex;flex-direction: column;gap: var(--lumo-space-s);box-shadow: rgba(25,59,103,0.05) 0px 1px 3px 0px}.customer-card:hover{box-shadow: var(--lumo-box-shadow-m);transform: translateY(-1px)}.customer-avatar{width: 40px;height: 40px;min-width: 40px;border-radius: 50%;background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color);display: flex;align-items: center;justify-content: center;font-weight: 600;letter-spacing: 0.5px}.customer-stats-row{display: grid;grid-template-columns: repeat(3,1fr);gap: 0;border-top: 1px solid var(--lumo-contrast-5pct);padding-top: var(--lumo-space-s)}.customer-stat-cell{display: flex;flex-direction: column;gap: 2px}.vendor-card-list{box-sizing: border-box;display: grid !important;gap: var(--lumo-space-m);grid-template-columns: 1fr;align-content: start;width: 100%;max-width: 100%;padding: var(--lumo-space-xs) 1rem var(--lumo-space-xs) var(--lumo-space-xs)}@media (min-width: 768px){.vendor-card-list{grid-template-columns: repeat(2,1fr) !important}}.vendor-card{cursor: pointer;transition: box-shadow 0.2s ease,transform 0.2s ease;border: 1px solid var(--lumo-contrast-10pct);border-left: 4px solid var(--lumo-primary-color);display: flex;flex-direction: column;gap: var(--lumo-space-s);box-shadow: rgba(25,59,103,0.05) 0px 1px 3px 0px}.vendor-card:hover{box-shadow: var(--lumo-box-shadow-m);transform: translateY(-1px)}.vendor-card-accent-danger{border-left-color: hsl(4,69%,60%)}.vendor-card-accent-primary{border-left-color: var(--lumo-primary-color)}.vendor-avatar{width: 44px;height: 44px;min-width: 44px;border-radius: 50%;background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color);display: flex;align-items: center;justify-content: center;font-weight: 600;letter-spacing: 0.5px}.vendor-avatar-danger{background: hsla(4,69%,60%,0.12);color: hsl(4,69%,50%)}.vendor-trusted-badge{display: inline-flex;align-items: center;padding: 2px 8px;border-radius: 10px;font-size: 10px;font-weight: 700;letter-spacing: 0.5px;background: hsl(145,63%,42%);color: #fff;white-space: nowrap;flex-shrink: 0}.vendor-stats-row{display: grid;grid-template-columns: repeat(3,1fr);gap: 0;border-top: 1px solid var(--lumo-contrast-5pct);padding-top: var(--lumo-space-s)}.vendor-stat-cell{display: flex;flex-direction: column;gap: 2px}.vendor-outstanding-text{color: hsl(4,69%,50%) !important}.vendor-call-btn{width: 36px;height: 36px;min-width: 36px;border-radius: 50%;background: var(--lumo-primary-color-10pct);display: flex;align-items: center;justify-content: center;cursor: pointer;transition: background 0.15s ease;flex-shrink: 0}.vendor-call-btn:hover{background: var(--lumo-primary-color-50pct)}[class*="vr-card"] *,[class*="vr-card"] *::before,[class*="vr-card"] *::after,[class*="vr-card"],[class*="vr-stat"] *,[class*="vr-stat"],[class*="vr-empty"] *,[class*="vr-empty"]{box-sizing: border-box}.vendor-receipt-tab{min-height: 0;box-sizing: border-box}.vr-summary-section{width: 100%;box-sizing: border-box;padding: var(--lumo-space-m);background: var(--lumo-contrast-5pct);border-radius: var(--lumo-border-radius-m);margin-top: var(--lumo-space-m)}.vr-card-list{display: flex;flex-direction: column;gap: var(--lumo-space-m);width: 100%;max-width: 100%;overflow-x: hidden;box-sizing: border-box;scrollbar-gutter: stable}.vr-card{width: 100%;max-width: 100%;background: var(--lumo-base-color);border: 1px solid var(--lumo-contrast-10pct);border-left: 4px solid var(--lumo-primary-color);border-radius: var(--lumo-border-radius-l);padding: var(--lumo-space-m);display: flex;flex-direction: column;gap: var(--lumo-space-s);box-shadow: rgba(25,59,103,0.05) 0px 1px 3px 0px}.vr-card-accent-danger{border-left-color: var(--lumo-error-color)}.vr-card-accent-ok{border-left-color: var(--lumo-success-color)}.vr-card-clickable{cursor: pointer;transition: box-shadow 0.2s ease,transform 0.2s ease}.vr-card-clickable:hover{box-shadow: var(--lumo-box-shadow-m);transform: translateY(-1px)}.vr-card-avatar{width: 40px;height: 40px;min-width: 40px;border-radius: 50%;background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color);display: flex;align-items: center;justify-content: center;font-size: var(--lumo-font-size-s);font-weight: 700;letter-spacing: 0.5px;flex-shrink: 0}.vr-card-avatar-danger{background: hsla(4,69%,60%,0.12);color: var(--lumo-error-color)}.vr-card-top-row{gap: var(--lumo-space-m) !important;align-items: center !important}.vr-card-info-block{min-width: 0;gap: 2px !important}.vr-card-header-row{gap: var(--lumo-space-s) !important}.vr-card-vendor-name{font-size: var(--lumo-font-size-m);font-weight: 600;color: var(--lumo-body-text-color);white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.vr-card-status-badge{display: inline-flex;align-items: center;padding: 2px 8px;border-radius: 10px;font-size: 11px;font-weight: 700;letter-spacing: 0.4px;white-space: nowrap;flex-shrink: 0}.vr-card-status-paid{background: hsla(145,63%,42%,0.12);color: hsl(145,63%,35%)}.vr-card-status-unpaid{background: hsla(4,69%,60%,0.12);color: var(--lumo-error-color)}.vr-card-contact{font-size: var(--lumo-font-size-s);color: var(--lumo-secondary-text-color)}.vr-card-stats-row{display: grid;grid-template-columns: repeat(3,1fr);gap: 0;border-top: 1px solid var(--lumo-contrast-5pct);border-bottom: 1px solid var(--lumo-contrast-5pct);padding: var(--lumo-space-s) 0}.vr-stat-cell{display: flex;flex-direction: column;gap: 2px;padding: 0 var(--lumo-space-xs)}.vr-stat-cell:not(:last-child){border-right: 1px solid var(--lumo-contrast-5pct)}.vr-stat-label{font-size: 11px;color: var(--lumo-secondary-text-color);font-weight: 500;text-transform: uppercase;letter-spacing: 0.4px}.vr-stat-value{font-size: var(--lumo-font-size-s);font-weight: 600;color: var(--lumo-body-text-color)}.vr-stat-value-danger{color: var(--lumo-error-color) !important}.vr-card-footer-row{gap: var(--lumo-space-s) !important;align-items: center !important}.vr-card-date{font-size: var(--lumo-font-size-s);color: var(--lumo-tertiary-text-color)}.vr-empty-state{display: flex;flex-direction: column;align-items: center;justify-content: center;gap: var(--lumo-space-m);padding: var(--lumo-space-xl) 0;width: 100%}.vr-empty-icon{color: var(--lumo-contrast-30pct)}.vr-empty-text{font-size: var(--lumo-font-size-m);color: var(--lumo-secondary-text-color)}[class*="mg-"] *,[class*="mg-"] *::before,[class*="mg-"] *::after,[class*="media-gallery"] *,[class*="media-gallery"] *::before,[class*="media-gallery"] *::after{box-sizing: border-box}.media-gallery-tab{min-height: 0}.media-gallery-scroll{overflow-y: auto;flex-grow: 1;scrollbar-gutter: stable;padding: var(--lumo-space-s);gap: var(--lumo-space-s)}.media-gallery-footer{flex-shrink: 0;border-top: 1px solid var(--lumo-contrast-10pct);background: var(--lumo-base-color);padding: var(--lumo-space-s)}.media-gallery-actions vaadin-button{width: 100%;min-height: 42px;font-weight: 600}.mg-upload-compact{width: 100%;padding: 0;--vaadin-upload-padding: 0;--vaadin-upload-gap: 0}.mg-upload-compact::part(drop-label){display: none}.mg-upload-compact vaadin-upload-file-list{display: none}.media-gallery-actions .mg-upload-compact::part(primary-buttons){width: 100%}.media-gallery-actions .mg-upload-compact::part(primary-buttons) vaadin-button{width: 100%;min-height: 42px;font-weight: 600}.mg-segment{display: flex;gap: var(--lumo-space-xs);background: var(--lumo-contrast-5pct);border-radius: var(--lumo-border-radius-l);padding: 4px}.mg-segment-btn{flex: 1;border-radius: var(--lumo-border-radius-l);background: transparent;color: var(--lumo-secondary-text-color);font-weight: 600;font-size: var(--lumo-font-size-s);min-height: 40px;cursor: pointer;display: flex;align-items: center;justify-content: center;user-select: none}.mg-segment-btn--active{background: var(--lumo-primary-color);color: var(--lumo-primary-contrast-color)}.mg-segment-btn--active .mg-segment-badge{background: rgba(255,255,255,0.25);color: var(--lumo-primary-contrast-color)}.mg-segment-badge{display: inline-flex;align-items: center;justify-content: center;min-width: 22px;height: 22px;padding: 0 6px;border-radius: 999px;font-size: var(--lumo-font-size-xs);font-weight: 700;background: var(--lumo-contrast-10pct);color: var(--lumo-secondary-text-color)}.mg-section-header{display: block;font-weight: 700;font-size: var(--lumo-font-size-xxs);text-transform: uppercase;letter-spacing: 0.05em;color: var(--lumo-secondary-text-color);padding: 0 0 var(--lumo-space-xs) 0}.mg-grid{display: grid;grid-template-columns: repeat(2,1fr);gap: var(--lumo-space-s);width: 100%}@media (max-width: 479px){.mg-grid{grid-template-columns: 1fr}}@media (min-width: 640px){.mg-grid{grid-template-columns: repeat(auto-fill,minmax(180px,1fr))}}.mg-empty{grid-column: 1 / -1;padding: var(--lumo-space-xl) 0;text-align: center;color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-s)}.mg-card{container-type: inline-size;display: flex;flex-direction: column;background: var(--lumo-base-color);border-radius: var(--lumo-border-radius-m);overflow: hidden;box-shadow: rgba(25,59,103,0.06) 0 1px 3px 0}.mg-card-thumb{position: relative;width: 100%;aspect-ratio: 4 / 3;overflow: hidden;border-radius: var(--lumo-border-radius-m) var(--lumo-border-radius-m) 0 0}.mg-card-thumb--gradient-0{background: linear-gradient(135deg,#6366f1 0%,#8b5cf6 100%)}.mg-card-thumb--gradient-1{background: linear-gradient(135deg,#14b8a6 0%,#3b82f6 100%)}.mg-card-thumb--gradient-2{background: linear-gradient(135deg,#22c55e 0%,#14b8a6 100%)}.mg-card-thumb--gradient-3{background: linear-gradient(135deg,#d97706 0%,#b45309 100%)}.mg-card-thumb-image{width: 100%;height: 100%;object-fit: cover;display: block}.mg-card-thumb--video .mg-card-play{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);width: 44px;height: 44px;border-radius: 50%;background: rgba(0,0,0,0.45);display: flex;align-items: center;justify-content: center;color: #fff}.mg-card-footer{display: flex;align-items: center;gap: var(--lumo-space-s);padding: var(--lumo-space-s);min-width: 0;background: var(--lumo-base-color)}.mg-card-type-icon{flex-shrink: 0;width: 28px;height: 28px;display: flex;align-items: center;justify-content: center;color: var(--lumo-secondary-text-color)}.mg-card-info{flex: 1 1 0;min-width: 0;overflow: hidden;display: flex;flex-direction: column;gap: 2px}.mg-card-name{font-weight: 600;font-size: var(--lumo-font-size-xs);overflow: hidden;text-overflow: ellipsis;white-space: nowrap;color: var(--lumo-body-text-color)}.mg-card-meta{font-size: var(--lumo-font-size-xxs);color: var(--lumo-secondary-text-color);overflow: hidden;text-overflow: ellipsis;white-space: nowrap}.mg-card-actions{flex: 0 0 auto;width: auto;max-width: fit-content;margin-inline-start: auto}vaadin-horizontal-layout.mg-card-actions{width: auto;flex-grow: 0}@container (max-width: 220px){.mg-card-footer{flex-wrap: wrap;row-gap: var(--lumo-space-xs)}.mg-card-info{flex: 1 1 calc(100% - 36px)}.mg-card-actions{flex: 1 1 100%;justify-content: flex-end}}.mg-card-download{display: inline-flex;align-items: center;justify-content: center;width: 32px;height: 32px;border-radius: var(--lumo-border-radius-m);background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-color);text-decoration: none}.mg-card-download:hover{background: var(--lumo-primary-color-20pct)}[class*="li-card"] *,[class*="li-card"] *::before,[class*="li-card"] *::after,[class*="li-card"],[class*="li-row-card"] *,[class*="li-left-side"] *,[class*="li-right-side"] *,[class*="li-part-name"] *,[class*="li-details"] *,[class*="li-subtotal"] *{box-sizing: border-box}.li-card-list{display: flex;flex-direction: column;width: 100%}.li-divider{margin: 0;border: none;border-top: 1px solid var(--lumo-contrast-10pct)}.li-row-card{width: 100%;background: var(--lumo-base-color);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-m);padding: var(--lumo-space-s) var(--lumo-space-m);margin-bottom: 6px}.li-card-inner{display: flex;align-items: center;width: 100%;gap: 8px}.li-left-side{flex: 1;min-width: 0;display: flex;flex-direction: column;gap: 2px}.li-part-name{font-size: var(--lumo-font-size-s);font-weight: 600;color: var(--lumo-body-text-color);white-space: nowrap;overflow: hidden;text-overflow: ellipsis}.li-details{font-size: var(--lumo-font-size-xs);color: var(--lumo-secondary-text-color);line-height: 1.3}.li-right-side{display: flex;align-items: center;gap: 4px;flex-shrink: 0}.li-subtotal-value{font-size: var(--lumo-font-size-s);font-weight: 700;color: var(--lumo-body-text-color);white-space: nowrap;margin-right: 4px}.li-empty-state{padding: var(--lumo-space-m);text-align: center;color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-s)}[class*="customer-detail"] *,[class*="customer-detail"] *::before,[class*="customer-detail"] *::after,[class*="customer-detail"]{box-sizing: border-box}.customer-detail-stats{display: grid;grid-template-columns: repeat(3,1fr);gap: 0;border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-m);overflow: hidden}.customer-detail-stat-box{display: flex;flex-direction: column;gap: 2px;padding: var(--lumo-space-s) var(--lumo-space-m)}.customer-detail-stat-box + .customer-detail-stat-box{border-left: 1px solid var(--lumo-contrast-10pct)}.customer-detail-badge{display: inline-flex;align-items: center;padding: 2px 10px;border-radius: 12px;font-size: var(--lumo-font-size-xs);font-weight: 600;white-space: nowrap}.customer-detail-badge-returning{background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color)}.customer-detail-badge-trusted{background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color)}.customer-detail-vehicle-card{display: flex;align-items: center;gap: var(--lumo-space-m);padding: var(--lumo-space-s) var(--lumo-space-m);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-m);cursor: pointer;transition: box-shadow 0.2s ease}.customer-detail-vehicle-card:hover{box-shadow: var(--lumo-box-shadow-s)}.customer-detail-job-card{display: flex;flex-direction: column;gap: var(--lumo-space-xs);padding: var(--lumo-space-s) var(--lumo-space-m);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-m);cursor: pointer;transition: box-shadow 0.2s ease}.customer-detail-job-card:hover{box-shadow: var(--lumo-box-shadow-s)}[class*="vehicle-detail"] *,[class*="vehicle-detail"] *::before,[class*="vehicle-detail"] *::after,[class*="vehicle-detail"]{box-sizing: border-box}.vehicle-detail-page{max-width: 860px;margin: 0 auto}.vehicle-detail-hero{display: flex;flex-direction: column;gap: var(--lumo-space-l);min-width: 0;overflow-x: hidden}.vehicle-detail-back-button{align-self: flex-start}.vehicle-detail-icon-badge{width: 56px;height: 56px;border-radius: 18px;display: inline-flex;align-items: center;justify-content: center;background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color);flex-shrink: 0}.vehicle-detail-icon-badge vaadin-icon{width: 26px;height: 26px}.vehicle-detail-meta-row{display: flex;flex-wrap: wrap;gap: var(--lumo-space-s)}.vehicle-detail-meta-pill{display: inline-flex;align-items: center;padding: 0.3rem 0.75rem;border-radius: 999px;background: var(--lumo-contrast-5pct);color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-s);font-weight: 600}.vehicle-detail-stat-row{display: flex;gap: var(--lumo-space-s)}.vehicle-detail-stat-card{display: flex;flex-direction: column;gap: 2px;padding: var(--lumo-space-s) var(--lumo-space-m);border-radius: var(--lumo-border-radius-m);background: var(--lumo-contrast-5pct);border: 1px solid var(--lumo-contrast-10pct)}.vehicle-detail-stats{grid-template-columns: repeat(2,1fr)}.vehicle-detail-actions{width: 100%;justify-content: flex-start}.vehicle-detail-section-card{display: flex;flex-direction: column;gap: var(--lumo-space-m);min-width: 0;overflow-x: hidden}.vehicle-detail-info-list{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-l);overflow: hidden;background: var(--lumo-base-color);max-width: 100%}.vehicle-detail-info-row{display: flex;flex-direction: column;gap: 0.25rem;padding: var(--lumo-space-s) var(--lumo-space-s);min-width: 0;border-bottom: 1px solid var(--lumo-contrast-10pct)}.vehicle-detail-info-row:nth-last-child(-n + 2){border-bottom: none}.vehicle-detail-info-row:nth-child(odd){border-right: 1px solid var(--lumo-contrast-10pct)}.vehicle-detail-info-label{text-transform: uppercase;letter-spacing: 0.03em}.vehicle-detail-info-value{line-height: 1.35}.vehicle-detail-history-table{border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-l);overflow-x: auto;overflow-y: hidden;background: var(--lumo-base-color);max-width: 100%}.vehicle-detail-history-header,.vehicle-detail-history-row{display: grid;grid-template-columns: minmax(120px,1.05fr) minmax(220px,2.4fr) minmax(140px,1.1fr) minmax(120px,1fr) minmax(140px,1fr);gap: var(--lumo-space-m);align-items: start}.vehicle-detail-history-header{padding: var(--lumo-space-s) var(--lumo-space-l);background: var(--lumo-contrast-5pct);border-bottom: 1px solid var(--lumo-contrast-10pct)}.vehicle-detail-history-row{padding: var(--lumo-space-m) var(--lumo-space-l);border-bottom: 1px solid var(--lumo-contrast-10pct);cursor: pointer;transition: background-color 0.18s ease}.vehicle-detail-history-row:last-child{border-bottom: none}.vehicle-detail-history-row:hover{background: var(--lumo-contrast-5pct)}.vehicle-detail-history-cell{display: flex;flex-direction: column;gap: 0.35rem;min-width: 0}.vehicle-detail-history-caption{display: none;font-size: var(--lumo-font-size-xs);font-weight: 600;color: var(--lumo-secondary-text-color);text-transform: uppercase;letter-spacing: 0.02em}.vehicle-detail-history-complaint{margin: 0;color: var(--lumo-body-text-color);line-height: 1.45}.vehicle-detail-empty-state{padding: var(--lumo-space-l);border-radius: var(--lumo-border-radius-l);color: var(--lumo-secondary-text-color);background: var(--lumo-contrast-5pct)}@media (max-width: 960px){.vehicle-detail-history-header{display: none}.vehicle-detail-history-row{grid-template-columns: repeat(2,minmax(0,1fr))}.vehicle-detail-history-caption{display: inline-flex}}@media (max-width: 640px){.vehicle-detail-stat-row{flex-direction: column}.vehicle-detail-history-row,.vehicle-detail-info-list{grid-template-columns: 1fr}.vehicle-detail-info-row{border-right: none !important;border-bottom: 1px solid var(--lumo-contrast-10pct)}.vehicle-detail-info-row:nth-last-child(-n + 2){border-bottom: 1px solid var(--lumo-contrast-10pct)}.vehicle-detail-info-row:last-child{border-bottom: none}.vehicle-detail-actions vaadin-button{width: 100%}}.job-detail-page{max-width: 900px;margin: 0 auto}.job-detail-top-section{width: 100%;gap: var(--lumo-space-s)}.job-detail-card{width: 100%;background: var(--lumo-base-color);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-l);padding: var(--lumo-space-m);box-sizing: border-box}.job-detail-stage-card{width: 100%;background: var(--lumo-contrast-5pct);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-l);padding: var(--lumo-space-m);box-sizing: border-box;transition: background-color 0.15s ease}.job-detail-stage-card-clickable{cursor: pointer}.job-detail-stage-card-clickable:hover{background: var(--lumo-contrast-10pct)}.job-detail-stage-card-readonly{cursor: default}.job-detail-car-header{gap: var(--lumo-space-m)}.job-detail-car-icon-badge{width: 46px;height: 46px;border-radius: 14px;display: inline-flex;align-items: center;justify-content: center;background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color);flex-shrink: 0}.job-detail-title-row{gap: var(--lumo-space-s);margin-bottom: 2px}.job-detail-job-code{color: var(--lumo-primary-color);font-weight: 700;font-size: var(--lumo-font-size-m);letter-spacing: 0.02em}.job-detail-vehicle-title{font-size: 1.6rem;font-weight: 700;line-height: 1.2;color: var(--lumo-header-text-color)}.job-detail-vehicle-meta,.job-detail-owner-line{color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-s)}.job-detail-owner-line{margin-top: 2px}.job-detail-stage-card{align-items: center;gap: var(--lumo-space-m)}.job-detail-stage-ring{--job-detail-stage-progress: 0.5;--job-detail-stage-ring-stroke: 4.5px;width: 52px;height: 52px;position: relative;display: inline-flex;align-items: center;justify-content: center;flex-shrink: 0}.job-detail-stage-ring::before{content: '';position: absolute;inset: 0;border-radius: 50%;background: conic-gradient( from -90deg,var(--lumo-primary-color) 0deg,var(--lumo-primary-color) calc(var(--job-detail-stage-progress) * 360deg),var(--lumo-contrast-20pct) calc(var(--job-detail-stage-progress) * 360deg),var(--lumo-contrast-20pct) 360deg );-webkit-mask: radial-gradient( farthest-side,transparent calc(100% - var(--job-detail-stage-ring-stroke)),#000 calc(100% - var(--job-detail-stage-ring-stroke) + 0.5px) );mask: radial-gradient( farthest-side,transparent calc(100% - var(--job-detail-stage-ring-stroke)),#000 calc(100% - var(--job-detail-stage-ring-stroke) + 0.5px) )}.job-detail-stage-progress-label{position: relative;z-index: 1;font-size: 0.8125rem;font-weight: 700;line-height: 1;color: var(--lumo-primary-color)}.job-detail-stage-info{gap: 4px;min-width: 0}.job-detail-stage-caption{color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-xs);font-weight: 600}.job-detail-stage-line{font-size: var(--lumo-font-size-m);font-weight: 700;color: var(--lumo-header-text-color);line-height: 1.35}.job-detail-stage-chevron{color: var(--lumo-tertiary-text-color);flex-shrink: 0;margin-left: auto}.job-detail-tab-sheet{margin-top: var(--lumo-space-s)}.job-detail-overview-content{gap: var(--lumo-space-s);padding: var(--lumo-space-s)}.job-detail-section-title{text-transform: uppercase;letter-spacing: 0.08em;color: var(--lumo-secondary-text-color);font-size: 0.72rem;font-weight: 700;margin-bottom: var(--lumo-space-s)}.job-detail-section-header{display: flex;align-items: center;width: 100%;margin-bottom: var(--lumo-space-s)}.job-detail-section-header .job-detail-section-title{margin-bottom: 0}.job-detail-summary-grid{display: grid;grid-template-columns: repeat(2,minmax(0,1fr));gap: var(--lumo-space-s);width: 100%}.job-detail-summary-grid>div{background: var(--lumo-contrast-5pct);border-radius: var(--lumo-border-radius-m);border: 1px solid var(--lumo-contrast-10pct);padding: var(--lumo-space-s);display: flex;flex-direction: column;gap: 2px;min-width: 0}.job-detail-summary-label{color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-xs)}.job-detail-summary-value{color: var(--lumo-header-text-color);font-size: 1.75rem;line-height: 1.2;font-weight: 700}.job-detail-summary-badge{color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-xs);font-weight: 600}.job-detail-complaint-text{color: var(--lumo-body-text-color);line-height: 1.5;font-size: var(--lumo-font-size-m)}.job-detail-tags-row{margin-top: var(--lumo-space-s);flex-wrap: wrap;gap: 6px}.job-detail-tag-chip{display: inline-flex;align-items: center;padding: 2px 8px;border-radius: 999px;background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color);font-size: 0.72rem;font-weight: 600}.job-detail-action-list,.job-detail-activity-list{width: 100%}.job-detail-action-row,.job-detail-activity-row{gap: var(--lumo-space-s);padding: var(--lumo-space-s) 0;border-top: 1px solid var(--lumo-contrast-10pct);cursor: pointer}.job-detail-action-row:first-child,.job-detail-activity-row:first-child{border-top: none;padding-top: 0}.job-detail-action-row:last-child,.job-detail-activity-row:last-child{padding-bottom: 0}.job-detail-action-row:hover{opacity: 0.85}.job-detail-action-row-disabled{opacity: 0.45;cursor: default}.job-detail-row-icon{width: 24px;height: 24px;border-radius: 8px;background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color);display: inline-flex;align-items: center;justify-content: center;flex-shrink: 0}.job-detail-row-text{font-size: var(--lumo-font-size-m);color: var(--lumo-body-text-color)}.job-detail-row-chevron{color: var(--lumo-tertiary-text-color)}.job-detail-activity-text-group{gap: 2px}.job-detail-activity-time{color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-s)}.job-detail-activity-icon-warning{background: hsla(38,100%,50%,0.15);color: hsl(38,100%,38%)}.job-detail-activity-icon-success{background: hsla(145,63%,42%,0.16);color: hsl(145,63%,36%)}@media (max-width: 640px){.job-detail-summary-grid{grid-template-columns: 1fr}}.cost-estimation-tab{min-height: 0}.cost-estimation-scroll{overflow-y: auto;flex-grow: 1;scrollbar-gutter: stable;padding: var(--lumo-space-s);gap: var(--lumo-space-s);box-sizing: border-box}.cost-estimation-card{width: 100%;max-width: 100%;box-sizing: border-box;background: var(--lumo-base-color);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-m)}.cost-estimation-card--padded{padding: var(--lumo-space-m)}.cost-estimation-footer{flex-shrink: 0;border-top: 1px solid var(--lumo-contrast-10pct);background: var(--lumo-base-color);padding: var(--lumo-space-s)}.cost-estimation-actions vaadin-button{width: 100%;min-height: 42px;font-weight: 600}.actual-cost-tab{min-height: 0}.actual-cost-scroll{overflow-y: auto;flex-grow: 1;scrollbar-gutter: stable;padding: var(--lumo-space-s);gap: var(--lumo-space-s);box-sizing: border-box}.actual-cost-variance-banner{display: flex;align-items: flex-start;gap: var(--lumo-space-s);padding: var(--lumo-space-m);border-radius: var(--lumo-border-radius-m);background: hsl(28,85%,94%);box-sizing: border-box}.actual-cost-variance-banner--under{background: hsl(145,45%,94%)}.actual-cost-variance-banner__icon{display: flex;align-items: center;justify-content: center;width: 32px;height: 32px;border-radius: 50%;flex-shrink: 0;background: hsl(28,90%,88%);color: hsl(28,70%,42%)}.actual-cost-variance-banner--under .actual-cost-variance-banner__icon{background: hsl(145,50%,88%);color: hsl(145,55%,32%)}.actual-cost-variance-banner__text{display: flex;flex-direction: column;gap: 2px;min-width: 0}.actual-cost-variance-banner__headline{font-weight: 700;font-size: var(--lumo-font-size-s);color: var(--lumo-header-text-color);line-height: 1.3}.actual-cost-variance-banner__subtext{font-size: var(--lumo-font-size-xs);color: var(--lumo-secondary-text-color)}.actual-cost-comparison-row{display: grid;grid-template-columns: 1fr 1fr;gap: var(--lumo-space-s);width: 100%;box-sizing: border-box}@media (max-width: 640px){.actual-cost-comparison-row{grid-template-columns: 1fr}}.actual-cost-comparison-card{background: var(--lumo-base-color);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-m);padding: var(--lumo-space-m);box-sizing: border-box}.actual-cost-comparison-card--actual{border-left: 4px solid var(--lumo-primary-color)}.actual-cost-comparison-card__label{font-size: var(--lumo-font-size-xs);color: var(--lumo-secondary-text-color);margin-bottom: var(--lumo-space-xs)}.actual-cost-comparison-card__value{font-weight: 700;font-size: var(--lumo-font-size-l);color: var(--lumo-header-text-color)}.actual-cost-comparison-card__value--actual{color: var(--lumo-primary-text-color)}.actual-cost-variance--over{color: #a65e2e;font-weight: 600;font-size: var(--lumo-font-size-xs)}.actual-cost-variance--under{color: #2d7a4d;font-weight: 600;font-size: var(--lumo-font-size-xs)}.actual-cost-badge-new{display: inline-flex;align-items: center;padding: 2px 8px;border-radius: 999px;font-size: var(--lumo-font-size-xxs);font-weight: 600;background: hsl(214,90%,94%);color: hsl(214,80%,40%);flex-shrink: 0}.actual-cost-summary{width: 100%;box-sizing: border-box;background: var(--lumo-contrast-5pct);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-m)}.actual-cost-grand-total{font-weight: 700;font-size: var(--lumo-font-size-xl);color: var(--lumo-primary-text-color)}.actual-cost-footer{flex-shrink: 0;border-top: 1px solid var(--lumo-contrast-10pct);background: var(--lumo-base-color);padding: var(--lumo-space-s)}.actual-cost-generate-invoice{--lumo-primary-color: hsl(145,63%,38%);--lumo-primary-text-color: hsl(145,63%,38%);background-color: hsl(145,63%,38%);color: #fff}.actual-cost-generate-invoice:hover{background-color: hsl(145,63%,32%)}.invoice-tab{min-height: 0}.invoice-scroll{overflow-y: auto;flex-grow: 1;scrollbar-gutter: stable;padding: var(--lumo-space-s);gap: var(--lumo-space-s);box-sizing: border-box}.invoice-payment-actions vaadin-button{width: 100%;white-space: normal;height: auto;min-height: var(--lumo-size-m)}.invoice-export-footer{flex-shrink: 0;border-top: 1px solid var(--lumo-contrast-10pct);background: var(--lumo-base-color);padding: var(--lumo-space-s);box-sizing: border-box}.invoice-export-footer vaadin-button{width: 100%}.dashboard-view{width: 100%;max-width: 100%;box-sizing: border-box}.dashboard-header{display: flex;flex-direction: column;gap: var(--lumo-space-xs);margin-bottom: var(--lumo-space-s)}.dashboard-header__title{margin: 0}.dashboard-header__subtitle{color: var(--lumo-secondary-text-color);font-size: var(--lumo-font-size-s)}.dashboard-toolbar{display: flex;flex-wrap: wrap;align-items: flex-end;gap: var(--lumo-space-m);margin-bottom: var(--lumo-space-l)}.dashboard-loading{margin-bottom: var(--lumo-space-s)}.dashboard-section-title{margin: 0 0 var(--lumo-space-m) 0;font-size: var(--lumo-font-size-l);font-weight: 600;color: var(--lumo-header-text-color)}.dashboard-stat-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(220px,1fr));gap: var(--lumo-space-m);width: 100%;margin-bottom: var(--lumo-space-xl);box-sizing: border-box}@media (max-width: 600px){.dashboard-stat-grid{grid-template-columns: 1fr}}.dashboard-stat-card{background: var(--lumo-base-color);border: 1px solid var(--lumo-contrast-10pct);border-left: 4px solid var(--lumo-primary-color);border-radius: var(--lumo-border-radius-l);padding: var(--lumo-space-m);display: flex;flex-direction: column;gap: var(--lumo-space-s);box-shadow: rgba(25,59,103,0.05) 0px 1px 3px 0px;box-sizing: border-box}.dashboard-stat-card--primary{border-left-color: var(--lumo-primary-color)}.dashboard-stat-card--success{border-left-color: var(--lumo-success-color)}.dashboard-stat-card--warning{border-left-color: var(--lumo-warning-color)}.dashboard-stat-card--error{border-left-color: var(--lumo-error-color)}.dashboard-stat-card__top{display: flex;align-items: center;gap: var(--lumo-space-s)}.dashboard-stat-card__icon{width: 40px;height: 40px;min-width: 40px;border-radius: 50%;display: flex;align-items: center;justify-content: center;flex-shrink: 0}.dashboard-stat-card--primary .dashboard-stat-card__icon{background: var(--lumo-primary-color-10pct);color: var(--lumo-primary-text-color)}.dashboard-stat-card--success .dashboard-stat-card__icon{background: hsla(145,65%,42%,0.12);color: var(--lumo-success-color)}.dashboard-stat-card--warning .dashboard-stat-card__icon{background: hsla(38,92%,50%,0.12);color: var(--lumo-warning-color)}.dashboard-stat-card--error .dashboard-stat-card__icon{background: hsla(4,69%,60%,0.12);color: var(--lumo-error-color)}.dashboard-stat-card__label{font-size: var(--lumo-font-size-s);font-weight: 600;color: var(--lumo-secondary-text-color);line-height: 1.3}.dashboard-stat-card__value{font-size: var(--lumo-font-size-xxl);font-weight: 700;line-height: 1.2;color: var(--lumo-header-text-color)}.dashboard-stat-card__value--success{color: var(--lumo-success-color)}.dashboard-stat-card__value--error{color: var(--lumo-error-color)}.dashboard-charts-section{display: flex;flex-direction: column;gap: var(--lumo-space-m);width: 100%}.dashboard-chart-row{display: grid !important;grid-template-columns: repeat(2,1fr);gap: var(--lumo-space-m);width: 100%;box-sizing: border-box}.dashboard-chart-card{background: var(--lumo-base-color);border: 1px solid var(--lumo-contrast-10pct);border-radius: var(--lumo-border-radius-l);padding: var(--lumo-space-m);overflow: hidden;box-shadow: rgba(25,59,103,0.05) 0px 1px 3px 0px;box-sizing: border-box}.dashboard-chart-card__title{margin: 0 0 var(--lumo-space-s) 0;font-size: var(--lumo-font-size-m);font-weight: 600;color: var(--lumo-header-text-color)}.dashboard-chart-card echarts-wrapper{display: block;width: 100%;min-height: 360px;height: 360px}@media (max-width: 800px){.dashboard-chart-row{grid-template-columns: 1fr !important}.dashboard-chart-card echarts-wrapper{min-height: 300px;height: 300px}}