:root{--primary: #1a202c;--accent: #3182ce;--success: #38a169;--warning: #ed8936;--error: #e53e3e;--bg: #f1f5f9}body{font-family:Inter,system-ui,sans-serif;background:var(--bg);margin:0;padding-bottom:90px;overflow-x:hidden}.empty-state{padding:48px;text-align:center;color:#888;font-size:14px}.sticky-header{position:sticky;top:0;background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:12px 15px;border-bottom:1px solid #d1d9e0;z-index:2000}.search-wrapper{position:relative;flex:1;display:flex;align-items:center}.search-wrapper:before{content:"";position:absolute;left:14px;width:12px;height:12px;border:2px solid #94a3b8;border-radius:50%;pointer-events:none}.search-wrapper:after{content:"";position:absolute;left:27px;top:28px;width:6px;height:2px;background:#94a3b8;transform:rotate(45deg);pointer-events:none}#search-bar{width:100%;padding:12px 15px 12px 40px;border:1px solid #cbd5e0;border-radius:12px;font-size:16px;outline:none;background:#fff;box-sizing:border-box}.action-bar{display:flex;gap:10px;align-items:center;margin-bottom:8px}#scan-button{background:var(--primary);color:#fff;border:none;padding:8px 14px;border-radius:10px;cursor:pointer;display:flex;align-items:center;gap:8px;font-weight:700;font-size:11px;text-transform:uppercase}.barcode-icon{display:flex;gap:2px;align-items:center;height:14px}.barcode-icon span{background:#fff;width:1px;height:100%}.barcode-icon span:nth-child(2n){width:3px}.filter-panel{display:flex;width:100%;justify-content:space-around;margin:20px 0;flex-wrap:wrap}.filter-panel button{border:2px solid;padding:10px 50px;border-radius:8px;font-size:14px;font-weight:700}#building-filter,#inspection-filter,#teststatus-filter{font-size:14px;font-weight:500;color:#111827;text-align:center;border:1.5px solid #e5e7eb;background:#fff;padding:6px 8px;border-radius:6px;outline:none;width:165px;transition:border-color .2s,background-color .2s}#all-btn:hover,#all-btn.active{background-color:#4b4a4a;color:#fff}#pending-btn:hover,#pending-btn.active{background-color:#ffc106;color:#fff}#completed-btn:hover,#completed-btn.active{background-color:#28a745;color:#fff}.filter-toggle{display:none;width:100%;padding:10px;border-radius:8px;border:1.5px solid #e5e7eb;background:#fff;font-weight:600;text-align:center;cursor:pointer}.filter-panel{display:flex;width:100%;justify-content:space-around;gap:15px;flex-wrap:wrap}@media(max-width:768px){.status-filters{flex-direction:column;align-items:stretch}.filter-toggle{display:block}.filter-panel{display:none;flex-direction:column;gap:10px;background:#fff;border-radius:10px;box-shadow:0 2px 6px #00000026;align-items:center;padding:10px 0}.filter-panel.active{display:flex}.filter-group{display:flex;justify-content:space-between;gap:8px}.filter-panel button{border:2px solid;width:90%;border-radius:8px;font-size:14px;font-weight:700}#building-filter,#inspection-filter,#teststatus-filter{width:90%}}.pending-btn .completed-btn .progress-stats{display:flex;justify-content:space-between;font-size:11px;font-weight:800;color:#64748b;margin-bottom:4px}#site-status-label{font-size:12px;margin-right:5px;font-weight:500;color:#252424}#progressLabel{font-size:12px;font-weight:500;color:#252424}.progress-container{height:6px;background:#e2e8f0;border-radius:10px;overflow:hidden;margin-top:4px}#progressBar{height:100%;background:var(--success);width:0%;transition:width .5s}.filter-buttons{margin-top:15px;display:flex;gap:10px}.filter-buttons button{flex:1;padding:10px;border:none;border-radius:6px;cursor:pointer}#completed-btn{background-color:transparent;border-color:#28a745;color:#28a745}#pending-btn{background-color:transparent;border-color:#ffc106;color:#ffc106}#all-btn{background-color:transparent;border-color:#4b4a4a;color:#4b4a4a}.footer{position:fixed;bottom:0;left:0;width:100%;background:#fff;padding:15px;box-shadow:0 -5px 20px #0000001a;z-index:1000;box-sizing:border-box}.footer-content{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}.footer{transition:transform .3s ease-in-out}.footer-handle{width:100%;text-align:center;margin:0 0 10px}#footer-arrow{font-size:16px}@media(max-width:768px){.footer{transform:translateY(60%)}.footer.expanded{transform:translateY(0)}}@media screen and (min-width:769px){.footer-content{position:fixed;bottom:0;left:0;width:100%;background:#fff;padding:15px;box-shadow:0 -5px 20px #0000001a;z-index:1000;box-sizing:border-box;display:flex}.btn-submit{background:var(--primary);color:#fff;width:98%;margin-left:auto;margin-right:auto;border:none;border-radius:12px;font-weight:700;cursor:pointer;font-size:16px}}#toast-container{position:fixed;bottom:80px;left:50%;transform:translate(-50%);z-index:2000;display:flex;flex-direction:column;gap:10px;pointer-events:none;align-items:center;justify-content:center}.toast{background:#333;color:#fff;padding:12px 24px;border-radius:25px;font-size:12px;box-shadow:0 4px 6px #0000001a;animation:fadeIn .3s,fadeOut .3s 2.7s forwards;display:flex;align-items:center;gap:8px;pointer-events:auto;width:220px;text-align:center}.toast.success{background:var(--success)}.toast.warning{background:var(--warning)}.toast.error{background:var(--error)}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(20px)}}@media screen and (min-width:600px){.toast{font-size:14px;width:auto}}#qr-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:600px;height:auto;max-height:80vh;background:#000;padding:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;border-radius:12px;z-index:2000;box-sizing:border-box}#close-qr{margin-top:15px;padding:10px 20px;border:none;background:#e53e3e;color:#fff;border-radius:6px;cursor:pointer;font-weight:600}#defect-modal{position:fixed;inset:0;z-index:3000;justify-content:center;align-items:center;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex}#defect-modal.active{display:flex}.modern-modal{background:#fff;width:90%;max-width:500px;border-radius:16px;padding:20px 28px;box-shadow:0 10px 30px #0003;animation:modalPop .2s ease-out;margin:20px}@keyframes modalPop{0%{transform:scale(.85);opacity:0}to{transform:scale(1);opacity:1}}.modal-header{text-align:center;margin-bottom:16px}.modal-header h2{margin:0;font-size:22px;color:#1f2937}.modal-header p{margin-top:6px;font-size:14px;color:#6b7280}.modal-body{display:flex;flex-direction:column;gap:14px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group .detail-label{font-weight:500;font-size:14px}.detail-input.full-width{max-width:100%;text-align:left}textarea{width:95%;border:1.5px solid #e5e7eb;border-radius:8px;padding:10px;font-size:14px;font-family:inherit;resize:vertical}textarea:focus{outline:none;border-color:#2563eb}.modal-footer{display:flex;justify-content:space-between;gap:12px;margin-top:18px}.btn-secondary{flex:1;padding:10px;border-radius:8px;border:1px solid #e5e7eb;background:#f1f5f9;font-weight:600;cursor:pointer}.btn-primary{flex:1;padding:10px;border-radius:8px;border:none;background:#1a202c;color:#fff;font-weight:600;cursor:pointer}.btn-primary:hover{background:#000}.loader-wrapper{position:fixed;inset:0;background:#fff9;display:flex;align-items:center;justify-content:center;z-index:9999;opacity:100;transition:opacity .2s ease}.loader-wrapper.active{visibility:visible;opacity:1}.loader{width:48px;height:48px;border:5px solid #e2e8f0;border-top:5px solid #3182ce;border-radius:50%;animation:spin 1s linear infinite}#bulk-filter-wrapper{position:relative;padding:10px 20px 40px}#bulk-filter-btn{position:absolute;right:15px;top:10px;background-color:#fff;padding:8px 16px;border-radius:50px;box-shadow:0 2px 6px #00000026;cursor:pointer;display:flex;align-items:center;gap:8px;border:1px solid #e0e0e0;transition:transform .1s ease,box-shadow .1s ease}#bulk-filter-box{position:absolute;right:15px;top:55px;background:#fff;border-radius:12px;box-shadow:0 4px 12px #00000026;width:220px;padding:16px;flex-direction:column;display:flex;gap:12px;z-index:1000}#inspection-filter,#teststatus-filter{font-size:14px;font-weight:500;color:#111827;text-align:center;border:1.5px solid #e5e7eb;background:#fff;padding:6px 8px;border-radius:6px;outline:none;width:100%;transition:border-color .2s,background-color .2s}#bulk-update-btn.disabled-btn{background-color:#00000085}#bulk-update-btn{background:var(--primary);color:#fff;width:100%;padding:10px 4px;border:none;border-radius:12px;font-weight:700;cursor:pointer;font-size:12px}.btn-submit{background:var(--primary);color:#fff;width:100%;padding:16px;border:none;border-radius:12px;font-weight:700;cursor:pointer;font-size:16px}.btn-submit.disabled-btn{background-color:#00000085}@media screen and (min-width:769px){.btn-submit{background:var(--primary);color:#fff;width:98%;margin-left:auto;margin-right:auto;border:none;border-radius:12px;font-weight:700;cursor:pointer;font-size:16px}}#buildingList{max-width:100%;margin:20px;display:grid;gap:16px;align-items:start;justify-content:center;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));grid-auto-flow:row dense}.building-card.expanded{grid-column:1 / -1}@media screen and (min-width:600px){#buildingList{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width:1200px){#buildingList{grid-template-columns:repeat(3,1fr)}}.building-card{width:100%;background:#fff;border-radius:8px;box-shadow:0 2px 6px #00000026;box-sizing:border-box;display:flex;flex-direction:column;padding:0 12px}.pending-building{border-left:6px solid #ffc106}.completed-building{border-left:6px solid var(--success)}.building-header{width:100%;padding:12px 0;display:flex;justify-content:space-between;align-items:center;cursor:pointer}.building-header-left{display:flex;flex-direction:column}.building-header-left h3{margin:0;font-size:16px}.building-info{font-size:14px;color:#666}.building-header-right{display:flex;align-items:center;gap:10px}.asset-count{background:#f1f5f9;color:#334155;font-size:14px;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap}.pending-building .asset-count{background:#fff7ed;color:#ffc106}.toggle-icon{font-size:22px;font-weight:700}.assets-container{width:100%;margin-top:10px;padding-top:10px;border-top:1px solid #e5e7eb}.asset-row{display:flex;align-items:stretch;gap:12px;padding:10px;margin-bottom:8px;background:#f8fafc;border-radius:6px}.asset-row:hover{background-color:#f1f5f9;cursor:pointer}.pending-asset{border-left:4px solid var(--warning)}.completed-asset{border-left:4px solid var(--success)}@media(max-width:600px){.asset-row{display:grid!important;grid-template-columns:28px 1fr;grid-template-rows:auto auto auto;column-gap:10px;row-gap:6px}.asset-left{grid-row:1 / span 4;grid-column:1}.asset-checkbox{width:26px;height:26px}.asset-center{grid-column:2;grid-row:1 / span 2}.assets-right-side{grid-column:2;grid-row:3;display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}.assets-right-side select{width:100%}}.asset-count{background:#f1f5f9;color:#334155;font-size:14px;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap;margin-top:4px}.completed-building .asset-count{background:#dcfce7;color:#166534}.pending-building .asset-count{background:#fff7ed;color:#9a3412}.assets-container{width:100%;margin-top:10px;border-top:1px solid #e5e7eb;padding-top:10px}.asset-row:hover{cursor:pointer}.pending-asset{border-left:4px solid #ffc106}.completed-asset{border-left:4px solid #28a745}.failed-asset{border-left:6px solid #e1340d}.asset-details-header{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:12px;padding:14px 16px;background-color:#fff;border-bottom:1px solid #e5e7eb;box-shadow:0 1px 3px #0000000d}.assets-right-side{display:flex;gap:30px;flex-wrap:wrap;justify-content:center}.asset-id-row{display:flex;align-items:center;gap:5px}.sync-icon.updating svg{animation:spin 1.2s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.back-button{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border:none;border-radius:50%;background-color:#f1f5f9;font-size:18px;font-weight:700;cursor:pointer;transition:background-color .2s ease,transform .1s ease}.back-button:hover{background-color:#e2e8f0}.back-button:active{transform:scale(.95)}.update-asset-button{margin-left:auto;padding:12px 18px;background-color:#000;color:#fff;border:none;text-align:center;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:background-color .2s ease,transform .1s ease,box-shadow .1s ease,color ease .1s}.update-asset-button:hover{background-color:#fff;color:#000;box-shadow:0 2px 6px #00000026}.update-asset-button:active{transform:scale(.97);box-shadow:0 2px 6px #00000026}.update-asset-button:disabled{background-color:#9ca3af;cursor:not-allowed}.asset-title{font-weight:600;color:#1f2937;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;flex-direction:column;gap:0px}.asset-title h2{font-size:24px;overflow:hidden}.asset-location{margin-top:-18px;color:#9f9d9d}.asset-tabs{margin-top:16px;display:flex;flex-direction:column;border-top:1px solid #e5e7eb;font-family:Arial,sans-serif}.tab-buttons{display:flex;flex-wrap:wrap;gap:8px;background-color:#f9fafb;padding:0 8px;border-bottom:1px solid #e5e7eb;justify-content:space-around;overflow-x:auto}.tab-btn{flex:0 0 auto;padding:10px 16px;background-color:transparent;border:none;font-size:14px;font-weight:500;cursor:pointer;color:#374151;transition:background-color .2s,color .2s,border-bottom .2s;border-bottom:2px solid transparent;white-space:nowrap;font-weight:700}.tab-btn:hover{background-color:#f3f4f6}.tab-btn.active{color:#1f2937;border-bottom:2px solid #3b82f6;color:#3b82f6}.tab-content{padding:16px;background-color:#fff;min-height:150px;border-bottom:1px solid #e5e7eb}@media(max-width:768px){.tab-btn{padding:8px 12px;font-size:13px}}@media(max-width:480px){.tab-buttons{gap:4px;padding:0 4px}.tab-btn{padding:6px 10px;font-size:12px}.update-asset-button{width:70px;font-size:12px}.asset-title h2{font-size:16px;overflow:hidden}.asset-location{font-size:14px;margin-top:-12px}}.detail-section{padding:12px 28px}.detail-row{display:grid;grid-template-columns:1fr auto;align-items:center;padding:12px 0;border-bottom:1px solid #f1f5f9}.detail-row .form-row{padding:0;display:flex;flex-direction:column;gap:10px}.detail-label{font-size:13px;color:#6b7280}.detail-input{font-size:14px;font-weight:500;color:#111827;text-align:right;border:1.5px solid #e5e7eb;background:#fff;padding:6px 8px;border-radius:6px;outline:none;max-width:170px;transition:border-color .2s,background-color .2s}.detail-input:hover{background:#fff;border-color:#c7d2fe}.detail-input:focus{background:#fff;border-color:#2563eb}.detail-input:disabled{border:none;background:transparent;color:#374151;padding:0;cursor:default}span.detail-input{border:none;background:transparent;color:#374151;padding:0;cursor:default}.detail-input.select-input{text-align:center}.status-complete{color:#16a34a}.status-open{color:#dc2626}.status-resolved{color:#16a34a}.tab-panel{display:none}.tab-panel.active{display:block}.form-row{padding:12px 16px;display:flex;flex-direction:column;gap:6px}.form-row label{font-size:13px;color:#6b7280}.form-row textarea,.form-row input[type=file]{font-size:14px}.upload-area{border:2px dashed #cbd5e0;border-radius:12px;padding:20px;text-align:center;background:#f9fafb;cursor:pointer;transition:background-color .2s,border-color .2s;position:relative}.upload-area:hover{background:#f1f5f9;border-color:#3b82f6}.upload-area input[type=file]{display:none;width:100%}.upload-area p{margin:0;font-size:14px;color:#64748b}.upload-preview{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.upload-preview img{width:80px;height:80px;object-fit:cover;border-radius:8px;box-shadow:0 1px 4px #0000001a;transition:transform .2s,box-shadow .2s}.upload-preview img:hover{transform:scale(1.05);box-shadow:0 4px 12px #00000026}@media(max-width:480px){.detail-section{padding:12px 10px}.detail-input{max-width:120px}.detail-input{max-width:140px;font-size:13px}}#search-result{padding:20px 25px;display:flex;gap:20px;justify-content:center;align-items:center}#search-result .asset-row{margin:20px 0}.empty-state{font-size:18px;font-weight:600}.asset-row{display:flex;align-items:stretch;gap:12px}.asset-left{display:flex;align-items:center;justify-content:center}.asset-checkbox{width:18px;height:18px;cursor:pointer;accent-color:#26a153}.assets-right-side{display:flex;gap:10px;align-items:center}.asset-row:hover{background-color:#f1f5f9}.asset-row select,.asset-row input{z-index:2}.asset-center{flex:1;display:flex;flex-direction:column;justify-content:center}.asset-id-row{display:flex;align-items:center;gap:6px}.asset-info{font-size:13px;color:#64748b}@media(max-width:600px){.asset-row{display:grid!important;grid-template-columns:28px 1fr;grid-template-rows:auto auto auto;column-gap:10px;row-gap:6px;align-items:center}.asset-left{grid-row:1 / span 4;grid-column:1;display:flex;align-items:center;justify-content:center}.asset-checkbox{width:26px;height:26px;accent-color:#26a153}.asset-center{grid-column:2;grid-row:1 / span 2;display:flex;flex-direction:column;gap:2px}.assets-right-side{grid-column:2;grid-row:3;display:grid;grid-template-columns:1fr 1fr;gap:8px;width:100%}.assets-right-side select{width:100%;max-width:none}}.unauthorized{height:100%;display:"flex";align-items:"center";justify-content:"center";flex-direction:"column";font-family:Inter,system-ui,sans-serif;background:"#f9f9f9";width:100%;text-align:center}