/* ========================================================== FINOVA ACCOUNTING SYSTEM MODULE : TAX MASTER Version : 2.1 Enterprise TABLE STANDARD : GLOBAL TABLE COMPONENT VISUAL STANDARD : BUSINESS PARTNER / CHART OF ACCOUNTS NOTE : - Header aligned with BP / COA - Filter aligned with BP / COA - Table visual controlled by Global Table CSS - Pagination controlled by Global Pagination CSS ========================================================== */ /* ========================================================== TAX PAGE ========================================================== */ .tax-page { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; width: 100%; } /* ========================================================== PAGE HEADER SAME AS BP / COA ========================================================== */ .tax-page > .finova-page-header { width: 100%; margin-bottom: 8px !important; flex-shrink: 0; box-sizing: border-box; } /* ========================================================== FILTER CARD SAME AS BP ========================================================== */ .tax-page > .tax-filter-card { width: 100% !important; max-width: none !important; margin: 0 !important; flex: 0 0 auto; box-sizing: border-box; border-radius: 12px; } /* ========================================================== FILTER CARD BODY SAME AS BP ========================================================== */ .tax-filter-card > .finova-card-body { width: 100%; padding: 8px 20px 6px 20px !important; box-sizing: border-box; } /* ========================================================== FILTER ROW ========================================================== */ .tax-filter-card > .finova-card-body > .row { width: 100% !important; margin: 0 !important; padding: 0 !important; box-sizing: border-box; align-items: end !important; } /* ========================================================== FILTER COLUMN ========================================================== */ .tax-filter-card > .finova-card-body > .row > [class*="col-"] { min-width: 0; margin: 0; box-sizing: border-box; } /* ========================================================== FILTER LABEL SAME AS BP ========================================================== */ .tax-filter-card .form-label { display: block; margin-top: 0 !important; margin-bottom: 6px !important; color: #111827 !important; font-size: 14px !important; font-weight: 600 !important; line-height: 1.2 !important; text-align: left; } /* ========================================================== FILTER INPUT & SELECT SAME AS BP ========================================================== */ .tax-filter-card .form-control, .tax-filter-card .form-select { width: 100% !important; height: 46px !important; min-height: 46px !important; box-sizing: border-box; } /* ========================================================== TABLE CARD ========================================================== */ .tax-table-card { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; width: 100%; overflow: hidden; } /* ========================================================== TABLE CARD BODY ========================================================== */ .tax-table-card .finova-card-body { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; padding: 0 !important; overflow: hidden; } /* ========================================================== TABLE CONTAINER ========================================================== */ .tax-table-card .finova-table-container { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; width: 100%; overflow: hidden; } /* ========================================================== TABLE RESPONSIVE ========================================================== */ .tax-table-card .finova-table-container .table-responsive { display: block; flex: 1 1 auto; min-height: 0; width: 100%; overflow: auto; } /* ========================================================== TABLE ========================================================== */ .tax-table-card .finova-table { width: 100%; margin-bottom: 0; vertical-align: middle; } /* ========================================================== TABLE HEADER SAME AS BP / COA ========================================================== */ .tax-table-card .finova-table thead th { font-weight: 700 !important; color: #111827 !important; } /* ========================================================== TABLE BODY ========================================================== */ .tax-table-card .finova-table tbody td { font-weight: 400 !important; color: #1F2937 !important; } /* ========================================================== REMOVE UNWANTED BOLD ========================================================== */ .tax-table-card .finova-table tbody td strong, .tax-table-card .finova-table tbody td b, .tax-table-card .finova-table tbody td .fw-bold, .tax-table-card .finova-table tbody td .fw-semibold { font-weight: 400 !important; } /* ========================================================== NUMBER COLUMN ========================================================== */ .tax-table-card .finova-table th:first-child, .tax-table-card .finova-table td:first-child { text-align: center !important; vertical-align: middle !important; } /* ========================================================== TYPE COLUMN ========================================================== */ .tax-table-card .finova-table th:nth-child(4), .tax-table-card .finova-table td:nth-child(4) { text-align: center !important; } /* ========================================================== RATE COLUMN ========================================================== */ .tax-table-card .finova-table th:nth-child(5), .tax-table-card .finova-table td:nth-child(5) { text-align: right !important; } /* ========================================================== STATUS COLUMN ========================================================== */ .tax-table-card .finova-table th:nth-child(8), .tax-table-card .finova-table td:nth-child(8) { text-align: center !important; } /* ========================================================== ACTION COLUMN ========================================================== */ .tax-table-card .finova-table th:nth-child(9), .tax-table-card .finova-table td:nth-child(9) { text-align: center !important; vertical-align: middle !important; } /* ========================================================== TAX STATUS BADGE SAME VISUAL AS BUSINESS PARTNER ========================================================== */ .tax-status-badge { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-width: 76px; height: 22px; padding: 0 10px; border-radius: 999px; font-size: 11px; font-weight: 600; line-height: 1; white-space: nowrap; } /* ========================================================== ACTIVE ========================================================== */ .tax-status-active { background: #DCFCE7; color: #15803D; } /* ========================================================== INACTIVE ========================================================== */ .tax-status-inactive { background: #FEE2E2; color: #B91C1C; } /* ========================================================== TAX ACTION SAME SIZE AS BUSINESS PARTNER ========================================================== */ .tax-action-group { display: inline-flex; align-items: center; justify-content: center; gap: 5px; } .tax-action-btn { width: 32px; height: 32px; min-width: 32px; padding: 0; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 5px; font-size: 13px; line-height: 1; } /* ========================================================== EDIT ========================================================== */ .tax-action-edit { background: #DBEAFE; color: #2563EB; } .tax-action-edit:hover { background: #BFDBFE; color: #1D4ED8; } /* ========================================================== TAX ACTION - SAME AS COA ========================================================== */ .tax-action-group { display: inline-flex; align-items: center; justify-content: center; gap: 6px; } .tax-action-btn { width: 32px; height: 32px; min-width: 32px; min-height: 32px; padding: 0; border: 1px solid transparent; border-radius: 6px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: all 0.15s ease; } .tax-action-btn i { font-size: 13px; } /* EDIT */ .tax-action-edit { color: #2563eb; background: #eff6ff; border-color: #bfdbfe; } .tax-action-edit:hover { background: #dbeafe; } /* ACTIVE */ .tax-action-active { color: #16a34a; background: #f0fdf4; border-color: #bbf7d0; } .tax-action-active:hover { background: #dcfce7; } /* INACTIVE */ .tax-action-inactive { color: #d97706; background: #fffbeb; border-color: #fde68a; } .tax-action-inactive:hover { background: #fef3c7; } /* DELETE */ .tax-action-delete { color: #dc2626; background: #fef2f2; border-color: #fecaca; } .tax-action-delete:hover { background: #fee2e2; } /* ========================================================== PAGINATION SAME AS BP / COA ========================================================== */ .tax-table-card .finova-table-container .finova-pagination-wrapper { flex: 0 0 auto; width: 100%; margin-top: auto; } /* ========================================================== PAGINATION LEFT ========================================================== */ .tax-table-card .finova-pagination-left { display: flex; align-items: center; gap: 8px; } /* ========================================================== PAGINATION LABEL ========================================================== */ .tax-table-card .finova-pagination-label { display: inline-flex; align-items: center; white-space: nowrap; } /* ========================================================== PAGINATION TOTAL ========================================================== */ .tax-table-card .finova-pagination-total { display: inline-flex; align-items: center; min-width: 18px; margin-left: 2px; } /* ========================================================== TAX MODAL ========================================================== */ #taxModal .modal-content { overflow: hidden; } /* ========================================================== TAX MODAL LABEL ========================================================== */ #taxModal .form-label { color: #1F2937; } /* ========================================================== TAX MODAL CONTROL ========================================================== */ #taxModal .form-control, #taxModal .form-select { box-sizing: border-box; } /* ========================================================== TAX MODAL TEXTAREA ========================================================== */ #taxModal textarea.form-control { height: auto; } /* ========================================================== TABLET ========================================================== */ @media (max-width: 1200px) { .tax-filter-card > .finova-card-body { padding-left: 16px !important; padding-right: 16px !important; } } /* ========================================================== MOBILE ========================================================== */ @media (max-width: 768px) { .tax-filter-card > .finova-card-body { padding: 8px 16px !important; } } /* ========================================================== TAX MASTER — ZOOM / RESPONSIVE TABLE FIX Keep column widths stable when browser zoom reduces the effective viewport. Horizontal scrolling stays inside the table wrapper instead of squeezing all columns. ========================================================== */ .tax-table-card, .tax-table-card > .finova-card-body, .tax-table-card .finova-table-container { min-width: 0; max-width: 100%; } .tax-table-card .finova-table-container > .table-responsive { width: 100%; max-width: 100%; overflow-x: auto !important; overflow-y: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; } .tax-table-card .finova-table { width: 100%; min-width: 1240px; table-layout: auto; } .tax-table-card .finova-table thead th, .tax-table-card .finova-table tbody td { box-sizing: border-box; vertical-align: middle; } /* Keep short identifiers and numeric/status fields readable. */ .tax-table-card .finova-table th:nth-child(1), .tax-table-card .finova-table td:nth-child(1) { min-width: 72px; width: 72px; } .tax-table-card .finova-table th:nth-child(2), .tax-table-card .finova-table td:nth-child(2) { min-width: 135px; } .tax-table-card .finova-table th:nth-child(3), .tax-table-card .finova-table td:nth-child(3) { min-width: 150px; } .tax-table-card .finova-table th:nth-child(4), .tax-table-card .finova-table td:nth-child(4) { min-width: 115px; } .tax-table-card .finova-table th:nth-child(5), .tax-table-card .finova-table td:nth-child(5) { min-width: 100px; white-space: nowrap; } .tax-table-card .finova-table th:nth-child(6), .tax-table-card .finova-table td:nth-child(6) { min-width: 170px; } .tax-table-card .finova-table th:nth-child(7), .tax-table-card .finova-table td:nth-child(7) { min-width: 170px; } .tax-table-card .finova-table th:nth-child(8), .tax-table-card .finova-table td:nth-child(8) { min-width: 125px; white-space: nowrap; } .tax-table-card .finova-table th:nth-child(9), .tax-table-card .finova-table td:nth-child(9) { min-width: 205px; white-space: nowrap; } /* Allow long account names to wrap naturally without collapsing the other columns. */ .tax-table-card .finova-table td:nth-child(3), .tax-table-card .finova-table td:nth-child(6), .tax-table-card .finova-table td:nth-child(7) { overflow-wrap: anywhere; word-break: normal; } .tax-table-card .finova-table td:nth-child(9) .tax-action-btn, .tax-table-card .finova-table td:nth-child(9) button { flex-shrink: 0; } @media (max-width: 768px) { .tax-table-card .finova-table { min-width: 1180px; } }