@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";@import"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0-beta3/css/all.min.css";:root{font-family:Inter,sans-serif;line-height:1.5;font-weight:400;color-scheme:light;color:#000;background-color:#fff;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;align-items:stretch;min-width:320px;min-height:100vh;font-family:Inter,sans-serif}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:none}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.sidebar{position:fixed;left:0;top:0;height:100vh;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;z-index:999;transition:all .3s ease;overflow-y:auto;box-shadow:2px 0 8px #00000026;font-family:Inter,sans-serif}.sidebar-header{padding:24px 20px;border-bottom:2px solid rgba(255,255,255,.1);background:#0000001a}.sidebar-title{margin:0;font-size:18px;font-weight:700;display:flex;align-items:center;gap:12px;line-height:1.4}@media (max-width: 767px){.sidebar-title{font-size:16px}}.sidebar-logo{width:40px;height:40px;object-fit:contain}.sidebar-nav{padding:16px 0}.sidebar-item{padding:16px 20px;cursor:pointer;display:flex;align-items:center;gap:16px;font-size:15px;transition:all .2s ease;border-left:4px solid transparent;white-space:nowrap}.sidebar-item span{font-size:20px;min-width:24px;display:flex;justify-content:center}.sidebar-item.inactive{color:#fffc}.sidebar-item.inactive:hover{background-color:#ffffff1a;color:#fff}.sidebar-item.active{background-color:#fff3;color:#fff;border-left-color:#ffc107;box-shadow:inset 0 0 0 1px #ffffff1a}.sidebar-toggle-button{width:44px;height:44px;border:none;background-color:#3f51b5;color:#fff;font-size:24px;cursor:pointer;border-radius:8px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px #0003;transition:all .3s ease}.sidebar-toggle-button:hover{background-color:#303f9f;box-shadow:0 4px 12px #0000004d}.sidebar-toggle-button.open{background-color:#ef4444;color:#fff}@media (min-width: 768px){.sidebar-toggle-button{display:none}}@media (max-width: 767px){.sidebar-toggle-button{display:flex}}.logout-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;animation:fade-In .2s ease}.logout-modal{background:#fff;border-radius:12px;padding:32px;max-width:400px;width:90%;box-shadow:0 10px 40px #0003;animation:slide-Up .3s ease}@keyframes slide-Up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.logout-modal-title{margin:0 0 16px;font-size:20px;font-weight:600;color:#1a1a1a}.logout-modal-message{margin:0 0 24px;font-size:15px;color:#666;line-height:1.5}.logout-modal-actions{display:flex;gap:12px;justify-content:flex-end}.logout-btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease}.logout-btn-cancel{background-color:#e0e0e0;color:#1a1a1a}.logout-btn-cancel:hover{background-color:#d0d0d0}.logout-btn-confirm{background-color:#ef4444;color:#fff}.logout-btn-confirm:hover{background-color:#dc2626}@media (min-width: 1920px){.sidebar{width:17.6vw}.sidebar-item{padding:18px 22px;font-size:13px}.sidebar-title{font-size:16px;gap:14px}.sidebar-item span{font-size:22px}.sidebar-logo{width:48px;height:48px}}@media (min-width: 1600px) and (max-width: 1919px){.sidebar{width:17.6vw}.sidebar-item{padding:17px 21px;font-size:15px}.sidebar-title{font-size:19px;gap:13px}.sidebar-item span{font-size:21px}.sidebar-logo{width:44px;height:44px}}@media (min-width: 1400px) and (max-width: 1599px){.sidebar{width:17.4vw}.sidebar-item{padding:16px 20px;font-size:13px}.sidebar-title{font-size:15px;gap:12px}.sidebar-item span{font-size:20px}.sidebar-logo{width:42px;height:42px}}@media (min-width: 1200px) and (max-width: 1399px){.sidebar{width:17.2vw}.sidebar-item{padding:15px 18px;font-size:12px}.sidebar-title{font-size:14px;gap:10px}.sidebar-item span{font-size:19px}.sidebar-logo{width:40px;height:40px}}@media (min-width: 992px) and (max-width: 1199px){.sidebar{width:17.2vw}.sidebar-item{padding:14px 10px;font-size:11px}.sidebar-title{font-size:12px;gap:10px}.sidebar-item span{font-size:18px}.sidebar-logo{width:30px;height:30px}}@media (min-width: 768px) and (max-width: 991px){.sidebar{width:180px}.sidebar-item{padding:13px 14px;font-size:12px}.sidebar-title{font-size:14px;gap:8px}.sidebar-item span{font-size:16px}.sidebar-logo{width:32px;height:32px}}@media (max-width: 767px){.sidebar{position:fixed;left:0;top:0;height:100vh;width:0;opacity:0;visibility:hidden;z-index:999}.sidebar.mobile-open{width:260px;opacity:1;visibility:visible}.sidebar-toggle-button{display:flex}}@media (max-width: 480px){.sidebar.mobile-open{width:100%;max-width:100%}.sidebar-title{font-size:14px}.sidebar-item{font-size:13px}}.modal-overlay-hapus-sn{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;animation:fadeIn .3s ease}.modal-content-hapus-sn{background:#fff;border-radius:8px;width:90%;max-width:800px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(50px);opacity:0}to{transform:translateY(0);opacity:1}}.modal-header-hapus-sn{padding:20px 24px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center;background:#f9fafb}.modal-header-hapus-sn h2{margin:0;font-size:20px;font-weight:600;color:#111827}.close-button-hapus-sn{background:none;border:none;font-size:28px;cursor:pointer;color:#6b7280;line-height:1;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.close-button-hapus-sn:hover{background:#e5e7eb;color:#111827}.modal-body-hapus-sn{padding:24px;overflow-y:auto;flex:1}.input-section-hapus-sn{margin-bottom:24px}.input-section-hapus-sn label{display:block;margin-bottom:8px;font-weight:500;color:#374151;font-size:14px}.input-wrapper-hapus-sn{display:flex;gap:8px}.sn-input-hapus-sn{flex:1;padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;transition:all .2s}.sn-input-hapus-sn:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.add-button-hapus-sn{padding:10px 20px;background:#3b82f6;color:#fff;border:none;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s;font-size:14px}.add-button-hapus-sn:hover:not(:disabled){background:#2563eb}.add-button-hapus-sn:disabled{background:#9ca3af;cursor:not-allowed}.input-hint-hapus-sn{margin-top:8px;font-size:12px;color:#6b7280;line-height:1.5}.sn-list-section-hapus-sn{margin-bottom:24px;padding:16px;background:#f9fafb;border-radius:6px;border:1px solid #e5e7eb}.sn-list-section-hapus-sn h3{margin:0 0 12px;font-size:14px;font-weight:600;color:#374151}.sn-chips-container-hapus-sn{display:flex;flex-wrap:wrap;gap:8px;max-height:200px;overflow-y:auto;padding:4px}.sn-chip-hapus-sn{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#fff;border:1px solid #d1d5db;border-radius:20px;font-size:13px;color:#374151;transition:all .2s}.sn-chip-hapus-sn:hover{border-color:#3b82f6;background:#eff6ff}.remove-chip-button-hapus-sn{background:none;border:none;font-size:18px;cursor:pointer;color:#6b7280;line-height:1;padding:0;width:16px;height:16px;display:flex;align-items:center;justify-content:center;transition:color .2s}.remove-chip-button-hapus-sn:hover{color:#ef4444}.message-box-hapus-sn{padding:12px 16px;border-radius:6px;margin-bottom:16px;font-size:14px;line-height:1.5}.message-box-hapus-sn.error{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}.message-box-hapus-sn.success{background:#f0fdf4;border:1px solid #bbf7d0;color:#166534}.confirmation-section-hapus-sn{margin-bottom:24px}.confirmation-section-hapus-sn h3{margin:0 0 16px;font-size:16px;font-weight:600;color:#111827}.table-container-hapus-sn{overflow-x:auto;border:1px solid #e5e7eb;border-radius:6px;margin-bottom:16px}.data-table-hapus-sn{width:100%;border-collapse:collapse;font-size:14px}.data-table-hapus-sn thead{background:#f9fafb}.data-table-hapus-sn th{padding:12px 16px;text-align:left;font-weight:600;color:#374151;border-bottom:1px solid #e5e7eb}.data-table-hapus-sn td{padding:12px 16px;border-bottom:1px solid #e5e7eb;color:#4b5563}.data-table-hapus-sn tbody tr:last-child td{border-bottom:none}.data-table-hapus-sn tbody tr:hover{background:#f9fafb}.not-found-row{background:#fef2f2!important}.status-badge-hapus-sn{display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500}.status-badge-hapus-sn.found{background:#d1fae5;color:#065f46}.status-badge-hapus-sn.not-found{background:#fee2e2;color:#991b1b}.summary-section-hapus-sn{padding:16px;background:#f9fafb;border-radius:6px;border:1px solid #e5e7eb}.summary-section-hapus-sn p{margin:0 0 8px;font-size:14px;color:#374151}.summary-section-hapus-sn p:last-child{margin-bottom:0}.summary-section-hapus-sn strong{font-weight:600;margin:0 4px}.warning-text-hapus-sn{color:#dc2626!important;font-weight:500!important;margin-top:12px!important}.result-section-hapus-sn{text-align:center;padding:40px 20px}.result-icon-hapus-sn{width:80px;height:80px;margin:0 auto 20px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:48px;font-weight:700}.result-section-hapus-sn.success .result-icon-hapus-sn{background:#d1fae5;color:#065f46}.result-section-hapus-sn.error .result-icon-hapus-sn{background:#fee2e2;color:#991b1b}.result-section-hapus-sn h3{margin:0 0 12px;font-size:24px;font-weight:600}.result-section-hapus-sn.success h3{color:#065f46}.result-section-hapus-sn.error h3{color:#991b1b}.result-section-hapus-sn p{margin:0;font-size:16px;color:#4b5563;line-height:1.6}.button-group-hapus-sn{display:flex;gap:12px;justify-content:flex-end;padding-top:16px;border-top:1px solid #e5e7eb}.button-group-hapus-sn button{padding:10px 24px;border-radius:6px;font-weight:500;cursor:pointer;transition:all .2s;border:none;font-size:14px}.cancel-button-hapus-sn,.back-button-hapus-sn{background:#fff;color:#374151;border:1px solid #d1d5db!important}.cancel-button-hapus-sn:hover,.back-button-hapus-sn:hover{background:#f9fafb;border-color:#9ca3af!important}.check-button-hapus-sn{background:#3b82f6;color:#fff}.check-button-hapus-sn:hover:not(:disabled){background:#2563eb}.check-button-hapus-sn:disabled{background:#9ca3af;cursor:not-allowed}.delete-button-hapus-sn{background:#ef4444;color:#fff}.delete-button-hapus-sn:hover:not(:disabled){background:#dc2626}.delete-button-hapus-sn:disabled{background:#9ca3af;cursor:not-allowed}.close-result-button-hapus-sn{background:#3b82f6;color:#fff}.close-result-button-hapus-sn:hover{background:#2563eb}.modal-body-hapus-sn::-webkit-scrollbar,.sn-chips-container-hapus-sn::-webkit-scrollbar,.table-container-hapus-sn::-webkit-scrollbar{width:8px;height:8px}.modal-body-hapus-sn::-webkit-scrollbar-track,.sn-chips-container-hapus-sn::-webkit-scrollbar-track,.table-container-hapus-sn::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.modal-body-hapus-sn::-webkit-scrollbar-thumb,.sn-chips-container-hapus-sn::-webkit-scrollbar-thumb,.table-container-hapus-sn::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:4px}.modal-body-hapus-sn::-webkit-scrollbar-thumb:hover,.sn-chips-container-hapus-sn::-webkit-scrollbar-thumb:hover,.table-container-hapus-sn::-webkit-scrollbar-thumb:hover{background:#9ca3af}@media (max-width: 768px){.modal-content-hapus-sn{width:95%;max-height:95vh}.modal-header-hapus-sn,.modal-body-hapus-sn{padding:16px}.input-wrapper-hapus-sn{flex-direction:column}.add-button-hapus-sn{width:100%}.button-group-hapus-sn{flex-direction:column}.button-group-hapus-sn button{width:100%}.data-table-hapus-sn{font-size:12px}.data-table-hapus-sn th,.data-table-hapus-sn td{padding:8px}}body{font-family:Inter,sans-serif;overflow-x:hidden}.error-page{height:100vh;width:100vw;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);display:flex;align-items:center;justify-content:center;padding:20px}.error-container{max-width:600px;width:100%;background:#fff;border-radius:20px;box-shadow:0 10px 40px #0000001a;padding:50px 40px;text-align:center}.error-icon{display:flex;justify-content:center;align-items:center;margin-bottom:25px}.icon-container{position:relative;width:100px;height:100px;display:flex;align-items:center;justify-content:center}.icon-search{width:100px;height:100px;color:#d1d5db}.icon-x{width:50px;height:50px;color:#ef4444;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.icon-lock{width:100px;height:100px;color:#ef4444}.icon-wrench{width:100px;height:100px;color:#f97316}.icon-error{width:100px;height:100px;color:#ef4444}.error-code h1{font-size:80px;font-weight:700;color:#1f2937;margin:0 0 15px;line-height:1}.error-title h2{font-size:28px;font-weight:600;color:#374151;margin:0 0 15px}.error-description p{font-size:16px;color:#6b7280;margin:0 0 25px;line-height:1.6}.error-message{background:#fef2f2;border:1px solid #fecaca;border-radius:10px;padding:15px 20px;margin:25px 0;display:flex;align-items:flex-start;gap:12px;text-align:left}.error-message-icon{flex-shrink:0;color:#dc2626;margin-top:2px}.error-message-content{flex:1}.error-message-label{font-weight:600;color:#991b1b;font-size:14px;margin:0 0 6px}.error-message-text{color:#991b1b;font-size:14px;margin:0;line-height:1.5;word-wrap:break-word;word-break:break-word}.error-footer{margin-top:35px;padding-top:25px;border-top:1px solid #e5e7eb;display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap}.error-link{color:#3b82f6;text-decoration:none;font-size:15px;font-weight:500;transition:all .3s ease;padding:5px 10px;border-radius:5px}.error-link:hover{color:#1d4ed8;background:#eff6ff}.error-separator{color:#d1d5db;font-size:16px}@media (max-width: 768px){.error-container{padding:40px 25px;max-width:90%}.error-code h1{font-size:64px}.error-title h2{font-size:22px}.error-description p{font-size:14px}.icon-search,.icon-lock,.icon-wrench,.icon-error,.icon-container{width:80px;height:80px}.icon-x{width:40px;height:40px}.error-message{padding:12px 15px}.error-message-label,.error-message-text{font-size:13px}}@media (max-width: 480px){.error-container{padding:30px 20px}.error-code h1{font-size:56px}.error-title h2{font-size:20px}.error-footer{flex-direction:column;gap:10px}.error-separator{display:none}.error-link{font-size:14px}}.analitik-container{background-color:#fff;min-height:100vh}.analitik-header{margin-bottom:30px;text-align:center;background-color:#f7fafc;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.analitik-header h2{color:#2c3e50;font-size:28px;font-weight:600;margin:0 0 8px}.analitik-subtitle{color:#718096;font-size:16px;margin:0;font-weight:400}.filter-section{background:#fff;padding:25px;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:25px;display:flex;gap:20px;align-items:flex-end;flex-wrap:wrap}.filter-group{display:flex;flex-direction:column;gap:8px;flex:1;min-width:200px}.filter-group label{font-weight:500;color:#555;font-size:14px}.filter-select{padding:10px 15px;border:1px solid #ddd;border-radius:6px;font-size:14px;background-color:#fff;cursor:pointer;transition:border-color .3s}.filter-select:hover{border-color:#5e72e4}.filter-select:focus{outline:none;border-color:#5e72e4;box-shadow:0 0 0 3px #5e72e41a}.btn-search{padding:10px 30px;background-color:#5e72e4;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .3s;height:42px}.btn-search:hover:not(:disabled){background-color:#4c63d2}.btn-search:disabled{background-color:#a0aec0;cursor:not-allowed}.error-message{background-color:#fee;border-left:4px solid #f56565;padding:15px;margin-bottom:20px;border-radius:6px}.error-message p{color:#c53030;margin:0;font-size:14px}.summary-section{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:30px;justify-content:center;max-width:1400px;margin-left:auto;margin-right:auto}.summary-card{background:#fff;padding:25px;border-radius:8px;box-shadow:0 2px 4px #0000001a;border-left:4px solid #5e72e4;transition:transform .3s,box-shadow .3s}.summary-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.summary-card.card-success{border-left-color:#48bb78}.summary-card.card-warning{border-left-color:#ed8936}.summary-card.card-danger{border-left-color:#f56565}.summary-card.card-info{border-left-color:#4299e1}.summary-card.card-primary{border-left-color:#667eea}.card-title{font-size:14px;color:#718096;font-weight:500;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}.card-value{font-size:24px;font-weight:700;color:#2d3748}.po-tidak-invoice-section{background:#fff;padding:25px;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:30px}.po-tidak-invoice-section h3{color:#2c3e50;font-size:18px;margin-bottom:20px;font-weight:600}.po-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:15px}.po-item{padding:12px 15px;background-color:#fff5f5;border-left:3px solid #f56565;border-radius:6px;display:flex;justify-content:space-between;align-items:center}.po-number{font-weight:600;color:#c53030}.po-sn{font-size:13px;color:#718096}.table-section{background:#fff;padding:25px;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:30px}.table-section h3{color:#2c3e50;font-size:18px;margin-bottom:20px;font-weight:600}.table-controls{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.items-per-page{display:flex;align-items:center;gap:10px}.items-per-page label{font-size:14px;color:#555}.items-per-page select{padding:6px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;cursor:pointer}.table-responsive{overflow-x:auto;margin-bottom:20px}.data-table{width:100%;border-collapse:collapse;font-size:14px}.data-table thead{background-color:#f7fafc;border-bottom:2px solid #e2e8f0}.data-table th{padding:12px 15px;text-align:left;font-weight:600;color:#2d3748;text-transform:uppercase;font-size:12px;letter-spacing:.5px}.data-table tbody tr{border-bottom:1px solid #e2e8f0;transition:background-color .2s}.data-table tbody tr:hover{background-color:#f7fafc}.data-table td{padding:12px 15px;color:#4a5568}.data-table td:first-child{font-weight:500}.text-warning{color:#ed8936;font-weight:600}.pagination-section{display:flex;justify-content:space-between;align-items:center;margin-top:20px;flex-wrap:wrap;gap:15px}.pagination-info{font-size:14px;color:#718096}.pagination-controls{display:flex;gap:5px}.pagination-btn{padding:8px 12px;border:1px solid #e2e8f0;background-color:#fff;color:#4a5568;border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s;min-width:38px}.pagination-btn:hover:not(:disabled){background-color:#f7fafc;border-color:#cbd5e0}.pagination-btn:disabled{cursor:not-allowed;opacity:.5}.pagination-btn.active{background-color:#5e72e4;color:#fff;border-color:#5e72e4}.empty-state{background:#fff;padding:60px 20px;text-align:center;border-radius:8px;box-shadow:0 2px 4px #0000001a}.empty-state p{color:#718096;font-size:16px;margin:0}@media (max-width: 768px){.filter-section{flex-direction:column;align-items:stretch}.filter-group{min-width:100%}.btn-search{width:100%}.summary-section,.po-list{grid-template-columns:1fr}.pagination-section{flex-direction:column;align-items:center}.table-responsive{font-size:12px}.data-table th,.data-table td{padding:8px 10px}}@media (max-width: 480px){.analitik-container{padding:15px}.analitik-header h2{font-size:22px}.pagination-controls{flex-wrap:wrap;justify-content:center}}.goods-omset-dashboard{padding:24px;background-color:#fff;min-height:100vh}.goods-dashboard-header{margin-bottom:24px;text-align:center}.goods-dashboard-title{font-size:30px;font-weight:700;color:#1f2937;margin:0 0 8px}.goods-dashboard-subtitle{color:#6b7280;margin:0;font-size:14px}.error-container{background-color:#fee;border:1px solid #fca5a5;color:#991b1b;padding:16px;border-radius:8px}.error-title{font-weight:700;margin:0 0 8px}.error-message{margin:0 0 12px}.btn-reload{background-color:#ef4444;color:#fff;padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-weight:500;transition:background-color .2s}.btn-reload:hover{background-color:#dc2626}.goods-summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;margin-bottom:24px}.goods-summary-card{border-radius:12px;box-shadow:0 4px 6px #0000001a;padding:24px;color:#fff}.goods-card-total{background:linear-gradient(135deg,#3b82f6,#2563eb)}.goods-card-success{background:linear-gradient(135deg,#10b981,#059669)}.goods-card-warning{background:linear-gradient(135deg,#f59e0b,#d97706)}.goods-card-label{font-size:14px;font-weight:600;opacity:.9;margin:0 0 8px}.goods-card-value{font-size:28px;font-weight:700;margin:0 0 8px}.goods-card-footer{display:flex;justify-content:space-between;font-size:14px;opacity:.9}.goods-filter-section{background-color:#fff;border-radius:12px;box-shadow:0 2px 4px #0000000d;padding:24px;margin-bottom:24px}.goods-filter-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px;align-items:start}.goods-filter-group{display:flex;flex-direction:column;gap:10px}.goods-filter-label{font-size:14px;font-weight:600;color:#374151;margin-bottom:2px}.goods-filter-buttons{display:flex;gap:8px;flex-wrap:wrap}.filter-btn{flex:1;min-width:100px;padding:10px 16px;border-radius:8px;font-weight:600;font-size:14px;border:2px solid #e5e7eb;background-color:#fff;color:#6b7280;cursor:pointer;transition:all .2s;position:relative;overflow:hidden}.filter-btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.filter-btn:hover:before{left:100%}.filter-btn:hover{border-color:#d1d5db;transform:translateY(-2px);box-shadow:0 4px 6px #0000001a}.filter-btn.active{background:linear-gradient(135deg,#3b82f6,#2563eb);border-color:#2563eb;color:#fff;box-shadow:0 4px 12px #3b82f64d;transform:translateY(-2px)}.filter-btn.active-success{background:linear-gradient(135deg,#10b981,#059669);border-color:#059669;box-shadow:0 4px 12px #10b9814d}.filter-btn.active-warning{background:linear-gradient(135deg,#f59e0b,#d97706);border-color:#d97706;box-shadow:0 4px 12px #f59e0b4d}.filter-btn:active{transform:translateY(0)}.po-filter-container{display:flex;flex-direction:column;gap:10px;position:relative}.po-goods-search-input{padding:10px 14px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .2s;background-color:#f9fafb;font-family:inherit}.po-goods-search-input:focus{outline:none;border-color:#3b82f6;background-color:#fff;box-shadow:0 0 0 4px #3b82f61a}.po-goods-search-input::placeholder{color:#9ca3af}.goods-filter-select{padding:10px 36px 10px 14px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;background-color:#fff;cursor:pointer;transition:all .2s;font-family:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%236b7280' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center}.goods-filter-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 4px #3b82f61a}.goods-filter-select:hover{border-color:#d1d5db}.po-search-count{position:absolute;bottom:12px;right:14px;font-size:11px;font-weight:600;color:#3b82f6;background-color:#eff6ff;padding:3px 10px;border-radius:12px;pointer-events:none;animation:slideInRight .3s ease-out}@keyframes slideInRight{0%{opacity:0;transform:translate(10px)}to{opacity:1;transform:translate(0)}}.goods-search-input{width:100%;padding:10px 14px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .2s;font-family:inherit}.goods-search-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 4px #3b82f61a}.goods-search-input::placeholder{color:#9ca3af}.btn-clear-filter{padding:10px 20px;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;border:none;border-radius:8px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s;align-self:end;box-shadow:0 4px 6px #ef444433}.btn-clear-filter:hover{background:linear-gradient(135deg,#dc2626,#b91c1c);transform:translateY(-2px);box-shadow:0 6px 12px #ef44444d}.btn-clear-filter:active{transform:translateY(0)}.goods-main-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(400px,1fr));gap:24px}.content-panel{background-color:#fff;border-radius:12px;box-shadow:0 2px 4px #0000000d;overflow:hidden}.panel-header{padding:16px 20px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center}.panel-title{font-size:20px;font-weight:700;color:#1f2937;margin:0}.btn-close{background:none;border:none;color:#6b7280;font-size:20px;cursor:pointer;padding:4px 8px;transition:color .2s}.btn-close:hover{color:#1f2937}.panel-body{overflow-y:auto;max-height:600px}.loading-container{padding:60px 20px;text-align:center}.spinner{width:48px;height:48px;border:4px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;margin:0 auto 16px;animation:spin 1s linear infinite}.loading-text{color:#6b7280;margin:0}.empty-state{padding:60px 20px;text-align:center;color:#9ca3af}.perusahaan-list{list-style:none;margin:0;padding:0}.perusahaan-item{padding:16px 20px;border-bottom:1px solid #e5e7eb;cursor:pointer;transition:background-color .2s}.perusahaan-item:hover{background-color:#eff6ff}.perusahaan-item.selected{background-color:#dbeafe}.perusahaan-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.perusahaan-info{flex:1}.perusahaan-name{font-weight:700;color:#1f2937;margin:0 0 4px;font-size:16px}.perusahaan-sn{font-size:13px;color:#6b7280;margin:0}.perusahaan-po{font-size:12px;color:#9ca3af;margin:4px 0 0;font-style:italic}.perusahaan-omset{font-size:18px;font-weight:700;color:#3b82f6;white-space:nowrap;margin-left:12px}.perusahaan-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.stat-badge{padding:6px 12px;border-radius:6px;font-size:13px;font-weight:500;text-align:center}.stat-success{background-color:#d1fae5;color:#065f46}.stat-warning{background-color:#fed7aa;color:#92400e}.detail-content{background-color:#fff;border-radius:12px;box-shadow:0 2px 4px #0000000d}.detail-info{padding:16px 20px;background-color:#f9fafb;border-bottom:1px solid #e5e7eb}.detail-company-name{font-size:18px;font-weight:700;color:#1f2937;margin:0 0 12px}.detail-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.detail-item{font-size:13px;color:#6b7280;display:flex;gap:6px}.detail-label{font-weight:600}.detail-value{color:#1f2937}.detail-summary{padding:16px 20px;border-bottom:1px solid #e5e7eb}.goods-summary-title{font-weight:700;color:#1f2937;margin:0 0 12px;font-size:16px}.goods-summary-list{display:flex;flex-direction:column;gap:8px}.goods-summary-row{display:flex;justify-content:space-between;font-size:14px}.goods-summary-label{color:#6b7280}.goods-summary-value{font-weight:700}.value-total{color:#3b82f6}.value-success{color:#10b981}.value-warning{color:#f59e0b}.goods-summary-total{padding-top:8px;border-top:1px solid #e5e7eb}.invoice-section,.barang-section{padding:16px 20px}.invoice-title,.barang-title{font-weight:700;color:#1f2937;margin:0 0 12px;font-size:16px}.invoice-list,.barang-list{display:flex;flex-direction:column;gap:12px}.barang-card{border:2px solid #e5e7eb;border-radius:10px;padding:16px;background-color:#f9fafb;transition:all .2s}.barang-card:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f61a}.barang-header{margin-bottom:12px;padding-bottom:12px;border-bottom:2px dashed #d1d5db}.barang-sn{font-weight:700;color:#1f2937;margin:0 0 6px;font-size:15px;display:flex;align-items:center;gap:8px}.barang-sn:before{content:"📱";font-size:18px}.barang-spec{color:#6b7280;margin:0 0 8px;font-size:13px;line-height:1.4}.barang-meta{display:flex;gap:12px;flex-wrap:wrap}.barang-meta-item{font-size:12px;background-color:#e5e7eb;padding:4px 10px;border-radius:12px;color:#4b5563;font-weight:500}.stamp-returned{font-size:11px;font-weight:700;color:#007bff;border:2px solid #007bff;padding:4px 12px;border-radius:4px;text-transform:uppercase;transform:rotate(-8deg);opacity:.9;box-shadow:0 0 0 2px #007bff33,0 0 6px #007bff40;background:#007bff14}.invoice-list-nested{margin-top:12px}.invoice-count{font-size:13px;font-weight:600;color:#6b7280;margin:0 0 8px;text-transform:uppercase;letter-spacing:.5px}.invoice-card-nested{border:1px solid #d1d5db;border-radius:8px;padding:12px;background-color:#fff;margin-bottom:8px;transition:all .2s}.invoice-card-nested:last-child{margin-bottom:0}.invoice-card-nested:hover{box-shadow:0 2px 6px #00000014;border-color:#9ca3af}.invoice-card{border:1px solid #e5e7eb;border-radius:8px;padding:12px;transition:box-shadow .2s}.invoice-card:hover{box-shadow:0 2px 8px #0000001a}.invoice-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.invoice-info{flex:1}.invoice-id{font-weight:700;color:#1f2937;margin:0 0 4px;font-size:14px}.invoice-po{font-size:12px;color:#6b7280;margin:0}.status-badge{padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600;white-space:nowrap}.status-sudah{background-color:#d1fae5;color:#065f46}.status-belum{background-color:#fed7aa;color:#92400e}.status-toggle{padding:8px 16px;border-radius:6px;font-size:13px;font-weight:600;white-space:nowrap;border:2px solid transparent;cursor:pointer;transition:all .2s;box-shadow:0 2px 4px #0000001a;position:relative}.status-toggle:after{content:"Klik untuk ubah";position:absolute;bottom:-20px;left:50%;transform:translate(-50%);font-size:10px;opacity:0;transition:opacity .2s;white-space:nowrap;pointer-events:none}.status-toggle:hover:after{opacity:.7}.status-toggle:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0003}.status-toggle:active{transform:translateY(0)}.status-toggle:disabled{opacity:.6;cursor:not-allowed;transform:none}.status-toggle.status-sudah{background-color:#10b981;color:#fff;border-color:#059669}.status-toggle.status-sudah:hover:not(:disabled){background-color:#059669;border-color:#047857}.status-toggle.status-belum{background-color:#f59e0b;color:#fff;border-color:#d97706}.status-toggle.status-belum:hover:not(:disabled){background-color:#d97706;border-color:#b45309}.toggle-icon{margin-left:6px;font-size:11px;opacity:.8}.goods-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out}.goods-modal-container{background-color:#fff;border-radius:16px;width:90%;max-width:500px;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease-out;overflow:hidden}.goods-modal-header{padding:24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;position:relative;text-align:center}.goods-modal-icon{width:60px;height:60px;background-color:#fff3;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:32px;margin:0 auto 16px}.goods-modal-title{margin:0;font-size:20px;font-weight:600}.goods-modal-close{position:absolute;top:16px;right:16px;background:#fff3;border:none;color:#fff;width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:18px;display:flex;align-items:center;justify-content:center;transition:all .2s}.goods-modal-close:hover{background:#ffffff4d;transform:rotate(90deg)}.goods-modal-body{padding:24px}.goods-modal-info-section{background-color:#f9fafb;border-radius:8px;padding:16px;margin-bottom:20px}.goods-modal-info-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e5e7eb}.goods-modal-info-row:last-child{border-bottom:none}.goods-modal-label{color:#6b7280;font-size:14px;font-weight:500}.goods-modal-value{color:#1f2937;font-size:14px;font-weight:600}.goods-modal-status-change{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.status-box{flex:1;padding:16px;border-radius:8px;text-align:center;display:flex;flex-direction:column;gap:8px}.status-current-sudah{background-color:#d1fae5;border:2px solid #10b981}.status-current-belum{background-color:#fed7aa;border:2px solid #f59e0b}.status-new-sudah{background-color:#d1fae5;border:2px solid #10b981;animation:pulse 1s ease-in-out infinite}.status-new-belum{background-color:#fed7aa;border:2px solid #f59e0b;animation:pulse 1s ease-in-out infinite}.status-label{font-size:11px;text-transform:uppercase;font-weight:600;color:#6b7280;letter-spacing:.5px}.status-text{font-size:14px;font-weight:700;color:#1f2937}.status-arrow{font-size:24px;color:#9ca3af;font-weight:700}.goods-modal-question{text-align:center;color:#4b5563;font-size:15px;margin:0;line-height:1.5}.goods-modal-footer{padding:20px 24px;background-color:#f9fafb;display:flex;gap:12px;justify-content:flex-end}.goods-modal-btn{padding:12px 24px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.goods-modal-btn-cancel{background-color:#e5e7eb;color:#374151}.goods-modal-btn-cancel:hover{background-color:#d1d5db}.goods-modal-btn-confirm{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.goods-modal-btn-confirm:hover{transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.success-modal{background-color:#fff;border-radius:16px;padding:40px;text-align:center;box-shadow:0 20px 60px #0000004d;animation:bounceIn .5s ease-out}@keyframes bounceIn{0%{transform:scale(.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(.9)}to{transform:scale(1);opacity:1}}.success-icon{width:80px;height:80px;background:linear-gradient(135deg,#10b981,#059669);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:48px;color:#fff;margin:0 auto 20px;animation:scaleIn .5s ease-out .2s both}.success-title{margin:0 0 8px;font-size:24px;font-weight:700;color:#1f2937}.success-message{margin:0;color:#6b7280;font-size:16px}.updating-overlay{display:flex;align-items:center;gap:8px;padding:8px 12px;background-color:#eff6ff;border:1px solid #bfdbfe;border-radius:6px;margin-bottom:12px;font-size:13px;color:#1e40af}.spinner-small{width:16px;height:16px;border:2px solid #e5e7eb;border-top-color:#3b82f6;border-radius:50%;animation:spin .8s linear infinite}.invoice-body{display:flex;flex-direction:column;gap:6px}.invoice-row{display:flex;justify-content:space-between;font-size:13px}.invoice-label{color:#6b7280;font-weight:500}.invoice-value{color:#1f2937;text-align:right}.invoice-price{font-weight:700;color:#3b82f6}@media (max-width: 1024px){.goods-main-content{grid-template-columns:1fr}}@media (max-width: 768px){.goods-omset-dashboard{padding:16px}.goods-summary-cards,.goods-filter-container{grid-template-columns:1fr}.goods-filter-buttons{flex-wrap:wrap}.goods-card-value{font-size:24px}.perusahaan-header{flex-direction:column;gap:8px}.perusahaan-omset{margin-left:0}.detail-grid{grid-template-columns:1fr}.btn-clear-filter{width:100%}}@media (max-width: 480px){.goods-dashboard-title{font-size:24px}.goods-card-value{font-size:20px}.goods-filter-btn{flex:1;padding:8px 12px;font-size:13px}.perusahaan-stats{grid-template-columns:1fr}.goods-modal-container{width:95%}.goods-modal-status-change{flex-direction:column}.status-arrow{transform:rotate(90deg)}.goods-modal-footer{flex-direction:column}.goods-modal-btn{width:100%}}.goods-custom-dropdown{position:relative;width:100%}.goods-dropdown-trigger{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#fff;border:1px solid #d1d5db;border-radius:8px;cursor:pointer;transition:all .2s;min-height:42px}.goods-dropdown-trigger:hover{border-color:#9ca3af;box-shadow:0 1px 3px #0000000d}.goods-dropdown-trigger:focus-within{border-color:#10b981;box-shadow:0 0 0 3px #10b9811a}.goods-dropdown-text{flex:1;font-size:14px;color:#374151;font-weight:500}.goods-dropdown-icons{display:flex;align-items:center;gap:8px}.goods-clear-icon{color:#6b7280;cursor:pointer;padding:2px 6px;border-radius:4px;transition:all .2s;font-size:14px;font-weight:700}.goods-clear-icon:hover{background:#f3f4f6;color:#ef4444}.goods-chevron-icon{color:#6b7280;transition:transform .2s;font-size:10px}.goods-chevron-icon.rotate{transform:rotate(180deg)}.goods-dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:1px solid #d1d5db;border-radius:8px;box-shadow:0 10px 25px #0000001a;z-index:1000;max-height:400px;display:flex;flex-direction:column;animation:goodsSlideDown .2s ease-out}@keyframes goodsSlideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.goods-search-container{position:relative;padding:12px;border-bottom:1px solid #e5e7eb}.goods-search-icon{position:absolute;left:24px;top:50%;transform:translateY(-50%);font-size:14px}.goods-search-input-dropdown{width:100%;padding:8px 12px 8px 32px;border:1px solid #e5e7eb;border-radius:6px;font-size:14px;outline:none;transition:all .2s}.goods-search-input-dropdown:focus{border-color:#10b981;box-shadow:0 0 0 3px #10b9811a}.goods-dropdown-list{overflow-y:auto;max-height:280px}.goods-dropdown-list::-webkit-scrollbar{width:6px}.goods-dropdown-list::-webkit-scrollbar-track{background:#f3f4f6;border-radius:3px}.goods-dropdown-list::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:3px}.goods-dropdown-list::-webkit-scrollbar-thumb:hover{background:#9ca3af}.goods-dropdown-item{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;cursor:pointer;transition:background .15s}.goods-dropdown-item:hover{background:#f9fafb}.goods-dropdown-item.selected{background:#d1fae5;color:#065f46}.goods-item-label{font-size:14px;font-weight:500;flex:1}.goods-item-count{font-size:12px;color:#6b7280;background:#f3f4f6;padding:3px 10px;border-radius:12px;font-weight:500;white-space:nowrap;margin-left:8px}.goods-dropdown-item.selected .goods-item-count{background:#a7f3d0;color:#065f46}.goods-divider{height:1px;background:#e5e7eb;margin:4px 0}.goods-no-results{padding:24px 16px;text-align:center;color:#9ca3af;font-size:14px}.goods-dropdown-footer{padding:8px 16px;border-top:1px solid #e5e7eb;font-size:12px;color:#6b7280;background:#f9fafb;border-radius:0 0 8px 8px;font-weight:500}@media (max-width: 768px){.goods-dropdown-menu{max-height:300px}.goods-dropdown-list{max-height:200px}.goods-dropdown-item{padding:12px 14px}.goods-item-label{font-size:13px}.goods-item-count{font-size:11px;padding:2px 8px}}.import-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;justify-content:center;align-items:center;z-index:2000;padding:20px}.import-modal{background:#fff;border-radius:16px;width:100%;max-width:700px;max-height:90vh;overflow-y:auto;box-shadow:0 20px 60px #0000004d}.import-modal-header{padding:24px 30px;border-bottom:2px solid #e9ecef;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#06c,#004999);color:#fff;border-radius:16px 16px 0 0}.import-modal-header h3{margin:0;font-size:20px;font-weight:700}.import-close-btn{background:#fff3;border:none;color:#fff;cursor:pointer;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:8px;transition:background .3s}.import-close-btn:hover{background:#ffffff4d}.import-modal-body{padding:30px}.import-section{margin-bottom:30px}.import-section h4{font-size:16px;font-weight:600;color:#1a1a1a;margin-bottom:12px;display:flex;align-items:center;gap:8px}.import-download-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;background:#28a745;color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:background .3s}.import-download-btn:hover{background:#218838}.import-hint{margin-top:8px;font-size:13px;color:#6c757d;font-style:italic}.import-upload-area{border:2px dashed #dee2e6;border-radius:12px;padding:40px 20px;text-align:center;background:#f8f9fa;transition:all .3s}.import-upload-area:hover{border-color:#06c;background:#f0f7ff}.import-upload-label{display:flex;flex-direction:column;align-items:center;gap:12px;cursor:pointer;color:#495057}.import-upload-label svg{color:#06c}.import-upload-label span{font-size:15px;font-weight:600}.import-upload-label small{font-size:13px;color:#6c757d}.import-file-info{background:#f8f9fa;border:1px solid #dee2e6;border-radius:10px;padding:20px}.import-info-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid #e9ecef}.import-info-row:last-child{border-bottom:none}.import-info-icon{font-size:20px;width:24px;text-align:center}.import-info-content{flex:1;display:flex;justify-content:space-between;align-items:center}.import-info-content strong{color:#495057;font-size:14px}.import-info-content span{color:#1a1a1a;font-weight:600;font-size:14px}.import-preview-table{border:1px solid #dee2e6;border-radius:10px;overflow:hidden}.import-preview-table table{width:100%;border-collapse:collapse;font-size:13px}.import-preview-table thead{background:#f8f9fa}.import-preview-table th{padding:12px;text-align:left;font-weight:600;color:#495057;border-bottom:2px solid #dee2e6}.import-preview-table td{padding:10px 12px;border-bottom:1px solid #e9ecef;color:#495057}.import-preview-table tbody tr:hover{background:#f8f9fa}.import-more-rows td{text-align:center;font-style:italic;color:#6c757d;background:#f8f9fa!important}.import-alert{display:flex;align-items:center;gap:12px;padding:14px 18px;border-radius:10px;font-size:14px;margin-top:20px}.import-alert-error{background:#fff3cd;border:1px solid #ffc107;color:#856404}.import-alert-success{background:#d4edda;border:1px solid #28a745;color:#155724}.import-modal-footer{padding:20px 30px;border-top:2px solid #e9ecef;display:flex;justify-content:flex-end;gap:12px;background:#f8f9fa;border-radius:0 0 16px 16px}.import-btn-cancel,.import-btn-import{padding:12px 24px;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s}.import-btn-cancel{background:#fff;color:#495057;border:1px solid #dee2e6}.import-btn-cancel:hover:not(:disabled){background:#e9ecef}.import-btn-import{background:#06c;color:#fff}.import-btn-import:hover:not(:disabled){background:#0052a3}.import-btn-import:disabled,.import-btn-cancel:disabled{opacity:.6;cursor:not-allowed}@media (max-width: 768px){.import-modal{max-width:100%;margin:10px}.import-modal-body{padding:20px}.import-preview-table{overflow-x:auto}}.po-ext-rental-container{max-width:1400px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.po-ext-dashboard-header{margin-bottom:30px;text-align:center}.po-ext-dashboard-header h1{font-size:32px;color:#1a1a1a;margin-bottom:8px;font-weight:700}.po-ext-subtitle{font-size:16px;color:#6c757d;margin:0}.po-ext-stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;margin-bottom:40px}.po-ext-stat-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #00000014;display:flex;align-items:center;gap:20px;transition:transform .2s,box-shadow .2s}.po-ext-stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.po-ext-stat-icon{width:64px;height:64px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.po-ext-stat-card.po-ext-blue .po-ext-stat-icon{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.po-ext-stat-card.po-ext-green .po-ext-stat-icon{background:linear-gradient(135deg,#11998e,#38ef7d);color:#fff}.po-ext-stat-card.po-ext-orange .po-ext-stat-icon{background:linear-gradient(135deg,#f2994a,#f2c94c);color:#fff}.po-ext-stat-card.po-ext-purple .po-ext-stat-icon{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.po-ext-stat-card.po-ext-success .po-ext-stat-icon{background:linear-gradient(135deg,#56ab2f,#a8e063);color:#fff}.po-ext-stat-card.po-ext-warning .po-ext-stat-icon{background:linear-gradient(135deg,#ee0979,#ff6a00);color:#fff}.po-ext-stat-card.po-ext-cyan .po-ext-stat-icon{background:linear-gradient(135deg,#0891b2,#06b6d4);color:#fff;box-shadow:0 4px 20px #06b6d44d}.po-ext-stat-card.po-ext-cyan:hover{box-shadow:0 6px 30px #06b6d466;transform:translateY(-5px)}.po-ext-stat-content{flex:1}.po-ext-stat-content h3{font-size:14px;color:#6c757d;margin:0 0 8px;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.po-ext-stat-value{font-size:32px;font-weight:700;color:#1a1a1a;margin:0;line-height:1}.po-ext-stat-value-money{font-size:20px;font-weight:700;color:#1a1a1a;margin:0;line-height:1.2}.po-ext-stat-label{font-size:12px;color:#6c757d;margin-top:4px;display:inline-block}.po-ext-list-section{margin-top:40px}.po-ext-list-header{margin-bottom:20px;display:flex;justify-content:space-between;align-items:center}.po-ext-list-header h2{font-size:24px;color:#1a1a1a;margin:0;font-weight:700}.po-ext-search-filter{max-width:400px;flex:1;margin-left:20px}.po-ext-search-input{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:15px;transition:border-color .3s}.po-ext-search-input:focus{outline:none;border-color:#06c}.po-ext-table-container{background:#fff;border-radius:12px;box-shadow:0 2px 8px #00000014;overflow:auto}.po-ext-list-table{width:100%;border-collapse:collapse;font-size:14px}.po-ext-list-table thead{background:linear-gradient(135deg,#06c,#004999);color:#fff}.po-ext-list-table th{padding:16px 14px;text-align:left;font-weight:600;white-space:nowrap}.po-ext-list-table td{padding:16px 14px;border-bottom:1px solid #e9ecef;vertical-align:middle}.po-ext-list-table tbody tr{transition:background .2s}.po-ext-list-table tbody tr:hover{background:#f8f9fa}.po-ext-po-number{font-weight:600;color:#06c}.po-ext-text-center{text-align:center}.po-ext-text-right{text-align:right;font-weight:600}.po-ext-duration{font-size:12px;color:#6c757d;font-weight:400}.po-ext-no-data{text-align:center;padding:40px!important;color:#6c757d;font-style:italic}.po-ext-btn-manage{display:inline-flex;align-items:center;gap:6px;padding:8px 16px;background:#06c;color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:background .3s}.po-ext-btn-manage:hover{background:#0052a3}.po-ext-paid-amount{font-weight:600;color:#28a745}.po-ext-payment-progress{font-size:11px;color:#6c757d;font-weight:400;display:inline-block;margin-top:2px}.po-ext-header-section{background:linear-gradient(135deg,#06c,#004999);color:#fff;padding:30px;border-radius:12px;margin-bottom:30px;position:relative}.po-ext-back-btn{background:#fff3;color:#fff;border:1px solid rgba(255,255,255,.3);padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;margin-bottom:20px;transition:background .3s}.po-ext-back-btn:hover{background:#ffffff4d}.po-ext-header-info h1{font-size:28px;margin-bottom:20px;font-weight:700}.po-ext-header-details{display:flex;gap:40px;flex-wrap:wrap}.po-ext-detail-item{display:flex;flex-direction:column;gap:5px}.po-ext-detail-item .po-ext-label{font-size:13px;opacity:.9;font-weight:500}.po-ext-detail-item .po-ext-value{font-size:18px;font-weight:600}.po-ext-extend-btn{position:absolute;top:30px;right:30px;background:#ff9800;color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:background .3s}.po-ext-extend-btn:hover{background:#f57c00}.po-ext-details-section,.po-ext-payment-section{background:#fff;border-radius:12px;padding:30px;margin-bottom:30px;box-shadow:0 2px 8px #00000014}.po-ext-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #f0f0f0}.po-ext-section-header h2{font-size:22px;color:#1a1a1a;margin:0}.po-ext-section-actions{display:flex;gap:10px}.po-ext-import-btn{display:inline-flex;align-items:center;gap:6px;background:#ff9800;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:background .3s}.po-ext-import-btn:hover{background:#f57c00}.po-ext-export-btn{background:#4caf50;color:#fff;border:none;padding:10px 20px;border-radius:6px;font-size:14px;font-weight:600;cursor:pointer;transition:background .3s}.po-ext-export-btn:hover{background:#45a049}.po-ext-details-table-wrapper,.po-ext-payment-table-wrapper{overflow-x:auto}.po-ext-details-table,.po-ext-payment-table{width:100%;border-collapse:collapse;font-size:14px}.po-ext-details-table th,.po-ext-payment-table th{background:#f8f9fa;color:#495057;font-weight:600;text-align:left;padding:14px 12px;border-bottom:2px solid #dee2e6;white-space:nowrap}.po-ext-details-table td,.po-ext-payment-table td{padding:14px 12px;border-bottom:1px solid #e9ecef;vertical-align:middle}.po-ext-details-table tbody tr:hover,.po-ext-payment-table tbody tr:hover{background:#f8f9fa}.po-ext-status-badge{display:inline-block;padding:6px 12px;border-radius:20px;font-size:13px;font-weight:600}.po-ext-status-badge.po-ext-paid{background:#d4edda;color:#155724}.po-ext-status-badge.po-ext-unpaid{background:#fff3cd;color:#856404}.po-ext-payment-table tr.po-ext-paid{background:#f8fff9}.po-ext-payment-table tr.po-ext-unpaid{background:#fffef8}.po-ext-item-payment-group{background:#fff;border:2px solid #e9ecef;border-radius:12px;margin-bottom:20px;overflow:hidden;transition:all .3s}.po-ext-item-payment-group:hover{border-color:#06c;box-shadow:0 4px 12px #0066cc1a}.po-ext-item-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;background:linear-gradient(135deg,#f8f9fa,#e9ecef);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background .2s}.po-ext-item-header:hover{background:linear-gradient(135deg,#e9ecef,#dee2e6)}.po-ext-item-info{display:flex;align-items:center;gap:16px;flex:1}.po-ext-collapse-icon{font-size:14px;color:#6c757d;font-weight:700;min-width:20px}.po-ext-item-details h3{margin:0 0 6px;font-size:16px;color:#06c;font-weight:700}.po-ext-item-spec{margin:0 0 8px;font-size:13px;color:#495057}.po-ext-item-meta{display:flex;gap:16px;flex-wrap:wrap}.po-ext-item-meta span{font-size:12px;color:#6c757d;display:inline-flex;align-items:center;gap:4px}.po-ext-payment-summary{display:flex;flex-direction:column;align-items:flex-end;gap:4px}.po-ext-paid-count{font-size:16px;font-weight:700;color:#28a745;background:#28a7451a;padding:6px 12px;border-radius:20px}.po-ext-modal-large{max-width:700px}.po-ext-select-all{padding:12px;background:#f8f9fa;border-radius:8px;margin-bottom:12px}.po-ext-checkbox-label{display:flex;align-items:center;gap:10px;cursor:pointer;font-weight:600;color:#495057}.po-ext-checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.po-ext-items-list{max-height:300px;overflow-y:auto;border:1px solid #dee2e6;border-radius:8px;padding:12px}.po-ext-item-checkbox{display:flex;align-items:flex-start;gap:12px;padding:12px;border-radius:8px;cursor:pointer;transition:background .2s;margin-bottom:8px}.po-ext-item-checkbox:hover{background:#f8f9fa}.po-ext-item-checkbox-content{flex:1;display:flex;flex-direction:column;gap:4px}.po-ext-item-checkbox-content strong{color:#06c;font-size:14px}.po-ext-item-checkbox-content span{color:#495057;font-size:13px}.po-ext-item-checkbox-content small{color:#6c757d;font-size:12px}.po-ext-action-buttons{display:flex;gap:8px;flex-wrap:wrap}.po-ext-btn-update-payment,.po-ext-btn-update-invoice{padding:8px 16px;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .3s}.po-ext-btn-update-payment{background:#007bff;color:#fff}.po-ext-btn-update-payment:hover:not(:disabled){background:#0056b3}.po-ext-btn-update-payment:disabled{background:#ccc;cursor:not-allowed;opacity:.6}.po-ext-btn-update-invoice{background:#28a745;color:#fff}.po-ext-btn-update-invoice:hover{background:#218838}.po-ext-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000;padding:20px}.po-ext-modal{background:#fff;border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0000004d}.po-ext-modal-header{padding:24px 30px;border-bottom:1px solid #e9ecef;display:flex;justify-content:space-between;align-items:center}.po-ext-modal-header h3{margin:0;font-size:20px;color:#1a1a1a}.po-ext-close-btn{background:none;border:none;font-size:28px;color:#6c757d;cursor:pointer;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background .3s}.po-ext-close-btn:hover{background:#f8f9fa;color:#1a1a1a}.po-ext-modal-form{padding:30px}.po-ext-form-group{margin-bottom:20px}.po-ext-form-group label{display:block;margin-bottom:8px;font-weight:600;color:#495057;font-size:14px}.po-ext-form-group input{width:100%;padding:10px 14px;border:2px solid #e0e0e0;border-radius:6px;font-size:15px;transition:border-color .3s;box-sizing:border-box}.po-ext-form-group input:focus{outline:none;border-color:#06c}.po-ext-modal-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:30px}.po-ext-btn-cancel,.po-ext-btn-submit{padding:10px 24px;border:none;border-radius:6px;font-size:15px;font-weight:600;cursor:pointer;transition:all .3s}.po-ext-btn-cancel{background:#f8f9fa;color:#495057;border:1px solid #dee2e6}.po-ext-btn-cancel:hover{background:#e9ecef}.po-ext-btn-submit{background:#06c;color:#fff}.po-ext-btn-submit:hover{background:#0052a3}.po-ext-loading,.po-ext-error{text-align:center;padding:60px 20px;font-size:18px;color:#6c757d}.po-ext-error{color:#dc3545}.po-ext-item-checkbox{display:flex;align-items:flex-start;padding:12px;cursor:pointer;gap:12px;transition:background .15s}.po-ext-item-checkbox:hover{background:#f9fafb}.po-ext-item-checkbox input[type=checkbox]{width:18px;height:18px;margin-top:2px;cursor:pointer;flex-shrink:0}.po-ext-item-checkbox-content{display:flex;flex-direction:column;gap:4px;flex:1}.po-ext-item-checkbox-content strong{color:#111827;font-size:14px}.po-ext-item-checkbox-content span{color:#6b7280;font-size:13px}.po-ext-item-checkbox-content small{color:#9ca3af;font-size:12px}.po-ext-replacement-section{padding:12px 12px 12px 42px;background:#fffbeb;border-top:1px solid #fef3c7}.po-ext-replacement-label{display:flex;align-items:center;gap:8px;margin-bottom:8px;cursor:pointer}.po-ext-replacement-label input[type=checkbox]{width:16px;height:16px;cursor:pointer}.po-ext-replacement-label span{font-size:13px;font-weight:500;color:#92400e}.po-ext-replacement-input{width:100%;padding:8px 10px;border:1px solid #fcd34d;border-radius:4px;font-size:13px;box-sizing:border-box;background:#fff}.po-ext-replacement-input:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b1a}@media (max-width: 768px){.po-ext-header-section{padding:20px}.po-ext-extend-btn{position:static;margin-top:20px;width:100%}.po-ext-header-details{flex-direction:column;gap:15px}.po-ext-details-section,.po-ext-payment-section{padding:20px}.po-ext-section-header{flex-direction:column;gap:15px;align-items:flex-start}.po-ext-export-btn{width:100%}.po-ext-action-buttons{flex-direction:column;width:100%}.po-ext-btn-update-payment,.po-ext-btn-update-invoice{width:100%}.po-ext-modal{margin:20px}.po-ext-modal-form{padding:20px}}.po-ext-stat-card.po-ext-has-warning{position:relative;cursor:help;border:2px solid transparent;transition:all .3s ease}.po-ext-stat-card.po-ext-has-warning:hover{border-color:#f59e0b;box-shadow:0 8px 30px #f59e0b4d}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.1)}}.po-ext-duplicate-tooltip{animation:popIn .3s ease forwards;background:#fef3c7;border:1px solid #fcd34d;padding:12px;border-radius:8px;box-shadow:0 4px 12px #0000001a;width:300px;font-size:13px;color:#92400e;position:absolute;top:100%;left:4%;transform:translate(-50%);z-index:1000;opacity:0;pointer-events:none}@keyframes popIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.po-ext-stat-card.po-ext-has-info{position:relative;cursor:help;border:2px solid transparent;transition:all .3s ease}.po-ext-stat-card.po-ext-has-info:hover{border-color:#3b82f6;box-shadow:0 8px 30px #3b82f64d}.po-ext-info-tooltip:before{content:"";position:absolute;top:-8px;left:50%;transform:translate(-50%);width:0;height:0;border-left:8px solid transparent;border-right:8px solid transparent;border-bottom:8px solid #3b82f6}.po-ext-info-tooltip:after{content:"";position:absolute;top:-6px;left:50%;transform:translate(-50%);width:0;height:0;border-left:7px solid transparent;border-right:7px solid transparent;border-bottom:7px solid #dbeafe}.po-ext-info-tooltip{animation:fadeInUp .3s ease-out}.po-ext-info-tooltip>div:nth-child(3)::-webkit-scrollbar{width:6px}.po-ext-info-tooltip>div:nth-child(3)::-webkit-scrollbar-track{background:#dbeafe;border-radius:3px}.po-ext-info-tooltip>div:nth-child(3)::-webkit-scrollbar-thumb{background:#3b82f6;border-radius:3px}.po-ext-info-tooltip>div:nth-child(3)::-webkit-scrollbar-thumb:hover{background:#2563eb}.toast-container{position:fixed;top:20px;right:20px;z-index:10000;display:flex;flex-direction:column;gap:10px;pointer-events:none}.toast{background:#fff;border-radius:8px;padding:16px 20px;box-shadow:0 4px 12px #00000026;display:flex;align-items:center;justify-content:space-between;min-width:300px;max-width:500px;pointer-events:auto;animation:slideIn .3s ease-out;border-left:4px solid #ccc}@keyframes slideIn{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}.toast.success{border-left-color:#10b981;background:#f0fdf4}.toast.error{border-left-color:#ef4444;background:#fef2f2}.toast.info{border-left-color:#3b82f6;background:#eff6ff}.toast.offline{border-left-color:#f59e0b;background:#fffbeb}.toast-content{display:flex;align-items:center;gap:12px}.toast-icon{font-size:20px;font-weight:700;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%}.toast.success .toast-icon{background:#10b981;color:#fff}.toast.error .toast-icon{background:#ef4444;color:#fff}.toast.info .toast-icon{background:#3b82f6;color:#fff}.toast.offline .toast-icon{background:#f59e0b;color:#fff}.toast-message{color:#1f2937;font-size:14px;font-weight:500;line-height:1.5}.toast-close{background:none;border:none;color:#6b7280;font-size:24px;line-height:1;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s;margin-left:12px}.toast-close:hover{background:#0000000d;color:#1f2937}.notes-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#14141473;display:flex;align-items:center;justify-content:center;z-index:999}.notes-modal-content{background:#fff;border-radius:12px;width:440px;max-width:95%;box-shadow:0 6px 20px #00000040;overflow:hidden;animation:popIn .25s ease}@keyframes popIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.notes-modal-header{background:linear-gradient(135deg,#1565c0,#2196f3);color:#fff;padding:18px 22px}.notes-modal-title{margin:0;font-size:20px;font-weight:600}.last-checked{margin:6px 0 0;font-size:13px;color:#e3f2fd}.notes-modal-body{padding:18px 22px;color:#333;background:#fafafa}.rental-info{background:#fff;border-radius:8px;padding:10px 12px;box-shadow:0 1px 3px #00000014}.rental-info p{margin:4px 0;font-size:14px}.notes-section{margin-top:15px}.notes-section h4{margin-bottom:8px;font-size:15px;font-weight:600}.notes-list{list-style:none;padding:0;margin:0}.notes-list li{background:#fff;border:1px solid #e0e0e0;padding:8px 10px;border-radius:6px;margin-bottom:6px;transition:background .2s}.notes-list li:hover{background:#f0faff}.note-text{font-size:14px;font-weight:500;color:#333}.note-date{font-size:12px;color:#666;margin-top:2px}.empty-notes{font-size:13px;color:#777;font-style:italic}.loading{font-size:13px;color:#555}.notes-modal-footer{display:flex;justify-content:flex-end;padding:12px 20px;background:#f5f5f5;border-top:1px solid #e0e0e0;gap:10px}.btn-view-notes{background-color:#1976d2;color:#fff;border:none;padding:6px 10px;border-radius:5px;cursor:pointer;font-size:14px}.btn-view-notes:hover{background-color:#125a9c}.btn-refresh{background-color:#e3f2fd;color:#1565c0;border:1px solid #90caf9;padding:6px 12px;border-radius:6px;cursor:pointer;transition:all .2s}.btn-refresh:hover{background-color:#bbdefb}.btn-close{background-color:#d32f2f;color:#fff;border:none;padding:6px 12px;border-radius:6px;cursor:pointer;transition:all .2s}.btn-close:hover{background-color:#b71c1c}.catatan-penambahan{margin-top:12px;font-size:12px;color:#555}.catatan-penambahan em{font-style:italic}.delete-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .2s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.delete-modal-container{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0003;max-width:480px;width:90%;animation:scaleIn .3s ease-out;overflow:hidden}.delete-modal-header{background:linear-gradient(135deg,#ff4757,#ff6348);color:#fff;padding:20px 24px;display:flex;align-items:center;gap:12px}.delete-modal-header h3{margin:0;font-size:20px;font-weight:600;flex:1}.delete-modal-icon{width:40px;height:40px;background:#fff3;border-radius:50%;display:flex;align-items:center;justify-content:center;animation:pulse 2s infinite}.delete-modal-body{padding:24px}.delete-warning-text{font-size:16px;color:#333;margin-bottom:20px;line-height:1.6}.delete-item-details{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:16px;margin-bottom:20px}.delete-detail-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e9ecef}.delete-detail-row:last-child{border-bottom:none}.delete-detail-label{font-weight:600;color:#666;font-size:14px}.delete-detail-value{color:#333;font-size:14px;text-align:right;max-width:60%;word-break:break-word}.delete-confirmation-text{background:#fff3cd;border:1px solid #ffeaa7;border-radius:6px;padding:12px 16px;color:#856404;font-size:14px;display:flex;align-items:center;gap:10px}.delete-confirmation-text svg{flex-shrink:0}.delete-modal-footer{padding:16px 24px;background:#f8f9fa;display:flex;justify-content:flex-end;gap:12px;border-top:1px solid #e9ecef}.delete-cancel-btn,.delete-confirm-btn{padding:10px 20px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px}.delete-cancel-btn{background:#e9ecef;color:#495057}.delete-cancel-btn:hover{background:#dee2e6;transform:translateY(-1px)}.delete-confirm-btn{background:#dc3545;color:#fff}.delete-confirm-btn:hover{background:#c82333;transform:translateY(-1px);box-shadow:0 4px 12px #dc35454d}.delete-confirm-btn:disabled{background:#6c757d;cursor:not-allowed;transform:none}.delete-loading{display:inline-block;width:14px;height:14px;border:2px solid #ffffff;border-radius:50%;border-top-color:transparent;animation:spin .8s linear infinite}@keyframes scaleIn{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@media (max-width: 480px){.delete-modal-container{width:95%;margin:10px}.delete-modal-header{padding:16px 20px}.delete-modal-body{padding:20px}.delete-detail-row{flex-direction:column;gap:4px}.delete-detail-value{text-align:left;max-width:100%}}.delete-completed-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:flex;justify-content:center;align-items:center;z-index:9999;opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.delete-completed-modal-overlay.show{opacity:1}.delete-completed-modal-container{background:linear-gradient(135deg,#fff,#f8fafc);border-radius:20px;padding:40px 30px 30px;width:90%;max-width:420px;text-align:center;position:relative;box-shadow:0 25px 50px -12px #00000040,0 0 0 1px #fffc;transform:scale(.7) translateY(50px);opacity:0;transition:all .4s cubic-bezier(.34,1.56,.64,1)}.delete-completed-modal-container.show{transform:scale(1) translateY(0);opacity:1}.success-icon-wrapper{position:relative;margin-bottom:25px;display:inline-block}.success-icon-bg{width:80px;height:80px;background:linear-gradient(135deg,#059669,#047857);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto;position:relative;animation:successPulse .6s ease-out;box-shadow:0 10px 25px #05966966,0 0 0 6px #05966926}.success-icon{color:#fff;animation:checkmarkDraw .8s ease-out .2s both}.success-ripple{position:absolute;top:50%;left:50%;width:80px;height:80px;border:2px solid #059669;border-radius:50%;transform:translate(-50%,-50%) scale(0);opacity:0;animation:rippleEffect 1.5s ease-out .3s}.delete-completed-modal-content{margin-bottom:30px}.success-title{font-size:24px;font-weight:700;color:#1f2937;margin-bottom:12px;animation:slideInUp .6s ease-out .4s both}.success-message{font-size:16px;color:#6b7280;line-height:1.6;margin:0;animation:slideInUp .6s ease-out .5s both}.close-button{position:absolute;top:15px;right:15px;background:#6b72801a;border:none;border-radius:50%;width:36px;height:36px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#6b7280;transition:all .2s ease;opacity:0;animation:fadeIn .3s ease-out .6s both}.close-button:hover{background:#6b728033;color:#374151;transform:scale(1.1)}.modal-actions{animation:slideInUp .6s ease-out .6s both}.ok-button{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:12px;padding:14px 32px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 14px #3b82f64d,0 0 0 1px #3b82f61a;min-width:120px}.ok-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #3b82f666,0 0 0 1px #3b82f633}.ok-button:active{transform:translateY(0)}@keyframes successPulse{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@keyframes checkmarkDraw{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}@keyframes rippleEffect{0%{transform:translate(-50%,-50%) scale(0);opacity:1}to{transform:translate(-50%,-50%) scale(2);opacity:0}}@media (max-width: 480px){.delete-completed-modal-container{margin:20px;padding:30px 20px 25px;border-radius:16px}.success-icon-bg{width:70px;height:70px}.success-icon{width:40px;height:40px}.success-title{font-size:20px}.success-message{font-size:14px}.ok-button{padding:12px 28px;font-size:14px}}@media (prefers-reduced-motion: reduce){.delete-completed-modal-overlay,.delete-completed-modal-container,.success-icon-bg,.success-icon,.success-ripple,.success-title,.success-message,.close-button,.modal-actions,.ok-button{animation:none;transition:none}.delete-completed-modal-container{transform:none;opacity:1}}.po-change-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fade-In .2s ease-out;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.po-change-modal-container{background:#fff;border-radius:12px;box-shadow:0 10px 40px #0003;max-width:900px;width:95%;max-height:95vh;animation:scale-In .3s ease-out;overflow:hidden;display:flex;flex-direction:column}.po-change-modal-header{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;padding:20px 24px;display:flex;align-items:center;justify-content:space-between;position:relative}.po-change-modal-header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);pointer-events:none}.po-change-modal-header h3{margin:0;font-size:20px;font-weight:600;position:relative;z-index:1;display:flex;align-items:center;gap:10px}.po-change-modal-header h3:before{content:"📁";font-size:22px}.po-change-close-btn{background:red;border:none;font-size:24px;cursor:pointer;color:#fff;padding:4px;border-radius:4px;transition:all .2s ease;position:relative;z-index:1;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.po-change-close-btn:hover{background-color:#dc2626;transform:scale(1.1)}.po-change-close-btn:active{transform:scale(.95)}.po-change-modal-body{padding:24px;overflow-y:auto;flex:1}.po-change-modal-body::-webkit-scrollbar{width:6px}.po-change-modal-body::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.po-change-modal-body::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.po-change-modal-body::-webkit-scrollbar-thumb:hover{background:#94a3b8}.po-change-form-group{margin-bottom:20px}.po-change-form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:#374151;letter-spacing:.025em}.po-change-form-group label:after{content:"*";color:#ef4444;margin-left:4px;font-weight:700}.po-change-form-group label:not([data-required]):after{display:none}.po-change-form-group input,.po-change-form-group select,.po-change-form-group textarea{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:inherit;transition:all .2s ease;background:#fff;box-sizing:border-box}.po-change-form-group input:focus,.po-change-form-group select:focus,.po-change-form-group textarea:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;transform:translateY(-1px)}.po-change-form-group input:hover,.po-change-form-group select:hover,.po-change-form-group textarea:hover{border-color:#cbd5e1}.po-change-form-group input:disabled,.po-change-form-group select:disabled{background-color:#f5f5f5;color:#666;cursor:not-allowed}.po-change-form-group textarea{resize:vertical;min-height:80px;font-family:inherit;line-height:1.5}.po-change-form-group select{cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;padding-right:40px}.po-change-form-group input.error,.po-change-form-group select.error,.po-change-form-group textarea.error{border-color:#ef4444;box-shadow:0 0 0 3px #ef44441a}.po-change-error-message{color:#ef4444;font-size:12px;margin-top:4px;display:flex;align-items:center;gap:4px}.po-change-error-message:before{content:"⚠️";font-size:14px}.po-change-info-box{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border:1px solid #0ea5e9;border-radius:8px;padding:16px;margin-top:20px}.po-change-info-box h4{margin:0 0 12px;color:#0c4a6e;font-size:16px;font-weight:600;display:flex;align-items:center;gap:8px}.po-change-info-box h4:before{content:"ℹ️";font-size:18px}.po-change-info-box ul{margin:0;padding-left:20px;color:#0c4a6e}.po-change-info-box li{margin-bottom:6px;font-size:14px;line-height:1.4}.po-change-info-box li:last-child{margin-bottom:0}.po-change-debug-info{background:#f8f9fa;border:1px solid #e9ecef;border-radius:8px;padding:12px;margin-top:16px;font-family:Courier New,monospace;font-size:11px;color:#495057;max-height:200px;overflow-y:auto}.po-change-debug-info strong{color:#212529}.po-change-debug-info pre{margin:8px 0 0;white-space:pre-wrap;word-break:break-all}.po-change-modal-footer{background:#f8fafc;border-top:1px solid #e2e8f0;padding:20px 24px;display:flex;justify-content:flex-end;gap:12px}.po-change-cancel-btn,.po-change-save-btn{padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px;border:none;position:relative;overflow:hidden}.po-change-cancel-btn{background:#f1f5f9;color:#64748b;border:1px solid #e2e8f0}.po-change-cancel-btn:hover{background:#e2e8f0;color:#475569;transform:translateY(-1px)}.po-change-save-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 6px -1px #667eea4d}.po-change-save-btn:hover{transform:translateY(-2px);box-shadow:0 8px 15px -3px #667eea66}.po-change-save-btn:active{transform:translateY(0)}.po-change-save-btn:disabled,.po-change-cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.po-change-save-btn:disabled:hover,.po-change-cancel-btn:disabled:hover{transform:none}.po-change-save-btn:disabled{background:#94a3b8}@keyframes fade-In{0%{opacity:0}to{opacity:1}}@keyframes scale-In{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}@media (max-width: 768px){.po-change-modal-container{width:95%;margin:10px;max-height:95vh}.po-change-modal-header{padding:16px 20px}.po-change-modal-header h3{font-size:18px}.po-change-modal-body{padding:20px}.po-change-modal-footer{padding:16px 20px;flex-direction:column}.po-change-cancel-btn,.po-change-save-btn{width:100%;justify-content:center}}@media (max-width: 480px){.po-change-modal-container{width:98%;margin:5px}.po-change-modal-header{padding:14px 16px}.po-change-modal-body{padding:16px}.po-change-form-group{margin-bottom:16px}.po-change-info-box{padding:12px}.po-change-info-box h4{font-size:14px}.po-change-info-box li{font-size:13px}}@media (prefers-reduced-motion: reduce){.po-change-modal-overlay,.po-change-modal-container,.po-change-close-btn,.po-change-cancel-btn,.po-change-save-btn,.po-change-form-group input,.po-change-form-group select,.po-change-form-group textarea{animation:none;transition:none}}.po-change-cancel-btn:focus-visible,.po-change-save-btn:focus-visible{outline:2px solid #667eea;outline-offset:2px}.po-change-form-group input:focus-visible,.po-change-form-group select:focus-visible,.po-change-form-group textarea:focus-visible{outline:2px solid #667eea;outline-offset:2px}.loading-months{padding:12px 16px;background:#f8fafc;border:2px solid #e2e8f0;border-radius:8px;color:#64748b;font-size:14px;display:flex;align-items:center;gap:8px}.loading-months:before{content:"";width:16px;height:16px;border:2px solid #e2e8f0;border-top:2px solid #667eea;border-radius:50%;animation:spin 1s linear infinite}.selected-period-info{margin-top:8px;padding:8px 12px;background:#f0f9ff;border:1px solid #0ea5e9;border-radius:6px;font-size:12px;color:#0c4a6e}.selected-period-info strong{color:#075985}.po-change-help-text{font-size:12px;color:#64748b;margin-top:4px;line-height:1.4;padding:8px 12px;background:#f8fafc;border-radius:6px;border-left:3px solid #0ea5e9}.po-history-section{margin:24px 0;padding:20px;background:linear-gradient(135deg,#f8fafc,#f1f5f9);border:1px solid #e2e8f0;border-radius:12px}.po-history-section h4{margin:0 0 16px;color:#1e293b;font-size:16px;font-weight:600;display:flex;align-items:center;gap:8px}.po-history-section h4:before{content:"📋";font-size:18px}.loading-po-history{padding:20px;text-align:center;color:#64748b;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px}.loading-po-history:before{content:"";width:16px;height:16px;border:2px solid #e2e8f0;border-top:2px solid #667eea;border-radius:50%;animation:spin 1s linear infinite}.po-history-container{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 1px 3px #0000001a}.po-history-table{overflow-x:auto}.po-history-table table{width:100%;border-collapse:collapse;font-size:13px}.po-history-table th{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:12px 8px;text-align:left;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid #5a67d8}.po-history-table td{padding:12px 8px;border-bottom:1px solid #e2e8f0;vertical-align:middle}.po-history-table tr:hover{background-color:#f8fafc}.po-history-table tr.will-change{background-color:#fef3c7;border-left:4px solid #f59e0b}.po-history-table tr.will-change:hover{background-color:#fde68a}.po-history-table tr.no-change{background-color:#f0f9ff;border-left:4px solid #0ea5e9}.po-history-table tr.no-change:hover{background-color:#e0f2fe}.po-history-table .po-number{font-weight:500;min-width:150px}.current-po{color:#1e293b;font-family:Courier New,monospace;background:#f1f5f9;padding:4px 8px;border-radius:4px;font-size:12px}.po-change-preview{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.old-po{color:#dc2626;font-family:Courier New,monospace;background:#fee2e2;padding:4px 8px;border-radius:4px;font-size:12px;text-decoration:line-through;opacity:.7}.arrow{color:#059669;font-weight:700;font-size:14px}.new-po{color:#059669;font-family:Courier New,monospace;background:#dcfce7;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:600;border:1px solid #16a34a}.payment-status{padding:4px 8px;border-radius:12px;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.5px}.payment-status.paid{background:#dcfce7;color:#166534;border:1px solid #16a34a}.payment-status.unpaid{background:#fee2e2;color:#991b1b;border:1px solid #dc2626}.no-po-history{padding:40px 20px;text-align:center;color:#64748b}.no-po-history p{margin:0;font-size:14px;display:flex;align-items:center;justify-content:center;gap:8px}.no-po-history p:before{content:"📄";font-size:20px;opacity:.5}@media (max-width: 768px){.po-history-section{margin:16px 0;padding:16px}.po-history-table{font-size:12px}.po-history-table th,.po-history-table td{padding:8px 6px}.po-change-preview{flex-direction:column;align-items:flex-start;gap:4px}.arrow{transform:rotate(90deg);align-self:center}}@media (max-width: 480px){.po-history-table table{font-size:11px}.po-history-table th{font-size:10px;padding:6px 4px}.po-history-table td{padding:6px 4px}.current-po,.old-po,.new-po{font-size:10px;padding:2px 4px}.payment-status{font-size:9px;padding:2px 6px}}.color-box{width:16px;height:16px;border-radius:50%;display:inline-block;margin-right:8px}.will-change .color-box{background-color:#fef3c7}.no-change .color-box{background-color:#f0f9ff}.po-change-cancel-btn{background:red;color:#fff;border:1px solid #e2e8f0;padding:12px 24px;border-radius:8px;transition:background-color .2s ease,color .2s ease}.po-change-cancel-btn:hover{background:#be0000;color:#fff;transform:translateY(-1px)}.po-change-save-btn{background:green;color:#fff;padding:12px 24px;border-radius:8px;transition:background-color .2s ease,color .2s ease}.po-change-save-btn:hover{background:#006000;color:#fff;transform:translateY(-1px)}strong{color:#1e293b}.mobile-warning-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000d9;display:flex;justify-content:center;align-items:center;z-index:9999;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.mobile-warning-modal{background:#fff;padding:2.5rem;border-radius:12px;max-width:90%;width:400px;text-align:center;box-shadow:0 10px 25px #0003;animation:slideIn .3s ease-out}.mobile-warning-icon{margin-bottom:0rem;color:#dc3545;opacity:.7}.mobile-warning-modal h2{color:red;margin-bottom:1rem;font-size:1.4rem;font-weight:600;line-height:1.3}.mobile-warning-modal p{color:#6c757d;margin-bottom:2rem;line-height:1.6;font-size:.95rem}.mobile-warning-actions{display:flex;justify-content:center;gap:1rem}.mobile-warning-button{padding:14px 28px;border:none;border-radius:6px;cursor:pointer;font-size:1rem;font-weight:500;transition:all .2s ease;min-width:160px}.mobile-warning-button-primary:hover{background-color:#0056b3;transform:translateY(-1px);box-shadow:0 4px 12px #007bff4d}.mobile-warning-button-primary:active{transform:translateY(0)}@media (max-width: 480px){.mobile-warning-modal{padding:2rem;margin:1rem}.mobile-warning-modal h2{font-size:1.2rem}.mobile-warning-button{padding:12px 20px;font-size:.9rem;min-width:140px}}.ext-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:9999;padding:20px;animation:fadeIn .3s ease-out}@keyframes slideIn{0%{transform:translateY(-30px);opacity:0}to{transform:translateY(0);opacity:1}}.ext-modal-container{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;width:100%;max-width:800px;max-height:90vh;display:flex;flex-direction:column;animation:slideIn .3s ease-out;overflow:hidden}.ext-modal-header{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;padding:28px 32px;display:flex;justify-content:space-between;align-items:flex-start;border-bottom:3px solid rgba(255,255,255,.2)}.ext-modal-title{font-size:26px;font-weight:700;margin:0 0 6px;letter-spacing:-.5px}.ext-modal-subtitle{color:#ffffffe6;font-size:14px;margin:0;font-weight:400}.ext-modal-close-btn{background:#ffffff26;border:none;color:#fff;width:36px;height:36px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.ext-modal-close-btn:hover{background:#ffffff40;transform:scale(1.05)}.ext-modal-content-scroll{overflow-y:auto;padding:32px;flex:1}.ext-modal-content-scroll::-webkit-scrollbar{width:8px}.ext-modal-content-scroll::-webkit-scrollbar-track{background:#f1f1f1}.ext-modal-content-scroll::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}.ext-modal-content-scroll::-webkit-scrollbar-thumb:hover{background:#a8a8a8}.rental-info-box{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border:2px solid #bae6fd;border-radius:12px;padding:24px;margin-bottom:32px;box-shadow:0 2px 8px #3b82f614}.rental-info-title{font-size:16px;font-weight:700;color:#0369a1;margin-bottom:16px;display:flex;align-items:center;gap:8px}.rental-info-title:before{content:"ℹ️";font-size:18px}.info-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #bae6fd}.info-item:last-child{border-bottom:none;padding-bottom:0}.info-label{font-weight:600;color:#0369a1;font-size:14px}.info-value{color:#0c4a6e;font-weight:500;text-align:right;font-size:14px}.ext-modal-form{display:flex;flex-direction:column;gap:24px}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{font-weight:600;color:#1f2937;font-size:14px;display:flex;align-items:center;gap:4px}.required{color:#ef4444;font-weight:700}.form-input{padding:12px 16px;border:2px solid #e5e7eb;border-radius:10px;font-size:14px;transition:all .2s;background:#fff;font-family:inherit}.form-input:focus{outline:none;border-color:#6366f1;box-shadow:0 0 0 3px #6366f11a}.form-input:hover{border-color:#c7d2fe}.form-input::placeholder{color:#9ca3af}.input-error{border-color:#ef4444;background:#fef2f2}.input-error:focus{border-color:#ef4444;box-shadow:0 0 0 3px #ef44441a}.error-message{color:#dc2626;font-size:13px;font-weight:500;display:flex;align-items:center;gap:4px;margin-top:-4px}.error-message:before{content:"⚠️";font-size:14px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}.ext-modal-footer{display:flex;gap:12px;justify-content:flex-end;padding-top:24px;border-top:2px solid #f3f4f6;margin-top:8px}.btn-cancel,.btn-submit{padding:12px 28px;border-radius:10px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;border:none;display:flex;align-items:center;gap:8px}.btn-cancel{background:#f3f4f6;color:#4b5563;border:2px solid #e5e7eb}.btn-cancel:hover{background:#e5e7eb;transform:translateY(-1px);box-shadow:0 2px 8px #0000001a}.btn-submit{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;box-shadow:0 4px 12px #4f46e54d}.btn-submit:hover{transform:translateY(-2px);box-shadow:0 6px 16px #4f46e566}.btn-submit:active,.btn-cancel:active{transform:translateY(0)}@media (max-width: 768px){.ext-modal-container{max-width:95%;margin:10px}.ext-modal-header{padding:20px}.ext-modal-title{font-size:22px}.ext-modal-content-scroll{padding:20px}.form-row{grid-template-columns:1fr;gap:16px}.ext-modal-footer{flex-direction:column-reverse}.btn-cancel,.btn-submit{width:100%;justify-content:center}.rental-info-box{padding:16px}.info-item{flex-direction:column;gap:4px}.info-value{text-align:left}}body.ext-modal-open{overflow:hidden}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{opacity:1;height:40px}input[type=date]{-moz-appearance:none;appearance:none;-webkit-appearance:none}input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.6;filter:invert(.5)}input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}.btn-cancel:focus-visible,.btn-submit:focus-visible,.form-input:focus-visible,.ext-modal-close-btn:focus-visible{outline:3px solid #6366f1;outline-offset:2px}.rental-management{display:flex;max-width:100vw;min-width:100vw;max-height:100vh;min-height:100vh;overflow:hidden}.container{flex-grow:1;min-height:100vh;box-sizing:border-box;display:flex;flex-direction:column;background:linear-gradient(to bottom,#f7fafc,#edf2f7);width:82vw;margin-left:17vw;overflow-x:hidden}.content{flex:1 1 auto;flex-direction:column;min-width:inherit;max-width:inherit;padding:20px;margin-left:10px;height:fit-content;box-sizing:border-box}.year-filter{display:flex;align-items:center;gap:15px;background:#fff3;padding:15px 25px;border-radius:50px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.3);position:relative;z-index:1;transition:all .3s ease}.year-filter:hover{background:#ffffff4d;transform:translateY(-2px)}.year-filter select{background:#fffffff2;border:none;padding:12px 18px;border-radius:25px;font-size:15px;font-weight:600;outline:none;cursor:pointer;transition:all .3s ease;color:#4a5568;min-width:100px}.year-filter select:hover{background:#fff;transform:translateY(-1px);box-shadow:0 5px 15px #0000001a}.table-head-navigation{background:transparent;border-radius:20px;padding:0;margin-bottom:20px;box-shadow:0 10px 25px #0000001a,0 0 0 1px #667eea1a;border:1px solid rgba(102,126,234,.1);position:relative;overflow:hidden}.search-input-and-filter-wrapper{display:flex;justify-content:space-between;align-items:center;padding:20px 30px;gap:20px;flex-wrap:wrap;background:#fff;border-radius:16px;box-shadow:0 2px 8px #0000000a}.search-input-wrapper-rental{position:relative;display:flex;align-items:center;flex:1;min-width:400px;max-width:600px}.search-icon-rental{position:absolute;left:18px;color:#94a3b8;z-index:1;transition:color .3s ease}.search-input-rental{width:100%;padding:14px 50px;border:2px solid #e2e8f0;border-radius:12px;font-size:14px;outline:none;transition:all .3s ease;background:#f8fafc;color:#1e293b;font-weight:500}.search-input-rental::placeholder{color:#94a3b8;font-weight:400}.search-input-rental:focus{border-color:#667eea;background:#fff;box-shadow:0 0 0 4px #667eea14}.search-input-rental:focus~.search-icon-rental{color:#667eea}.clear-search-rental{position:absolute;right:14px;background:#ef4444;color:#fff;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer;font-size:16px;font-weight:700;display:flex;align-items:center;justify-content:center;transition:all .2s ease;z-index:2}.clear-search-rental:hover{background:#dc2626;transform:scale(1.1)}.clear-search-rental:active{transform:scale(.95)}.filter-wrapper{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.filter-icon{color:#667eea;flex-shrink:0}.master-filter-select{padding:12px 40px 12px 16px;border-radius:10px;min-width:180px;background:#fff;border:2px solid #e2e8f0;font-size:13px;font-weight:600;color:#334155;outline:none;cursor:pointer;transition:all .3s ease;white-space:nowrap;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23334155' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:12px}.master-filter-select:hover{background-color:#f8fafc;border-color:#667eea;transform:translateY(-1px);box-shadow:0 4px 12px #667eea26}.master-filter-select:focus{border-color:#667eea;box-shadow:0 0 0 4px #667eea14}.master-filter-select option{padding:10px;background:#fff;color:#334155;font-weight:500}.master-filter-select option:hover{background:#667eea;color:#fff}.master-filter-select option:checked{background:#667eea;color:#fff}.tabs{display:flex;background:#fff;padding:6px;border-radius:20px;box-shadow:0 10px 25px #0000001a,0 0 0 1px #667eea1a;position:relative;overflow:hidden}.tabs span{font-size:13px}.tab-button{flex:1;padding:12px 20px;background:transparent;border:none;border-radius:15px;font-weight:700;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);color:#64748b;position:relative;overflow:hidden;text-transform:capitalize;letter-spacing:.5px}.tab-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}.tab-button.active{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;transform:translateY(-3px);box-shadow:0 15px 30px #667eea66}.tab-button.active:before{left:100%}.tab-button:hover:not(.active){background:linear-gradient(135deg,#f1f5f9,#e2e8f0);transform:translateY(-2px);box-shadow:0 10px 20px #0000001a}.card{background:#fff;border-radius:24px;box-shadow:0 20px 40px #0000001a,0 0 0 1px #667eea1a;overflow:hidden;border:1px solid rgba(102,126,234,.1);position:relative;animation:slideIn .6s ease-out}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px}.card-header{background:#fff;padding:20px 35px;border-bottom:1px solid #e5e7eb;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.card-header h2{margin:0;font-size:24px;font-weight:700;color:#1e293b;letter-spacing:-.5px}.table-container{-webkit-overflow-scrolling:touch;max-height:calc(100vh - 410px);overflow-y:auto;box-sizing:border-box}.table-controls{display:flex;gap:20px;align-items:center;flex-wrap:wrap;justify-content:center;margin:10px 0}.table-controls label,.table-controls span{color:#64748b;font-size:15px;font-weight:500;margin-right:10px}.table-controls select,.table-controls input[type=search]{padding:6px 12px;border:1px solid #e2e8f0;border-radius:20px;font-size:14px;font-weight:500;color:#1e293b;outline:none}.stats{display:flex;gap:20px;align-items:center;flex-wrap:wrap}.stats-item{color:#64748b;font-size:15px;font-weight:500}.stats-item strong{color:#667eea;font-weight:700;font-size:18px}.search-info{background:#fef3c7;color:#92400e;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:600;border:1px solid #fbbf24}.data-table{width:100%;border-collapse:collapse;font-size:12px;table-layout:auto;word-wrap:break-word;overflow-y:visible}.data-table thead{background:linear-gradient(135deg,#f8fafc,#e2e8f0)}.data-table th{padding:20px 18px;text-align:left;font-size:12px;font-weight:700;color:#374151;text-transform:uppercase;letter-spacing:.5px;border-bottom:2px solid #e5e7eb;border:1px solid #ccc;background-color:#f5f5f5;position:sticky;top:0;z-index:8;box-shadow:inset 0 -1px #e5e7eb;vertical-align:middle}.data-table td{padding:20px 18px;border:1px solid #d2d3d4;color:#374151;font-size:12px;font-weight:500;transition:all .3s ease;vertical-align:middle;text-align:left}.data-table tbody tr{transition:all .3s ease}.data-table .text-center{text-align:center}.serial-number{color:#667eea;font-weight:600;font-size:16px;text-align:center;width:60px;position:sticky;left:0;background:#fff;z-index:5;border-right:1px solid #e5e7eb;box-shadow:2px 0 5px #0000000d;border-radius:0 24px 0 0;transition:all .3s ease}.monthly-table-container{width:100%;overflow-x:auto;margin-top:1rem}.monthly-data-table{width:100%;border-collapse:collapse;font-size:14px;min-width:900px}.monthly-data-table thead{position:sticky;top:0;background:#f8f9fa;z-index:2}.monthly-data-table th,.monthly-data-table td{padding:8px 12px;border:1px solid #ddd;text-align:center;white-space:nowrap}.monthly-data-table th{background:#eaeaea;font-weight:600}.monthly-data-table tr:nth-child(2n){background-color:#fdfdfd}.monthly-data-table tr:nth-child(odd){background-color:#fafafa}.items-table{width:100vw;max-width:100vw;border-collapse:collapse;font-size:14px;table-layout:auto;word-wrap:break-word;margin-bottom:20px;border:2px solid #000}.items-table th{background-color:#0c6;color:#fff;font-weight:700;padding:10px;text-align:center;border:2px solid #000;font-size:14px}.items-table td{padding:10px;border:2px solid #000;text-align:center;font-size:10px}button{cursor:pointer;transition:all .3s ease;background-color:#667eea;color:#fff;border:none;padding:10px 20px}button,.view-btn,.delete-btn,.edit-btn{padding:6px 12px;font-size:.875rem}.action-buttons{display:flex;gap:8px;justify-content:center;align-items:center}.view-btn{display:inline-flex;align-items:center;gap:6px;background-color:#17a2b8;color:#fff;border:none;border-radius:4px;font-weight:500;cursor:pointer;transition:all .2s ease;margin-right:8px;position:relative;overflow:hidden}.view-btn:hover{background-color:#138496;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.view-btn:active{transform:translateY(0)}.edit-btn{background-color:#27ae60}.edit-btn:hover{background-color:#1e8449}.delete-btn{display:inline-flex;align-items:center;gap:6px;background-color:#dc3545;color:#fff;border:none;border-radius:4px;font-weight:500;cursor:pointer;transition:all .2s ease;margin-right:15px}.delete-btn:hover{background-color:#c82333;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.delete-btn:active{transform:translateY(0)}.update-payment-btn{background-color:#007bff;color:#fff;border:none;padding:6px 12px;border-radius:4px;font-size:12px;cursor:pointer;transition:background-color .2s ease;margin:2px}.update-payment-btn:hover{background-color:#0056b3;opacity:.8}.update-po-btn{background-color:green;color:#fff;padding:8px 16px;border:none;border-radius:4px;font-size:14px;font-weight:500;cursor:pointer;transition:background-color .2s ease;align-items:center;gap:6px;position:relative;overflow:hidden;box-shadow:0 2px 4px #0000001a;text-decoration:none}.update-po-btn:hover{background-color:#006000;transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.update-po-btn:active{transform:translateY(0)}.update-po-btn:disabled{background-color:#94a3b8;cursor:not-allowed;opacity:.6;transform:none;box-shadow:none}.update-po-btn:disabled:hover{transform:none}.update-po-btn .loading-spinner{display:none;border:2px solid rgba(255,255,255,.5);border-left-color:#fff;width:16px;height:16px;animation:spin 1s linear infinite}.update-invoice-btn{background-color:#17a2b8;color:#fff;border:none;padding:6px 12px;border-radius:4px;cursor:pointer;font-size:12px;transition:background-color .2s;margin:2px}.update-invoice-btn:hover{background-color:#138496;opacity:.8}.print-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 20px;background-color:#28a745;color:#fff;border:none;border-radius:4px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.print-btn:hover{background-color:#218838;transform:translateY(-1px);box-shadow:0 4px 8px #0000001a}.print-btn:active{transform:translateY(0)}.inline-action-buttons{display:flex;justify-content:center;align-items:center;gap:8px}.button-row{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;width:fit-content}.button-wrapper{position:relative;display:flex;justify-content:center;align-items:center}.action-btn{display:flex;justify-content:center;align-items:center;width:48px;height:48px;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;font-size:18px}.action-btn.primary{background-color:#007bff;color:#fff}.action-btn.primary:hover{background-color:#0056b3}.action-btn.secondary{background-color:#6c757d;color:#fff}.action-btn.secondary:hover{background-color:#5a6268}.action-btn.info{background-color:#17a2b8;color:#fff}.action-btn.info:hover{background-color:#138496}.action-btn.warning{background-color:#ffc107;color:#333}.action-btn.warning:hover{background-color:#e0a800}.action-btn.danger{background-color:#dc3545;color:#fff}.action-btn.danger:hover{background-color:#c82333}.status-badge{padding:4px 12px;font-size:14px;font-weight:600;border-radius:12px;color:#fff;display:inline-block;min-width:70px;text-align:center}.status-badge.active{background-color:#28a745}.status-badge.inactive{background-color:#dc3545}.paid-rental{background-color:#28a745!important;color:#fff!important}.paid-rental td{color:#fff!important}.expired-rental{background-color:#8b0000!important;color:#fff!important}.expired-rental td{color:#fff!important}.week-left-rental{background-color:#f66!important;color:#fff!important}.week-left-rental td{color:#fff!important}.month-left-rental{background-color:#ffcccb!important}.status-biru{background-color:#00f;color:#fff;padding:2px 6px;border-radius:4px;display:inline-block}.status-hijau{background-color:green;color:#fff;padding:2px 6px;border-radius:4px;display:inline-block}.status-merah{background-color:red;color:#fff;padding:2px 6px;border-radius:4px;display:inline-block}.paid-label{background-color:#28a745;color:#fff;padding:4px 8px;border-radius:4px;font-size:12px;font-weight:700;display:inline-block}.outstanding{font-weight:700;color:#dc3545}.status-dot{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:8px;vertical-align:middle}.status-dot.paid{background-color:green}.status-dot.expired{background-color:#9e0202}.status-dot.week-left{background-color:#ffac39}.status-dot.month-left{background-color:#9e50e2}.po-change-indicator{display:flex;flex-direction:column;gap:4px;font-size:12px;line-height:1.2}.po-old{color:#dc3545;background-color:#f8d7da;padding:2px 6px;border-radius:3px;border:1px solid #f5c6cb}.po-new{color:#155724;background-color:#d4edda;padding:2px 6px;border-radius:3px;border:1px solid #c3e6cb}.po-arrow{text-align:center;color:#6c757d;font-weight:700;font-size:14px}.po-change-badge{background-color:#fff3cd;color:#856404;padding:2px 6px;border-radius:3px;border:1px solid #ffeaa7;font-size:10px;text-align:center;font-weight:700}.po-normal{padding:4px 8px;background-color:#f8f9fa;border-radius:3px;border:1px solid #dee2e6;color:#495057;font-size:12px}.po-label{font-weight:700;font-size:10px;text-transform:uppercase}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:9999}.modal{background:#fff;border-radius:16px;width:100%;max-width:1200px;max-height:90vh;display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden;animation:fadeIn .3s ease-out}.modal-small{max-width:500px}.view-modal{max-width:800px;width:90%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column}.payment-update-modal{max-width:500px;width:90%}.modal-header{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;padding:24px 28px;display:flex;justify-content:space-between;align-items:center;position:relative}.modal-header:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#ffffff1a,#ffffff0d);pointer-events:none}.modal-header h3{margin:0;font-size:20px;font-weight:600;letter-spacing:-.025em;position:relative;z-index:1}.modal-body{overflow-y:auto;flex-grow:1;padding:28px;max-height:calc(100vh - 160px);width:100%;box-sizing:border-box}.modal-body::-webkit-scrollbar{width:6px}.modal-body::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.modal-body::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:3px}.modal-body::-webkit-scrollbar-thumb:hover{background:#94a3b8}.modal-body:has(.rental-info-card){padding-top:20px}.modal-footer{background:#f8fafc;border-top:1px solid #e2e8f0;padding:20px 28px;display:flex;justify-content:flex-end;gap:12px;width:100%;box-sizing:border-box}.close-btn{background:transparent;width:34px;border:none;font-size:24px;cursor:pointer;color:#fff;padding:4px;border-radius:4px;transition:all .4s ease}.close-btn:hover{background-color:red;color:#fff}.close-btn:active{transform:scale(.95)}.cancel-btn{background:red;color:#fff;border:1px solid #e2e8f0;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.cancel-btn:hover{background:#be0000;color:#fff;transform:translateY(-1px)}.cancel-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.cancel-btn:disabled:hover{transform:none}.save-btn{padding:12px 24px;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;gap:8px;border:none;position:relative;overflow:hidden;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 6px -1px #667eea4d}.save-btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 15px -3px #667eea66;background-color:#218838}.save-btn:active{transform:translateY(0)}.save-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none;background:#94a3b8}.save-btn:disabled:hover{transform:none}.form-section{margin-top:24px}.form-section h4{margin:0 0 20px;color:#1e293b;font-size:16px;font-weight:600;padding-bottom:8px;border-bottom:2px solid #e2e8f0;display:flex;align-items:center;gap:8px}.form-section h4:before{content:"📝";font-size:18px}.form-group{margin-bottom:20px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}.form-group label{display:block;margin-bottom:6px;font-size:13px;font-weight:500;color:#374151;letter-spacing:.025em}.form-group label:after{content:"*";color:#ef4444;margin-left:2px;display:none}.form-group label[for*=required]:after,.form-group label:has(+input[required]):after{display:inline}.form-group input,.form-group select,.form-group textarea,.form-input{width:100%;padding:12px 16px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;font-family:inherit;transition:all .2s ease;background:#fff;box-sizing:border-box}.form-group input:focus,.form-group select:focus,.form-group textarea:focus,.form-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a;transform:translateY(-1px)}.form-group input:hover,.form-group select:hover,.form-group textarea:hover{border-color:#cbd5e1}.form-group textarea{resize:vertical;min-height:80px;font-family:inherit;line-height:1.5}.form-group select{cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;padding-right:40px}.form-group input::placeholder,.form-group textarea::placeholder{color:#9ca3af;font-style:italic}.form-group .checkbox-label{display:flex;align-items:center;gap:10px;cursor:pointer;padding:10px;background-color:#f8f9fa;border-radius:6px;border:1px solid #e9ecef;transition:background-color .2s ease}.form-group .checkbox-label input[type=checkbox]{margin-right:10px;cursor:pointer;width:20px;height:20px;accent-color:#007bff;border:2px solid #ddd;border-radius:4px;background-color:#fff;transition:border-color .2s ease}.form-group .checkbox-label input[type=checkbox]:checked{background-color:#007bff;border-color:#007bff}.form-group .checkbox-label:hover{background-color:#e2e8f0}.form-group .checkbox-label:active{background-color:#d1d5db}.payment-update-form{display:flex;flex-direction:column;gap:20px}.payment-update-form .form-group{display:flex;flex-direction:column;gap:8px}.payment-update-form .form-group label{font-weight:600;color:#333;font-size:14px}.payment-update-form .month-display{background-color:#f8f9fa;padding:10px;border-radius:6px;border:1px solid #e9ecef;font-weight:500;color:#495057}.payment-update-form .checkbox-label{display:flex;align-items:center;gap:10px;cursor:pointer;padding:10px;background-color:#f8f9fa;border-radius:6px;border:1px solid #e9ecef;transition:background-color .2s ease}.payment-update-form .checkbox-label:hover{background-color:#e9ecef}.payment-update-form .checkbox-label input[type=checkbox]{width:18px;height:18px;cursor:pointer}.payment-update-form .checkbox-text{font-weight:500;color:#495057}.payment-update-form .info-note{background-color:#fff3cd;border:1px solid #ffeaa7;border-radius:6px;padding:10px;margin-top:10px}.payment-update-form .info-note small{color:#856404;font-size:12px}.user-info-container{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:20px;margin-bottom:24px}.user-info-container h4{margin:0 0 16px;color:#1e293b;font-size:16px;font-weight:600;display:flex;align-items:center;gap:8px}.user-info-container h4:before{content:"👤";font-size:18px}.info-grid-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.info-grid-container>div{display:flex;flex-direction:column;gap:4px}.info-grid-container label{font-size:12px;font-weight:500;color:#64748b;text-transform:uppercase;letter-spacing:.05em}.info-grid-container span{font-size:14px;font-weight:500;color:#1e293b;padding:6px 0}.rental-info-card{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;margin-bottom:25px;box-shadow:0 10px 25px #667eea4d,0 0 0 1px #ffffff1a;overflow:hidden;position:relative;animation:slideInFromTop .6s ease-out}.rental-info-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Ccircle cx='30' cy='30' r='2'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E") repeat;pointer-events:none}.rental-info-header{background:transparent;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:16px 24px;border-bottom:1px solid rgba(255,255,255,.2);position:relative;z-index:1}.rental-info-header h4{margin:0;color:#fff;font-size:18px;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,.2);letter-spacing:-.5px;display:flex;align-items:center;gap:8px}.rental-info-content{padding:24px;position:relative;z-index:1}.rental-info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}.rental-info-item{background:#fffffff2;border-radius:12px;padding:18px 20px;box-shadow:0 4px 12px #0000001a,0 0 0 1px #fff3;transition:all .3s ease;position:relative;overflow:hidden}.rental-info-item:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#667eea,#764ba2)}.rental-info-item:hover{transform:translateY(-2px);box-shadow:0 8px 20px #00000026,0 0 0 1px #ffffff4d}.rental-info-item label{display:block;font-size:13px;font-weight:600;color:#64748b;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;display:flex;align-items:center;gap:6px}.rental-info-item span{display:block;font-size:16px;font-weight:700;color:#1e293b;line-height:1.4;word-break:break-word}.rental-info-card+.table-container{margin-top:0}.quotation-print{background:#fff;padding:30px;font-family:Arial,sans-serif;color:#000;max-width:800px;margin:0 auto}.print-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:20px;border-bottom:2px solid #000}.company-logo img{height:60px;width:150px;object-fit:contain}.company-info{text-align:right}.company-info h2{font-size:18px;font-weight:700;margin:0 0 5px}.company-info p{font-size:12px;margin:0;line-height:1.4;color:#000}.quotation-title{text-align:center;margin:30px 0}.quotation-title h1{font-size:28px;font-weight:700;margin:0 0 10px;text-decoration:underline}.quotation-title p{font-size:14px;margin:0}.quotation-date{text-align:left;margin-bottom:20px;font-size:14px}.info-grid,.address-grid,.terms-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-bottom:20px;border:2px solid #000}.info-section,.address-section,.terms-section{border-right:2px solid #000}.info-section:last-child,.address-section:last-child,.terms-section:last-child{border-right:none}.section-header{background-color:#0c6;color:#fff;padding:8px 12px;font-weight:700;font-size:14px;text-align:center;border-bottom:2px solid #000}.section-content{padding:12px;min-height:60px}.section-content p{margin:0;font-size:14px;line-height:1.6}.company-name{font-weight:700;color:#000}.terms-grid{grid-template-columns:1fr 1fr 1fr}.print-footer{margin-top:30px;font-size:14px}.print-footer p{margin:5px 0}.regards{margin:20px 0;font-weight:700}.signature-section{margin-top:60px}.sign-name{font-weight:700;text-decoration:underline;margin-bottom:5px}.custom-tooltip{position:absolute;bottom:100%;left:50%;transform:translate(-50%);background-color:#333;color:#fff;padding:6px 12px;border-radius:4px;font-size:12px;white-space:nowrap;margin-bottom:8px;z-index:1000;pointer-events:none}.tooltip-arrow{position:absolute;bottom:-6px;left:50%;transform:translate(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:6px solid #333}.tooltip-content{position:relative}.notes{background:#fff8d8;color:#8a6d3b;padding:20px;margin-bottom:20px;border-radius:8px;font-size:14px;font-weight:500;text-align:left;box-shadow:0 1px 4px #0000001a;border:1px solid #ffeeba}.notes .highlight{font-weight:700}.rental-note{background:#fff;border-left:6px solid #dc3545;border-radius:10px;padding:1rem 1.5rem;margin:1rem 0;box-shadow:0 4px 10px #00000014;font-size:14px;line-height:1.6}.rental-note .note-header{font-size:16px;font-weight:700;margin-bottom:.75rem;color:#dc3545;display:flex;align-items:center;gap:6px}.rental-note ul{color:#8a6d3b;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:500;text-align:left;margin:0;padding-left:1.2rem}.rental-note li{margin-bottom:.6rem;color:#444}.rental-note b{color:#222}.important-note ul{color:#a94442;padding:20px;border-radius:8px;font-size:14px;font-weight:500;text-align:left}.important-note li{margin-bottom:8px;line-height:1.4;list-style-type:disc;margin-left:20px}.maintenance-message{background-color:#fff3cd;border:1px solid #ffeeba;padding:15px 20px;border-radius:8px;color:#856404;font-size:14px;margin-bottom:20px;box-shadow:0 2px 6px #0000001a}.maintenance-message strong{font-weight:600}.maintenance-message h1{font-size:20px;margin-bottom:10px;color:#856404;font-weight:600}.loading-animation-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:20px;font-size:16px;color:#333}.loading-spinner{border:4px solid rgba(0,0,0,.1);border-left-color:#0c6;border-radius:50%;width:36px;height:36px;animation:spin 1s linear infinite;margin-bottom:10px}.developer-tools-section{padding:16px 24px;background:linear-gradient(135deg,#fef2f2,#fff1f2);text-align:center;margin-top:0}.developer-link{color:#dc2626;text-decoration:none;font-size:14px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:8px;transition:all .3s ease;border:2px dashed #dc2626;background:#fef2f2;position:relative;overflow:hidden;box-shadow:0 2px 4px #dc26261a;animation:pulse-red 2s ease-in-out infinite}.developer-link:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(220,38,38,.1),transparent);transition:left .5s ease}.developer-link:hover{background:#fee2e2;border-color:#b91c1c;border-style:solid;color:#991b1b;text-decoration:none;transform:translateY(-2px);box-shadow:0 4px 12px #dc262633;animation:none}.developer-link:hover:before{left:100%}.developer-link:active{transform:translateY(0) scale(.98);box-shadow:0 2px 4px #dc262626}.developer-link-badge{display:inline-block;padding:6px 12px;background:#dc2626;color:#fff;border-radius:4px;font-size:11px;font-weight:600;margin-left:8px;text-transform:uppercase;letter-spacing:.5px}.dropdown-item{padding:10px 20px;margin:8px 0;cursor:pointer;transition:background-color .3s ease}.dropdown-item:hover{background-color:#f1f5f9;color:#1e293b}.action-cell{position:relative;padding:12px!important;overflow:visible}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes pulse-red{0%,to{box-shadow:0 2px 4px #dc26261a}50%{box-shadow:0 2px 12px #dc26264d}}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@media (min-width: 768px) and (max-width: 1400px){.container{width:82vw;margin-left:17.6vw}.header h1{font-size:2rem}.card-header h2{font-size:18px}.rental-info-header h4{font-size:14px}.rental-info-item span{font-size:13px}.rental-info-item label{font-size:12px}.data-table th,.data-table td{font-size:13px;padding:12px 10px}.serial-number{width:70px;font-size:15px}button,.view-btn,.delete-btn,.edit-btn{font-size:13px;padding:6px 12px}.year-filter{flex-direction:row;align-items:center;padding:10px 15px;justify-content:flex-start;gap:10px}.year-filter select,.tab-button{font-size:14px;padding:8px 12px}.search-input-and-filter-wrapper{padding:18px 25px;gap:16px}.search-input-wrapper-rental{min-width:320px;max-width:500px}.search-input-rental{font-size:13px;padding:13px 45px 13px 48px}.search-icon-rental{left:16px}.clear-search-rental{right:12px;width:22px;height:22px;font-size:15px}.master-filter-select{min-width:160px;font-size:12px;padding:11px 36px 11px 14px}.filter-icon{width:20px;height:20px}.print-header{flex-direction:row;justify-content:space-between}.company-info{text-align:right}.items-table{font-size:14px}.items-table th,.items-table td{padding:10px}.action-buttons{flex-direction:row;justify-content:center;gap:10px}.delete-btn,.edit-btn,.view-btn{width:auto;margin-bottom:0}.rental-info-content{padding:20px}.rental-info-header{padding:14px 20px}.rental-info-item{padding:16px 18px}.rental-info-item span{font-size:15px}.button-row{gap:6px}.action-btn{width:40px;height:40px}.po-change-indicator{font-size:10px}.po-change-badge{font-size:9px}.po-normal{font-size:11px;padding:3px 6px}.update-payment-btn,.update-po-btn,.update-invoice-btn{font-size:11px;padding:4px 8px}}@media (min-width: 1200px){.data-table th,.data-table td{padding:8px 12px;font-size:.875rem}.serial-number{width:80px;font-size:16px}}@media (min-width: 1440px){.view-modal{width:1000px;height:100vh}.modal-body{padding:20px}.quotation-print{padding:40px}.print-header{justify-content:space-between}.company-info{text-align:right;margin-top:0}.info-grid,.address-grid{grid-template-columns:repeat(2,1fr)}.terms-grid{grid-template-columns:repeat(3,1fr)}.items-table{font-size:14px}.items-table th,.items-table td{padding:10px;font-size:12px}}@media print{@page{size:F5;margin:0}body{margin:0;padding:20mm;font-size:12pt}.menu,.footer,.print-quotation,.date-info,.about-blank,.hidden-print{display:none!important}.quotation-print{padding:0;margin:0;width:100%;height:auto}.items-table{width:100%;border-collapse:collapse;margin-bottom:20px}.items-table th,.items-table td{border:1px solid black;padding:8px;text-align:left}}.give-me-some-space{margin-bottom:20px;margin-top:30px}.custom-header{background:linear-gradient(135deg,#4f46e5,#6366f1);border-bottom:1px solid #e5e7eb;padding:1.5rem 2rem;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100;width:100%}.header-left{display:flex;align-items:center;gap:1rem}.dashboard-title{font-size:1.7rem;font-weight:700;color:#fff;margin:0}.header-right{display:flex;align-items:center;gap:1rem}.search-container{position:relative;display:flex;align-items:center}.search-input{padding:.5rem 2.5rem .5rem 1rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.875rem;width:200px;transition:all .2s}.search-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.search-icon{position:absolute;right:.75rem;color:#9ca3af;pointer-events:none}.year-filter-wrapper{display:flex;align-items:center}.year-filter-select{padding:.5rem 2rem .5rem .75rem;border:1px solid #d1d5db;border-radius:.5rem;font-size:.875rem;background:#fff;color:#374151;cursor:pointer;transition:all .2s;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%239ca3af' d='M6 9L1 4h10z'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .5rem center}.year-filter-select:hover{border-color:#9ca3af}.year-filter-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.new-invoice-btn{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;background:#3b82f6;color:#fff;border:white 1px solid;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap}.new-invoice-btn:hover{background:#2563eb}.new-invoice-btn:active{transform:scale(.98)}.notification-wrapper,.account-wrapper{position:relative}.account-btn{display:flex;align-items:center;gap:.75rem;padding:.5rem 1rem;background:#fff3;border:1px solid #e5e7eb;border-radius:.5rem;cursor:pointer;transition:all .2s}.account-btn:hover{background:#f9fafb7a;border-color:#0d1827}.user-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#4f46e5,#6366f1);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:.95rem}.user-info{display:flex;flex-direction:column;align-items:flex-start;text-align:left}.user-name{font-size:.9rem;font-weight:500;color:#fff;line-height:1.2;margin-bottom:2px}.user-role{font-size:.8rem;color:#fff;line-height:1.2}.chevron{color:#fff;transition:transform .2s}.chevron.open{transform:rotate(180deg)}.account-dropdown{position:absolute;top:calc(100% + .5rem);right:0;background:#fff;border:1px solid #e5e7eb;border-radius:.5rem;box-shadow:0 10px 15px -3px #0000001a;min-width:280px;z-index:1000}.dropdown-header{display:flex;gap:1rem;padding:1rem}.user-avatar-large{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;font-size:1rem;flex-shrink:0}.user-name-large{font-size:1rem;font-weight:600;color:#1f2937;margin-bottom:.25rem}.user-email{font-size:.875rem;color:#6b7280;margin-bottom:.25rem}.user-role-info{font-size:.75rem;color:#9ca3af}.dropdown-divider{height:1px;background:#e5e7eb;margin:.5rem 0}.dropdown-item{display:flex;align-items:center;gap:.75rem;width:100%;padding:.75rem 1rem;border:none;background:none;text-align:left;cursor:pointer;transition:background .2s;font-size:.875rem;color:#374151}.dropdown-item:hover{background:#f9fafb}.dropdown-item.logout-btn{color:#ef4444}.dropdown-item.logout-btn:hover{background:#fef2f2}.dropdown-overlay{position:fixed;top:0;left:0;right:0;bottom:0;z-index:999}.logout-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:9999;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.logout-modal{background:#fff;border-radius:.75rem;padding:2rem;max-width:400px;width:90%;box-shadow:0 20px 25px -5px #0000001a}.logout-modal-title{font-size:1.25rem;font-weight:600;color:#1f2937;margin:0 0 .5rem}.logout-modal-message{font-size:.875rem;color:#6b7280;margin:0 0 1.5rem}.logout-modal-actions{display:flex;gap:.75rem;justify-content:flex-end}.logout-btn{padding:.5rem 1rem;border-radius:.5rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:all .2s;border:none}.logout-btn-cancel{background:#f3f4f6;color:#374151}.logout-btn-cancel:hover{background:#e5e7eb}.logout-btn-confirm{background:#ef4444;color:#fff}.logout-btn-confirm:hover{background:#dc2626}.custom-header-mobile{display:none}.custom-header-desktop{display:flex}@media (max-width: 1024px){.custom-header{width:100%;margin-left:0}.user-info{display:none}.search-input{width:150px}}@media (max-width: 768px){.custom-header-desktop{display:none}.custom-header-mobile{display:flex;flex-direction:column;gap:1rem;padding:1rem}.header-left{width:100%;justify-content:space-between}.header-right{width:100%;flex-wrap:wrap}.search-input{flex:1;min-width:150px}.new-invoice-btn{font-size:.75rem;padding:.5rem .75rem}.year-filter-select{font-size:.75rem;padding:.5rem 1.5rem .5rem .5rem}}.version-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.version-list-modal{background:#fff;border-radius:16px;width:90%;max-width:600px;max-height:93vh;overflow:hidden;box-shadow:0 20px 60px #0003;animation:modalAppear .3s ease-out}@keyframes modalAppear{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.version-modal-header{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;padding:20px 24px;display:flex;justify-content:space-between;align-items:center}.version-modal-title{display:flex;align-items:center;gap:12px}.version-modal-title h2{margin:0;font-size:20px;font-weight:600}.version-icon{color:#fbbf24}.version-modal-close{background:none;border:none;color:#fff;cursor:pointer;padding:8px;border-radius:8px;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.version-modal-close:hover{background:#ffffff1a;transform:scale(1.05)}.version-modal-content{padding:0;overflow-y:auto;max-height:calc(90vh - 140px)}.version-list{padding:0}.version-item-container{border-bottom:1px solid #e5e7eb}.version-item-container:last-child{border-bottom:none}.version-item-header{padding:20px 24px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:all .2s ease;background:#fff}.version-item-header:hover{background:#f9fafb}.version-info{flex:1}.version-main{display:flex;align-items:center;gap:12px;margin-bottom:8px}.version-number{font-size:18px;font-weight:700;color:#1f2937}.version-badge{padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;text-transform:uppercase}.version-badge.current{background:#dcfce7;color:#166534}.version-badge.major{background:#fecaca;color:#dc2626}.version-badge.minor{background:#dbeafe;color:#2563eb}.version-badge.beta{background:#ede9fe;color:#cced3a}.version-badge.patch{background:#f3e8ff;color:#7c3aed}.version-date{display:flex;align-items:center;gap:6px;color:#6b7280;font-size:14px}.expand-icon{color:#6b7280;transition:transform .2s ease}.version-changelog{padding:0 24px 20px;background:#f8fafc;animation:expandIn .3s ease-out}@keyframes expandIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.changelog-header{padding:16px 0 12px;border-bottom:1px solid #e5e7eb;margin-bottom:16px}.changelog-header h4{margin:0;color:#374151;font-size:16px;font-weight:600}.changelog-list{display:flex;flex-direction:column;gap:12px}.changelog-item{display:flex;gap:12px;align-items:flex-start}.change-icon{flex-shrink:0;margin-top:2px}.change-content{flex:1}.change-type{display:block;font-weight:600;font-size:13px;color:#374151;margin-bottom:2px}.change-description{display:block;font-size:14px;color:#6b7280;line-height:1.5}.version-footer{background:#f9fafb;padding:20px 24px;border-top:1px solid #e5e7eb;text-align:center}.app-info p{margin:4px 0;color:#6b7280;font-size:14px}.app-info p:first-child{color:#1f2937;font-weight:600}.text-green-600{color:#059669}.text-red-600{color:#dc2626}.text-blue-600{color:#2563eb}.text-purple-600{color:#7c3aed}.text-gray-600{color:#4b5563}@media (max-width: 768px){.version-list-modal{width:95%;margin:10px}.version-modal-header{padding:16px 20px}.version-modal-title h2{font-size:18px}.version-item-header{padding:16px 20px}.version-number{font-size:16px}.version-main{flex-direction:column;align-items:flex-start;gap:8px;margin-bottom:8px}.version-changelog{padding:0 20px 16px}.version-footer{padding:16px 20px}}@media (max-width: 480px){.version-modal-title{gap:8px}.version-modal-title h2{font-size:16px}.version-item-header{padding:14px 16px}.version-changelog{padding:0 16px 14px}.changelog-item{gap:8px}.change-type{font-size:12px}.change-description{font-size:13px}}.uim-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);height:100vh;z-index:9998;animation:fadeIn .2s ease-out}.uim-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:16px;width:90%;max-width:500px;z-index:9999;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s cubic-bezier(.34,1.56,.64,1);overflow:hidden}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,-40%)}to{opacity:1;transform:translate(-50%,-50%)}}.uim-header{padding:24px 28px;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.uim-header-content{display:flex;align-items:center;gap:14px}.uim-icon{color:#fff;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.uim-header h3{margin:0;font-size:22px;font-weight:700;letter-spacing:-.5px}.uim-close-btn{background:#fff3;border:none;width:36px;height:36px;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;transition:all .2s;flex-shrink:0}.uim-close-btn:hover{background:#ffffff4d;transform:rotate(90deg)}.uim-close-btn:active{transform:rotate(90deg) scale(.95)}.uim-form{padding:28px;background:#fafafa}.uim-form-group{margin-bottom:24px}.uim-form-group:last-of-type{margin-bottom:0}.uim-form-group label{display:block;margin-bottom:10px;font-weight:600;color:#2c3e50;font-size:14px;letter-spacing:.3px}.uim-required{color:#e74c3c;margin-left:2px}.uim-input,.uim-input-disabled{width:100%;padding:14px 18px;border:2px solid #e0e0e0;border-radius:10px;font-size:15px;transition:all .3s;font-family:inherit;background:#fff;box-sizing:border-box}.uim-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 4px #667eea1a;transform:translateY(-1px)}.uim-input::placeholder{color:#bdc3c7}.uim-input-disabled{background:#ecf0f1;color:#7f8c8d;cursor:not-allowed;border-color:#dfe6e9}.uim-input[type=date]{position:relative;cursor:pointer}.uim-input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.6;transition:opacity .2s}.uim-input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}.uim-footer{display:flex;gap:12px;justify-content:flex-end;padding:24px 28px;border-top:1px solid #e0e0e0;background:#fff}.uim-btn-cancel,.uim-btn-submit{padding:12px 28px;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;letter-spacing:.3px;position:relative;overflow:hidden}.uim-btn-cancel{background:#ecf0f1;color:#34495e;border:2px solid transparent}.uim-btn-cancel:hover{background:#bdc3c7;transform:translateY(-1px)}.uim-btn-cancel:active{transform:translateY(0)}.uim-btn-submit{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 15px #667eea4d;position:relative}.uim-btn-submit:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#5568d3,#6a3e8c);opacity:0;transition:opacity .3s}.uim-btn-submit:hover:before{opacity:1}.uim-btn-submit:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.uim-btn-submit:active{transform:translateY(-1px)}.uim-btn-submit span{position:relative;z-index:1}@media (max-width: 768px){.uim-modal{width:95%;max-width:none;margin:10px}.uim-header{padding:20px}.uim-header h3{font-size:18px}.uim-form{padding:20px}.uim-footer{flex-direction:column-reverse;gap:10px;padding:20px}.uim-btn-cancel,.uim-btn-submit{width:100%;padding:14px 24px}}@media (max-width: 480px){.uim-modal{width:100%;max-height:90vh;overflow-y:auto}.uim-header,.uim-form{padding:18px}.uim-input,.uim-input-disabled{font-size:16px}}.uim-input:focus-visible,.uim-btn-cancel:focus-visible,.uim-btn-submit:focus-visible{outline:3px solid #667eea;outline-offset:2px}.uim-btn-submit:disabled{opacity:.6;cursor:not-allowed;transform:none!important}.uim-btn-submit:disabled:hover{box-shadow:0 4px 15px #667eea4d}.upm-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0009;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999;animation:fadeIn .2s ease-out}.upm-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:12px;box-shadow:0 20px 60px #0000004d;width:90%;max-width:550px;max-height:90vh;overflow-y:auto;z-index:1000;animation:slideUp .3s ease-out}@keyframes slideUp{0%{opacity:0;transform:translate(-50%,-45%)}to{opacity:1;transform:translate(-50%,-50%)}}.upm-header{display:flex;justify-content:space-between;align-items:center;padding:24px 24px 20px;border-bottom:2px solid #e5e7eb;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px 12px 0 0}.upm-header-content{display:flex;align-items:center;gap:12px;color:#fff}.upm-icon{background:#fff3;padding:8px;border-radius:8px}.upm-header h3{margin:0;font-size:20px;font-weight:600;color:#fff}.upm-close-btn{background:#fff3;border:none;color:#fff;width:32px;height:32px;border-radius:6px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}.upm-close-btn:hover:not(:disabled){background:#ffffff4d;transform:rotate(90deg)}.upm-close-btn:disabled{opacity:.5;cursor:not-allowed}.upm-form{padding:24px}.upm-info-box{background:linear-gradient(135deg,#f5f7fa,#e9ecef);border:1px solid #dee2e6;border-radius:10px;padding:16px;margin-bottom:24px}.upm-info-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #dee2e6}.upm-info-row:last-child{border-bottom:none}.upm-info-label{color:#6c757d;font-size:14px;font-weight:500}.upm-info-value{color:#212529;font-size:14px;font-weight:600}.upm-price{color:#667eea;font-size:16px}.upm-form-group{margin-bottom:20px}.upm-form-group label{display:block;font-weight:600;color:#374151;margin-bottom:8px;font-size:14px}.upm-required{color:#ef4444;margin-left:2px}.upm-input{width:100%;padding:12px 16px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .2s;font-family:inherit}.upm-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.upm-input:disabled{background-color:#f3f4f6;cursor:not-allowed;opacity:.6}.upm-input[type=date]{cursor:pointer}.upm-checkbox-group{margin-bottom:20px}.upm-checkbox-label{display:flex;align-items:center;gap:10px;cursor:pointer;padding:12px;border:2px solid #e5e7eb;border-radius:8px;transition:all .2s}.upm-checkbox-label:hover{background-color:#f9fafb;border-color:#667eea}.upm-checkbox{width:20px;height:20px;cursor:pointer;accent-color:#667eea}.upm-checkbox:disabled{cursor:not-allowed}.upm-checkbox-label span{font-weight:600;color:#374151;font-size:14px}.upm-warning{display:flex;align-items:flex-start;gap:10px;padding:12px;background-color:#fef3c7;border:1px solid #fbbf24;border-radius:8px;margin-bottom:20px;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.upm-warning svg{color:#f59e0b;flex-shrink:0;margin-top:2px}.upm-warning span{font-size:13px;color:#92400e;line-height:1.5}.upm-footer{display:flex;justify-content:flex-end;gap:12px;padding-top:20px;border-top:1px solid #e5e7eb}.upm-btn-cancel,.upm-btn-submit{padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;border:none}.upm-btn-cancel{background-color:#f3f4f6;color:#6b7280}.upm-btn-cancel:hover:not(:disabled){background-color:#e5e7eb}.upm-btn-submit{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.upm-btn-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 10px 20px #667eea4d}.upm-btn-cancel:disabled,.upm-btn-submit:disabled{opacity:.5;cursor:not-allowed;transform:none}@media (max-width: 640px){.upm-modal{width:95%;max-height:95vh}.upm-header{padding:20px 16px 16px}.upm-form{padding:20px 16px}.upm-info-row{flex-direction:column;gap:4px}.upm-footer{flex-direction:column-reverse}.upm-btn-cancel,.upm-btn-submit{width:100%}}.pb-container{padding:28px;background:#f8f9fa;height:100%;overflow:auto;margin-bottom:20px}.pb-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:24px;background:#fff;padding:20px 24px;border-radius:12px;box-shadow:0 2px 8px #00000014}.pb-header-left h2{margin:0 0 8px;font-size:24px;color:#1a1a1a;font-weight:600}.pb-header-info{display:flex;gap:16px;align-items:center;flex-wrap:wrap}.pb-header-actions{display:flex;align-items:center;gap:12px}.pb-import-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;padding:10px 20px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s ease;box-shadow:0 2px 8px #10b9814d}.pb-import-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b98166;background:linear-gradient(135deg,#059669,#047857)}.pb-import-btn:active{transform:translateY(0)}.pb-po-number{display:flex;align-items:center;gap:6px;padding:6px 12px;background:#e3f2fd;color:#1976d2;border-radius:6px;font-weight:600;font-size:14px}.pb-company-name{color:#666;font-size:14px}.pb-close-btn{background:#f5f5f5;border:none;width:36px;height:36px;border-radius:8px;cursor:pointer;font-size:20px;color:#666;display:flex;align-items:center;justify-content:center;transition:all .2s}.pb-close-btn:hover{background:#e0e0e0;color:#333}.pb-summary-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-bottom:24px}.pb-summary-card{background:#fff;padding:20px;border-radius:12px;display:flex;align-items:center;gap:16px;box-shadow:0 2px 8px #00000014;transition:transform .2s,box-shadow .2s}.pb-summary-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001f}.pb-card-icon{width:48px;height:48px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.pb-card-blue .pb-card-icon{background:#e3f2fd;color:#1976d2}.pb-card-purple .pb-card-icon{background:#f3e5f5;color:#7b1fa2}.pb-card-green .pb-card-icon{background:#e8f5e9;color:#388e3c}.pb-card-orange .pb-card-icon{background:#fff3e0;color:#f57c00}.pb-card-content{flex:1}.pb-card-label{font-size:13px;color:#666;margin-bottom:4px}.pb-card-value{font-size:20px;font-weight:700;color:#1a1a1a}.pb-table-container{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #00000014}.pb-table{width:100%;border-collapse:collapse}.pb-table thead{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.pb-table thead th{padding:16px 12px;text-align:left;font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:.5px}.pb-table tbody tr{border-bottom:1px solid #e0e0e0;transition:background-color .2s;cursor:pointer}.pb-table tbody tr:hover{background-color:#f5f5f5}.pb-table tbody td{padding:14px 12px;font-size:14px;color:#333}.pb-row-expanded{background-color:#f8f9fa!important}.text-center{text-align:center}.text-right{text-align:right}.pb-text-success{color:#388e3c;font-weight:600}.pb-text-warning{color:#f57c00;font-weight:600}.pb-text-muted{color:#999;font-style:italic}.pb-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:600}.pb-badge-primary{background:#e3f2fd;color:#1976d2}.pb-badge-info{background:#e0f2f1;color:#00796b}.pb-status{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:13px;font-weight:600}.pb-status-success{background:#e8f5e9;color:#388e3c}.pb-status-pending{background:#fff3e0;color:#f57c00}.pb-action-buttons{display:flex;gap:8px;justify-content:center}.pb-action-btn{width:36px;height:36px;border:none;border-radius:8px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}.pb-btn-invoice{background:#e3f2fd;color:#1976d2}.pb-btn-invoice:hover{background:#1976d2;color:#fff;transform:scale(1.05)}.pb-btn-payment{background:#e8f5e9;color:#388e3c}.pb-btn-payment:hover{background:#388e3c;color:#fff;transform:scale(1.05)}.pb-expanded-row td{padding:0!important;background:#f8f9fa}.pb-expanded-content{padding:24px;animation:expandRow .3s ease-out}@keyframes expandRow{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.pb-expanded-content h4{margin:0 0 16px;font-size:16px;color:#333;display:flex;align-items:center;gap:8px}.pb-items-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}.pb-item-card{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:12px;transition:all .2s}.pb-item-card:hover{border-color:#667eea;box-shadow:0 2px 8px #667eea26}.pb-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.pb-item-sn{background:#f5f5f5;padding:4px 8px;border-radius:4px;font-size:12px;font-family:Courier New,monospace;color:#333}.pb-item-status{padding:3px 8px;border-radius:10px;font-size:11px;font-weight:600}.pb-item-status-paid{background:#e8f5e9;color:#388e3c}.pb-item-status-unpaid{background:#fff3e0;color:#f57c00}.pb-item-spec{font-size:13px;color:#666;margin-bottom:8px;line-height:1.4}.pb-item-price{font-size:16px;font-weight:700;color:#1a1a1a;display:flex;align-items:baseline;gap:4px}.pb-item-price-label{font-size:11px;color:#999;font-weight:400}.pb-item-date{font-size:12px;color:#388e3c;margin-top:6px}.pb-no-data{text-align:center;padding:48px 20px!important;color:#999;font-style:italic}.pb-loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:16px}.pb-spinner{width:48px;height:48px;border:4px solid #f3f3f3;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite}.pb-loading-container p{color:#666;font-size:14px}.pb-error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:16px;text-align:center}.pb-error-icon{color:#f44336}.pb-error-container h3{margin:0;color:#333;font-size:20px}.pb-error-container p{color:#666;margin:0;max-width:500px}.pb-retry-btn{padding:10px 24px;background:#667eea;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;transition:background .2s}.pb-retry-btn:hover{background:#5568d3}@media (max-width: 1200px){.pb-summary-cards{grid-template-columns:repeat(2,1fr)}}@media (max-width: 768px){.pb-container{padding:16px}.pb-header{flex-direction:column;gap:16px}.pb-summary-cards{grid-template-columns:1fr}.pb-table-container{overflow-x:auto}.pb-table{min-width:1000px}.pb-items-grid{grid-template-columns:1fr}}.idsb-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px;animation:idsb-fadeIn .2s ease-out}@keyframes idsb-fadeIn{0%{opacity:0}to{opacity:1}}.idsb-modal{background:#fff;border-radius:12px;width:100%;max-width:900px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px #0000004d;animation:idsb-slideUp .3s ease-out}@keyframes idsb-slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.idsb-header{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;border-bottom:2px solid #e5e7eb;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:12px 12px 0 0}.idsb-header-left{display:flex;align-items:center;gap:16px}.idsb-header-icon{background:#fff3;padding:10px;border-radius:10px}.idsb-header h2{margin:0;font-size:22px;font-weight:700}.idsb-subtitle{margin:4px 0 0;font-size:14px;opacity:.9;font-weight:400}.idsb-close-btn{background:#fff3;border:none;width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;transition:all .2s}.idsb-close-btn:hover:not(:disabled){background:#ffffff4d;transform:scale(1.05)}.idsb-close-btn:disabled{opacity:.5;cursor:not-allowed}.idsb-content{padding:28px;overflow-y:auto;flex:1}.idsb-template-section{margin-bottom:24px}.idsb-info-box{background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;padding:16px;display:flex;gap:12px;color:#1e40af;margin-bottom:16px;line-height:1.6}.idsb-info-box svg{flex-shrink:0;margin-top:2px}.idsb-download-btn{background:linear-gradient(135deg,#10b981,#059669);color:#fff;border:none;margin:0 auto;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s;box-shadow:0 2px 8px #10b9814d}.idsb-download-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #10b98166}.idsb-upload-section{margin-bottom:24px}.idsb-upload-area{border:2px dashed #cbd5e1;border-radius:12px;padding:40px;text-align:center;cursor:pointer;transition:all .3s;background:#f8fafc;display:flex;flex-direction:column;align-items:center;gap:12px}.idsb-upload-area:hover{border-color:#667eea;background:#f1f5f9}.idsb-upload-area svg{color:#667eea;opacity:.7}.idsb-upload-text{font-size:16px;font-weight:600;color:#334155;margin:0}.idsb-upload-hint{font-size:13px;color:#64748b;margin:0}.idsb-error-box{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:16px;display:flex;gap:12px;color:#991b1b;margin-bottom:24px}.idsb-error-box svg{flex-shrink:0;margin-top:2px}.idsb-error-list{margin:8px 0 0;padding-left:20px}.idsb-error-list li{margin:4px 0;font-size:13px}.idsb-preview-section{margin-top:24px}.idsb-preview-section h3{margin:0 0 16px;font-size:18px;font-weight:600;color:#1e293b}.idsb-table-container{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden;max-height:400px;overflow-y:auto}.idsb-table{width:100%;border-collapse:collapse;font-size:14px}.idsb-table thead{background:#f8fafc;position:sticky;top:0;z-index:10}.idsb-table th{padding:12px 16px;text-align:left;font-weight:600;color:#475569;border-bottom:2px solid #e5e7eb;white-space:nowrap}.idsb-table td{padding:12px 16px;border-bottom:1px solid #f1f5f9;color:#334155}.idsb-table tbody tr:hover{background:#f8fafc}.idsb-table tbody tr:last-child td{border-bottom:none}.idsb-badge{display:inline-block;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600}.idsb-badge-blue{background:#dbeafe;color:#1e40af}.idsb-status{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:6px;font-size:12px;font-weight:600}.idsb-status-success{background:#d1fae5;color:#065f46}.idsb-status-pending{background:#fef3c7;color:#92400e}.idsb-text-error{color:#dc2626;font-style:italic}.idsb-footer{padding:20px 28px;border-top:2px solid #e5e7eb;display:flex;justify-content:flex-end;gap:12px;background:#f8fafc;border-radius:0 0 12px 12px}.idsb-btn{padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;border:none;transition:all .2s;display:flex;align-items:center;gap:8px}.idsb-btn-cancel{background:#f1f5f9;color:#475569}.idsb-btn-cancel:hover:not(:disabled){background:#e2e8f0}.idsb-btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 2px 8px #667eea4d}.idsb-btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.idsb-btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}@media (max-width: 768px){.idsb-modal{max-width:100%;max-height:100vh;border-radius:0}.idsb-header{border-radius:0}.idsb-content{padding:20px}.idsb-table-container{overflow-x:auto}.idsb-footer{border-radius:0}}.idsb-file-info-card{background:linear-gradient(135deg,#f0f9ff,#e0f2fe);border:2px solid #bae6fd;border-radius:12px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;box-shadow:0 2px 8px #0ea5e91a;animation:idsb-slideIn .3s ease-out}@keyframes idsb-slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.idsb-file-info-left{display:flex;align-items:center;gap:16px;flex:1;min-width:0}.idsb-file-icon{background:linear-gradient(135deg,#0ea5e9,#0284c7);color:#fff;width:48px;height:48px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.idsb-file-details{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.idsb-file-name{font-size:15px;font-weight:600;color:#0c4a6e;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.idsb-file-metadata{display:flex;align-items:center;gap:8px;font-size:13px;color:#075985}.idsb-file-type{font-weight:500}.idsb-file-separator{color:#0891b2}.idsb-file-size{font-weight:500}.idsb-remove-file-btn{background:transparent;border:none;color:#dc2626;width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;flex-shrink:0}.idsb-remove-file-btn:hover:not(:disabled){background:#fef2f2}.idsb-remove-file-btn:disabled{opacity:.5;cursor:not-allowed}.idsb-upload-area-dragging{border-color:#667eea!important;background:#eff6ff!important;transform:scale(1.02);box-shadow:0 4px 12px #667eea33}.gpim-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:9998;animation:fadeIn .2s ease-out}.gpim-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:12px;width:90%;max-width:550px;z-index:9999;box-shadow:0 10px 40px #0003}.gpim-header{padding:20px 24px;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff;border-radius:12px 12px 0 0}.gpim-header-content{display:flex;align-items:center;gap:12px}.gpim-icon{color:#fff}.gpim-header h3{margin:0;font-size:20px;font-weight:600}.gpim-close-btn{background:#fff3;border:none;width:32px;height:32px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;transition:background .2s}.gpim-close-btn:hover{background:#ffffff4d}.gpim-form{padding:24px}.gpim-alert{display:flex;align-items:flex-start;gap:12px;padding:16px;background:#fff3e0;border-left:4px solid #ff9800;border-radius:8px;margin-bottom:24px}.gpim-alert svg{color:#f57c00;flex-shrink:0;margin-top:2px}.gpim-alert strong{display:block;color:#e65100;margin-bottom:4px;font-size:14px}.gpim-alert p{margin:0;font-size:13px;color:#ef6c00;line-height:1.5}.gpim-form-group{margin-bottom:20px}.gpim-form-group label{display:block;margin-bottom:8px;font-weight:600;color:#333;font-size:14px}.gpim-required{color:#f44336}.gpim-input-disabled{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;background:#f5f5f5;color:#999;cursor:not-allowed;font-family:inherit}.gpim-select{width:100%;padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;transition:border-color .2s;font-family:inherit;cursor:pointer;background:#fff}.gpim-select:focus{outline:none;border-color:#f5576c}.gpim-loading{padding:12px 16px;background:#f5f5f5;border-radius:8px;color:#666;text-align:center;font-size:14px}.gpim-footer{display:flex;gap:12px;justify-content:flex-end;padding-top:20px;border-top:1px solid #e0e0e0}.gpim-btn-cancel,.gpim-btn-submit{padding:10px 24px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s}.gpim-btn-cancel{background:#f5f5f5;color:#666}.gpim-btn-cancel:hover{background:#e0e0e0}.gpim-btn-submit{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.gpim-btn-submit:hover{transform:translateY(-1px);box-shadow:0 4px 12px #f5576c66}.gpim-btn-submit:disabled{opacity:.6;cursor:not-allowed;transform:none}@media (max-width: 768px){.gpim-modal{width:95%}.gpim-form{padding:20px}.gpim-footer{flex-direction:column-reverse}.gpim-btn-cancel,.gpim-btn-submit{width:100%}}.po-internal-container{width:100%;margin:0 auto}.po-page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:10px 30px;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;border-radius:10px;box-shadow:0 4px 6px #0000001a}.po-page-header h1{margin:0;font-size:28px;font-weight:600}.po-header-stats{display:flex;gap:20px}.po-stat-item{background:#bdbbe46c;padding:16px 20px;border-radius:20px;font-size:14px;color:#fff}.po-stat-item strong{font-size:18px;font-weight:700;color:#fff}.po-card{background:#fff;border-radius:10px;box-shadow:0 2px 8px #0000001a;overflow:hidden}.po-card-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e5e7eb;background:#f9fafb}.search-container{position:relative;flex:1;max-width:500px}.po-search-input{width:100%;padding:10px 40px 10px 15px;border:2px solid #e5e7eb;border-radius:8px;font-size:14px;transition:all .3s}.po-search-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.clear-search{position:relative;left:87%;top:-37px;background:none;border:none;color:#9ca3af;cursor:pointer;font-size:18px;padding:5px}.clear-search:hover{color:#ef4444}.refresh-btn{padding:10px 20px;background:#667eea;color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .3s}.refresh-btn:hover{background:#5568d3;transform:translateY(-2px);box-shadow:0 4px 12px #667eea66}.po-table-container{height:100%}.po-data-table{width:100%;border-collapse:collapse;font-size:14px}.po-data-table thead{background:#f3f4f6;position:sticky;top:0;z-index:10}.po-data-table th{padding:12px 16px;text-align:left;font-weight:600;color:#374151;border-bottom:2px solid #e5e7eb;white-space:nowrap}.po-data-table td{padding:12px 16px;border-bottom:1px solid #e5e7eb;vertical-align:middle}.po-data-table tbody tr.po-row{transition:all .2s}.po-data-table tbody tr.po-row:hover{background:#f9fafb}.text-center{text-align:center!important}.text-right{text-align:right!important}.badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:600}.badge-info{background:#dbeafe;color:#1e40af}.detail-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:13px;font-weight:600;transition:all .3s;box-shadow:0 2px 4px #667eea4d}.detail-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px #667eea80}.detail-btn:active{transform:translateY(0)}.no-po-data{text-align:center;padding:40px!important;color:#9ca3af;font-size:14px}.pagination-container{display:flex;justify-content:space-between;align-items:center;padding:20px;border-top:1px solid #e5e7eb;flex-wrap:wrap;gap:15px}.table-controls{display:flex;align-items:center;gap:10px;font-size:14px}.table-controls select{padding:6px 12px;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer}.pagination-info{font-size:14px;color:#6b7280}.pagination-controls{display:flex;align-items:center;gap:8px}.pagination-btn{padding:8px 12px;background:#fff;color:#374151;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;font-size:13px;transition:all .2s}.pagination-btn:hover:not(:disabled){background:#f3f4f6;border-color:#667eea;color:#667eea}.page-numbers{display:flex;gap:5px}.page-btn{padding:8px 12px;background:#fff;border:1px solid #e5e7eb;color:#667eea;border-radius:6px;cursor:pointer;font-size:13px;transition:all .2s}.page-btn:hover{background:#f3f4f6;border-color:#667eea}.page-btn.active{background:#667eea;color:#fff;border-color:#667eea}.ellipsis{padding:8px 5px;color:#9ca3af}.loading-container,.error-container{display:flex;justify-content:center;align-items:center;min-height:400px;flex-direction:column}.spinner{width:50px;height:50px;border:4px solid #f3f4f6;border-top-color:#667eea;border-radius:50%;animation:spin 1s linear infinite}.loading-container p{margin-top:15px;color:#6b7280;font-size:14px}.error-message{text-align:center;padding:30px;background:#fee;border:1px solid #fcc;border-radius:8px;max-width:500px}.error-message h3{color:#dc2626;margin-bottom:10px}.error-message p{color:#991b1b;margin-bottom:20px}.retry-btn{padding:10px 20px;background:#ef4444;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:500;transition:all .2s}.retry-btn:hover{background:#dc2626}.po-int-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:999;opacity:0;transition:opacity .3s ease}.po-int-modal-overlay-active{opacity:1}.po-int-modal{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.9);background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;z-index:1000;width:95%;max-width:1400px;max-height:90vh;display:flex;flex-direction:column;opacity:0;transition:all .3s cubic-bezier(.4,0,.2,1)}.po-int-modal-active{opacity:1;transform:translate(-50%,-50%) scale(1)}.po-int-modal-header{display:flex;justify-content:space-between;align-items:flex-start;padding:24px 28px;border-bottom:2px solid #e5e7eb;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:16px 16px 0 0}.po-int-modal-header h2{margin:0;font-size:24px;font-weight:700}.po-int-modal-subtitle{margin:6px 0 0;font-size:15px;opacity:.95;font-weight:400}.po-int-modal-close{background:#fff3;border:none;color:#fff;width:36px;height:36px;border-radius:50%;cursor:pointer;font-size:20px;display:flex;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0;margin-left:20px}.po-int-modal-close:hover{background:#ffffff4d;transform:rotate(90deg)}.po-int-modal-body{padding:24px 28px;overflow-y:auto;flex:1;background:#f9fafb}.po-int-modal-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}.po-int-modal-stat-card{background:#fff;padding:20px;border-radius:12px;box-shadow:0 2px 8px #00000014;border-left:4px solid #667eea;transition:all .3s}.po-int-modal-stat-card:hover{transform:translateY(-4px);box-shadow:0 6px 16px #667eea33}.po-int-modal-stat-label{font-size:13px;color:#6b7280;font-weight:500;margin-bottom:8px;text-transform:uppercase;letter-spacing:.5px}.po-int-modal-stat-value{font-size:24px;font-weight:700;color:#667eea}.po-int-modal-table-wrapper{background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #00000014}.po-int-modal-table{width:100%;border-collapse:collapse;font-size:13px}.po-int-modal-table thead{background:linear-gradient(135deg,#667eea,#764ba2)}.po-int-modal-table th{padding:14px 12px;text-align:left;font-weight:600;color:#fff;white-space:nowrap;font-size:13px;text-transform:uppercase;letter-spacing:.5px}.po-int-modal-table td{padding:14px 12px;border-bottom:1px solid #e5e7eb;vertical-align:middle}.po-int-modal-table tbody tr{transition:all .2s}.po-int-modal-table tbody tr:hover{background:#f3f4f6}.po-int-modal-table tbody tr:last-child td{border-bottom:none}.po-int-modal-code{background:linear-gradient(135deg,#667eea15,#764ba215);padding:6px 10px;border-radius:6px;font-family:Courier New,monospace;font-size:12px;color:#667eea;font-weight:600;border:1px solid #667eea30}.po-int-modal-spec{max-width:350px;white-space:normal;word-wrap:break-word;line-height:1.5;color:#374151}.po-int-modal-date-range{display:flex;flex-direction:column;gap:6px}.po-int-modal-date-item{font-size:12px;color:#6b7280;display:flex;gap:6px}.po-int-modal-date-item strong{color:#374151;min-width:45px}.po-int-modal-footer{padding:20px 28px;border-top:2px solid #e5e7eb;display:flex;justify-content:flex-end;background:#fff;border-radius:0 0 16px 16px}.po-int-modal-btn-close{padding:12px 32px;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:15px;font-weight:600;transition:all .3s;box-shadow:0 4px 12px #667eea4d}.po-int-modal-btn-close:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea80}.po-int-modal-btn-close:active{transform:translateY(0)}.po-action-grid{display:grid;grid-auto-flow:row;grid-template-columns:repeat(3,1fr);gap:8px;padding:8px;width:160px;margin:0 auto}.po-action-btn{width:45px;height:45px;border:none;border-radius:8px;color:#fff;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 4px #0000001a;position:relative}.po-action-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026;z-index:1001}.po-action-btn:focus{outline:none}.po-action-btn:active{transform:translateY(0)}.po-action-btn:nth-child(4){grid-column:1}.po-action-btn-green{background:#10b981}.po-action-btn-green:hover{background:#059669}.po-action-btn-yellow{background:#f59e0b}.po-action-btn-yellow:hover{background:#d97706}.po-action-btn-red{background:#ef4444}.po-action-btn-red:hover{background:#dc2626}.po-action-btn-pink{background:#ec4899}.po-action-btn-pink:hover{background:#db2777}.po-action-btn-purple{background:#8b5cf6}.po-action-btn:before{content:attr(data-tooltip);position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(-8px);background:#1f2937;color:#fff;padding:8px 12px;border-radius:6px;font-size:12px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease;z-index:1002;font-weight:500;box-shadow:0 4px 12px #00000026}.po-action-btn:after{content:"";position:absolute;bottom:100%;left:50%;transform:translate(-50%) translateY(0);border:6px solid transparent;border-top-color:#1f2937;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .3s ease;z-index:1002}.po-action-btn:hover:before{opacity:1;transform:translate(-50%) translateY(-12px)}.po-action-btn:hover:after{opacity:1;transform:translate(-50%) translateY(-4px)}.po-data-table td{position:relative;overflow:visible}.po-data-table tr{position:relative}.po-data-table tbody tr:hover{z-index:10}@media (max-width: 768px){.page-header{flex-direction:column;gap:15px;text-align:center}.header-stats{flex-direction:column;gap:10px}.card-header{flex-direction:column;gap:15px}.search-container{max-width:100%}.pagination-container{flex-direction:column;align-items:stretch}.pagination-controls{flex-wrap:wrap;justify-content:center}.po-int-modal{width:98%;max-height:95vh;border-radius:12px}.po-int-modal-header{padding:18px 20px;border-radius:12px 12px 0 0}.po-int-modal-header h2{font-size:20px}.po-int-modal-body{padding:18px 20px}.po-int-modal-stats{grid-template-columns:1fr}.po-int-modal-table-wrapper{overflow-x:auto}.po-int-modal-table{font-size:12px}.po-int-modal-table th,.po-int-modal-table td{padding:10px 8px}.po-int-modal-footer{padding:16px 20px}.po-int-modal-btn-close{width:100%}}.po-int-modal-body::-webkit-scrollbar{width:8px}.po-int-modal-body::-webkit-scrollbar-track{background:#f1f1f1;border-radius:10px}.po-int-modal-body::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px}.po-int-modal-body::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#5568d3,#653a8a)}.po-int-modal-table-wrapper::-webkit-scrollbar{height:8px}.po-int-modal-table-wrapper::-webkit-scrollbar-track{background:#f1f1f1}.po-int-modal-table-wrapper::-webkit-scrollbar-thumb{background:#667eea;border-radius:10px}.po-int-modal-table-wrapper::-webkit-scrollbar-thumb:hover{background:#5568d3}.perpanjangan-sewa-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:9999;padding:20px;animation:fadeIn .2s ease-in-out}.perpanjangan-sewa-modal{background:#fff;border-radius:12px;width:100%;max-width:900px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 10px 40px #0003;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.perpanjangan-sewa-header{display:flex;justify-content:space-between;align-items:center;padding:24px 30px;border-bottom:1px solid #e5e7eb}.perpanjangan-sewa-title{margin:0;font-size:24px;font-weight:600;color:#111827}.perpanjangan-sewa-close{background:none;border:none;font-size:32px;color:#6b7280;cursor:pointer;padding:0;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s}.perpanjangan-sewa-close:hover{background-color:#f3f4f6;color:#111827}.perpanjangan-sewa-body{padding:30px;overflow-y:auto;flex:1}.perpanjangan-sewa-description{margin:0 0 24px;color:#6b7280;font-size:15px;line-height:1.6}.perpanjangan-sewa-type-selection{padding:10px 0}.perpanjangan-sewa-type-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin-top:10px}.perpanjangan-sewa-type-card{border:2px solid #e5e7eb;border-radius:12px;padding:30px 24px;cursor:pointer;transition:all .3s;text-align:center;background:#fff}.perpanjangan-sewa-type-card:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.perpanjangan-sewa-type-icon{font-size:48px;margin-bottom:16px}.perpanjangan-sewa-type-name{margin:0 0 12px;font-size:20px;font-weight:600;color:#111827}.perpanjangan-sewa-type-desc{margin:0;color:#6b7280;font-size:14px;line-height:1.5}.perpanjangan-sewa-po-selection{padding:10px 0}.perpanjangan-sewa-po-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:16px;margin-bottom:24px}.perpanjangan-sewa-po-card{border:2px solid #e5e7eb;border-radius:12px;padding:20px;transition:all .3s;background:#fff}.perpanjangan-sewa-po-card:hover{border-color:#3b82f6;box-shadow:0 4px 16px #3b82f61a;transform:translateY(-2px)}.perpanjangan-sewa-po-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid #e5e7eb}.perpanjangan-sewa-po-number{font-size:18px;font-weight:600;color:#3b82f6}.perpanjangan-sewa-po-select-btn{background:#3b82f6;color:#fff;border:none;padding:8px 20px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;font-family:inherit}.perpanjangan-sewa-po-select-btn:hover{background:#2563eb;box-shadow:0 2px 8px #2563eb4d;transform:translateY(-1px)}.perpanjangan-sewa-po-info{display:flex;flex-direction:column;gap:10px}.perpanjangan-sewa-po-customer{color:#111827;font-size:15px;font-weight:500;display:flex;flex-direction:column;gap:4px}.perpanjangan-sewa-po-label{font-size:12px;color:#6b7280;font-weight:400;text-transform:uppercase;letter-spacing:.5px}.perpanjangan-sewa-po-stats{display:flex;flex-direction:column;gap:6px}.perpanjangan-sewa-po-stat{color:#6b7280;font-size:13px;display:flex;align-items:center;gap:4px}.perpanjangan-sewa-po-stat strong{color:#059669;font-weight:600}.perpanjangan-sewa-empty{grid-column:1 / -1;text-align:center;padding:60px 20px;color:#6b7280;font-size:15px}.perpanjangan-sewa-empty p{margin:0}.perpanjangan-sewa-info-box{background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;padding:16px 20px;margin-bottom:24px;font-size:14px;line-height:1.8;color:#1e40af}.perpanjangan-sewa-info-box strong{color:#1e3a8a}.perpanjangan-sewa-form{padding:10px 0}.perpanjangan-sewa-form-fields{display:flex;flex-direction:column;gap:20px;margin-bottom:30px}.perpanjangan-sewa-form-group{display:flex;flex-direction:column;gap:8px}.perpanjangan-sewa-label{font-size:14px;font-weight:500;color:#374151}.perpanjangan-sewa-input{padding:12px 16px;border:1px solid #d1d5db;border-radius:8px;font-size:15px;transition:all .2s;font-family:inherit}.perpanjangan-sewa-input:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.perpanjangan-sewa-input-small{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:13px;font-family:inherit;width:100%;max-width:200px}.perpanjangan-sewa-input-small:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.perpanjangan-sewa-items-section{margin-bottom:24px}.perpanjangan-sewa-section-title{margin:0 0 20px;font-size:18px;font-weight:600;color:#111827}.perpanjangan-sewa-po-group{margin-bottom:24px;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden}.perpanjangan-sewa-po-group-header{background:#f9fafb;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e5e7eb}.perpanjangan-sewa-po-group-count{background:#3b82f6;color:#fff;padding:4px 12px;border-radius:12px;font-size:13px;font-weight:500}.perpanjangan-sewa-items-list{padding:12px;display:flex;flex-direction:column;gap:12px}.perpanjangan-sewa-item-card{display:flex;align-items:center;gap:16px;padding:16px;border:2px solid #e5e7eb;border-radius:8px;transition:all .2s;background:#fff}.perpanjangan-sewa-item-card:hover{border-color:#d1d5db;box-shadow:0 2px 8px #0000000d}.perpanjangan-sewa-item-selected{border-color:#3b82f6;background-color:#eff6ff}.perpanjangan-sewa-item-checkbox{flex-shrink:0}.perpanjangan-sewa-item-checkbox input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:#3b82f6}.perpanjangan-sewa-item-info{flex:1;display:flex;flex-direction:column;gap:6px}.perpanjangan-sewa-item-name{font-size:15px;font-weight:600;color:#111827}.perpanjangan-sewa-item-sn{font-size:13px;color:#6b7280;font-family:Courier New,monospace}.perpanjangan-sewa-item-price{font-size:14px;color:#059669;font-weight:500}.perpanjangan-sewa-replacement{flex-shrink:0;display:flex;flex-direction:column;align-items:flex-end}.perpanjangan-sewa-selected-summary{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:8px;padding:12px 20px;text-align:center;color:#166534;font-size:15px;margin-bottom:24px}.perpanjangan-sewa-selected-summary strong{font-size:18px;color:#15803d}.perpanjangan-sewa-confirm{padding:10px 0}.perpanjangan-sewa-confirm-box{background:#f9fafb;border:1px solid #e5e7eb;border-radius:10px;padding:24px;margin-bottom:24px}.perpanjangan-sewa-confirm-title{margin:0 0 20px;font-size:18px;font-weight:600;color:#111827;padding-bottom:16px;border-bottom:2px solid #e5e7eb}.perpanjangan-sewa-confirm-section{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #e5e7eb;font-size:15px}.perpanjangan-sewa-confirm-section:last-of-type{border-bottom:none}.perpanjangan-sewa-confirm-section strong{color:#374151;font-weight:600}.perpanjangan-sewa-confirm-section span{color:#111827;font-weight:500}.perpanjangan-sewa-confirm-items{margin-top:20px;padding-top:20px;border-top:2px solid #e5e7eb}.perpanjangan-sewa-confirm-items strong{display:block;margin-bottom:12px;color:#374151;font-size:15px;font-weight:600}.perpanjangan-sewa-confirm-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}.perpanjangan-sewa-confirm-list li{padding:10px 16px;background:#fff;border:1px solid #e5e7eb;border-radius:6px;font-size:14px;color:#374151}.perpanjangan-sewa-replacement-info{color:#3b82f6;font-weight:500}.perpanjangan-sewa-success{text-align:center;padding:40px 20px}.perpanjangan-sewa-success-icon{width:80px;height:80px;background:#10b981;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 24px;font-size:48px;color:#fff;animation:scaleIn .4s ease-out}@keyframes scaleIn{0%{transform:scale(0)}to{transform:scale(1)}}.perpanjangan-sewa-success-title{margin:0 0 24px;font-size:24px;font-weight:600;color:#111827}.perpanjangan-sewa-success-info{background:#f0fdf4;border:1px solid #bbf7d0;border-radius:10px;padding:24px;margin-bottom:30px;text-align:left}.perpanjangan-sewa-success-info p{margin:0 0 12px;font-size:15px;color:#166534;line-height:1.6}.perpanjangan-sewa-success-info p:last-child{margin-bottom:0}.perpanjangan-sewa-success-info strong{color:#15803d;font-weight:600}.perpanjangan-sewa-mode-toggle{display:flex;gap:12px;margin-bottom:24px;padding:4px;background:#f3f4f6;border-radius:8px}.perpanjangan-sewa-mode-btn{flex:1;padding:12px 20px;border:none;background:transparent;border-radius:6px;font-size:15px;font-weight:500;color:#6b7280;cursor:pointer;transition:all .2s;font-family:inherit}.perpanjangan-sewa-mode-btn.active{background:#fff;color:#3b82f6;box-shadow:0 2px 4px #0000000d}.perpanjangan-sewa-mode-btn:hover:not(.active){color:#374151}.perpanjangan-sewa-import-section{background:#f9fafb;border:1px solid #e5e7eb;border-radius:10px;padding:24px;margin-bottom:24px}.perpanjangan-sewa-import-instructions{background:#eff6ff;border:1px solid #bfdbfe;border-radius:8px;padding:16px 20px;margin-bottom:20px}.perpanjangan-sewa-import-instructions h4{margin:0 0 12px;color:#1e40af;font-size:16px}.perpanjangan-sewa-import-instructions ol{margin:0;padding-left:20px;color:#1e40af}.perpanjangan-sewa-import-instructions li{margin:6px 0;font-size:14px}.perpanjangan-sewa-import-actions{display:flex;justify-content:center;margin:16px 0}.perpanjangan-sewa-btn-download{background:#10b981;color:#fff;padding:12px 24px;border:none;border-radius:8px;font-size:15px;font-weight:500;cursor:pointer;transition:all .2s;font-family:inherit}.perpanjangan-sewa-btn-download:hover:not(:disabled){background:#059669;box-shadow:0 4px 12px #10b9814d}.perpanjangan-sewa-import-upload{margin:20px 0}.perpanjangan-sewa-upload-label{display:block;cursor:pointer}.perpanjangan-sewa-upload-input{display:none}.perpanjangan-sewa-upload-area{border:2px dashed #d1d5db;border-radius:10px;padding:40px 20px;text-align:center;background:#fff;transition:all .3s}.perpanjangan-sewa-upload-area:hover{border-color:#3b82f6;background:#f0f9ff}.perpanjangan-sewa-upload-icon{font-size:48px;margin-bottom:16px}.perpanjangan-sewa-upload-text{display:flex;flex-direction:column;gap:8px}.perpanjangan-sewa-upload-text strong{color:#111827;font-size:16px}.perpanjangan-sewa-upload-text span{color:#6b7280;font-size:14px}.perpanjangan-sewa-upload-text small{color:#9ca3af;font-size:12px}.perpanjangan-sewa-file-icon{font-size:48px;margin-bottom:12px}.perpanjangan-sewa-file-info{display:flex;flex-direction:column;gap:6px}.perpanjangan-sewa-file-info strong{color:#111827;font-size:16px}.perpanjangan-sewa-file-info span{color:#6b7280;font-size:14px}.perpanjangan-sewa-file-summary{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:16px;margin-bottom:20px;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}.perpanjangan-sewa-file-summary-item{display:flex;flex-direction:column;gap:4px}.perpanjangan-sewa-file-summary-item strong{font-size:13px;color:#6b7280}.perpanjangan-sewa-file-summary-item span{font-size:16px;color:#111827;font-weight:600}.perpanjangan-sewa-text-success{color:#059669!important}.perpanjangan-sewa-text-error{color:#dc2626!important}.perpanjangan-sewa-errors{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:16px 20px;margin-bottom:20px}.perpanjangan-sewa-errors-title{margin:0 0 12px;color:#991b1b;font-size:15px}.perpanjangan-sewa-errors-list{display:flex;flex-direction:column;gap:12px}.perpanjangan-sewa-error-item{background:#fff;border:1px solid #fca5a5;border-radius:6px;padding:12px}.perpanjangan-sewa-error-item strong{display:block;margin-bottom:8px;color:#991b1b;font-size:14px}.perpanjangan-sewa-error-item ul{margin:0;padding-left:20px;color:#dc2626}.perpanjangan-sewa-error-item li{margin:4px 0;font-size:13px}.perpanjangan-sewa-preview-title{margin:20px 0 12px;color:#111827;font-size:16px;font-weight:600}.perpanjangan-sewa-preview-table-wrapper{overflow-x:auto;border:1px solid #e5e7eb;border-radius:8px;margin-bottom:20px}.perpanjangan-sewa-preview-table{width:100%;border-collapse:collapse;font-size:13px;background:#fff}.perpanjangan-sewa-preview-table thead{background:#f9fafb;border-bottom:2px solid #e5e7eb}.perpanjangan-sewa-preview-table th{padding:12px 16px;text-align:left;font-weight:600;color:#374151;white-space:nowrap}.perpanjangan-sewa-preview-table td{padding:12px 16px;border-bottom:1px solid #f3f4f6;color:#111827}.perpanjangan-sewa-preview-table tbody tr:hover{background:#f9fafb}.perpanjangan-sewa-preview-table code{background:#f3f4f6;padding:2px 6px;border-radius:4px;font-family:Courier New,monospace;font-size:12px}.perpanjangan-sewa-success-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:16px;margin-bottom:24px}.perpanjangan-sewa-success-stat-card{background:#f3f4f6;border-radius:10px;padding:20px;text-align:center}.perpanjangan-sewa-stat-success{background:#d1fae5;border:2px solid #6ee7b7}.perpanjangan-sewa-stat-error{background:#fee2e2;border:2px solid #fca5a5}.perpanjangan-sewa-stat-number{font-size:32px;font-weight:700;color:#111827;margin-bottom:4px}.perpanjangan-sewa-stat-label{font-size:13px;color:#6b7280;font-weight:500}.perpanjangan-sewa-stat-success .perpanjangan-sewa-stat-number{color:#059669}.perpanjangan-sewa-stat-error .perpanjangan-sewa-stat-number{color:#dc2626}.perpanjangan-sewa-success-list,.perpanjangan-sewa-failed-list{margin-top:16px;text-align:left}.perpanjangan-sewa-success-list strong,.perpanjangan-sewa-failed-list strong{display:block;margin-bottom:8px;color:#374151}.perpanjangan-sewa-success-list ul,.perpanjangan-sewa-failed-list ul{margin:0;padding-left:20px;max-height:200px;overflow-y:auto}.perpanjangan-sewa-success-list li{margin:6px 0;color:#059669;font-size:14px}.perpanjangan-sewa-failed-list{background:#fef2f2;border:1px solid #fecaca;border-radius:8px;padding:16px}.perpanjangan-sewa-failed-list li{margin:8px 0;color:#dc2626;font-size:14px}.perpanjangan-sewa-failed-list small{color:#991b1b;font-size:12px}.perpanjangan-sewa-actions{display:flex;gap:12px;justify-content:flex-end}.perpanjangan-sewa-btn{padding:12px 24px;border-radius:8px;font-size:15px;font-weight:500;cursor:pointer;transition:all .2s;border:none;font-family:inherit}.perpanjangan-sewa-btn:disabled{opacity:.5;cursor:not-allowed}.perpanjangan-sewa-btn-primary{background:#3b82f6;color:#fff}.perpanjangan-sewa-btn-primary:hover:not(:disabled){background:#2563eb;box-shadow:0 4px 12px #2563eb4d}.perpanjangan-sewa-btn-secondary{background:#f3f4f6;color:#374151}.perpanjangan-sewa-btn-secondary:hover:not(:disabled){background:#e5e7eb}.perpanjangan-sewa-loading{text-align:center;padding:60px 20px;color:#6b7280;font-size:16px}@media (max-width: 768px){.perpanjangan-sewa-modal{max-width:100%;max-height:100vh;border-radius:0}.perpanjangan-sewa-header{padding:20px}.perpanjangan-sewa-title{font-size:20px}.perpanjangan-sewa-body{padding:20px}.perpanjangan-sewa-type-cards,.perpanjangan-sewa-po-list{grid-template-columns:1fr}.perpanjangan-sewa-item-card{flex-direction:column;align-items:flex-start}.perpanjangan-sewa-replacement{width:100%;align-items:flex-start}.perpanjangan-sewa-input-small{max-width:100%}.perpanjangan-sewa-actions{flex-direction:column-reverse}.perpanjangan-sewa-btn{width:100%}}.rental-container{width:100%;min-height:100vh;max-height:100vh;min-width:83vw;max-width:83vw;background:#f3f4f6;display:flex;flex-direction:column;padding-bottom:0;position:relative;margin-left:17vw}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.rental-header h1{font-size:2rem;font-weight:700;color:#fff;margin-bottom:6px;letter-spacing:-.5px;line-height:1.2;text-transform:none;font-family:Inter,sans-serif;margin-left:20px}.rental-header p{font-size:1rem;color:#fff;font-weight:500;font-family:Inter,sans-serif;margin-left:20px}.rental-form{background:none;padding:0 40px;border-radius:0;box-shadow:none;border:none}.rental-form{max-height:none;overflow-y:visible}.rental-form h2{font-size:1.6rem;font-weight:800;color:#000;margin-top:40px;margin-bottom:40px;letter-spacing:-.5px;line-height:1.2;text-transform:none;font-family:Inter,sans-serif;text-align:center}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px}.form-group{display:flex;flex-direction:column}.form-group.full-width{width:80%}.form-group label{font-weight:600;margin-bottom:8px;color:#000;font-size:.9rem;position:relative}.form-group input,.form-group select,.form-group textarea{padding:8px 12px;border:1.5px solid #dee2e6;border-radius:8px;font-size:.85rem;transition:all .2s ease;background:#fff;color:#495057;font-family:inherit}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#007bff;box-shadow:0 0 0 3px #007bff1a}.form-group input:hover,.form-group select:hover,.form-group textarea:hover{border-color:#adb5bd}.form-group input[readonly]{background:#f8f9fa;color:#6c757d;cursor:not-allowed;border-color:#dee2e6}.form-group input[readonly]:focus{box-shadow:none;border-color:#dee2e6}.form-group textarea{resize:vertical;min-height:60px;font-family:inherit}.form-group select{cursor:pointer;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='m6 8 4 4 4-4'/%3e%3c/svg%3e");background-position:right 12px center;background-repeat:no-repeat;background-size:16px;padding-right:40px;-webkit-appearance:none;-moz-appearance:none;appearance:none}.cost-summary-card{background:linear-gradient(135deg,#fff,#f8f9ff);border:1px solid #e1e5f0;border-radius:16px;padding:30px;margin:30px 0;box-shadow:0 8px 32px #00000014;transition:all .3s ease;position:relative;overflow:hidden}.cost-summary-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:linear-gradient(135deg,#4f46e5,#6366f1)}.cost-summary-card:hover{transform:translateY(-2px);box-shadow:0 12px 40px #0000001f}.cost-header{text-align:center;margin-bottom:25px}.cost-header h2{font-size:1.5rem;font-weight:700;color:#2d3748;margin-bottom:8px;display:flex;align-items:center;justify-content:center;gap:10px}.cost-icon{font-size:1.8rem}.cost-subtitle{font-size:.9rem;color:#718096;margin:0}.cost-breakdown{display:flex;flex-direction:column;gap:15px}.cost-item{display:flex;justify-content:space-between;align-items:center;padding:15px;background:#ffffffb3;border-radius:12px;transition:all .2s ease}.cost-item:hover{background:#ffffffe6;transform:translate(5px)}.cost-item.total{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;font-weight:600;margin-top:10px}.cost-label{display:flex;align-items:center;gap:10px;font-size:.95rem;color:#4a5568}.cost-item.total .cost-label{color:#fff}.item-icon{font-size:1.2rem}.cost-value{font-size:1.1rem;font-weight:600;color:#2d3748}.cost-value.monthly{color:#3182ce}.cost-value.duration{color:#38a169}.cost-value.final{font-size:1.3rem;font-weight:700;color:#2d3748}.cost-item.total .cost-value{color:#fff;font-size:1.4rem}.cost-divider{height:1px;background:linear-gradient(90deg,transparent,#e2e8f0,transparent);margin:10px 0}.cost-note{display:flex;align-items:center;gap:8px;margin-top:20px;padding:12px;background:#edf2f780;border-radius:8px;font-size:.85rem;color:#4a5568}.note-icon{font-size:1rem}@media (max-width: 768px){.cost-summary-card{padding:20px;margin:20px 0}.cost-header h2{font-size:1.3rem}.cost-item{flex-direction:column;align-items:flex-start;gap:8px}.cost-value{align-self:flex-end}}@media (max-width: 480px){.cost-summary-card{padding:15px}.cost-header h2{font-size:1.2rem}.cost-label{font-size:.9rem}.cost-value{font-size:1rem}}.form-total,.form-list{display:none}.form-actions{display:flex;gap:15px;justify-content:flex-end;margin-top:5px;position:relative;margin-right:3vw;margin-bottom:30px;z-index:10;padding:0}.btn-cancel,.btn-submit{padding:12px 24px;border:none;border-radius:6px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;text-transform:none;letter-spacing:normal;position:relative;overflow:hidden;min-width:100px}.btn-cancel{background:#f8f9fa;color:#000;border:1.5px solid #dee2e6}.btn-cancel:hover{background:#e9ecef;color:#495057;border-color:#adb5bd}.btn-submit{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;border:1.5px solid #007bff;min-width:140px}.btn-submit:hover{background:#0056b3;border-color:#0056b3}.btn-submit:disabled,.btn-cancel:disabled{opacity:.6;cursor:not-allowed;transform:none;box-shadow:none}.error-message{background:#f8d7da;color:#721c24;padding:12px 16px;border-radius:6px;border:1px solid #f5c6cb;margin-bottom:20px;font-weight:500;font-size:.9rem}.success-container{min-width:83vw;max-width:83vw;min-height:100vh;max-height:100vh;margin-left:17vw;background:#f3f4f6;display:flex;align-items:center;justify-content:center;padding:2rem}.success-card{background:#fff;padding:2.5rem;border-radius:1.5rem;box-shadow:0 8px 20px #0000001f;text-align:center;max-width:450px;width:100%;animation:fadeInUp .6s ease-out}.success-icon{font-size:3rem;color:#10b981;margin-bottom:1rem;animation:pop .5s ease-out forwards}.success-card h2{font-size:1.75rem;color:#111827;margin-bottom:.5rem}.success-card p{font-size:1rem;color:#4b5563;margin-bottom:2rem;line-height:1.5}.success-actions{display:flex;justify-content:center;gap:1rem}.back-button{background:#2563eb;color:#fff;padding:.75rem 1.25rem;border-radius:.75rem;border:none;font-size:.8rem;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #2563eb4d}.back-button:hover{background:#1e40af;transform:translateY(-2px)}.back-button:active{transform:translateY(0)}@keyframes fadeInUp{0%{opacity:0;transform:translateY(25px)}to{opacity:1;transform:translateY(0)}}@keyframes pop{0%{transform:scale(.6);opacity:0}70%{transform:scale(1.2);opacity:1}to{transform:scale(1)}}@keyframes successSlide{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.success-icon{font-size:3.5rem;color:#28a745;margin-bottom:20px}.success-message h2{font-size:1.8rem;color:#495057;margin-bottom:15px;font-weight:600}.success-message p{font-size:1rem;color:#6c757d;line-height:1.5}@media (max-width: 768px){.rental-container{margin-top:70px}.rental-header h1{font-size:1.8rem}.form-row{grid-template-columns:1fr;gap:20px}.form-actions{flex-direction:column-reverse;gap:12px}.btn-cancel,.btn-submit{width:100%;padding:14px}.success-message{margin:15px;padding:35px 25px}}@media (max-width: 480px){.rental-header{margin-bottom:25px}.rental-header h1{font-size:1.6rem}.form-group input,.form-group select,.form-group textarea{padding:10px 14px;font-size:16px}.form-row{gap:18px;margin-bottom:20px}}.btn-submit:disabled:after{content:"";position:absolute;top:50%;left:50%;width:16px;height:16px;margin:-8px 0 0 -8px;border:2px solid transparent;border-top:2px solid #fff;border-radius:50%;animation:spin 1s linear infinite}.form-group input:focus-visible,.form-group select:focus-visible,.form-group textarea:focus-visible,.btn-cancel:focus-visible,.btn-submit:focus-visible{outline:2px solid #007bff;outline-offset:2px}.form-group input::placeholder,.form-group textarea::placeholder{color:#adb5bd;font-style:italic}.form-group:hover label{color:#343a40}.form-group input[type=date]{position:relative}.form-group input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:.7}.form-group input[type=date]::-webkit-calendar-picker-indicator:hover{opacity:1}.form-group input[type=number]::-webkit-outer-spin-button,.form-group input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.form-group input[type=number]{-webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield}.form-group label:before{content:""}.form-group{animation:slideUp .3s ease-out;animation-fill-mode:both}.form-group:nth-child(1){animation-delay:.1s}.form-group:nth-child(2){animation-delay:.2s}.form-group:nth-child(3){animation-delay:.3s}.success-data{animation:successSlide .3s ease-out;animation-fill-mode:both;background:#d1cfcf;padding:1rem;border-radius:1.5rem;box-shadow:0 8px 20px #0000001f;text-align:center;max-width:450px;width:100%;margin-bottom:2rem}.success-data p{font-size:1rem;color:#6c757d;line-height:1.5;margin-bottom:.5rem;font-weight:600;text-align:left}@keyframes successSlide{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media print{.rental-container{background:#fff}.form-actions,.error-message{display:none}}@media (max-width: 1200px){.rental-container{margin-left:17vw}.rental-form{max-width:75.5vw}}@media (max-width: 768px){.rental-content{margin:0;padding:0}.rental-container{max-width:100vw;padding:0;margin:0}.rental-header{padding-top:6vh}.rental-header h1{font-size:1.8rem}.form-row{grid-template-columns:1fr;gap:20px}.form-actions{flex-direction:column-reverse;gap:12px;margin-bottom:50px;padding-bottom:30px;width:100%;padding-right:20px;padding-left:20px}.btn-cancel,.btn-submit{width:100%;padding:14px}.success-message{margin:15px;padding:35px 25px}}@media (max-width: 480px){.rental-header{margin-bottom:25px}.rental-header h1{font-size:1.6rem}.form-group input,.form-group select,.form-group textarea{padding:10px 14px;font-size:16px}.form-row{gap:18px;margin-bottom:20px}.form-actions{margin-bottom:50px;padding-bottom:25px}}.import-section{padding:2rem 3rem;background:#fff;border-radius:16px;box-shadow:0 4px 6px #00000012}.import-section h2{margin:0;font-size:1.5rem;color:#1e293b;font-weight:700;margin-bottom:1.5rem;text-align:center}.import-buttons-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.5rem}.btn-import-modern,.btn-template-modern{display:flex;align-items:center;gap:1rem;padding:1.25rem 1.5rem;border:none;border-radius:12px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);font-family:inherit;position:relative;overflow:hidden}.btn-import-modern{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;box-shadow:0 4px 15px #667eea66}.btn-import-modern:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.btn-template-modern{background:linear-gradient(135deg,#8f9779,#9dc183);color:#fff;box-shadow:0 4px 15px #f093fb66}.btn-template-modern:hover{transform:translateY(-2px);box-shadow:0 6px 20px #f093fb99}.btn-import-modern:active,.btn-template-modern:active{transform:translateY(0)}.btn-icon{font-size:2rem;line-height:1}.btn-content{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;flex:1}.btn-title{font-size:1.1rem;font-weight:600;letter-spacing:.01em}.btn-subtitle{font-size:.85rem;opacity:.9;font-weight:400}.import-modal-overlay.modern-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem;animation:modalFadeIn .3s ease-out}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.import-modal-content.modern-modal{background:#fff;border-radius:24px;max-width:900px;width:100%;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 25px 50px -12px #00000080;animation:modalSlideIn .4s cubic-bezier(.34,1.56,.64,1);position:relative}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9) translateY(-20px)}to{opacity:1;transform:scale(1) translateY(0)}}.import-modal-header{display:flex;align-items:center;justify-content:space-between;padding:2rem 2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;position:relative;overflow:hidden}.import-modal-header h2{display:flex;align-items:center;gap:1rem;margin:0;font-size:1.3rem;font-weight:700;z-index:1;text-shadow:0 2px 4px rgba(0,0,0,.1)}.import-modal-icon{font-size:2rem;animation:bounce 2s ease-in-out infinite}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}.import-modal-close{background:#ffffff40;border:2px solid rgba(255,255,255,.3);border-radius:50%;width:40px;height:40px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;font-size:1.5rem;font-weight:300;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:1}.import-modal-close:hover{background:#ffffff59;transform:rotate(90deg) scale(1.1);border-color:#ffffff80}.import-modal-close:active{transform:rotate(90deg) scale(.95)}.import-modal-body{padding:2.5rem;overflow-y:auto;flex:1;background:#fafbfc}.import-modal-body::-webkit-scrollbar{width:8px}.import-modal-body::-webkit-scrollbar-track{background:#f1f3f5;border-radius:10px}.import-modal-body::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px}.import-modal-body::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,#764ba2,#667eea)}.upload-area{margin-bottom:2.5rem}.file-upload-label{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 2rem;border:3px dashed #cbd5e1;border-radius:20px;background:#fff;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.file-upload-label:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#667eea0d,#764ba20d);opacity:0;transition:opacity .4s}.file-upload-label:hover{border-color:#667eea;background:#fff;transform:translateY(-2px);box-shadow:0 10px 30px #667eea33}.file-upload-label:hover:before{opacity:1}.file-upload-label:hover .upload-icon{transform:scale(1.1) translateY(-5px)}.upload-icon-wrapper{margin-bottom:1.5rem;position:relative;z-index:1}.upload-icon{font-size:4rem;transition:all .4s cubic-bezier(.4,0,.2,1);filter:drop-shadow(0 4px 8px rgba(102,126,234,.2))}.upload-text{font-size:1.2rem;color:#1e293b;margin:.75rem 0;font-weight:600;position:relative;z-index:1}.upload-text strong{background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.upload-hint{font-size:.95rem;color:#64748b;margin:0;position:relative;z-index:1}.preview-section{margin-top:2.5rem;border:2px solid #e5e7eb;border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 4px 6px #0000000d;animation:slideInUp .4s ease-out}@keyframes slideInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.preview-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.75rem;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-bottom:2px solid #e5e7eb}.preview-header h3{margin:0;font-size:1.2rem;color:#1e293b;font-weight:700;display:flex;align-items:center;gap:.5rem}.preview-header h3:before{content:"📊";font-size:1.5rem}.preview-count{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.5rem 1rem;border-radius:20px;font-size:.9rem;font-weight:700;box-shadow:0 2px 8px #667eea4d;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.preview-table-container{overflow-x:auto;max-height:400px;overflow-y:auto}.preview-table{width:100%;border-collapse:collapse;font-size:.9rem}.preview-table thead{background:green;position:sticky;top:0;z-index:10}.preview-table th{padding:1rem 1.25rem;text-align:left;font-weight:600;color:#fff;font-size:.85rem;text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}.preview-table td{padding:1rem 1.25rem;border-bottom:1px solid #e5e7eb;color:#334155;transition:all .2s}.preview-table tbody tr{transition:all .2s}.preview-table tbody tr:hover{background:linear-gradient(135deg,#667eea0d,#764ba20d);transform:scale(1.01)}.row-number{background:linear-gradient(135deg,#f1f5f9,#e2e8f0);font-weight:700;color:#667eea;text-align:center;width:60px;position:sticky;left:0}.preview-note{padding:1rem 1.75rem;background:linear-gradient(135deg,#fef3c7,#fde68a);border-top:2px solid #fbbf24;margin:0;font-size:.9rem;color:#92400e;text-align:center;font-weight:600;display:flex;align-items:center;justify-content:center;gap:.5rem}.preview-note:before{content:"💡";font-size:1.2rem}.import-modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:1rem;padding:1.75rem 2.5rem;border-top:2px solid #e5e7eb;background:#fff;box-shadow:0 -4px 6px #0000000d}.btn-import-modal-cancel,.btn-import-modal-submit{padding:.875rem 2rem;border:none;border-radius:12px;font-size:1rem;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;gap:.625rem;font-family:inherit;letter-spacing:.02em}.btn-import-modal-cancel{background:red;color:#fff;border:2px solid #afafaf}.btn-import-modal-cancel:hover:not(:disabled){background:#e95a5a;color:#000;border-color:#cbd5e1;transform:translateY(-1px)}.btn-import-modal-submit{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 15px #667eea66;border:2px solid transparent;position:relative;overflow:hidden}.btn-import-modal-submit:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#764ba2,#667eea);opacity:0;transition:opacity .3s}.btn-import-modal-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #667eea99}.btn-import-modal-submit:hover:not(:disabled):before{opacity:1}.btn-import-modal-submit>*{position:relative;z-index:1}.btn-import-modal-submit:disabled,.btn-import-modal-cancel:disabled{opacity:.6;cursor:not-allowed;transform:none!important}.import-progress-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#fffffffa;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeIn .3s ease-out}.import-progress-content{text-align:center;padding:3rem;animation:zoomIn .4s cubic-bezier(.34,1.56,.64,1)}@keyframes zoomIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.progress-text{margin-top:2rem;font-size:1.4rem;font-weight:700;color:#1e293b;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.progress-subtext{margin-top:.75rem;font-size:1rem;color:#64748b;font-weight:500}.modern-success{max-width:650px;padding:3.5rem;background:#fff}.success-animation{display:flex;justify-content:center;margin-bottom:2.5rem}.checkmark-circle{width:140px;height:140px;position:relative;display:inline-block}.checkmark-circle:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;width:140px;height:140px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 10px 40px #667eea66;animation:scaleIn .6s cubic-bezier(.34,1.56,.64,1)}@keyframes scaleIn{0%{transform:scale(0) rotate(-180deg);opacity:0}50%{transform:scale(1.15) rotate(0)}to{transform:scale(1) rotate(0);opacity:1}}.checkmark-stem,.checkmark-kick{position:absolute;background:#fff;border-radius:10px}.checkmark-stem{width:7px;height:60px;left:56px;top:41px;transform:rotate(45deg);animation:drawStem .4s ease-out .6s forwards;transform-origin:bottom;opacity:0}.checkmark-kick{width:7px;height:30px;left:60px;top:72px;transform:rotate(-45deg);animation:drawKick .4s ease-out .9s forwards;transform-origin:bottom;opacity:0}@keyframes drawStem{0%{height:0;opacity:0}to{height:60px;opacity:1}}@keyframes drawKick{0%{height:0;opacity:0}to{height:30px;opacity:1}}.success-title{font-size:2.25rem;font-weight:800;color:#1e293b;margin-bottom:1rem;animation:fadeInUp .5s ease-out 1.1s backwards;text-align:center}.success-message{font-size:1.15rem;color:#475569;margin-bottom:2.5rem;line-height:1.7;animation:fadeInUp .5s ease-out 1.2s backwards;text-align:center}.success-message strong{color:#667eea;font-weight:700;font-size:1.3rem}@keyframes fadeInUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.success-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1.5rem;margin:2.5rem 0;animation:fadeInUp .5s ease-out 1.3s backwards}.stat-item{display:flex;flex-direction:column;align-items:center;padding:2rem 1.5rem;background:linear-gradient(135deg,#f8fafc,#e2e8f0);border-radius:16px;box-shadow:0 4px 12px #00000014;transition:all .3s;border:2px solid transparent}.stat-item:hover{transform:translateY(-5px);box-shadow:0 8px 20px #667eea4d;border-color:#667eea}.stat-icon{font-size:2.5rem;margin-bottom:.75rem;animation:bounce 1s ease-in-out infinite}.stat-value{font-size:2.5rem;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:.5rem}.stat-label{font-size:1rem;color:#64748b;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.modern-back{margin-top:2.5rem;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:1.125rem 2.5rem;border:none;border-radius:14px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);box-shadow:0 6px 20px #667eea66;animation:fadeInUp .5s ease-out 1.4s backwards;display:inline-block;width:100%;position:relative;overflow:hidden}.modern-back:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(135deg,#764ba2,#667eea);opacity:0;transition:opacity .3s}.modern-back:hover{transform:translateY(-3px);box-shadow:0 10px 30px #667eea99}.modern-back:hover:before{opacity:1}.modern-back span{display:flex;align-items:center;justify-content:center;gap:.75rem;position:relative;z-index:1}@media (max-width: 768px){.import-buttons-container{grid-template-columns:1fr}.modern-modal{max-height:95vh;margin:.5rem;border-radius:20px}.import-modal-header{padding:1.5rem 1.75rem}.import-modal-header h2{font-size:1rem}.import-modal-body{padding:1.75rem}.import-modal-footer{flex-direction:column-reverse;padding:1.25rem 1.75rem;gap:.75rem}.btn-import-modal-cancel,.btn-import-modal-submit{width:100%;justify-content:center}.success-stats{grid-template-columns:1fr;gap:1rem}.checkmark-circle{width:110px;height:110px}.checkmark-circle:before{width:110px;height:110px}.checkmark-stem{height:48px;left:53px;top:32px}.checkmark-kick{height:24px;left:38px;top:58px}.success-title{font-size:1.75rem}.success-message,.btn-title{font-size:1rem}.btn-subtitle{font-size:.8rem}.upload-icon{font-size:3rem}.file-upload-label{padding:3rem 1.5rem}.modern-success{padding:2.5rem 1.5rem}}@media (max-width: 480px){.import-section{padding:1rem}.import-modal-header h2{font-size:1.2rem;gap:.5rem}.import-modal-icon{font-size:1.5rem}.preview-table th,.preview-table td{padding:.75rem .875rem;font-size:.8rem}.upload-text{font-size:1rem}.upload-hint{font-size:.85rem}}.btn-import-modern:focus-visible,.btn-template-modern:focus-visible,.btn-import-modal-cancel:focus-visible,.btn-import-modal-submit:focus-visible,.modern-back:focus-visible{outline:3px solid #667eea;outline-offset:3px}.import-modal-close:focus-visible{outline:2px solid white;outline-offset:3px}.file-upload-label:focus-within{border-color:#667eea;box-shadow:0 0 0 3px #667eea33}@media print{.import-modal-overlay,.import-section{display:none}}.toast-container{position:fixed;top:20px;right:20px;z-index:9999;min-width:320px;max-width:500px;padding:16px 20px;border-radius:8px;box-shadow:0 4px 12px #00000026;display:flex;align-items:center;gap:12px;animation:slideInRight .3s ease-out}.toast-success{background:linear-gradient(135deg,#10b981,#059669);color:#fff}.toast-error{background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff}.toast-icon{flex-shrink:0;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px}.toast-success .toast-icon,.toast-error .toast-icon{background-color:#fff3}.toast-content{flex:1}.toast-title{font-weight:600;font-size:14px;margin-bottom:4px}.toast-message{font-size:13px;opacity:.95;line-height:1.4}@keyframes slideInRight{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}@media (max-width: 640px){.toast-container{right:16px;left:16px;min-width:auto}}.file-upload-area{border:2px dashed #bbb;border-radius:12px;padding:30px;text-align:center;background-color:#fafafa;transition:all .3s ease;cursor:pointer;position:relative}.file-upload-area.dragging{border-color:#007bff;background-color:#e8f2ff;transform:scale(1.02);box-shadow:0 0 15px #007bff33}.file-upload-label{display:flex;flex-direction:column;align-items:center;pointer-events:none}.upload-icon-wrapper{font-size:40px;margin-bottom:10px}.upload-icon{display:inline-block;transition:transform .3s ease}.upload-text{font-size:16px;color:#333;margin-bottom:5px;transition:color .3s ease,opacity .3s ease}.file-upload-area.dragging .upload-text{color:#007bff}.fade-in{opacity:1;transition:opacity .2s ease-in}.fade-out{opacity:1;transition:opacity .2s ease-out}.upload-hint{font-size:14px;color:#666}.file-input-hidden{display:none}@keyframes bounce{0%{transform:translateY(0)}to{transform:translateY(-5px)}}.file-upload-area.dragging .upload-icon{animation:bounce .8s infinite alternate}.dashboard-container{display:flex;min-height:100vh;max-height:100vh;background-color:#f8fafc;width:83vw;margin-left:17vw;position:fixed;padding:0;overflow:hidden}.dashboard-main-content{flex:1;padding:0;height:100vh;overflow-y:auto}.dashboard-header-mobile{display:none}@media (min-width: 769px){.dashboard-header-mobile{display:none!important}}.notification-bell{position:relative;z-index:9998}.bell-button{background:none;border:none;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;transition:background-color .2s}.bell-button:hover{background-color:#f1f5f9}.notification-count{position:absolute;top:-5px;right:-5px;background-color:#ef4444;color:#fff;border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;box-shadow:0 2px 4px #0000001a}.notification-popup{position:absolute;top:45px;right:0;background:#fff;border:1px solid #e2e8f0;border-radius:8px;width:350px;box-shadow:0 10px 25px #0000001a;z-index:9999;max-height:500px;display:flex;flex-direction:column}.notification-popup-header{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid #e2e8f0}.notification-popup-header h3{margin:0;font-size:16px;font-weight:600;color:#1e293b}.close-popup{background:none;border:none;font-size:20px;cursor:pointer;color:#94a3b8;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:background-color .2s}.close-popup:hover{background-color:#f1f5f9}.notification-list{max-height:400px;overflow-y:auto}.notification-item{padding:16px;border-bottom:1px solid #f1f5f9;transition:background-color .2s}.notification-item:hover{background-color:#f8fafc}.notification-item.due_soon{border-left:3px solid #f59e0b}.notification-item.due_today{border-left:4px solid #ffc107;background-color:#fffbf0}.notification-item.overdue{border-left:4px solid #dc3545;background-color:#fff5f5}.notification-item.unreturned{border-left:4px solid #ff6b6b;background-color:#fff5f5}.notification-message{font-size:14px;color:#1e293b;margin-bottom:8px;line-height:1.4}.notification-meta{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#64748b}.notification-company{font-weight:500}.notification-date{background-color:#f1f5f9;padding:2px 8px;border-radius:12px}.notification-loading{padding:40px 20px;text-align:center;color:#999}.no-notification{padding:60px 20px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;color:#64748b;font-size:14px}.notification-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px}.notification-modal-content{background:#fff;border-radius:12px;max-width:600px;width:100%;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.notification-modal-header{padding:20px;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;align-items:center}.notification-modal-header h3{margin:0;font-size:18px;color:#333}.modal-close-button{background:none;border:none;font-size:28px;cursor:pointer;color:#999;line-height:1;padding:0;width:30px;height:30px}.modal-close-button:hover{color:#333}.notification-modal-body{padding:20px}.notification-modal-footer{padding:16px 20px;border-top:1px solid #e0e0e0;display:flex;justify-content:flex-end;gap:12px}.status-badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:12px;font-weight:500;margin-right:8px;margin-bottom:4px}.status-overdue{background-color:#fee;color:#c00}.status-today{background-color:#fff3cd;color:#856404}.status-soon{background-color:#d1ecf1;color:#0c5460}.info-card{background-color:#f8f9fa;border-radius:8px;padding:16px;margin-bottom:16px}.info-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid #e9ecef}.info-row:last-child{border-bottom:none}.info-label{font-weight:600;color:#495057;font-size:13px}.info-value{color:#212529;font-size:13px;text-align:right}.unit-summary-list{display:flex;flex-direction:column;gap:12px}.unit-summary-card{background-color:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:12px}.unit-summary-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid #f0f0f0}.unit-type{font-weight:600;color:#333;font-size:14px}.unit-count{background-color:#007bff;color:#fff;padding:2px 8px;border-radius:12px;font-size:12px;font-weight:500}.unit-details-list{display:flex;flex-direction:column;gap:6px}.unit-detail-item{display:flex;justify-content:space-between;padding:6px 8px;background-color:#f8f9fa;border-radius:4px;font-size:12px}.unit-sn{color:#495057;font-weight:500}.unit-info{color:#6c757d}.date-info-section{margin-top:16px;padding-top:16px;border-top:1px solid #e0e0e0}.btn-secondary,.btn-danger{padding:10px 20px;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.btn-secondary{background-color:#6c757d;color:#fff}.btn-secondary:hover{background-color:#5a6268}.btn-danger{background-color:#dc3545;color:#fff}.btn-danger:hover{background-color:#c82333}.btn-back,.btn-delete{padding:6px 12px;border-radius:6px;border:none;cursor:pointer;font-size:14px}.btn-back{background-color:#f1f5f9;color:#1e293b}.btn-back:hover{background-color:#e2e8f0}.btn-delete{background-color:#ef4444;color:#fff}.btn-delete:hover{background-color:#dc2626}.dashboard-loading,.dashboard-error{display:flex;justify-content:center;align-items:center;height:100vh;font-size:18px}.dashboard-loading{color:#6b7280}.dashboard-error{color:#ef4444}.dashboard-stats-grid{display:grid;max-width:100%;max-height:auto;padding:0 30px;grid-template-rows:auto;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:2vw;margin-bottom:30px;margin-left:auto;margin-right:auto;justify-content:center;align-items:center}.dashboard-stat-card{background-color:#fff;padding:24px;border-radius:12px;box-shadow:0 1px 3px #0000001a}.dashboard-stat-card.revenue{border-left:4px solid #3b82f6}.dashboard-stat-card.invoices{border-left:4px solid #10b981}.dashboard-stat-card.remaining{border-left:4px solid #df55d3}.dashboard-stat-card.tenants{border-left:4px solid #f59e0b}.dashboard-stat-card.active{border-left:4px solid #22c55e}.dashboard-stat-card.pending{border-left:4px solid #ef4444}.dashboard-stat-card.user-remaining{border-left:4px solid #190d75}.dashboard-stat-card.items{border-left:4px solid #8b5cf6}.dashboard-stat-header{display:flex;align-items:center;gap:12px;margin-bottom:12px}.dashboard-stat-icon{font-size:24px}.dashboard-stat-title{color:#6b7280;font-size:14px}.dashboard-stat-value{font-size:32px;font-weight:700;color:#1f2937;margin-bottom:8px}.dashboard-stat-change{color:#10b981;font-size:12px}.dashboard-charts-grid{display:grid;grid-template-columns:2fr 1fr;gap:20px;margin-bottom:10px;min-height:300px;padding:20px}.dashboard-chart-card{background:#fff;border-radius:12px;padding:24px;box-shadow:0 2px 8px #00000014;height:100%;display:flex;flex-direction:column;animation:fadeInUp .5s ease-out}.dashboard-chart-title{font-size:18px;font-weight:600;color:#1a1a1a;margin:0 0 20px;padding-bottom:12px;border-bottom:2px solid #f0f0f0}.recharts-wrapper{margin:0 auto}.dashboard-pie-legend{margin-top:20px}.recharts-pie-label-text{font-size:13px;font-weight:600;fill:#333;text-shadow:0 0 3px #fff,0 0 3px #fff}.recharts-legend-wrapper{margin-top:16px!important}.recharts-default-legend{display:flex!important;justify-content:center!important;align-items:center!important;gap:24px!important;flex-wrap:wrap!important}.recharts-legend-item{display:flex!important;align-items:center!important;gap:8px!important;margin:4px 0!important}.recharts-legend-item-text{font-size:14px!important;font-weight:500!important;color:#333!important}.dashboard-pie-legend{display:flex;justify-content:center;align-items:center;gap:32px;margin-top:24px;padding-top:20px;border-top:1px solid #e5e7eb;flex-wrap:wrap}.dashboard-legend-item{display:flex;align-items:center;gap:10px;padding:8px 16px;background:#f9fafb;border-radius:8px;transition:all .2s ease}.dashboard-legend-item:hover{background:#f3f4f6;transform:translateY(-2px);box-shadow:0 2px 6px #0000001a}.dashboard-legend-color{width:16px;height:16px;border-radius:4px;flex-shrink:0;box-shadow:0 0 0 2px #fffc}.dashboard-legend-text{font-size:14px;font-weight:500;color:#374151;white-space:nowrap}.recharts-tooltip-wrapper{outline:none}.recharts-default-tooltip{background:#fffffffa!important;border:1px solid #e5e7eb!important;border-radius:8px!important;box-shadow:0 4px 12px #00000026!important;padding:12px 16px!important}.recharts-tooltip-label{font-size:14px!important;font-weight:600!important;color:#1a1a1a!important;margin-bottom:8px!important}.recharts-tooltip-item{font-size:13px!important;color:#4b5563!important;padding:4px 0!important}.dashboard-chart-empty{display:flex;align-items:center;justify-content:center;height:300px;color:#6b7280;font-size:14px;flex-direction:column;gap:12px;background:#f9fafb;border-radius:8px;border:2px dashed #e5e7eb}.dashboard-chart-empty-icon{font-size:48px;opacity:.5}.dashboard-chart-empty-title{font-size:16px;font-weight:600;color:#374151}.dashboard-chart-empty-subtitle{font-size:13px;color:#9ca3af}.dashboard-invoices-card{background-color:#fff;padding:15px 34px;border-radius:12px;box-shadow:0 1px 3px #0000001a}.dashboard-invoices-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.dashboard-invoices-title{margin:0;color:#1f2937;font-size:18px;font-weight:700}.dashboard-invoices-actions{display:flex;gap:10px}.dashboard-print-btn{background-color:#10b981;color:#fff;border:none;padding:8px 16px;border-radius:6px;cursor:pointer;font-size:14px;display:flex;align-items:center;gap:6px}.dashboard-print-btn:hover{background-color:#059669}.dashboard-view-all-btn{color:#3b82f6;border:none;background:none;cursor:pointer;font-size:14px}.dashboard-view-all-btn:hover{color:#2563eb;text-decoration:underline}.dashboard-table{width:100%;border-collapse:collapse}.dashboard-table-header{background-color:#f9fafb}.dashboard-table-header th{padding:12px;text-align:left;color:#6b7280;font-size:12px;font-weight:700;text-transform:uppercase}.dashboard-table-row{border-bottom:1px solid #e5e7eb}.dashboard-table-cell{padding:12px;font-size:13px;max-width:270px}.dashboard-table-cell.po-number{color:#3b82f6;font-weight:700}.dashboard-table-cell.price{font-weight:700;color:#1f2937}.dashboard-table-cell.date{color:#6b7280}.dashboard-status-badge{padding:4px 12px;border-radius:20px;font-size:12px;font-weight:700}.dashboard-status-badge.pending{background-color:#fef3c7;color:#92400e}.dashboard-status-badge.completed{background-color:#d1fae5;color:#065f46}.dashboard-status-badge.cancelled{background-color:#fee2e2;color:#b91c1c}.dashboard-status-badge.overdue{background-color:#fef2f2;color:#dc2626}.dashboard-status-badge.draft{background-color:#e0f2fe;color:#0284c7}.dashboard-status-badge.paid{background-color:#d1fae5;color:#065f46}.dashboard-status-badge.processing{background-color:#fef9c3;color:#b45309}.dashboard-status-badge.approved{background-color:#d1fae5;color:#065f46}.dashboard-status-badge.rejected{background-color:#fee2e2;color:#b91c1c}.dashboard-status-badge.active{background-color:#d1fae5;color:#065f46}.dashboard-status-badge.inactive{background-color:#ef4444;color:#fff}.dashboard-empty-state{text-align:center;padding:40px;color:#6b7280}.dashboard-empty-state-icon{font-size:48px;margin-bottom:20px}.dashboard-login-prompt{text-align:center;margin:auto;width:100%;height:100vh;display:flex;padding:40px;color:#6b7280;font-size:18px}.styling-chart{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;font-family:Inter,sans-serif;font-size:14px;color:#374151}.checkbox-show-all{-moz-appearance:none;appearance:none;-webkit-appearance:none;width:18px;height:18px;border:2px solid #3b82f6;border-radius:.375rem;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;margin-right:.4rem;transition:all .2s ease}.checkbox-show-all:checked{background-color:#3b82f6;border-color:#3b82f6}.checkbox-show-all:checked:after{content:"✔";font-size:12px;color:#fff}.dashboard-year-select{padding:6px 10px;border:1px solid #d1d5db;border-radius:.375rem;font-size:14px;color:#374151;background-color:#fff;cursor:pointer;transition:border .2s ease,box-shadow .2s ease}.dashboard-year-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 2px #3b82f640}.option-select-data-years{margin:0 20px}.popup-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.popup-content{background-color:#fff;padding:20px;gap:10px;border-radius:8px;width:25%;height:auto;box-shadow:0 5px 15px #0000004d;position:relative;animation:fadeIn .3s ease-in-out;font-size:1.1em}.loading-modal-content{background-color:#fff;padding:30px 40px;border-radius:16px;box-shadow:0 10px 30px #0003;display:flex;flex-direction:column;align-items:center;gap:20px;min-width:280px;max-width:400px;animation:fadeInScale .3s ease forwards;z-index:9999}.loading-spinner{width:80px;height:80px;animation:spin 1.5s linear infinite;display:flex;align-items:center;justify-content:center}.loading-logo{width:60px;height:60px;object-fit:contain;filter:drop-shadow(0 0 5px rgba(102,126,234,.7))}.loading-text{font-size:1.2rem;font-weight:600;color:#3b82f6;font-family:Inter,sans-serif;text-align:center;-webkit-user-select:none;user-select:none}@keyframes fadeIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes fadeInScale{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}:root{--color-belum-aktif: #f59e0b;--color-aktif: #10b981;--color-tidak-aktif: #ef4444;--color-belum-aktif-light: #fef3c7;--color-aktif-light: #d1fae5;--color-tidak-aktif-light: #fee2e2}@media (max-width: 1600px){.dashboard-header-mobile{display:none}.dashboard-container{width:83vw}.dashboard-stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-chart-card,.dashboard-stat-card{padding:16px;font-size:14px}.dashboard-charts-grid{grid-template-columns:1fr}}@media (max-width: 1400px){.dashboard-container{width:83vw}.dashboard-stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-charts-grid{grid-template-columns:1fr}.dashboard-stat-title{font-size:12px}.dashboard-stat-value{font-size:20px}.dashboard-stat-change,.dashboard-table-header th,.dashboard-table-cell{font-size:10px}.dashboard-print-btn{padding:6px 10px;font-size:10px}.dashboard-view-all-btn{font-size:10px}.dashboard-user-profile{padding:10px 12px}}@media (max-width: 1200px){.dashboard-header-mobile{display:none}.dashboard-container{width:83vw;margin-left:17vw}.dashboard-stats-grid{grid-template-columns:repeat(2,1fr)}.dashboard-charts-grid{grid-template-columns:1fr}}@media (max-width: 768px){.dashboard-container{width:100vw;margin-left:0}.dashboard-header-desktop{display:none}.dashboard-header-mobile{display:flex;justify-content:space-between;align-items:center;width:100%}.dashboard-header-actions{flex-wrap:wrap;gap:10px;width:100%}.dashboard-stats-grid{grid-template-columns:1fr}.dashboard-header{flex-direction:column;gap:20px;align-items:flex-start}.dashboard-search-input{width:200px}.dashboard-table{font-size:14px}.dashboard-table-cell{padding:8px}.dashboard-chart-card{padding:16px}.dashboard-chart-title{font-size:16px;margin-bottom:16px}.dashboard-pie-legend{gap:16px;margin-top:16px}.dashboard-legend-item{padding:6px 12px;font-size:12px}.dashboard-legend-color{width:14px;height:14px}.recharts-pie-label-text{font-size:11px}.dashboard-charts-grid{grid-template-columns:1fr;gap:16px}.notification-modal-content{max-width:100%;margin:0;border-radius:0;max-height:100vh}.info-row{flex-direction:column;gap:4px}.info-value{text-align:left}}@media (max-width: 600px){.dashboard-title{font-size:1.2rem}.dashboard-stat-title{font-size:12px}.dashboard-stat-value{font-size:20px}.dashboard-stat-change,.dashboard-table-header th,.dashboard-table-cell{font-size:10px}.dashboard-print-btn{padding:6px 10px;font-size:10px}.dashboard-view-all-btn{font-size:10px}.dashboard-user-profile{padding:10px 12px}}@media (max-width: 480px){.dashboard-stat-value{font-size:18px}.dashboard-search-input{width:120px;font-size:12px}.dashboard-new-invoice-btn{padding:6px 12px;font-size:10px}.dashboard-invoices-card{overflow-x:visible;max-width:100%}}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}.login-container{position:fixed;top:0;left:0;width:100vw;height:100vh;background:linear-gradient(135deg,#000000b3,#0006),url("/assets/kantor_icp(landscape2)-H3kZIvM7.webp");background-size:cover;background-position:center;background-attachment:fixed;display:flex;align-items:center;justify-content:center;padding:20px;margin:0 auto}.login-card{background:#fffffff7;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-radius:24px;padding:45px;width:100%;max-width:450px;box-shadow:0 30px 60px #00000059;border:1px solid rgba(255,255,255,.3);animation:slide-Up .6s ease-out}@keyframes slide-Up{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.login-header{text-align:center;margin-bottom:35px}.login-logo{width:clamp(80px,15vw,120px);height:auto;margin-bottom:20px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.1))}.login-title{color:#1a1a1a;font-size:2rem;font-weight:700;margin-bottom:10px;background:linear-gradient(135deg,#4f46e5,#6366f1);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1.3}.login-subtitle{color:#555;font-size:.95rem;font-weight:400;line-height:1.5}.login-footer{text-align:center;margin-top:20px;font-size:.9rem;color:#444}.login-footer a{color:#4f46e6;text-decoration:none;font-weight:600;transition:color .3s ease}.login-footer a:hover{color:#764ba2}.form-group{margin-bottom:22px}.form-label{display:block;margin-bottom:8px;color:#2d3748;font-weight:600;font-size:.95rem}.form-input,.form-select{width:100%;padding:14px 18px;border:2px solid #e2e8f0;border-radius:10px;font-size:.98rem;transition:all .3s ease;background:#f8fafc;color:#2d3748}.form-input::placeholder{color:#a0aec0}.form-input:focus,.form-select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 4px #667eea1f;background:#fff}.form-group[style*="position: relative"] .form-input{padding-right:45px}.form-select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23667eea' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 15px center;background-size:20px;padding-right:50px;background-color:#f8fafc}.role-badge{display:inline-block;padding:4px 8px;border-radius:6px;font-size:.8rem;font-weight:600;margin-top:5px}.role-admin{background:linear-gradient(135deg,#ff6b6b,#ee5a24);color:#fff}.role-user{background:linear-gradient(135deg,#4ecdc4,#44a08d);color:#fff}.login-button{width:100%;padding:15px;background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;border:none;border-radius:12px;font-size:1.05rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:10px;position:relative;overflow:hidden;box-shadow:0 4px 15px #667eea4d}.login-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #667eea66}.login-button:active{transform:translateY(0)}.login-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.login-button:hover:before{left:100%}.forgot-password{text-align:center;margin-top:18px;font-size:.9rem}.forgot-password span{color:#4f46e6;cursor:pointer;transition:all .3s ease;font-weight:500}.forgot-password span:hover{color:#764ba2;text-decoration:underline}.footer-info{text-align:center;margin-top:30px;padding-top:20px;border-top:1px solid #e2e8f0;color:#718096;font-size:.85rem;line-height:1.6}@media (max-width: 768px){.login-container{justify-content:center;padding:20px}.login-card{max-width:100%;padding:35px 28px}.login-title{font-size:1.7rem}}@media (max-width: 480px){.login-card{margin:10px;padding:30px 25px}.login-title{font-size:1.6rem}}.welcome-modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.welcome-modal-content{background:linear-gradient(135deg,#fff,#f8fafc);padding:2.5rem 3rem;border-radius:20px;box-shadow:0 20px 60px #0000004d;text-align:center;max-width:380px;width:90%;font-family:Inter,Segoe UI,Tahoma,Geneva,Verdana,sans-serif;border:1px solid rgba(255,255,255,.3)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.welcome-modal-animate-fade-in{animation:fadeIn .5s cubic-bezier(.34,1.56,.64,1) forwards}.welcome-modal-checkmark-wrapper{display:flex;justify-content:center;margin-bottom:1.5rem}.welcome-modal-checkmark{width:64px;height:64px;stroke:#4bb543;stroke-width:4;stroke-miterlimit:10;stroke-linecap:round;stroke-linejoin:round;fill:none;filter:drop-shadow(0 4px 8px rgba(75,181,67,.3))}.welcome-modal-checkmark-circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:4;stroke-miterlimit:10;stroke-linecap:round;stroke-linejoin:round;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.welcome-modal-checkmark-check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .6s forwards}@keyframes stroke{to{stroke-dashoffset:0}}.welcome-modal-content h2{color:#1a202c;font-size:1.5rem;font-weight:700;margin-bottom:.8rem;line-height:1.4}.welcome-modal-content p{color:#4a5568;font-size:1rem;font-weight:500}.login-error-message{color:#e53e3e;text-align:center;margin-top:12px;font-weight:600;font-size:.9rem;padding:10px;background:#fed7d780;border-radius:8px;border-left:4px solid #e53e3e}.mobile-warning-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.mobile-warning-modal{background:#fff;border-radius:12px;padding:32px;max-width:400px;width:90%;box-shadow:0 10px 25px #0003;text-align:center;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.mobile-warning-icon{margin-bottom:16px}.mobile-warning-title{font-size:20px;font-weight:600;color:#333;margin-bottom:16px}.mobile-warning-message{font-size:14px;color:#666;line-height:1.5;margin-bottom:20px}.mobile-warning-list{text-align:left;margin-bottom:24px;padding-left:20px}.mobile-warning-list li{font-size:14px;color:#555;margin-bottom:8px}.mobile-warning-actions{display:flex;justify-content:center}.mobile-warning-button{padding:12px 24px;border:none;border-radius:8px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease}.mobile-warning-button-primary{background-color:#007bff;color:#fff}.mobile-warning-button-primary:hover{background-color:#0056b3;transform:translateY(-1px)}@media (max-width: 480px){.mobile-warning-modal{padding:24px;margin:16px}.mobile-warning-title{font-size:18px}.mobile-warning-message{font-size:13px}}.audit-log-container{width:83vw;min-height:100vh;margin-left:17vw;background:linear-gradient(135deg,#f0f9ff,#e0f2fe,#dbeafe);overflow-x:hidden}.audit-log-header{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;padding:2rem 3rem;box-shadow:0 4px 6px #0000001a}.header-content h1{font-size:2rem;font-weight:700;margin:0 0 .5rem}.header-content p{font-size:1rem;margin:0;opacity:.9}.audit-log-content{padding:2rem 3rem;max-width:1600px;margin:0 auto}.controls-section{margin-bottom:2rem}.search-filter-row{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.audit-search-box{position:relative;flex:2;min-width:300px}.filter-audit-search-icon{position:absolute;left:1rem;top:44%;transform:translateY(-50%);color:#6b7280}.audit-search-input{width:100%;padding:.75rem 1rem .75rem 3rem;border:2px solid #e5e7eb;border-radius:12px;font-size:.95rem;transition:all .3s ease;background:#fff;color:#374151}.search-input:focus{outline:none;border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.audit-filter-box{position:relative;flex:1;min-width:250px;display:flex;align-items:center;gap:.75rem;padding:0rem 1rem;background:#fff;border:2px solid #e5e7eb;border-radius:12px;transition:all .3s ease}.filter-box:focus-within{border-color:#4f46e5;box-shadow:0 0 0 3px #4f46e51a}.filter-box svg{color:#6b7280}.filter-select{flex:1;border:none;outline:none;font-size:.95rem;background:transparent;cursor:pointer;color:#374151;font-weight:500}.audit-stats-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.5rem}.audit-stat-card{background:#fff;padding:1.5rem;border-radius:16px;display:flex;align-items:center;gap:1.25rem;box-shadow:0 2px 8px #00000014;transition:all .3s ease}.audit-stat-card:hover{transform:translateY(-4px);box-shadow:0 8px 16px #0000001f}.audit-stat-icon{font-size:2.5rem;width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:12px}.audit-stat-icon-total{background:linear-gradient(135deg,#ede9fe,#ddd6fe)}.audit-stat-icon-success{background:linear-gradient(135deg,#d1fae5,#a7f3d0)}.audit-stat-icon-failed{background:linear-gradient(135deg,#fee2e2,#fecaca)}.audit-stat-icon-users{background:linear-gradient(135deg,#dbeafe,#bfdbfe)}.stat-info{flex:1}.stat-value{font-size:2rem;font-weight:700;color:#1f2937;line-height:1;margin-bottom:.25rem}.stat-label{font-size:.9rem;color:#6b7280;font-weight:500}.tabs-section{display:flex;justify-content:space-between;align-items:center;margin-bottom:2rem;background:#fff;padding:1rem;border-radius:16px;box-shadow:0 2px 8px #00000014;flex-wrap:wrap;gap:1rem}.tabs-container{display:flex;gap:.5rem;flex-wrap:wrap}.tab{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border:2px solid #e5e7eb;background:#fff;border-radius:12px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease;color:#6b7280}.tab:hover{border-color:#4f46e5;color:#4f46e5;transform:translateY(-2px)}.tab.active{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;border-color:#4f46e5;box-shadow:0 4px 8px #4f46e54d}.btn-danger{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border:none;border-radius:12px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease;background:linear-gradient(135deg,#ef4444,#dc2626);color:#fff;box-shadow:0 2px 4px #0000001a}.btn-danger:hover{transform:translateY(-2px);box-shadow:0 4px 8px #ef44444d}.tab-content{background:#fff;border-radius:16px;padding:3rem;box-shadow:0 4px 12px #00000014}.coming-soon{text-align:center;padding:4rem 2rem;color:#6b7280}.coming-soon-icon{color:#9ca3af;margin-bottom:1rem}.coming-soon h3{font-size:1.5rem;margin:1rem 0 .5rem;color:#374151}.coming-soon p{font-size:1rem;color:#9ca3af}.audit-table-container{background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 4px 12px #00000014;margin-bottom:2rem;overflow-x:auto}.audit-table-container::-webkit-scrollbar{display:none}.audit-table{width:100%;border-collapse:collapse}.audit-table thead{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff}.audit-table th{padding:1rem;text-align:left;font-weight:600;font-size:.9rem;text-transform:uppercase;letter-spacing:.5px}.audit-table tbody tr{border-bottom:1px solid #f3f4f6;transition:all .2s ease}.audit-table tbody tr:hover{background:#f9fafb}.audit-table td{padding:1rem;font-size:.9rem;color:#374151}.code-cell{font-family:Courier New,monospace;font-weight:600;color:#4f46e5}.user-cell{display:flex;align-items:center;gap:.5rem}.user-icon{color:#6366f1}.ip-cell{font-family:Courier New,monospace;color:#6b7280;font-size:.85rem}.action-badge{display:inline-block;padding:.35rem .75rem;background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1e40af;border-radius:8px;font-size:.85rem;font-weight:600}.resource-cell{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.date-cell{display:flex;align-items:center;gap:.5rem;color:#6b7280;font-size:.85rem}.calendar-icon{color:#9ca3af}.status-badge{display:inline-block;padding:.35rem .75rem;border-radius:8px;font-size:.8rem;font-weight:600;text-transform:capitalize}.status-success{background:linear-gradient(135deg,#d1fae5,#a7f3d0);color:#065f46}.status-failed{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#991b1b}.status-pending{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}.action-cell{display:flex;gap:.5rem}.btn-icon{padding:.5rem;border:none;border-radius:8px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.btn-view{background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1e40af}.btn-view:hover{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;transform:scale(1.1)}.btn-history{background:linear-gradient(135deg,#e0e7ff,#c7d2fe);color:#4338ca}.btn-history:hover{background:linear-gradient(135deg,#6366f1,#4f46e5);color:#fff;transform:scale(1.1)}.btn-export{background:linear-gradient(135deg,#dbeafe,#bfdbfe);color:#1e40af}.btn-export:hover{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;transform:scale(1.1)}.btn-restore{background:linear-gradient(135deg,#fef3c7,#fde68a);color:#92400e}.btn-restore:hover{background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;transform:scale(1.1)}.no-data{text-align:center;padding:3rem!important;color:#9ca3af;font-style:italic}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem;background:#fff;border-radius:16px;box-shadow:0 4px 12px #00000014}.spinner{width:50px;height:50px;border:4px solid #e5e7eb;border-top-color:#4f46e5;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:1rem}@keyframes spin{to{transform:rotate(360deg)}}.loading-container p{color:#6b7280;font-size:1rem}.pagination{display:flex;justify-content:center;align-items:center;gap:.5rem;margin-top:2rem}.pagination-btn{padding:.5rem 1rem;border:2px solid #e5e7eb;background:#fff;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;color:#374151}.pagination-btn:hover:not(:disabled){background:#4f46e5;color:#fff;border-color:#4f46e5}.pagination-btn:disabled{opacity:.5;cursor:not-allowed}.pagination-numbers{display:flex;gap:.5rem}.pagination-number{width:40px;height:40px;border:2px solid #e5e7eb;background:#fff;border-radius:8px;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .2s ease;color:#374151}.pagination-number:hover{background:#f3f4f6;border-color:#4f46e5}.pagination-number.active{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;border-color:#4f46e5}.pagination-ellipsis{display:flex;align-items:center;padding:0 .5rem;color:#9ca3af}.audit-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.audit-modal-content{background:#fff;border-radius:20px;box-shadow:0 20px 40px #0003;max-width:600px;width:90%;max-height:85vh;overflow-y:auto;animation:audit-modalSlideIn .3s ease}.modal-large{max-width:900px}@keyframes audit-modalSlideIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.audit-modal-header{background:linear-gradient(135deg,#4f46e5,#6366f1);color:#fff;padding:1.5rem 2rem;border-radius:20px 20px 0 0;display:flex;justify-content:space-between;align-items:center}.audit-modal-header h2{margin:0;font-size:1.5rem;font-weight:700}.audit-modal-close{background:#fff3;border:none;color:#fff;font-size:2rem;width:40px;height:40px;border-radius:50%;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;line-height:1;padding:0}.audit-modal-close:hover{background:#ffffff4d;transform:rotate(90deg)}.audit-modal-body{padding:2rem}.detail-row{display:flex;padding:1rem;border-bottom:1px solid #f3f4f6}.detail-row:last-child{border-bottom:none}.detail-label{font-weight:600;color:#4b5563;min-width:150px}.detail-value{color:#1f2937;flex:1;word-break:break-word}.history-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-bottom:1.5rem;padding:1rem;background:#f9fafb;border-radius:12px}.history-stat{text-align:center;font-size:.9rem}.history-stat strong{display:block;color:#6b7280;font-size:.8rem;margin-bottom:.25rem;text-transform:uppercase}.history-list{display:flex;flex-direction:column;gap:1rem;max-height:500px;overflow-y:auto}.history-item{background:#f9fafb;border-radius:12px;padding:1rem;border-left:4px solid #4f46e5;transition:all .2s ease}.history-item:hover{background:#f3f4f6;box-shadow:0 2px 8px #00000014}.history-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.history-action{font-weight:600;color:#1f2937;font-size:1rem}.history-item-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.5rem}.history-detail{font-size:.85rem;color:#6b7280}.history-detail strong{color:#4b5563;margin-right:.5rem}@media (max-width: 1200px){.audit-log-container{width:100vw;margin-left:0}.search-filter-row{flex-direction:column}.search-box,.filter-box{max-width:100%}}@media (max-width: 768px){.audit-log-header,.audit-log-content{padding:1.5rem}.audit-stats-cards{grid-template-columns:1fr}.tabs-section{flex-direction:column;align-items:stretch}.tabs-container{width:100%}.tab{flex:1;justify-content:center}.btn-danger{width:100%;justify-content:center}.audit-table-container{overflow-x:auto}.audit-table{min-width:900px}.audit-modal-content{width:95%}.history-stats{grid-template-columns:1fr}.action-cell{flex-wrap:wrap}}.role-badges{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.role-badge{padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500;display:inline-block}.role-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.role-secondary{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.ip-cell{font-family:Courier New,monospace;font-size:13px;color:#555;max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resource-cell{max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;cursor:help}.calendar-icon{margin-right:6px;vertical-align:middle;color:#666}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.invoice-container{min-height:100vh;max-height:100vh;display:flex;flex-direction:column;align-items:center;box-sizing:border-box;margin:0 auto;min-width:100vw;max-width:100vw;overflow-y:auto;background-image:url("/assets/kantor_icp(landscape2)-H3kZIvM7.webp");background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;color:#333;animation:fadeIn .6s ease-out;position:relative}.invoice-header-enhanced{max-width:100vw;width:100%;min-height:10vh;margin:0;padding:0;background:linear-gradient(135deg,#fff,#f8fafc);box-shadow:0 4px 20px #00000014;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:1000;border-bottom:1px solid #e2e8f0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.logo-section{display:flex;margin-left:2vw;align-items:center;gap:15px}.logo-container{width:50px;height:50px;border-radius:12px;overflow:hidden;box-shadow:0 4px 12px #4f46e54d}.logo-image{width:100%;height:100%;object-fit:contain}.logo-placeholder{width:100%;height:100%;background:linear-gradient(135deg,#4f46e5,#7c3aed);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:16px}.logo-text{font-size:16px;font-weight:600;color:#1e293b;line-height:1.3}.subtitle{font-size:12px;color:#64748b;font-weight:400}.nav-shortcuts{display:flex;gap:8px;background:#fffc;padding:8px;border-radius:12px;border:1px solid #e2e8f0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.nav-item{padding:8px 16px;border-radius:8px;border:none;background:transparent;color:#64748b;font-size:13px;font-weight:500;transition:all .2s ease;display:flex;align-items:center;gap:8px;cursor:pointer;text-decoration:none}.nav-item:hover{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;transform:translateY(-1px);box-shadow:0 4px 12px #4f46e54d}.nav-item.active{background:linear-gradient(135deg,#4f46e5,#7c3aed);color:#fff;box-shadow:0 2px 8px #4f46e54d}.nav-icon{width:16px;height:16px}.dashpro-user-info-section{display:flex;align-items:center;gap:15px;background:#fffc;margin-right:2vw;padding:8px 16px;border-radius:12px;border:1px solid #e2e8f0;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.dashpro-user-details{display:flex;flex-direction:column;align-items:flex-end;gap:2px}.dashpro-user-name{font-size:14px;font-weight:600;color:#1e293b}.invoice-id{font-size:11px;color:#64748b;background:#f1f5f9;padding:2px 8px;border-radius:6px;border:1px solid #e2e8f0}.dashpro-user-avatar{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;text-transform:uppercase;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #f59e0b4d;position:relative}.dashpro-user-avatar:hover{transform:scale(1.05);box-shadow:0 6px 20px #f59e0b66}.status-indicator{position:absolute;top:-2px;right:-2px;width:12px;height:12px;background:#10b981;border:2px solid white;border-radius:50%;animation:pulse 2s infinite}@keyframes pulse{0%{box-shadow:0 0 #10b981b3}70%{box-shadow:0 0 0 10px #10b98100}to{box-shadow:0 0 #10b98100}}@media (max-width: 768px){.nav-shortcuts{order:3;width:100%;justify-content:center}.nav-item{flex:1;justify-content:center}}.invoice-main-content{max-width:1100px;margin:0 auto;padding:40px 20px}.invoice-title-status-container{border-radius:25px;padding:15px 30px;box-shadow:0 4px 15px #3498db33;max-width:400px;margin:0 auto 40px;text-align:center}.invoice-title{text-align:center;font-size:32px;font-weight:700;color:#2c3e50;margin-bottom:0;text-shadow:0 2px 4px rgba(0,0,0,.1)}.invoice-main-status{text-align:center;font-size:24px;font-weight:600;color:#3498db;padding:0;background:none;border-radius:0;box-shadow:none;display:block;width:100%;max-width:400px;margin:8px auto 0}.progress-bar-section{background:#fff;padding:40px;border-radius:16px;box-shadow:0 8px 30px #0000001a;margin-bottom:30px;position:relative;overflow:hidden}.progress-bar-section:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:navy}.progress-bar-track{height:8px;background:#e9ecef;border-radius:4px;margin-bottom:30px;position:relative;overflow:hidden}.progress-bar-fill{height:100%;background:#c20909;border-radius:4px;transition:width .8s ease-in-out;position:relative}@keyframes shimmer{0%{left:-100%}to{left:100%}}.progress-status-list{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}.progress-status-item{display:flex;flex-direction:column;align-items:center;flex:1;text-align:center;transition:all .3s ease}.progress-status-item:hover{transform:translateY(-2px)}.status-dot{width:24px;height:24px;border-radius:50%;background:#dee2e6;border:3px solid #fff;box-shadow:0 2px 8px #0000001a;margin-bottom:12px;transition:all .3s ease;position:relative}.progress-status-item.completed .status-dot{background:linear-gradient(135deg,#2ecc71,#27ae60);box-shadow:0 4px 15px #2ecc7166}.progress-status-item.completed .status-dot:after{content:"✓";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:12px;font-weight:700}.status-label{font-size:14px;font-weight:500;color:#6c757d;line-height:1.4;max-width:150px;transition:color .3s ease}.progress-status-item.completed .status-label{color:#2ecc71;font-weight:600}.order-details-section,.cost-details-section{background:#fff;padding:30px;border-radius:16px;box-shadow:0 6px 25px #00000014;margin-bottom:25px;transition:transform .2s ease,box-shadow .2s ease}.order-details-section:hover,.cost-details-section:hover{transform:translateY(-2px);box-shadow:0 8px 35px #0000001f}.monthly-cost-details-section{background:#fff;padding:30px;border-radius:16px;box-shadow:0 6px 25px #00000014;margin-bottom:25px;transition:transform .2s ease,box-shadow .2s ease}.monthly-cost-details-section:hover{transform:translateY(-2px);box-shadow:0 8px 35px #0000001f}.monthly-cost-details-box p{margin:0;font-size:15px;line-height:1.6;color:#495057;padding:8px 0;border-bottom:1px solid #f8f9fa}.monthly-cost-details-box p:last-child{border-bottom:none}.monthly-cost-details-box strong{color:#2c3e50;font-weight:600;min-width:120px;display:inline-block}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0000004d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:999;display:flex;align-items:center;justify-content:center}.period-detail-modal{background:#fff;border-radius:12px;box-shadow:0 20px 40px #00000026;z-index:1000;min-width:320px;max-width:400px;border:1px solid #e5e7eb;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #f3f4f6;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px 12px 0 0;color:#fff}.modal-header h4{margin:0;font-size:16px;font-weight:600;flex:1}.close-btn{background:none;border:none;color:#fff;font-size:18px;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background .2s ease}.close-btn:hover{background:#fff3}.modal-content{padding:20px;max-height:400px;overflow-y:auto}.detail-item{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px;padding:8px 0;border-bottom:1px solid #f9fafb}.detail-item:last-child{border-bottom:none;margin-bottom:0}.detail-label{font-weight:600;color:#374151;font-size:14px;min-width:100px;display:flex;align-items:center;gap:4px}.detail-value{font-size:14px;color:#6b7280;text-align:right;flex:1;margin-left:12px}.detail-value.status-badge{padding:4px 12px;border-radius:20px;font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.5px;text-align:center}.detail-value.amount{color:#059669;font-weight:700;font-size:15px}.detail-value.invoice-number{color:#1d4ed8;font-weight:600;font-family:Courier New,monospace;background:#eff6ff;padding:4px 8px;border-radius:4px;border:1px solid #dbeafe}.payment-summary{margin-bottom:25px;padding:20px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;color:#fff;box-shadow:0 4px 15px #667eea4d}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:15px;margin-bottom:15px}.summary-item{background:#ffffff26;padding:15px;border-radius:8px;text-align:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);transition:all .3s ease}.summary-item:hover{transform:translateY(-2px);background:#ffffff40}.summary-item.warning{background:#f59e0b33;border:1px solid rgba(245,158,11,.3)}.summary-item.danger{background:#dc262633;border:1px solid rgba(220,38,38,.3);animation:alertPulse 2s infinite}.summary-item.total{background:#22c55e33;border:1px solid rgba(34,197,94,.3)}@keyframes alertPulse{0%{box-shadow:0 0 #dc262666}70%{box-shadow:0 0 0 10px #dc262600}to{box-shadow:0 0 #dc262600}}.summary-number{font-size:24px;font-weight:700;margin-bottom:5px;display:block}.summary-label{font-size:12px;opacity:.9;text-transform:uppercase;letter-spacing:.5px}.belumlunas-amount-info{background:#fff;padding:15px;border-radius:8px;border-left:4px solid #f59e0b;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.belumlunas-amount-info p{margin:0;font-size:16px;color:#fff;border-bottom:none;padding:0}.payment-periods-container{margin-bottom:25px;padding:20px;background:#f8f9fa;border-radius:12px;border:1px solid #e9ecef}.payment-grid{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:20px;justify-content:flex-start}.payment-box{width:50px;height:50px;border-radius:8px;display:flex;align-items:center;justify-content:center;position:relative;color:#fff;font-weight:600;font-size:14px;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #00000026}.payment-box:hover{transform:translateY(-2px);box-shadow:0 4px 15px #00000040}.payment-box.current-period{border:3px solid #2c3e50;animation:pulse 2s infinite}@keyframes pulse{0%{box-shadow:0 2px 8px #00000026,0 0 #2c3e50b3}70%{box-shadow:0 2px 8px #00000026,0 0 0 10px #2c3e5000}to{box-shadow:0 2px 8px #00000026,0 0 #2c3e5000}}.period-number{font-size:16px;font-weight:700}.current-indicator{position:absolute;top:-5px;right:-5px;background:#2c3e50;color:#fff;border-radius:50%;width:12px;height:12px;font-size:8px;display:flex;align-items:center;justify-content:center;animation:blink 1.5s infinite}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:.3}}.payment-legend{display:flex;flex-wrap:wrap;gap:15px;justify-content:flex-start}.legend-item{display:flex;align-items:center;gap:8px;font-size:14px;color:#495057}.legend-color{width:16px;height:16px;border-radius:4px;border:1px solid rgba(0,0,0,.1)}.current-period-info{margin-top:20px;padding:20px;background:#fff;border-radius:12px;border:1px solid #e9ecef;box-shadow:0 2px 8px #00000014}.current-period-info p{margin:12px 0;padding:12px 16px;border-radius:8px;background:#f8f9fa;border-left:4px solid #6c757d;font-size:15px;line-height:1.5}.current-period-info p:first-child{background:linear-gradient(135deg,#e3f2fd,#f3e5f5);border-left-color:#2196f3}.current-period-info p:nth-child(2){background:linear-gradient(135deg,#fff3e0,#fce4ec);border-left-color:#ff9800}.current-period-info p:nth-child(3){background:linear-gradient(135deg,#f3e5f5,#e8f5e8);border-left-color:#4caf50}.current-period-info p:last-child{background:linear-gradient(135deg,#ffebee,#fce4ec);border-left-color:#f44336;font-weight:600}.current-period-info strong{color:#2c3e50;font-weight:600;display:block;margin-bottom:4px}@media (max-width: 768px){.summary-grid{grid-template-columns:repeat(2,1fr);gap:10px}.summary-item{padding:12px}.summary-number{font-size:20px}.summary-label{font-size:11px}.belumlunas-amount-info p{font-size:14px}.payment-box{width:40px;height:40px;font-size:12px}.payment-grid{gap:8px}.payment-legend{gap:10px}.legend-item{font-size:12px}.period-number{font-size:14px}.period-detail-modal{min-width:300px;max-width:90vw}.modal-content{padding:16px}.detail-item{flex-direction:column;align-items:flex-start;gap:4px}.detail-value{text-align:left;margin-left:0}.detail-label{min-width:auto}}.details-title{font-size:22px;font-weight:600;color:#2c3e50;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #e9ecef;position:relative}.details-title:after{content:"";position:absolute;bottom:-2px;left:0;width:50px;height:2px;background:linear-gradient(90deg,#3498db,#2ecc71)}.order-details-box{display:grid;grid-template-columns:1fr 1fr;gap:30px}.order-details-left,.order-details-right{display:flex;flex-direction:column;gap:12px}.order-details-box p,.cost-details-box p{margin:0;font-size:15px;line-height:1.6;color:#495057;padding:8px 0;border-bottom:1px solid #f8f9fa}.order-details-box p:last-child,.cost-details-box p:last-child{border-bottom:none}.order-details-box strong,.cost-details-box strong{color:#2c3e50;font-weight:600;min-width:120px;display:inline-block}.cost-details-box{display:flex;flex-direction:column;gap:12px}.notes-section{background:#fff;padding:30px;border-radius:16px;box-shadow:0 6px 25px #00000014;margin-bottom:25px;transition:transform .2s ease,box-shadow .2s ease}.notes-section:hover{transform:translateY(-2px);box-shadow:0 8px 35px #0000001f}.notes-box{display:flex;flex-direction:column;gap:12px}.notes-box p{margin:0;font-size:15px;line-height:1.6;color:#495057;padding:8px 0;border-bottom:1px solid #f8f9fa}.notes-box p:last-child{border-bottom:none}.notes-box strong{color:#2c3e50;font-weight:600;min-width:120px;display:inline-block}.order-details-actions{display:flex;justify-content:center;gap:20px;margin-top:30px;flex-wrap:wrap}.btn{padding:14px 28px;font-size:16px;font-weight:600;border:none;border-radius:8px;cursor:pointer;transition:all .3s ease;text-decoration:none;display:inline-block;text-align:center;min-width:160px;position:relative;overflow:hidden}.btn:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s ease}.btn:hover:before{left:100%}.btn-primary{background:linear-gradient(135deg,#3498db,#2980b9);color:#fff;box-shadow:0 4px 15px #3498db4d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #3498db66}.btn-primary:active{transform:translateY(0)}.btn.disabled{background:#95a5a6;color:#fff;cursor:not-allowed;opacity:.6;transform:none!important;box-shadow:none!important}.btn.disabled:hover{transform:none;box-shadow:none}.error-animation{animation:fadeIn .5s ease-out}.error-icon{width:80px;height:80px;margin-bottom:20px;opacity:.8}.invoice-not-found-container{animation:fadeIn .6s ease-out}.loading-container{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.spinner{animation:spin 1s linear infinite}.tooltip-wrapper{position:relative;display:inline-block}.tooltip-text{visibility:hidden;opacity:0;transition:opacity .2s ease;position:absolute;top:110%;left:50%;transform:translate(-50%);background:#000000a0;color:#fff;padding:6px;border-radius:4px;white-space:nowrap;z-index:1}.tooltip-wrapper.show-tooltip:hover .tooltip-text{visibility:visible;opacity:1}@media (max-width: 768px){.logo{justify-content:center}.dashpro-user-info{align-items:center}.invoice-main-content{padding:20px 15px}.invoice-title{font-size:24px}.invoice-main-status{font-size:18px;padding:12px 20px}.progress-bar-section{padding:25px 20px}.progress-status-list{flex-direction:column;gap:15px}.progress-status-item{flex-direction:row;text-align:left;justify-content:flex-start;gap:15px}.status-dot{flex-shrink:0;margin-bottom:0}.status-label{max-width:none}.order-details-box{grid-template-columns:1fr;gap:20px}.order-details-section,.cost-details-section{padding:20px}.details-title{font-size:18px}.order-details-actions{flex-direction:column;align-items:center;gap:15px}.btn{width:100%;max-width:300px}}@media (max-width: 480px){.logo-image{width:50px;height:50px}.logo-text{font-size:14px}.dashpro-user-avatar{width:35px;height:35px;font-size:12px}.invoice-title{font-size:20px}.invoice-main-status{font-size:16px;padding:10px 15px}.progress-bar-section{padding:20px 15px}.order-details-section,.cost-details-section{padding:15px}.details-title{font-size:16px}.order-details-box p,.cost-details-box p{font-size:14px}.btn{padding:12px 20px;font-size:14px}}@media print{.invoice-container{background:#fff;box-shadow:none}.invoice-header{box-shadow:none;border-bottom:2px solid #000}.progress-bar-section,.order-details-section,.cost-details-section{box-shadow:none;border:1px solid #ddd}.order-details-actions,.btn{display:none}}@media (prefers-reduced-motion: reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}@media (prefers-contrast: high){.invoice-container{background:#000;color:#fff}.invoice-header,.progress-bar-section,.order-details-section,.cost-details-section{background:#fff;color:#000;border:2px solid #000}.btn-primary{background:#000;color:#fff;border:2px solid #fff}}.dashboard-footer{margin-top:40px;padding:0;text-align:center;font-size:14px;color:#fff}.dashboard-footer a{color:#007bff;text-decoration:none;font-weight:500}.dashboard-footer a:hover{text-decoration:underline}.dashboard-footer p{margin:0 0 10px}.faq-link:hover{text-decoration:underline}.copyright-text{margin:0 0 10px;font-size:14px;color:#fff}@media (max-width: 768px){.dashboard-footer{padding:15px;font-size:12px}}.btn:focus,.dashpro-user-avatar:focus{outline:3px solid #3498db;outline-offset:2px}html{scroll-behavior:smooth}section{scroll-margin-top:100px}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#c1c1c1;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#a8a8a8}*{margin:0;padding:0;box-sizing:border-box}.invoice-checker-app{font-family:Inter,sans-serif;min-height:100vh;max-height:100vh;min-width:100vw;max-width:100vw;background:linear-gradient(#0006,#0006),url("/assets/kantor_icp(landscape2)-H3kZIvM7.webp") center/cover no-repeat;background-attachment:fixed;display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:20px}.background-image{position:fixed;top:0;left:0;width:100%;height:100%;z-index:-1}.background-image img{width:100%;height:100%;object-fit:cover}.main-container{display:flex;flex-direction:column;align-items:center;width:100%;max-width:500px;min-height:calc(100vh - 100px);justify-content:center}.inv-logo-section{text-align:center;margin-bottom:60px;color:#000}.logo{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:10px}.logo-icon{width:50px;height:50px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3)}.company-name{color:#1a1a1a;font-size:2.2rem;font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.company-subtitle{color:#666;font-size:1.5rem;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.form-container{background:#fffffff2;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;padding:40px;box-shadow:0 20px 40px #0000004d;border:1px solid rgba(255,255,255,.2);width:100%;max-width:400px;text-align:center}.form-title{font-size:28px;font-weight:700;color:#2c3e50;margin-bottom:30px;text-shadow:0 2px 4px rgba(0,0,0,.1)}.input-group{margin-bottom:25px;text-align:left}.input-field{width:100%;padding:15px 20px;border:2px solid #e1e8ed;border-radius:12px;font-size:16px;transition:all .3s ease;background:#fff;color:#2c3e50}.input-field:focus{outline:none;border-color:#3498db;box-shadow:0 0 0 3px #3498db1a;transform:translateY(-2px)}.input-field::placeholder{color:#95a5a6;font-weight:400}.check-button{padding:15px 30px;border:none;border-radius:12px;font-size:15px;font-weight:600;cursor:pointer;transition:all .5s cubic-bezier(.4,0,.2,1);text-decoration:none;display:inline-block;text-align:center;position:relative;overflow:hidden;min-width:160px}.check-button{background:linear-gradient(135deg,#6a5acd,#4169e1);color:#fff;box-shadow:0 6px 20px #6a5acd66;border:2px solid transparent}.check-button:hover{background:linear-gradient(135deg,#4169e1,#483d8b);transform:translateY(-3px);box-shadow:0 10px 30px #6a5acd80}.check-button:active{transform:translateY(-1px);box-shadow:0 4px 15px #6a5acd66}.check-button:focus{outline:none;box-shadow:0 0 0 3px #4169e133}.copyright{color:#fff;font-size:14px;text-align:center;text-shadow:0 2px 4px rgba(0,0,0,.5);margin-top:20px}.loading{margin-top:10px;color:#3498db;font-size:14px}.error-message{color:#e74c3c;font-size:14px;margin-top:10px;padding:10px;background:#e74c3c1a;border-radius:8px;border:1px solid rgba(231,76,60,.2)}.success-message{color:#27ae60;font-size:14px;margin-top:10px;padding:10px;background:#27ae601a;border-radius:8px;border:1px solid rgba(39,174,96,.2)}.button-group{display:flex;flex-direction:column;justify-content:center;gap:15px;margin-top:20px}@media (max-width: 768px){.form-container{padding:30px 20px;margin:20px 10px}.form-title{font-size:24px}.logo-section{margin-bottom:40px}.company-name{font-size:16px}.company-subtitle{font-size:14px}}@media (max-width: 480px){.form-container{padding:25px 15px}.form-title{font-size:22px}.input-field{padding:12px 15px}.check-button{padding:12px;font-size:15px}}.faq-user-container{max-width:100vw;min-width:100vw;margin:0 auto;padding:2rem;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif;line-height:1.6;color:#333;background-image:url("/assets/kantor_icp(landscape2)-H3kZIvM7.webp");background-size:cover;background-position:center;background-repeat:no-repeat;background-attachment:fixed;min-height:100vh;max-height:100vh;position:relative;overflow-y:auto}.faq-user-container:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:1}.faq-user-container>*{position:relative;z-index:2}.faq-user-header{text-align:center;margin:0 auto 3rem;padding:2rem;max-width:1200px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;color:#fff;box-shadow:0 8px 32px #0000001a}.faq-user-header h1{font-size:2.5rem;font-weight:700;margin-bottom:.5rem;text-shadow:0 2px 4px rgba(0,0,0,.1)}.faq-user-subtitle{font-size:1.2rem;opacity:.9;max-width:600px;margin:0 auto;font-weight:300}.faq-user-main{max-width:1200px;background:#fff;border-radius:12px;padding:2.5rem;box-shadow:0 4px 20px #00000014;margin:0 auto 2rem}.faq-user-back-button-container{max-width:1200px;margin:2rem auto;text-align:center}.faq-user-back-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:12px 24px;font-size:1.1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 12px #667eea4d}.faq-user-back-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #667eea66}.faq-user-back-button:active{transform:translateY(0);box-shadow:0 2px 8px #667eea4d}.faq-user-section{margin-bottom:2.5rem;padding-bottom:2rem;border-bottom:1px solid #e9ecef;padding:20px}.faq-user-section:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}.faq-user-section h2{color:#2c3e50;font-size:1.8rem;font-weight:600;margin-bottom:1.5rem;position:relative;padding-left:1rem}.faq-user-section h2:before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:100%;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:2px}.faq-user-section h3{color:#34495e;font-size:1.4rem;font-weight:600;margin:1.5rem 0 1rem}.faq-user-section p{color:#555;font-size:1.1rem;margin-bottom:1rem;text-align:justify}.faq-user-section ol,.faq-user-section ul{margin:1rem 0;padding-left:2rem}.faq-user-section ol li,.faq-user-section ul li{margin-bottom:.8rem;color:#555;font-size:1.1rem}.faq-user-section ol li{counter-increment:step-counter;position:relative}.faq-user-section ol li:before{content:counter(step-counter);position:absolute;left:-2rem;top:.2rem;background:#667eea;color:#fff;width:1.5rem;height:1.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:700}.faq-user-section ul li{position:relative}.faq-user-section ul li:before{content:"•";color:#667eea;font-weight:700;position:absolute;left:-1rem}.status-guide{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.5rem;margin:2rem 0}.status-item{background:#f8f9fa;padding:1.5rem;border-radius:8px;border-left:4px solid #667eea;transition:transform .3s ease,box-shadow .3s ease}.status-item:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.status-item h3{color:#2c3e50;font-size:1.3rem;margin-bottom:1rem;font-weight:600}.status-item ul{margin:0;padding-left:1.5rem}.status-item ul li{font-size:1rem;margin-bottom:.5rem}.faq-user-section a{color:#667eea;text-decoration:none;font-weight:500;transition:color .3s ease}.faq-user-section a:hover{color:#764ba2;text-decoration:underline}@media (max-width: 768px){.faq-user-container{padding:1rem}.faq-user-header{padding:1.5rem;margin-bottom:2rem}.faq-user-header h1{font-size:2rem}.faq-user-subtitle{font-size:1rem}.faq-user-main{padding:1.5rem}.faq-user-section h2{font-size:1.5rem}.faq-user-section h3{font-size:1.2rem}.status-guide{grid-template-columns:1fr}.faq-user-back-button{font-size:1rem;padding:10px 20px}}@media (max-width: 480px){.faq-user-container{padding:.5rem}.faq-user-header{padding:1rem}.faq-user-header h1{font-size:1.5rem}.faq-user-main{padding:1rem}.faq-user-back-button{font-size:.9rem;padding:8px 16px}}.faq-user-section{animation:fadeInUp .6s ease-out}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.faq-user-container::-webkit-scrollbar{width:8px}.faq-user-container::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.faq-user-container::-webkit-scrollbar-thumb{background:#667eea;border-radius:4px}.faq-user-container::-webkit-scrollbar-thumb:hover{background:#764ba2}.faq-admin-container{width:83vw;margin-left:17vw;font-family:Inter,sans-serif;background-color:#f8fafc;min-height:100vh;max-height:100vh;overflow-y:auto;box-sizing:border-box}.faq-header{text-align:center;padding:30px 20px;display:flex;flex-direction:column;width:100%;position:relative;min-height:10vh;box-sizing:border-box;margin-bottom:20px;background:linear-gradient(135deg,#4f46e5,#6366f1)}.faq-header h1{font-size:2rem;font-weight:700;color:#fff;margin-bottom:6px;letter-spacing:-.5px;line-height:1.2;text-transform:none;font-family:Inter,sans-serif}.faq-header p{font-size:1rem;color:#fff;font-weight:500;font-family:Inter,sans-serif}.faq-search-container{position:relative;max-width:600px;margin:0 auto 3rem}.faq-search-input{width:100%;padding:1rem 1rem 1rem 3rem;font-size:1rem;border:2px solid #e2e8f0;border-radius:50px;outline:none;transition:all .3s ease;background-color:#fff;box-shadow:0 2px 10px #0000001a}.faq-search-input:focus{border-color:#667eea;box-shadow:0 4px 20px #667eea33}.search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:#64748b;pointer-events:none}.faq-content{display:flex;flex-direction:column;gap:1.5rem}.faq-section{background:#fff;border-radius:12px;box-shadow:0 4px 6px #0000000d,0 1px 3px #0000001a;overflow:hidden;transition:all .3s ease}.faq-section:hover{box-shadow:0 8px 25px #0000001a}.faq-section-header{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 2rem;background:linear-gradient(135deg,#f8fafc,#e2e8f0);cursor:pointer;transition:all .3s ease;border-bottom:1px solid #e2e8f0}.faq-section-header:hover{background:linear-gradient(135deg,#e2e8f0,#cbd5e1)}.section-title{display:flex;align-items:center;gap:1rem}.section-title h2{font-size:1.5rem;font-weight:600;color:#1e293b;margin:0}.faq-icon{width:32px;height:32px;color:#667eea;stroke-width:2}.chevron-icon{width:24px;height:24px;color:#64748b;transition:transform .3s ease}.faq-section-content{max-height:0;overflow:hidden;transition:max-height .3s ease-out;background-color:#fff}.faq-section-content.expanded{max-height:none;transition:max-height .3s ease-in}.faq-item{padding:1.5rem 2rem;border-bottom:1px solid #f1f5f9;transition:background-color .3s ease}.faq-answer p{margin:0;font-size:1rem;color:#475569;line-height:1.6}.faq-answer-list{margin-top:.5rem;padding-left:1.5rem}.faq-item li{margin-bottom:.5rem;font-size:1rem;color:#475569;line-height:1.6;list-style-type:disc;padding-left:1.5rem;position:relative;margin-left:1.5rem;font-weight:400;font-family:Inter,sans-serif}.faq-item:last-child{border-bottom:none}.faq-item:hover{background-color:#f8fafc}.faq-question{font-size:1.125rem;font-weight:600;color:#1e293b;margin-bottom:.75rem;line-height:1.5}.faq-answer{font-size:1rem;color:#475569;line-height:1.7;margin:0}.faq-footer{text-align:center;margin-top:3rem;padding:2rem;background-color:#fff;border-radius:12px;box-shadow:0 4px 6px #0000000d}.faq-footer p{color:#64748b;font-size:1rem;margin:0}.faq-footer strong{color:#1e293b}@media (max-width: 768px){.faq-admin-container{min-width:100vw;max-width:100vw;margin-left:0}.faq-header{padding-top:6vh}.header-icon{width:40px;height:40px}.faq-subtitle{font-size:1rem}.faq-search-container{margin-bottom:2rem}.faq-section-header{padding:1rem 1.5rem}.section-title h2{font-size:1.25rem}.faq-icon{width:28px;height:28px}.faq-item{padding:1rem 1.5rem}.faq-question{font-size:1rem}.faq-answer{font-size:.875rem}}@media (max-width: 1024px){.faq-admin-container{min-width:83vw;max-width:83vw;margin-left:17vw}}@media (max-width: 768px){.faq-admin-container{min-width:100vw;max-width:100vw;margin-left:0vw}}@media (max-width: 480px){.faq-header h1{font-size:1.75rem}.faq-section-header{padding:1rem}.section-title{gap:.75rem}.section-title h2{font-size:1.125rem}.faq-item{padding:1rem}}.faq-section-content{max-height:0;overflow:hidden;transition:max-height .3s ease-out}.faq-section-content.expanded{max-height:2000px;transition:max-height .5s ease-in}.loading{display:flex;justify-content:center;align-items:center;padding:3rem;color:#64748b}.empty-state{text-align:center;padding:3rem;color:#64748b}.empty-state h3{font-size:1.5rem;margin-bottom:.5rem;color:#475569}.empty-state p{font-size:1rem;margin:0}.faq-content::-webkit-scrollbar{width:8px}.faq-content::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}.faq-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}.faq-content::-webkit-scrollbar-thumb:hover{background:#94a3b8}.cookies-layout{position:relative}.cookies-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#00000080;display:flex;align-items:flex-end;justify-content:center;z-index:9999;animation:fadeIn .3s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.cookies-modal{background:#fff;border-radius:24px 24px 0 0;box-shadow:0 -10px 40px #0003;width:100%;max-width:672px;padding:32px;animation:slideUp .4s ease-out}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.cookies-modal-content{display:flex;gap:16px}.cookies-icon{flex-shrink:0;width:48px;height:48px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff}.cookies-text-content{flex:1}.cookies-text-content h2{font-size:24px;font-weight:700;color:#1a202c;margin:0 0 12px}.cookies-description{color:#4a5568;line-height:1.6;margin:0 0 16px;font-size:15px}.cookies-policy-link{font-size:14px;color:#718096;margin:0 0 24px}.cookies-policy-link a{color:#5a67d8;font-weight:600;text-decoration:underline;text-underline-offset:2px;transition:color .2s ease}.cookies-policy-link a:hover{color:#4c51bf}.cookies-modal-buttons{display:flex;gap:12px}.cookies-modal-buttons button{flex:1;padding:12px 24px;border-radius:12px;font-weight:600;font-size:15px;cursor:pointer;transition:all .2s ease;border:none;outline:none}.btn-agree{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;box-shadow:0 4px 12px #667eea66}.btn-agree:hover{transform:translateY(-2px);box-shadow:0 6px 16px #667eea80}.btn-remind{background:#edf2f7;color:#2d3748}.btn-remind:hover{background:#e2e8f0;transform:translateY(-2px)}.policy-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background-color:#0009;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px;animation:fadeIn .3s ease-out}.policy-modal{background:#fff;border-radius:16px;box-shadow:0 20px 60px #0000004d;width:100%;max-width:700px;max-height:85vh;display:flex;flex-direction:column;animation:scaleIn .3s ease-out}@keyframes scaleIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}.policy-modal-header{display:flex;justify-content:space-between;align-items:center;padding:24px 28px;border-bottom:2px solid #e2e8f0}.policy-modal-header h2{font-size:24px;font-weight:700;color:#1a202c;margin:0}.close-button{width:36px;height:36px;border-radius:50%;background:#f7fafc;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#4a5568;transition:all .2s ease}.close-button:hover{background:#edf2f7;color:#2d3748;transform:rotate(90deg)}.policy-modal-body{overflow-y:auto;padding:28px;flex:1}.policy-modal-body::-webkit-scrollbar{width:8px}.policy-modal-body::-webkit-scrollbar-track{background:#f7fafc;border-radius:4px}.policy-modal-body::-webkit-scrollbar-thumb{background:#cbd5e0;border-radius:4px}.policy-modal-body::-webkit-scrollbar-thumb:hover{background:#a0aec0}.policy-intro{background:linear-gradient(135deg,#667eea15,#764ba215);border-left:4px solid #667eea;padding:16px 20px;border-radius:8px;margin-bottom:28px}.policy-intro p{margin:0;color:#2d3748;line-height:1.6;font-size:15px}.policy-section{margin-bottom:24px}.policy-section h3{font-size:18px;font-weight:700;color:#1a202c;margin:0 0 12px}.policy-section p{color:#4a5568;line-height:1.6;margin:0;font-size:15px}.policy-item{display:flex;gap:16px;padding:20px;background:#f7fafc;border-radius:12px;margin-bottom:16px;transition:all .2s ease}.policy-item:hover{background:#edf2f7;transform:translate(4px)}.policy-item-icon{flex-shrink:0;width:40px;height:40px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px;display:flex;align-items:center;justify-content:center;color:#fff}.policy-item-content h4{font-size:16px;font-weight:600;color:#2d3748;margin:0 0 8px}.policy-item-content p{color:#4a5568;line-height:1.6;margin:0;font-size:14px}.policy-footer{margin-top:28px;padding-top:20px;border-top:1px solid #e2e8f0}.policy-footer p{color:#718096;font-size:13px;text-align:center;margin:0;font-style:italic}.policy-modal-actions{padding:20px 28px;border-top:2px solid #e2e8f0;display:flex;justify-content:flex-end}.btn-close-policy{padding:12px 32px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:10px;font-weight:600;font-size:15px;cursor:pointer;transition:all .2s ease;box-shadow:0 4px 12px #667eea4d}.btn-close-policy:hover{transform:translateY(-2px);box-shadow:0 6px 16px #667eea66}@media (max-width: 768px){.cookies-modal{padding:24px;max-width:100%}.cookies-modal-content{flex-direction:column}.cookies-icon{width:40px;height:40px}.cookies-text-content h2{font-size:20px}.cookies-modal-buttons{flex-direction:column}.policy-modal{max-width:95%;max-height:90vh}.policy-modal-header,.policy-modal-body,.policy-modal-actions{padding:20px}.policy-item{flex-direction:column}}