/* Reference layout for the warranty pre-report. Scoped to this modal. */
#preModal.pre-reference{inset:0!important;padding:24px!important;align-items:center!important;z-index:350!important;background:#12243db3!important}
#preModal.pre-reference .modalbox{display:flex!important;flex-direction:column!important;width:min(1100px,100%)!important;max-width:1100px!important;height:auto!important;max-height:95dvh!important;margin:0!important;overflow:hidden!important;border-radius:16px!important;background:linear-gradient(135deg,#f7fbff,#fff 45%)!important}
#preModal.pre-reference .preMobileAppHeader{display:none!important}
#preModal.pre-reference .modalhead{display:flex!important;position:relative!important;flex:0 0 auto!important;min-height:86px!important;padding:22px!important;border:0!important;background:transparent!important;box-shadow:none!important;gap:12px}
#preModal.pre-reference .modalhead:before,#preModal.pre-reference h2:before,#preModal.pre-reference h2:after{display:none!important;content:none!important}
#preModal.pre-reference .preTitle{display:flex;align-items:center;gap:17px;min-width:0}
#preModal.pre-reference .preTitleIcon{display:grid;place-items:center;width:56px;height:56px;flex:0 0 56px;border-radius:50%;background:#e5f0ff;color:#0064ff;font-size:31px}
#preModal.pre-reference .modalhead h2{width:auto!important;font-size:26px!important;line-height:1.2!important;color:#081c53!important;letter-spacing:-.5px}
#preModal.pre-reference .preTitle p{margin:4px 0 0;color:#536f9d;font-size:14px;line-height:1.4}
#preModal.pre-reference .preModalHeadActions{position:static!important;display:flex!important;inset:auto!important;gap:10px!important;width:auto!important;height:auto!important;margin-left:auto!important;pointer-events:auto!important}
#preModal.pre-reference .mobileViewToggle{display:flex!important;gap:7px;align-items:center;white-space:nowrap;padding:10px 12px;border:1px solid #a9caff;border-radius:9px;background:#fff;color:#0064ff;font-size:13px}
#preModal.pre-reference .closex{position:static!important;display:grid!important;place-items:center!important;opacity:1!important;width:40px!important;min-width:40px!important;height:40px!important;padding:0!important;font-size:19px!important;border:1px solid #d5dfed!important;background:#f7f9fc!important;color:#536d94!important;box-shadow:none!important}
#preModal.pre-reference .closex:before,#preModal.pre-reference .mobileCloseLabel{display:none!important}
#preModal.pre-reference .modalbody{flex:1 1 auto!important;min-height:0;max-height:none!important;overflow:auto!important;overscroll-behavior:contain;padding:0 22px!important;background:transparent!important}
#preModal.pre-reference .detailgrid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;margin:0 0 17px!important;padding:12px!important;border-radius:16px!important;background:white!important;box-shadow:none!important}
#preModal.pre-reference .detailcard{position:relative;min-height:78px!important;padding:14px 10px 12px 65px!important;border:1px solid #e0edfc!important;border-radius:10px!important;background:linear-gradient(110deg,#f8fbff,#f5faff)!important;min-width:0}
#preModal.pre-reference .detailcard:before{position:absolute;left:12px;top:16px;display:grid;place-items:center;width:42px!important;height:42px!important;border-radius:50%;background:#e6f1ff;color:#0066ff;font-size:24px!important;content:'▤'}
#preModal.pre-reference .detailcard:nth-child(2):before{content:'▰'}#preModal.pre-reference .detailcard:nth-child(3):before{content:'⚙'}#preModal.pre-reference .detailcard:nth-child(4):before{content:'▥'}#preModal.pre-reference .detailcard:nth-child(5):before{content:'◇'}#preModal.pre-reference .detailcard:nth-child(6):before{content:'☑'}#preModal.pre-reference .detailcard:nth-child(8):before{content:'$'}
#preModal.pre-reference .detailcard small{font-size:10px!important;color:#466494!important}#preModal.pre-reference .detailcard b{font-size:14px!important;line-height:1.35!important;color:#081c53!important;overflow-wrap:anywhere;margin-top:5px!important}
#preModal.pre-reference .preReportedDefect{display:grid!important;grid-template-columns:38px 1fr!important;align-items:center;gap:14px!important;padding:15px 22px!important;margin:0 0 20px!important;border:1px solid #ffa500!important;border-radius:13px!important;background:linear-gradient(100deg,#fff9ec,#fffaf2)!important}
#preModal.pre-reference .preReportedDefectIcon{width:32px!important;height:32px!important;border-radius:50%;background:#ffa600;color:#fff;font-size:20px!important}
#preModal.pre-reference .preReportedDefect small{font-size:12px!important;color:#ed7900!important}#preModal.pre-reference .preReportedDefect b{font-size:14px!important}#preModal.pre-reference .preReportedHint{font-size:12px!important;color:#64718b!important}
#preModal.pre-reference .flow{display:grid!important;grid-template-columns:repeat(6,minmax(95px,1fr))!important;gap:0!important;padding:4px 0 12px!important;margin:0 0 18px!important;overflow-x:auto!important;width:100%!important}
#preModal.pre-reference .flowstep{position:relative;min-width:95px!important;border:0!important;border-radius:0!important;background:transparent!important;white-space:normal!important;padding:44px 7px 0!important;text-align:center!important;color:#526f9e!important;font-size:13px!important;font-weight:500!important;line-height:1.35!important}
#preModal.pre-reference .flowstep:before{content:'';position:absolute;left:0;right:0;top:17px;height:2px;background:#dce6f4}#preModal.pre-reference .flowstep:first-child:before{left:50%}#preModal.pre-reference .flowstep:last-child:before{right:50%}
#preModal.pre-reference .flowstep:after{content:attr(data-step);position:absolute;top:0;left:50%;transform:translateX(-50%);display:grid;place-items:center;width:34px;height:34px;border:1px solid #d2deed;border-radius:50%;background:#f6f8fb;color:#5874a0;font-size:14px;font-weight:700;box-shadow:0 0 0 7px white}
#preModal.pre-reference .flowstep.on:after,#preModal.pre-reference .flowstep.done:after{color:white;background:#0064ff;border-color:#0064ff}#preModal.pre-reference .flowstep.on{color:#0064ff!important}
#preModal.pre-reference .prebox{margin:0!important;padding:0!important;border:0!important;background:transparent!important}
#preModal.pre-reference .prebox>h3,#preModal.pre-reference .prebox>.subtext,#preModal.pre-reference .mobile-step{display:none!important}
#preModal.pre-reference .prebox>.formgrid{display:block!important}
#preModal.pre-reference .preMobileSection{margin:0 0 16px!important;border:1px solid #d6e6ff!important;border-radius:13px!important;overflow:hidden;background:#fff;box-shadow:none!important}
#preModal.pre-reference .preMobileSectionButton{display:flex!important;align-items:center;gap:15px!important;width:100%;min-height:60px!important;padding:10px 20px!important;border:0;border-bottom:1px solid #e1edfc;background:linear-gradient(100deg,#f8fbff,#f4f9ff);text-align:left;color:#08266e;cursor:pointer}
#preModal.pre-reference .preMobileSectionNumber{display:grid;place-items:center;width:39px!important;height:39px!important;flex:0 0 39px;border-radius:50%;background:#0064ff;color:white;font-size:20px!important;font-weight:800;box-shadow:none!important}
#preModal.pre-reference .preMobileSectionButton>span:nth-child(2){display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%}#preModal.pre-reference .preMobileSectionButton b{font-size:19px!important}#preModal.pre-reference .preMobileSectionButton small{font-size:12px!important;font-weight:400;color:#617eab;text-align:right;max-width:50%}
#preModal.pre-reference .preMobileSectionChevron{display:none!important}
#preModal.pre-reference .preMobileSectionBody{display:none!important;padding:17px!important}#preModal.pre-reference .preMobileSection.open .preMobileSectionBody{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
#preModal.pre-reference .field{min-width:0;margin:0!important;grid-column:auto!important}#preModal.pre-reference .field.full,#preModal.pre-reference .preOptional,#preModal.pre-reference .preMobileSection[data-pre-section='1'] .field:last-child{grid-column:1/-1!important}
#preModal.pre-reference .field label{display:block;margin:0 0 7px!important;font-size:13px!important;font-weight:700;color:#47628d!important}
#preModal.pre-reference input,#preModal.pre-reference select,#preModal.pre-reference textarea{width:100%!important;min-height:44px!important;padding:11px 14px!important;font-size:14px!important;border:1px solid #cbd9ec!important;border-radius:8px!important;background:#fff!important;color:#15233f!important;box-shadow:0 1px 2px #102b4b05!important;box-sizing:border-box;opacity:1!important;-webkit-text-fill-color:currentColor!important}
#preModal.pre-reference textarea{min-height:106px!important;line-height:1.5!important;resize:vertical}#preModal.pre-reference :is(input,select,textarea,button,summary):focus-visible{outline:3px solid #8fc0ff;outline-offset:2px}
#preModal.pre-reference .field .subtext{font-size:11px!important;color:#6c7f98!important;margin-top:4px}
#preModal.pre-reference .preOptional{margin:0!important;border:1px solid #9fc1ff!important;border-radius:9px!important;background:linear-gradient(100deg,#fff,#f0f6ff)!important}#preModal.pre-reference .preOptional summary{display:block!important;min-height:50px;padding:15px 18px;font-size:14px!important;color:#0059ed;box-sizing:border-box}#preModal.pre-reference .preOptional summary:before{content:'＋';margin-right:12px;font-size:19px}
#preModal.pre-reference .photo-picker{display:grid;grid-template-columns:1fr auto;column-gap:22px;padding:18px!important;border:1px dashed #a9caff!important;border-radius:10px!important;background:#f8fbff!important;align-items:center}#preModal.pre-reference .photo-picker.dragging{background:#e6f1ff!important;outline:2px solid #0064ff}
#preModal.pre-reference .photo-picker label{margin:0!important}#preModal.pre-reference .photo-help{font-size:12px;color:#607daa}#preModal.pre-reference .prePhotoActions{grid-column:2;grid-row:1/3;display:flex!important;gap:12px!important;margin:0!important}#preModal.pre-reference .prePhotoActions .btn{min-height:47px!important;font-size:14px!important;padding:12px 20px!important}#preModal.pre-reference .photo-grid{margin:0!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}#preModal.pre-reference .photo-grid:empty{display:none!important}#preModal.pre-reference .field:has(>.photo-grid:empty){display:none}
#preModal.pre-reference .actions{position:sticky!important;bottom:0!important;left:auto!important;right:auto!important;display:flex!important;justify-content:flex-end;gap:12px!important;z-index:10!important;margin:0 -22px!important;padding:14px 24px!important;border:0!important;border-top:1px solid #e2eaf5!important;border-radius:0!important;background:#fffffff5!important;box-shadow:0 -4px 16px #11335905!important;transform:none!important}
#preModal.pre-reference .actions .btn{min-height:44px!important;font-size:14px!important;grid-column:auto!important;grid-row:auto!important;padding:11px 20px!important;border-radius:8px!important}#preModal.pre-reference #printPre{margin-right:auto}#preModal.pre-reference .btn.primary{background:#0064ff!important;color:#fff!important;box-shadow:0 3px 8px #0064ff18!important}
#preModal.pre-reference.pre-mobile-view .modalbox{width:min(560px,100%)!important}
#preModal.pre-reference.pre-mobile-view .detailgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#preModal.pre-reference.pre-mobile-view .preMobileSectionBody{grid-template-columns:1fr!important}#preModal.pre-reference.pre-mobile-view .preMobileSectionButton small{display:none}
#preModal.pre-reference.pre-mobile-view .preTitleIcon{display:none}#preModal.pre-reference.pre-mobile-view h2{font-size:21px!important}#preModal.pre-reference.pre-mobile-view .preTitle p{font-size:12px}
#preModal.pre-reference.pre-mobile-view .photo-picker{display:block}#preModal.pre-reference.pre-mobile-view .prePhotoActions{margin-top:12px!important;flex-wrap:wrap}
@media(max-width:700px){
#preModal.pre-reference{padding:0!important}#preModal.pre-reference .modalbox{width:100%!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}
#preModal.pre-reference .modalhead{padding:14px!important;min-height:80px!important}#preModal.pre-reference .preTitleIcon{display:none}#preModal.pre-reference .modalhead h2{font-size:21px!important}#preModal.pre-reference .preTitle p{font-size:12px}#preModal.pre-reference .mobileViewToggle{display:none!important}
#preModal.pre-reference .modalbody{padding:0 12px!important}#preModal.pre-reference .detailgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;padding:6px!important;gap:5px!important}#preModal.pre-reference .detailcard{padding:12px 8px 12px 48px!important;min-height:73px!important}#preModal.pre-reference .detailcard:before{width:30px!important;height:30px!important;left:8px;top:16px;font-size:18px!important}#preModal.pre-reference .detailcard b{font-size:12px!important}
#preModal.pre-reference .preReportedDefect{padding:14px!important;gap:8px!important}#preModal.pre-reference .preReportedHint{font-size:11px!important}
#preModal.pre-reference .preMobileSectionButton{padding:10px 12px!important;gap:10px!important}#preModal.pre-reference .preMobileSectionButton b{font-size:17px!important}#preModal.pre-reference .preMobileSectionButton small{display:none}#preModal.pre-reference .preMobileSection.open .preMobileSectionBody{grid-template-columns:1fr!important;padding:14px!important;gap:16px!important}#preModal.pre-reference input,#preModal.pre-reference select,#preModal.pre-reference textarea{font-size:16px!important;min-height:48px!important}
#preModal.pre-reference .photo-picker{display:block}#preModal.pre-reference .prePhotoActions{margin-top:14px!important;display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}#preModal.pre-reference .prePhotoActions .btn{padding:10px!important;font-size:12px!important}
#preModal.pre-reference .photo-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
#preModal.pre-reference .actions{display:grid!important;grid-template-columns:1fr 1fr!important;margin:0 -12px!important;padding:12px 12px calc(12px + env(safe-area-inset-bottom))!important;gap:8px!important}#preModal.pre-reference .actions .primary{grid-column:1/-1!important;grid-row:1!important}#preModal.pre-reference .actions .btn{font-size:12px!important;padding:10px!important}#preModal.pre-reference #printPre{margin:0;width:100%}
}
#preModal.pre-reference .detailcard:has(.preSummaryIcon):before{display:none!important}
#preModal.pre-reference .preSummaryIcon{position:absolute;left:12px;top:16px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#e6f1ff;color:#0064ff}
#preModal.pre-reference .preSummaryIcon svg{width:24px;height:24px}#preModal.pre-reference .preTitleIcon svg{width:29px;height:29px}
@media(max-width:700px){#preModal.pre-reference .preSummaryIcon{left:8px;width:30px;height:30px}#preModal.pre-reference .preSummaryIcon svg{width:20px;height:20px}}
#preModal.pre-reference .preOptional summary:after{content:'⌄';font-size:18px}#preModal.pre-reference .preOptional[open] summary:after{content:'⌃'}
#preModal.pre-reference .detailcard:nth-child(6) b{display:inline-block;padding:4px 12px;border-radius:20px;background:#fff0c9;color:#ad6500!important;font-size:12px!important}