.app-container{--color-bg-app:#f4f6f9;--color-card-bg:#ffffff;--color-text-main:#1f2937;--color-text-label:#374151;--color-text-muted:#6b7280;--color-border:#e5e7eb;--color-input-border:#d1d5db;--color-navy:#043D7E;--color-navy-hover:#032e5f;--color-blue-bg:#f3f4f6;--color-btn-light-bg:#f3f4f6;--color-btn-light-text:#374151;--color-btn-light-hover:#e5e7eb;--color-save-green:#48bb78;--color-save-green-hover:#38a169;--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--radius-lg:10px;--radius-md:6px;--radius-sm:4px;--shadow-card:0 2px 4px -1px rgba(0, 0, 0, 0.05), 0 1px 2px -1px rgba(0, 0, 0, 0.05);font-family:var(--font-family);color:var(--color-text-main);line-height:1.4;-webkit-font-smoothing:antialiased;max-width:800px;width:100%;box-sizing:border-box;margin:10px auto;border:2px solid #043D7E;border-radius:12px;background-color:#f8fafc;padding:12px;box-shadow:0 12px 30px rgb(4 61 126 / .25),0 4px 12px rgb(4 61 126 / .15)}.app-container,.app-container *{box-sizing:border-box;margin:0;padding:0}body.local-env{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background-color:#f4f6f9;color:#1f2937;line-height:1.4;padding:15px 10px;-webkit-font-smoothing:antialiased}.app-container .dashboard-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:10px;align-items:start}.app-container .dashboard-left-col,.app-container .dashboard-right-col{display:flex;flex-direction:column;gap:10px;width:100%}.app-container .detailed-breakdown-card{width:100%}.app-container .card{background-color:var(--color-card-bg);border:1px solid #e2e8f0;border-radius:12px;box-shadow:0 4px 6px -1px rgb(15 23 42 / .03),0 2px 4px -1px rgb(15 23 42 / .02);padding:12px;transition:all 0.25s cubic-bezier(.4,0,.2,1)}.app-container .card:hover{box-shadow:0 10px 15px -3px rgb(15 23 42 / .06),0 4px 6px -2px rgb(15 23 42 / .03);border-color:#cbd5e1}.app-container .inputs-card-container{display:flex;flex-direction:column;gap:8px}.app-container .inputs-grid-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px}.app-container .input-column{display:flex;flex-direction:column}.app-container .column-header{border-bottom:1px solid var(--color-border);padding-bottom:6px;margin-bottom:12px}.app-container .column-header h2{font-size:1rem;font-weight:700;color:var(--color-navy)}.app-container .column-body{display:flex;flex-direction:column;gap:10px}.app-container .form-group{display:flex;flex-direction:column;gap:4px}.app-container label{font-size:.8rem;font-weight:600;color:var(--color-text-label)}.app-container .form-group label{background-color:#043D7E;color:#ffffff!important;padding:4px 8px;border-radius:4px;display:inline-flex;align-items:center;margin-bottom:6px;width:fit-content}.app-container .form-group label::before{content:"\f061";font-family:"Font Awesome 6 Free";font-weight:900;margin-right:6px;font-size:.75rem}.app-container input[type="text"],.app-container input[type="number"],.app-container input[type="date"],.app-container select{width:100%;padding:8px 12px;font-family:var(--font-family);font-size:.85rem;color:var(--color-text-main);background-color:#fcfdfe;border:1px solid var(--color-input-border);border-radius:6px;outline:none;transition:all 0.2s cubic-bezier(.4,0,.2,1);box-shadow:inset 0 1px 2px rgb(0 0 0 / .02)}.app-container input::placeholder{color:#9ca3af}.app-container input[type="text"]:hover,.app-container input[type="number"]:hover,.app-container input[type="date"]:hover,.app-container select:hover{border-color:#9ca3af;background-color:#fff}.app-container input[type="text"]:focus,.app-container input[type="number"]:focus,.app-container input[type="date"]:focus,.app-container select:focus,.app-container select:active{border-color:#043D7E;background-color:#fff;box-shadow:0 0 0 3px rgb(4 61 126 / .15),inset 0 1px 2px rgb(0 0 0 / .02)}.app-container .select-wrapper{position:relative;width:100%}.app-container .select-wrapper select{appearance:none;-webkit-appearance:none;padding-right:28px;cursor:pointer}.app-container .select-wrapper::after{content:"\f078";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#9ca3af;font-size:.72rem;pointer-events:none}.app-container input[type="date"]{position:relative;padding-right:28px}.app-container .inputs-footer-actions{border-top:1px solid var(--color-border);padding-top:14px;display:flex;justify-content:space-between;align-items:center;gap:12px}.app-container .actions-left{display:flex;gap:8px;align-items:center}.app-container .actions-right{display:flex;gap:8px;align-items:center}.app-container .btn{font-family:var(--font-family);font-size:.82rem;font-weight:600;padding:8px 16px;border-radius:6px;border:none;cursor:pointer;transition:all 0.2s cubic-bezier(.4,0,.2,1);box-shadow:0 1px 2px rgb(0 0 0 / .05)}.app-container .btn-calculate{background-color:var(--color-navy);color:#fff}.app-container .btn-calculate:hover{background-color:var(--color-navy-hover);transform:translateY(-1px);box-shadow:0 4px 6px -1px rgb(4 61 126 / .15),0 2px 4px -1px rgb(4 61 126 / .1)}.app-container .btn-reset,.app-container .btn-history{background-color:#f1f5f9;color:var(--color-navy);border:1px solid #e2e8f0}.app-container .btn-reset:hover,.app-container .btn-history:hover{background-color:#e2e8f0;color:#032e5f;transform:translateY(-1px)}.app-container .name-to-save-input{width:100px!important;padding:8px 10px!important;font-size:0.82rem!important;border-radius:6px!important}.app-container .btn-save{background-color:#10b981;color:#fff}.app-container .btn-save:hover{background-color:#059669;transform:translateY(-1px);box-shadow:0 4px 6px -1px rgb(16 185 129 / .15)}.app-container .results-card-container{display:flex;flex-direction:column;gap:14px}.app-container .result-card-header h2{font-size:1rem;font-weight:700;color:var(--color-navy)}.app-container .result-amount-display{display:flex;flex-direction:column;gap:2px}.app-container .result-amount-val{font-size:2.2rem;font-weight:800;color:var(--color-navy);line-height:1.1}.app-container .result-status-msg{font-size:.8rem;color:var(--color-text-muted)}.app-container .export-pills-row{display:flex;gap:6px}.app-container .btn-pill{font-family:var(--font-family);font-size:.75rem;font-weight:600;padding:4px 10px;background-color:var(--color-btn-light-bg);color:var(--color-btn-light-text);border-radius:50px;border:none;cursor:pointer;transition:background-color 0.15s ease}.app-container .btn-pill:hover{background-color:var(--color-btn-light-hover)}.app-container .table-container{border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;box-shadow:0 1px 3px rgb(0 0 0 / .02)}.app-container .gratuity-accrual-table{width:100%;border-collapse:collapse;font-size:.82rem;text-align:left}.app-container .gratuity-accrual-table th{background-color:var(--color-navy);color:#fff;font-weight:600;padding:10px 12px;letter-spacing:.02em}.app-container .gratuity-accrual-table td{padding:10px 12px;border-bottom:1px solid #f1f5f9;color:var(--color-text-main)}.app-container .gratuity-accrual-table tbody tr{transition:background-color 0.15s ease}.app-container .gratuity-accrual-table tbody tr:hover{background-color:#f8fafc}.app-container .gratuity-accrual-table tbody tr:last-child td{border-bottom:none}.app-container .text-center{text-align:center}.app-container .text-right{text-align:right}.app-container .table-net-row td{border-top:2px solid var(--color-border);background-color:#f8fafc;padding:12px 12px}.app-container .text-success{color:#10b981}.app-container .font-bold{font-weight:700}.app-container .eligibility-alert{display:flex;gap:10px;background-color:#fef2f2;border:1px solid #fee2e2;border-radius:var(--radius-md);padding:10px 12px;color:#991b1b}.app-container .eligibility-alert i{font-size:1.1rem;color:#dc2626;margin-top:2px}.app-container .eligibility-alert h4{font-size:.88rem;font-weight:700;margin-bottom:2px}.app-container .eligibility-alert p{font-size:.8rem;line-height:1.3}.app-container .detailed-breakdown-section{border-top:1px solid var(--color-border);padding-top:14px;margin-top:8px}.app-container .breakdown-header h3{font-size:.95rem;font-weight:700;color:var(--color-navy);margin-bottom:10px}.app-container .breakdown-list{display:flex;flex-direction:column}.app-container .breakdown-item{display:flex;justify-content:space-between;align-items:flex-start;padding:7px 0;border-bottom:1px solid var(--color-border);font-size:.82rem}.app-container .breakdown-item:last-child{border-bottom:none}.app-container .bd-label{font-weight:600;color:var(--color-text-label);flex:1}.app-container .bd-val{text-align:right;color:var(--color-text-main);flex:1.2;display:flex;flex-direction:column;align-items:flex-end}.app-container .breakdown-item.sub-item{padding:6px 12px;margin-bottom:3px;border-radius:var(--radius-sm);border-bottom:none;font-size:.8rem}.app-container #bdGrossDaysRow{background-color:#f8fafc;border-left:3px solid #64748b}.app-container #bdUnpaidLeaveRow{background-color:#fff5f5;border-left:3px solid #ef4444}.app-container #bdNetDaysRow{background-color:#ecfdf5;border-left:3px solid #10b981;font-weight:700}.app-container #bdNetDaysRow .bd-label{color:#065f46}.app-container #bdNetDaysRow .bd-val{color:#047857}.app-container #bdServiceDurationRow{background-color:#f0f9ff;border:1px solid #e0f2fe;border-left:4px solid #0284c7;border-radius:var(--radius-md);padding:10px 12px;margin-top:10px;margin-bottom:8px}.app-container #bdServiceDurationRow .bd-label{color:#0369a1;font-weight:700;font-size:.85rem}.app-container #bdServiceDurationRow .bd-val{color:#0369a1;font-size:.9rem;font-weight:700}.app-container #bdLawAppliedRow{background-color:#f8fafc;border-left:3px solid #475569;border-radius:var(--radius-sm);padding:8px 10px;margin-bottom:6px}.app-container #bdLawAppliedRow .bd-label{color:#334155}.app-container #bdLawAppliedRow .bd-val{color:#1e293b}.app-container #bdTotalSalaryRow{background-color:#f8fafc;border-left:3px solid #475569;border-radius:var(--radius-sm);padding:8px 10px;font-weight:700;margin:4px 0}.app-container #bdDailyWageRow{background-color:#f0fdf4;border:1px solid #d1fae5;border-left:4px solid #10b981;border-radius:var(--radius-md);padding:10px 12px;margin-top:10px;margin-bottom:8px}.app-container #bdDailyWageRow .bd-label{color:#065f46;font-weight:700}.app-container #bdDailyWageRow .formula-box{background-color:#fff;border-color:#a7f3d0;color:#047857;font-weight:600}.app-container #bdDailyWageRow .formula-result{font-weight:700;color:#065f46}.app-container #bdFormulaUsedRow{background-color:#fafafa;border:1px solid #e5e7eb;border-left:4px solid #4b5563;border-radius:var(--radius-md);padding:10px 12px;margin-bottom:8px;flex-direction:column;align-items:stretch}.app-container #bdFormulaUsedRow .bd-label{margin-bottom:6px;color:#374151;font-weight:700}.app-container #bdFormulaUsedRow .bd-val{align-items:flex-start;text-align:left;width:100%}.app-container #bdFormulaUsedRow .formula-box{background-color:#fff;border-color:#d1d5db;color:#374151;padding:6px 8px;font-size:.78rem;line-height:1.4;border-radius:var(--radius-sm)}.app-container #bdFirst5YearsRow,.app-container #bdAdditionalYearsRow{background-color:#f8fafc;border:1px solid #f1f5f9;border-left:3px solid #3b82f6;border-radius:var(--radius-sm);padding:8px 10px;margin-bottom:4px}.app-container #bdFirst5YearsRow .bd-label,.app-container #bdAdditionalYearsRow .bd-label{font-size:.8rem;color:#1e3a8a}.app-container #bdFirst5YearsRow .formula-box,.app-container #bdAdditionalYearsRow .formula-box{background-color:#fff;border-color:#bfdbfe;color:#1d4ed8}.app-container #bdFirst5YearsRow .formula-result,.app-container #bdAdditionalYearsRow .formula-result{font-weight:700;color:#1e3a8a}.app-container #bdGrossGratuityRow{background-color:#f0f9ff;border-left:3px solid #0284c7;border-radius:var(--radius-sm);padding:8px 10px;margin-top:6px}.app-container #bdGrossGratuityRow .bd-label{color:#0369a1}.app-container #bdGrossGratuityRow .bd-val{color:#0284c7;font-size:.88rem}.app-container .breakdown-item.highlight-total{background-color:#ecfdf5;border:1px solid #a7f3d0;border-left:5px solid #10b981;border-radius:var(--radius-lg);padding:14px 16px;margin-top:12px;box-shadow:0 4px 6px -1px rgb(16 185 129 / .05)}.app-container .breakdown-item.highlight-total .bd-label{font-size:.92rem;font-weight:700;color:#065f46}.app-container .breakdown-item.highlight-total .bd-val{font-size:1.3rem;font-weight:800;color:#047857}.app-container .formula-box{font-family:monospace;background-color:#f3f4f6;padding:3px 6px;border-radius:var(--radius-sm);font-size:.75rem;color:var(--color-navy);border:1px solid var(--color-border);margin-bottom:2px}.app-container .formula-large{font-size:.8rem;text-align:left;white-space:pre-wrap;width:100%;margin-top:2px}.app-container .formula-result{font-size:.72rem;color:var(--color-text-muted)}.app-container .text-description{font-size:.78rem;color:var(--color-text-muted);text-align:left;line-height:1.3}.app-container .breakdown-item.alert-item{background-color:#fffbeb;border:1px solid #fef3c7;border-left:4px solid #f59e0b;border-radius:var(--radius-md);padding:10px 12px;margin:8px 0}.app-container .breakdown-item.alert-item .bd-label{color:#78350f;font-weight:700}.app-container .reduction-badge{background-color:#f59e0b;color:#fff;font-size:.7rem;padding:1px 6px;border-radius:var(--radius-sm);font-weight:700;margin-bottom:2px}.app-container .reduction-badge.text-success{background-color:#10b981;color:#fff}.app-container .reduction-badge.text-danger{background-color:#ef4444;color:#fff}.app-container .reduction-badge.text-warning{background-color:#f59e0b;color:#fff}.app-container #bdDeductionsRow{background-color:#fef2f2;border:1px solid #fee2e2;border-left:4px solid #ef4444;border-radius:var(--radius-md);padding:10px 12px;margin:6px 0}.app-container #bdDeductionsRow .bd-label{color:#991b1b;font-weight:700}.app-container .deductions-list{list-style-type:none}.app-container .deductions-list li{font-size:.78rem;margin-bottom:2px;color:#7f1d1d}.app-container #bdServiceDurationRow,.app-container #bdDailyWageRow,.app-container #bdFormulaUsedRow,.app-container #bdFirst5YearsRow,.app-container #bdAdditionalYearsRow,.app-container #bdGrossGratuityRow,.app-container .breakdown-item.highlight-total,.app-container .breakdown-item.alert-item,.app-container #bdDeductionsRow,.app-container #bdCapRow,.app-container #bdLawAppliedRow,.app-container #bdTotalSalaryRow{border-bottom:none}.app-container .validation-error{font-size:.72rem;color:#dc2626;margin-top:1px;font-weight:500}.app-container .modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgb(15 23 42 / .4);display:none;align-items:center;justify-content:center;z-index:1000;backdrop-filter:blur(2px)}.app-container .modal-card{background-color:#fff;border-radius:var(--radius-lg);box-shadow:0 20px 25px -5px rgb(0 0 0 / .1),0 10px 10px -5px rgb(0 0 0 / .04);width:90%;max-width:440px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.app-container .modal-header{padding:12px 16px;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center;background-color:#fafafa}.app-container .modal-header h3{font-size:.95rem;font-weight:700;color:var(--color-navy)}.app-container .btn-close{background:#fff0;border:none;font-size:1.3rem;line-height:1;color:var(--color-text-muted);cursor:pointer}.app-container .btn-close:hover{color:var(--color-text-main)}.app-container .modal-body{padding:16px;overflow-y:auto;flex:1}.app-container .history-list-container{display:flex;flex-direction:column;gap:10px}.app-container .history-item{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:10px;display:flex;justify-content:space-between;align-items:center;background-color:#fff;transition:box-shadow 0.15s ease}.app-container .history-item:hover{box-shadow:var(--shadow-card)}.app-container .history-item-details{display:flex;flex-direction:column;gap:1px}.app-container .history-item-name{font-size:.88rem;font-weight:700;color:var(--color-navy)}.app-container .history-item-meta{font-size:.72rem;color:var(--color-text-muted)}.app-container .history-item-amount{font-size:.85rem;font-weight:700;color:#10b981}.app-container .history-item-actions{display:flex;gap:6px}.app-container .btn-load{background-color:#e6fffa;color:#319795;padding:4px 8px;font-size:.75rem}.app-container .btn-load:hover{background-color:#b2f5ea}.app-container .btn-delete-hist{background-color:#fff5f5;color:#e53e3e;padding:4px 8px;font-size:.75rem}.app-container .btn-delete-hist:hover{background-color:#fed7d7}@media (max-width:992px){.app-container .dashboard-grid{grid-template-columns:1fr}}@media (max-width:768px){.app-container{padding:10px;margin:5px auto;border-width:2px;border-radius:8px;width:100%;max-width:100%;box-sizing:border-box}.app-container .option-button-group{flex-direction:column;gap:6px;width:100%}.app-container .option-btn{width:100%;text-align:center;white-space:normal}.app-container .inputs-grid-columns{grid-template-columns:1fr;gap:16px}.app-container .inputs-footer-actions{flex-direction:column;align-items:stretch;gap:10px}.app-container .actions-left{flex-direction:column;gap:6px}.app-container .actions-left .btn{width:100%}.app-container .actions-right{flex-direction:column;gap:6px}.app-container .name-to-save-input{width:100%!important}.app-container .btn-save{width:100%}.app-container .export-pills-row{flex-direction:column;gap:6px}.app-container .btn-pill{width:100%;border-radius:var(--radius-sm)}.app-container .result-amount-val{font-size:1.8rem}.app-container .breakdown-item{flex-direction:column;align-items:flex-start;gap:2px}.app-container .bd-val{width:100%;text-align:left;align-items:flex-start}}.app-container .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media print{.app-container .inputs-card-container,.app-container .export-pills-row,.app-container .modal-overlay{display:none!important}.app-container .dashboard-grid{display:block}.app-container .results-card-container{border:none!important;box-shadow:none!important;padding:0!important}.app-container .gratuity-accrual-table th{background-color:#f3f4f6!important;color:#000000!important;border-bottom:2px solid #000000!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}.app-container .gratuity-accrual-table td{border-bottom:1px solid #cbd5e1!important}.app-container .table-net-row td{background-color:#f3f4f6!important;border-top:2px solid #000000!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}}.app-container .custom-select{position:relative;width:100%;cursor:pointer;font-family:var(--font-family);font-size:.85rem;color:var(--color-text-main);background-color:#fcfdfe;border:1px solid var(--color-input-border);border-radius:6px;transition:all 0.2s ease;user-select:none}.app-container .custom-select:hover{border-color:#9ca3af;background-color:#fff}.app-container .custom-select.open{border-color:#043D7E;box-shadow:0 0 0 3px rgb(4 61 126 / .15);background-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0}.app-container .custom-select-trigger{display:flex;justify-content:space-between;align-items:center;padding:8px 12px;width:100%}.app-container .custom-select-trigger span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.app-container .custom-select-trigger i{font-size:.75rem;color:#9ca3af;transition:transform 0.2s ease}.app-container .custom-select.open .custom-select-trigger i{transform:rotate(180deg)}.app-container .custom-options{position:absolute;top:100%;left:-1px;right:-1px;background-color:#fff;border:1px solid #043D7E;border-top:none;border-bottom-left-radius:6px;border-bottom-right-radius:6px;box-shadow:0 10px 15px -3px rgb(0 0 0 / .05);z-index:100;display:none;max-height:220px;overflow-y:auto}.app-container .custom-select.open .custom-options{display:block}.app-container .custom-option{padding:5px 9px;color:var(--color-text-main);transition:all 0.15s ease;text-align:left;border:3px solid #fff0}.app-container .custom-option:hover{background-color:#043D7E!important;color:#ffffff!important;border:3px solid #043D7E!important}.app-container .custom-option.selected{background-color:#043D7E!important;color:#ffffff!important;font-weight:700;border:3px solid #043D7E!important}.app-container .select-wrapper:has(.custom-select)::after,.app-container .select-wrapper:has(.option-button-group)::after{display:none}.app-container .option-button-group{display:flex;gap:8px;width:100%;margin-top:4px}.app-container .option-btn{flex:1;padding:8px 12px;font-family:var(--font-family);font-size:.82rem;font-weight:600;color:var(--color-navy);background-color:#f1f5f9;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;text-align:center;transition:all 0.25s cubic-bezier(.4,0,.2,1);outline:none;user-select:none}.app-container .option-btn:hover{background-color:#e2e8f0;color:var(--color-navy-hover);border-color:#cbd5e1}.app-container .option-btn.active{background-color:#043D7E!important;color:#ffffff!important;border-color:#043D7E!important;box-shadow:0 4px 6px -1px rgb(4 61 126 / .15)}