:root{--primary: #4f46e5;--primary-hover: #4338ca;--primary-light: #e0e7ff;--success: #10b981;--success-light: #d1fae5;--warning: #f59e0b;--warning-light: #fef3c7;--danger: #ef4444;--danger-light: #fee2e2;--bg-app: #f1f5f9;--bg-sidebar: #0f172a;--bg-sidebar-hover: #1e293b;--card-bg: #ffffff;--text-main: #1e293b;--text-muted: #64748b;--text-light: #94a3b8;--border-color: #cbd5e1;--border-light: #e2e8f0;--font-sans: "Inter", "Sarabun", sans-serif;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .05);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);--radius: 12px;--radius-sm: 6px;--transition: all .25s cubic-bezier(.4, 0, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-sans);background-color:var(--bg-app);color:var(--text-main);min-height:100vh;font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-weight:600;color:var(--text-main)}a{color:inherit;text-decoration:none}button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}.text-muted{color:var(--text-muted)}.text-center{text-align:center}.text-right{text-align:right}.text-success{color:var(--success)}.text-warning{color:var(--warning)}.text-danger{color:var(--danger)}.mt-2{margin-top:.5rem}.mt-3{margin-top:1rem}.mt-4{margin-top:1.5rem}.row{display:flex;margin-left:-10px;margin-right:-10px}.col-6{width:50%;padding:0 10px}.col-12{width:100%;padding:0 10px}.hidden{display:none!important}.cursor-pointer{cursor:pointer}.app-container{display:flex;min-height:100vh}.sidebar{width:260px;background-color:var(--bg-sidebar);color:#fff;display:flex;flex-direction:column;flex-shrink:0;box-shadow:var(--shadow-lg);position:relative;z-index:10}.sidebar-header{padding:24px;display:flex;align-items:center;gap:12px;border-bottom:1px solid rgba(255,255,255,.08)}.logo-icon{width:40px;height:40px;border-radius:50%;border:2px solid #ffffff;background:linear-gradient(135deg,var(--primary),#6366f1);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0}.logo-text h2{color:#fff;font-size:18px;margin:0}.logo-text span{font-size:11px;color:var(--text-light);display:block}.sidebar-menu{padding:24px 16px;display:flex;flex-direction:column;gap:4px;flex-grow:1;overflow-y:auto}.sidebar-section-title{font-size:11px;text-transform:uppercase;font-weight:700;color:#fff6;letter-spacing:.5px;margin-top:16px;margin-bottom:8px;padding-left:12px}.tab-header{display:flex;gap:15px;border-bottom:1px solid var(--border-light);margin-bottom:20px}.tab-button{background:none;border:none;font-family:inherit;font-size:14px;font-weight:600;color:var(--text-muted);padding:10px 15px;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s ease}.tab-button:hover{color:var(--primary)}.tab-button.active{color:var(--primary);border-bottom-color:var(--primary)}.tab-content-pane{display:none}.tab-content-pane.active{display:block;animation:fadeIn .3s ease-in-out}.menu-item{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:var(--radius-sm);color:var(--text-light);font-weight:500;transition:var(--transition)}.menu-item i{font-size:18px}.menu-item:hover,.menu-item.active{background-color:var(--bg-sidebar-hover);color:#fff}.sidebar-footer{padding:16px;border-top:1px solid rgba(255,255,255,.08)}.user-profile{display:flex;align-items:center;justify-content:space-between}.user-profile-inner{display:flex;align-items:center;gap:12px;overflow:hidden}.avatar{width:40px;height:40px;border-radius:50%;background-color:#ffffff1a;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--text-light);overflow:hidden;flex-shrink:0}.user-info{overflow:hidden}.user-info h4{font-size:13px;color:#fff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.user-info span{font-size:10px;color:var(--text-light);display:block}.main-content{flex-grow:1;display:flex;flex-direction:column;overflow-y:auto;padding:30px;max-width:calc(100vw - 260px)}.top-navbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.header-title h1{font-size:24px;margin-bottom:4px}.header-title p{font-size:13px}.date-display{background-color:var(--card-bg);padding:10px 16px;border-radius:var(--radius);box-shadow:var(--shadow-sm);display:flex;align-items:center;gap:8px;font-weight:500}.app-view{display:none;animation:fadeIn .3s ease}.app-view.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.dashboard-card{background-color:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow-sm);border:1px solid var(--border-light);margin-bottom:24px;overflow:hidden}.dashboard-card.main-card{flex-grow:2}.dashboard-card.side-card{flex-grow:1;max-width:320px}.card-header{padding:20px 24px;border-bottom:1px solid var(--border-light);display:flex;justify-content:space-between;align-items:center}.card-header h3{font-size:16px}.card-header-flex{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--border-light);padding-bottom:12px;margin-bottom:16px}.card-body{padding:24px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-bottom:24px}.stat-card{background-color:var(--card-bg);border-radius:var(--radius);padding:20px;box-shadow:var(--shadow-sm);border:1px solid var(--border-light);display:flex;align-items:center;gap:16px;transition:var(--transition)}.stat-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}.stat-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:24px}.stat-icon.income{background-color:var(--primary-light);color:var(--primary)}.stat-icon.outstanding{background-color:var(--warning-light);color:var(--warning)}.stat-icon.paid{background-color:var(--success-light);color:var(--success)}.stat-icon.customers{background-color:#f1f5f9;color:var(--text-muted)}.stat-info h3{font-size:12px;color:var(--text-muted);font-weight:500;margin-bottom:4px}.stat-info .value{font-size:20px;font-weight:700}.stat-info .trend{font-size:11px;display:block;margin-top:2px}.dashboard-grid{display:flex;gap:24px;align-items:flex-start}.quick-actions-list{display:flex;flex-direction:column;gap:12px;padding:20px}.form-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:24px}.form-card-column{display:flex;flex-direction:column;gap:24px}.form-card{background-color:var(--card-bg);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow-sm);border:1px solid var(--border-light)}.form-header{display:flex;align-items:center;gap:16px;margin-bottom:20px}.form-header h2{font-size:20px}.form-group{display:flex;flex-direction:column;gap:6px}.form-group label{font-size:12px;font-weight:600;color:var(--text-muted)}.form-control{width:100%;padding:10px 14px;border:1px solid var(--border-color);border-radius:var(--radius-sm);outline:none;transition:var(--transition);background-color:#fff}.form-control:focus{border-color:var(--primary);box-shadow:0 0 0 3px #4f46e526}.required{color:var(--danger)}.input-with-action{display:flex;gap:8px}.customer-preview-box{background-color:#f8fafc;border:1px dashed var(--border-color);border-radius:var(--radius-sm);padding:16px;min-height:110px;display:flex;flex-direction:column;justify-content:center}.customer-preview-box p{font-size:12px;margin-top:4px}.customer-preview-box strong{font-size:14px;color:var(--text-main);display:block;margin-bottom:6px}.preview-details p{margin:2px 0}.inline-select{width:auto;display:inline-block;padding:4px 8px;font-size:12px}.table-form{width:100%;border-collapse:collapse}.table-form th{background-color:#f8fafc;border-bottom:2px solid var(--border-light);color:var(--text-muted);font-weight:600;padding:10px 12px;text-align:left;font-size:12px}.table-form td{padding:10px 6px;border-bottom:1px solid var(--border-light);vertical-align:middle}.table-form input{border:1px solid var(--border-color);border-radius:4px;padding:6px 10px;width:100%;outline:none}.table-form input:focus{border-color:var(--primary)}.totals-section{display:flex;justify-content:space-between;gap:40px}.notes-block{flex-grow:1.5}.calculation-block{flex-grow:1;min-width:320px;background-color:#f8fafc;border-radius:var(--radius-sm);padding:20px}.calc-row{display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border-light);font-weight:500}.calc-row.flex-align-center{align-items:center}.calc-row.total-row{border-bottom:none;font-size:18px;font-weight:700;color:var(--primary);padding-top:12px}.thai-baht-text-preview{font-size:12px;font-weight:600;color:var(--text-muted);text-align:right;margin-top:10px;font-style:italic}.form-actions{display:flex;justify-content:flex-end;gap:12px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:500;padding:10px 20px;border-radius:var(--radius-sm);border:none;cursor:pointer;transition:var(--transition);text-align:center}.btn-primary{background-color:var(--primary);color:#fff}.btn-primary:hover{background-color:var(--primary-hover)}.btn-success{background-color:var(--success);color:#fff}.btn-success:hover{background-color:#059669}.btn-warning{background-color:var(--warning);color:#fff}.btn-warning:hover{background-color:#d97706}.btn-danger{background-color:var(--danger);color:#fff}.btn-danger:hover{background-color:#dc2626}.btn-secondary{background-color:var(--card-bg);border:1px solid var(--border-color);color:var(--text-main)}.btn-secondary:hover{background-color:#f1f5f9}.btn-text{background:none;border:none;color:var(--primary);padding:4px}.btn-text:hover{text-decoration:underline}.btn-icon-only{padding:10px;aspect-ratio:1}.btn-sm{padding:6px 12px;font-size:12px}.btn-block{width:100%}.btn-close{background:none;border:none;font-size:28px;cursor:pointer;line-height:1;color:var(--text-muted)}.btn-close:hover{color:var(--text-main)}.table-responsive{overflow-x:auto;width:100%}.table{width:100%;border-collapse:collapse;text-align:left}.table th,.table td{padding:14px 20px;border-bottom:1px solid var(--border-light)}.table th{background-color:#f8fafc;font-weight:600;color:var(--text-muted);font-size:12px;text-transform:uppercase;letter-spacing:.05em}.table tbody tr:hover{background-color:#f8fafc}.empty-state-row td{padding:40px;color:var(--text-muted)}.badge{display:inline-flex;align-items:center;padding:4px 10px;border-radius:9999px;font-size:11px;font-weight:600}.badge.badge-draft{background-color:#f1f5f9;color:var(--text-muted)}.badge.badge-sent{background-color:var(--primary-light);color:var(--primary)}.badge.badge-unpaid{background-color:var(--warning-light);color:var(--warning)}.badge.badge-paid{background-color:var(--success-light);color:var(--success)}.badge.badge-cancelled{background-color:var(--danger-light);color:var(--danger)}.badge.badge-waiting{background-color:var(--warning-light);color:var(--warning)}.badge.badge-running{background-color:var(--primary-light);color:var(--primary)}.badge.badge-completed{background-color:var(--success-light);color:var(--success)}.sidebar-logo-img{width:100%;height:100%;object-fit:contain;border-radius:inherit;padding:2px}.settings-logo-img{width:100%;height:100%;object-fit:contain}.avatar-logo-img{width:100%;height:100%;object-fit:cover;border-radius:50%}.preview-company-logo-img{max-height:60px;max-width:120px;object-fit:contain;border-radius:4px}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px}.search-box{position:relative;flex-grow:1;max-width:480px}.search-box i{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-light);font-size:18px}.search-box input{width:100%;padding:10px 14px 10px 42px;border:1px solid var(--border-color);border-radius:var(--radius-sm);outline:none;transition:var(--transition)}.search-box input:focus{border-color:var(--primary);box-shadow:0 0 0 3px #4f46e526}.filters{display:flex;gap:10px;align-items:center}.file-upload-wrapper{position:relative}.hidden-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;cursor:pointer}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0f172a99;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;animation:fadeInModal .2s ease-out}.modal-box{background-color:var(--card-bg);border-radius:var(--radius);width:90%;max-width:540px;box-shadow:var(--shadow-lg);border:1px solid var(--border-light);display:flex;flex-direction:column;max-height:90vh}.modal-box.modal-lg{max-width:900px}.modal-header{padding:20px 24px;border-bottom:1px solid var(--border-light);display:flex;justify-content:space-between;align-items:center}.modal-header h2{font-size:18px}.modal-body{padding:24px;overflow-y:auto}.scrollable-modal-body{padding:20px;background-color:#f1f5f9;flex-grow:1;overflow-y:auto}.modal-footer{padding:16px 24px;border-top:1px solid var(--border-light);display:flex;justify-content:space-between;align-items:center}.modal-footer .left-actions,.modal-footer .right-actions{display:flex;align-items:center;gap:10px}#convert-label{font-size:12px;font-weight:600;color:var(--text-muted)}@keyframes fadeInModal{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.danger-zone{border-top:1px solid var(--border-light);padding-top:20px}.document-preview-card{background-color:#fff;box-shadow:var(--shadow-sm);border:1px solid var(--border-color);max-width:100%;min-height:850px;padding:20px 25px;margin:0 auto;font-family:Sarabun,sans-serif;color:#000}.preview-invoice{display:flex;flex-direction:column;gap:20px}.preview-header{display:flex;justify-content:space-between;border-bottom:2px solid #000000;padding-bottom:16px}.preview-company-logo{display:flex;align-items:center;gap:12px}.preview-company-logo i{font-size:40px;color:var(--primary)}.preview-company-details{max-width:60%}.preview-company-details h2{font-size:16px;margin-bottom:4px;color:#000}.preview-company-details p{font-size:11px;margin:2px 0;color:#333}.preview-title-box{text-align:right;display:flex;flex-direction:column;justify-content:space-between}.preview-title-box h1{font-size:20px;color:#000;margin-bottom:6px}.preview-title-box p{font-size:11px;color:#333}.preview-meta-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:20px;border:1px solid #000000;border-radius:4px;padding:12px}.preview-customer-info h3,.preview-doc-meta h3{font-size:12px;border-bottom:1px solid #ccc;padding-bottom:4px;margin-bottom:6px;color:#000}.preview-customer-info p,.preview-doc-meta p{font-size:11px;margin:4px 0;color:#111}.preview-items-table{width:100%;border-collapse:collapse;margin-top:10px}.preview-items-table th,.preview-items-table td{border:1px solid #000000;padding:8px;font-size:11px}.preview-items-table th{background-color:#f1f5f9;text-align:center;color:#000;font-weight:600}.preview-totals-box{display:flex;justify-content:space-between;gap:40px;margin-top:10px}.preview-notes{flex-grow:1.5;border:1px solid #000000;padding:10px;border-radius:4px;font-size:11px}.preview-notes h4{font-size:11px;margin-bottom:4px}.preview-totals-calc{flex-grow:1;min-width:280px}.preview-calc-row{display:flex;justify-content:space-between;padding:4px 8px;font-size:11px}.preview-calc-row.grand-total{border:1px solid #000000;font-weight:700;font-size:12px;background-color:#f1f5f9;margin-top:4px}.preview-baht-text-row{border:1px solid #000000;border-top:none;padding:4px 8px;font-size:11px;font-weight:600;text-align:center;background-color:#f8fafc}.preview-signatures{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-top:40px;text-align:center}.sig-box{border:1px solid #cccccc;border-radius:4px;padding:16px 10px 10px;display:flex;flex-direction:column;justify-content:space-between;height:110px}.sig-box p{font-size:10px;color:#444}.sig-line{border-bottom:1px dashed #333;width:80%;margin:30px auto 4px}.print-only{display:none}@media print{body{background-color:#fff!important;color:#000!important;font-size:12pt;line-height:1.3}#root,.no-print,.modal-overlay,#document-detail-modal,.sidebar,.main-content,.top-navbar,.app-container{display:none!important}.print-only{display:block!important;width:100%;background-color:#fff;font-family:Sarabun,sans-serif}.document-print-page{width:148mm;height:210mm;padding:8mm 10mm;margin:0;page-break-after:always;background-color:#fff;color:#000;box-sizing:border-box;font-size:10px}.document-print-page .preview-invoice{gap:8px}.document-print-page .preview-header{padding-bottom:8px;margin-bottom:5px;border-bottom-width:1.5px}.document-print-page .preview-company-details h2{font-size:13px;margin-bottom:2px}.document-print-page .preview-company-details p,.document-print-page .preview-title-box p{font-size:9px;margin:1px 0}.document-print-page .preview-title-box h1{font-size:15px;margin-bottom:4px}.document-print-page .preview-meta-grid{gap:10px;padding:6px 10px;margin-bottom:5px;grid-template-columns:1.2fr .8fr}.document-print-page .preview-customer-info h3,.document-print-page .preview-doc-meta h3{font-size:10px;margin-bottom:4px;padding-bottom:2px}.document-print-page .preview-customer-info p,.document-print-page .preview-doc-meta p{font-size:9px;margin:2px 0}.document-print-page .preview-items-table{margin-top:5px}.document-print-page .preview-items-table th,.document-print-page .preview-items-table td{padding:4px 6px;font-size:9px}.document-print-page .preview-items-table th{background-color:#eaeaea!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.document-print-page .preview-baht-text-row,.document-print-page .preview-calc-row{font-size:9px;padding:3px 6px}.document-print-page .preview-calc-row.grand-total,.document-print-page .preview-baht-text-row{background-color:#eaeaea!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.document-print-page .preview-signatures{margin-top:15px;gap:8px;grid-template-columns:repeat(3,1fr)}.document-print-page .sig-box{height:75px;padding:8px 4px 4px;border-color:#ddd}.document-print-page .sig-box p{font-size:8px;margin:0}.document-print-page .sig-line{margin:15px auto 2px;width:90%}.table-responsive-container{overflow:visible!important;width:100%!important}.preview-items-table{min-width:100%!important}@page{size:A5 portrait;margin:0}.document-print-page:last-child{page-break-after:avoid!important}}.autocomplete-dropdown{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-sm);max-height:250px;overflow-y:auto;z-index:1000;box-shadow:var(--shadow-lg);margin-top:4px}.autocomplete-item{padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--border-light);display:flex;flex-direction:column;gap:2px;transition:var(--transition)}.autocomplete-item:last-child{border-bottom:none}.autocomplete-item:hover{background-color:var(--primary-light)}.autocomplete-item strong{font-size:13px;color:var(--text-main)}.autocomplete-item span{font-size:11px;color:var(--text-muted)}@media (max-width: 768px){.app-container{flex-direction:column}.sidebar{position:fixed;left:-260px;top:0;bottom:0;height:100vh;width:260px;transition:var(--transition);z-index:999}.sidebar.open{left:0}.sidebar-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0006;z-index:998;display:none}.sidebar.open+.sidebar-overlay{display:block}#btn-sidebar-toggle,#btn-sidebar-close{display:flex!important}.main-content{max-width:100%;width:100%;padding:16px}.top-navbar{flex-direction:column;align-items:flex-start;gap:12px}.header-actions{width:100%}.date-display{width:100%;justify-content:center}.stats-grid{grid-template-columns:repeat(2,1fr);gap:12px}.dashboard-grid{flex-direction:column}.dashboard-card.side-card{max-width:100%;width:100%}.form-grid{grid-template-columns:1fr;gap:16px}.form-card-column{gap:16px}.totals-section{flex-direction:column;gap:20px}.calculation-block{width:100%!important;min-width:100%}.table th,.table td{padding:10px 12px}.modal-box{width:95%;max-height:95vh}.modal-box.modal-lg{width:95%}.form-actions{flex-direction:column-reverse;gap:10px}.form-actions button{width:100%}.toolbar{flex-direction:column;align-items:stretch}.filters{flex-direction:column;align-items:stretch;width:100%}.filters select,.filters button,.file-upload-wrapper label{width:100%!important}.modal-footer{flex-direction:column;gap:15px;align-items:stretch;padding:16px}.modal-footer .left-actions,.modal-footer .right-actions{flex-direction:row;flex-wrap:wrap;justify-content:center;width:100%;gap:8px}.modal-footer .left-actions button,.modal-footer .right-actions button{flex:1 1 auto;min-width:120px;justify-content:center;margin:0}#convert-label{width:100%;text-align:center;margin-bottom:2px}}.badge{display:inline-block;padding:3px 8px;border-radius:var(--radius-sm);font-size:11px;font-weight:600;text-align:center}.badge-success{background-color:#dcfce7;color:#16a34a}.badge-warning{background-color:#fef9c3;color:#ca8a04}.badge-danger{background-color:#fee2e2;color:#dc2626}.text-right{text-align:right!important}.text-center{text-align:center!important}.text-success{color:#16a34a!important;font-weight:600}.text-danger{color:#dc2626!important;font-weight:600}.row-total-main{font-weight:700;background-color:var(--background-dark)!important;border-top:2px solid var(--text-main);border-bottom:2px double var(--text-main)}.row-subtotal{font-weight:600;background-color:#f8fafc!important;border-top:1px solid var(--border-color);border-bottom:1px solid var(--border-color)}#forecast-control-panel input{font-size:13px;padding:6px 10px}.col-2{flex:0 0 16.666667%;max-width:16.666667%;padding:0 8px}.col-4{flex:0 0 33.333333%;max-width:33.333333%;padding:0 8px}.payroll-number-input{width:100px;padding:4px 8px;font-size:13px;text-align:right;border:1px solid var(--border-color);border-radius:var(--radius-sm);display:inline-block}.payroll-number-input:focus{border-color:var(--primary);outline:none;box-shadow:0 0 0 2px var(--primary-light)}.payslip-container{width:100%;background:#fff;color:#000;font-family:Sarabun,sans-serif;font-size:13px;line-height:1.4;border:1px dashed #cbd5e1;padding:20px;border-radius:var(--radius-sm)}.payslip-header{text-align:center;border-bottom:2px solid #0f172a;padding-bottom:8px;margin-bottom:12px}.payslip-header h2{margin:0;font-size:16px;font-weight:700}.payslip-header p{margin:3px 0 0;font-size:12px;color:#475569}.payslip-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:15px;border-bottom:1px solid #e2e8f0;padding-bottom:10px}.payslip-meta-grid div p{margin:2px 0}.payslip-split-tables{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px;border-bottom:1px solid #0f172a;padding-bottom:10px}.payslip-column-title{font-weight:700;background-color:#f1f5f9;padding:4px 8px;margin-bottom:6px;border:1px solid #cbd5e1}.payslip-line-item{display:flex;justify-content:space-between;padding:4px 8px}.payslip-summary-row{display:flex;justify-content:space-between;font-weight:700;font-size:14px;background-color:#f8fafc;border:1px solid #0f172a;padding:8px 12px;margin-bottom:15px}.payslip-signatures-block{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:20px;text-align:center}.payslip-signature-line{border-top:1px dashed #cbd5e1;padding-top:6px;margin-top:25px;font-size:11px;color:#475569}.badge-category{font-size:10px;font-weight:700;padding:3px 6px;border-radius:var(--radius-sm);display:inline-block;text-transform:uppercase}.badge-marketing{background-color:#ffe4e6;color:#e11d48}.badge-rent{background-color:#fae8ff;color:#c026d3}.badge-utilities{background-color:#e0f2fe;color:#0369a1}.badge-supplies{background-color:#fef9c3;color:#a16207}.badge-repairs{background-color:#ffedd5;color:#ea580c}.badge-travel{background-color:#dcfce7;color:#15803d}.badge-misc{background-color:#f1f5f9;color:#475569}.budget-safe{background-color:#16a34a!important}.budget-warning-color{background-color:#ca8a04!important}.budget-over-color{background-color:#dc2626!important}.card-header-flex .btn-forecast-tab{font-weight:600!important;font-size:13px!important;padding:8px 16px!important;display:inline-flex!important;align-items:center!important;gap:8px!important;border:none!important;border-radius:6px!important;cursor:pointer!important;transition:var(--transition)!important;box-shadow:none!important}.card-header-flex .btn-forecast-tab.btn-secondary{background:none!important;color:var(--text-muted)!important}.card-header-flex .btn-forecast-tab.btn-secondary:hover{background-color:var(--bg-app)!important;color:var(--text-main)!important}.card-header-flex .btn-forecast-tab.btn-primary{background-color:var(--primary-light)!important;color:var(--primary)!important}.card-header-flex .btn-forecast-tab.btn-primary:hover{background-color:var(--primary-light)!important;opacity:.9!important}.fc .fc-day-today{background-color:#4f46e514!important;border:2px solid var(--primary)!important}.fc-v-event,.fc-h-event,.fc-daygrid-block-event,.fc-daygrid-dot-event,.fc-event{border-left:6px solid var(--fc-event-border-color)!important;border-top:1px solid rgba(0,0,0,.05)!important;border-right:1px solid rgba(0,0,0,.05)!important;border-bottom:1px solid rgba(0,0,0,.05)!important;border-radius:6px!important;padding:3px 6px!important;margin:2px 4px!important;box-shadow:0 2px 4px #0000000a!important;font-weight:500!important;font-size:12px!important;transition:transform .15s ease,box-shadow .15s ease!important}.fc-event:hover{transform:translateY(-1px)!important;box-shadow:0 4px 6px #00000014!important;filter:brightness(.95)!important;cursor:pointer}.fc-event-title{font-weight:600!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#view-admin .table th{background-color:var(--bg-app);color:var(--text-main);font-weight:600}#user-signature-preview img{border-radius:4px;background-color:#fff;box-shadow:0 1px 3px #0000000d}.signature-print-controls select{border:1px solid var(--border-color);border-radius:4px;background-color:#fff;outline:none;transition:var(--transition)}.signature-print-controls select:focus{border-color:var(--primary);box-shadow:0 0 0 2px #4f46e51a}@media (max-width: 768px){.row{flex-wrap:wrap}.row>.col-2,.row>.col-3,.row>.col-4,.row>.col-6{flex:0 0 100%!important;max-width:100%!important;width:100%!important;margin-bottom:12px}.fc-header-toolbar{flex-direction:column;gap:10px}.fc-toolbar-title{font-size:1.2rem!important}.table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border-color);border-radius:8px}.dashboard-grid .main-card,.dashboard-grid .side-card{flex:1 1 100%!important;width:100%!important}#items-table thead{display:none}#items-table,#items-table tbody,#items-table tr,#items-table td{display:block;width:100%}#items-table tr.item-row{margin-bottom:15px;border:1px solid var(--border-color);border-radius:8px;padding:12px;background-color:#f8fafc;position:relative}#items-table td{border:none;padding:6px 0}#items-table td:nth-child(1):before{content:"ประเภทงาน:";display:block;font-weight:500;font-size:12px;color:var(--text-muted);margin-bottom:4px}#items-table td:nth-child(2):before{content:"รายละเอียด:";display:block;font-weight:500;font-size:12px;color:var(--text-muted);margin-bottom:4px}#items-table td:nth-child(3):before{content:"จำนวน:";display:block;font-weight:500;font-size:12px;color:var(--text-muted);margin-bottom:4px}#items-table td:nth-child(4):before{content:"กว้าง:";display:block;font-weight:500;font-size:12px;color:var(--text-muted);margin-bottom:4px}#items-table td:nth-child(5):before{content:"ยาว:";display:block;font-weight:500;font-size:12px;color:var(--text-muted);margin-bottom:4px}#items-table td:nth-child(6):before{content:"ราคา/หน่วย (บาท):";display:block;font-weight:500;font-size:12px;color:var(--text-muted);margin-bottom:4px}#items-table td:nth-child(7):before{content:"จำนวนเงิน (บาท):";display:block;font-weight:500;font-size:12px;color:var(--text-muted);margin-bottom:4px}#items-table td:nth-child(8){position:absolute;top:8px;right:8px;padding:0;width:auto}#items-tbody input,#items-tbody input[type=text],#items-tbody select{min-width:100%;width:100%;box-sizing:border-box}#btn-add-item{width:100%;margin-top:10px}}@media (max-width: 480px){.stats-grid{grid-template-columns:1fr!important}}.login-container{display:flex;align-items:center;justify-content:center;min-height:100vh;background-color:var(--bg-app);background-image:linear-gradient(135deg,#f8fafc,#e2e8f0);position:fixed;top:0;left:0;right:0;bottom:0;z-index:9999}.login-container.hidden{display:none!important}.login-box{background:#fff;width:90%;max-width:400px;padding:40px;border-radius:12px;box-shadow:0 10px 25px #0000000d}.login-logo{text-align:center;margin-bottom:30px}.login-logo i{font-size:48px;color:var(--primary)}.login-logo h2{font-size:24px;font-weight:700;color:var(--text-main);margin-top:10px;margin-bottom:5px}.login-logo p{color:var(--text-muted);font-size:14px}.app-container.hidden{display:none!important}#slip-drop-zone.dragover{border-color:var(--primary)!important;background-color:#4f46e50d!important}#slip-drop-zone:hover{border-color:var(--primary);background-color:#4f46e505}.payment-slip-indicator{display:inline-flex;align-items:center;justify-content:center;color:#10b981;background-color:#d1fae5;border-radius:50%;width:20px;height:20px;margin-left:6px;cursor:pointer;font-size:11px;vertical-align:middle;transition:all .2s ease;box-shadow:0 1px 3px #10b98133}.payment-slip-indicator:hover{transform:scale(1.15);background-color:#10b981;color:#fff}.badge-paid-with-slip{display:inline-flex;align-items:center;gap:4px}.step-circle.active{background-color:var(--primary)!important;color:#fff!important;box-shadow:0 0 0 4px #4f46e533;transform:scale(1.1)}.step-circle.completed{background-color:#10b981!important;color:#fff!important}.workflow-mini-badges{display:inline-flex;align-items:center;gap:4px;background:#f1f5f9;padding:3px 6px;border-radius:6px;border:1px solid #e2e8f0}.mini-badge{font-size:10px;font-weight:700;padding:1px 4px;border-radius:4px;color:#94a3b8;background-color:#cbd5e1;transition:all .2s ease}.mini-badge.active{color:#fff;cursor:pointer}.mini-badge.active:hover{transform:scale(1.1);filter:brightness(.9)}.mini-badge.qt-color.active{background-color:#3b82f6}.mini-badge.do-color.active{background-color:#f59e0b}.mini-badge.bn-color.active{background-color:#8b5cf6}.mini-badge.iv-color.active{background-color:#10b981}.mini-badge-arrow{font-size:10px;color:#cbd5e1}.mini-badge-arrow.active{color:var(--primary);font-weight:700}.job-timeline-type{font-weight:700;font-size:12px}.menu-toggle{display:none}@media (max-width: 768px){.menu-toggle{display:flex!important}}*,*:before,*:after{box-sizing:border-box}html,body{overflow-x:hidden;margin:0;padding:0;width:100%}.app-container,.main-content{overflow-x:hidden}.sidebar{-ms-overflow-style:none;scrollbar-width:none}.sidebar::-webkit-scrollbar{display:none}.sidebar-menu{overflow-x:hidden;overflow-y:auto}.sidebar-menu::-webkit-scrollbar{display:none}:root{--bg-sidebar: #131314;--bg-sidebar-hover: #282a2c}.sidebar{background-color:var(--bg-sidebar)!important;border-right:1px solid rgba(255,255,255,.05);box-shadow:none!important;transition:width .3s cubic-bezier(.4,0,.2,1);z-index:1000}.sidebar-header{border-bottom:none!important;padding:16px!important}.menu-item{border-radius:50px!important;color:#e3e3e3!important;white-space:nowrap}.menu-item:hover,.menu-item.active{background-color:var(--bg-sidebar-hover)!important;color:#fff!important}.menu-item i{font-size:20px!important;line-height:1}.sidebar-section-title{color:#8c8c8c!important;font-size:11px!important;padding:16px 24px 8px!important;text-transform:uppercase;letter-spacing:.5px;background:transparent!important;white-space:nowrap}@media (min-width: 769px){.sidebar{width:72px!important;position:fixed!important;height:100vh;overflow-x:hidden}.sidebar.expanded{width:260px!important;box-shadow:10px 0 20px #0003!important}.main-content{margin-left:72px!important;max-width:calc(100% - 72px)!important;width:calc(100% - 72px)!important}.sidebar:not(.expanded) .logo-text,.sidebar:not(.expanded) .sidebar-section-title,.sidebar:not(.expanded) .menu-item span,.sidebar:not(.expanded) .user-info,.sidebar:not(.expanded) .logout-btn{opacity:0!important;visibility:hidden!important;width:0!important;height:0!important;margin:0!important;padding:0!important;border:none!important;overflow:hidden!important;transition:opacity .2s ease}.sidebar.expanded .logo-text,.sidebar.expanded .sidebar-section-title,.sidebar.expanded .menu-item span,.sidebar.expanded .user-info{opacity:1;visibility:visible;width:auto;height:auto;transition:opacity .3s ease .1s}.sidebar .sidebar-header{justify-content:flex-start;overflow:hidden;padding:16px!important}.sidebar:not(.expanded) .logo-icon{margin:0 auto}.sidebar .menu-item{margin:4px 12px!important;height:48px;display:flex;align-items:center;overflow:hidden}.sidebar:not(.expanded) .menu-item{width:48px;justify-content:center;padding:0!important;gap:0!important}.sidebar:not(.expanded) .menu-item i{margin:0!important}.sidebar.expanded .menu-item{padding:12px 16px!important}.sidebar-footer .user-profile{padding:15px 16px;overflow:hidden}.sidebar:not(.expanded) .sidebar-footer{padding:16px 0!important}.sidebar:not(.expanded) .user-profile{justify-content:center!important;padding:0!important}.sidebar:not(.expanded) .user-profile-inner{gap:0!important;padding-left:0!important}}@media (min-width: 769px){.sidebar .sidebar-menu{padding-left:0!important;padding-right:0!important}.sidebar:not(.expanded) .menu-item{margin:4px auto!important;width:48px!important;height:48px!important;display:flex;justify-content:center;align-items:center;padding:0!important}.sidebar.expanded .menu-item{margin:4px 16px!important;padding:12px 16px!important}.sidebar .sidebar-section-title{padding-left:24px!important}}@media (min-width: 769px){.main-content{transition:margin-left .3s cubic-bezier(.4,0,.2,1),width .3s cubic-bezier(.4,0,.2,1),max-width .3s cubic-bezier(.4,0,.2,1)!important}.sidebar.expanded~.main-content{margin-left:260px!important;max-width:calc(100% - 260px)!important;width:calc(100% - 260px)!important}}.document-preview-card .document-print-page{min-width:650px;padding:0 10px}@media (max-width: 768px){.document-preview-card{padding:10px;overflow-x:hidden!important}}