.paySlip {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: 10pt;
}

.paySlip .header {
    width: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 1.3em;
    margin-bottom: 10px;
}

.paySlip .subHeader {
    width: 100%;
    text-align: center;
    font-weight: bold;
}

.paySlip .titleTable {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.paySlip .paySlipbody {
    width: 100%;
}

.paySlip .paySlipbody .allowanceTable {
    width: 100%;
    border-collapse: collapse;
    font-size: 10pt;
}

.paySlip .paySlipbody .allowanceTable th {
    border-top: 1px solid;
    border-bottom: 1px solid;
    padding: 5px;
    padding-top: 8px;
    text-align: center;
    font-weight: normal;
}

.paySlip .paySlipbody .allowanceTable td {
    padding: 5px;
}

.paySlip .footer {
    display: flex;
    justify-content: space-between;
    padding-top: 50px;
    gap: 20px;
}

.paySlip .footer .flex {
    gap: 2px;
}

.paySlip .footer .signature {
    width: 150px;
    border-bottom: 1px solid;
    margin-bottom: 5px;
}

.salarySlipContainer {
    width: 100%;
    font-size: 11pt;
    display: flex;
    flex-direction: column;
    gap: 20px;
    page-break-after: always;
}
.salarySlipHeader {
    width: 100%;
    font-size: 11pt;
    display: flex;
    flex-direction: column;
    gap: 20px;
    page-break-after: always;
}

.salarySlip {
    width: 100%;
    font-size: 11pt;
    display: flex;
    flex-direction: column;
    gap: 20px;
    page-break-after: always;
}

.salarySlip .headerContainer {
    display: flex;
    justify-content: space-between;
}

.salarySlip .headerContainer .leftContainer {
    width: 60%;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.salarySlip .headerContainer .rightContainer {
    width: 40%;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.salarySlip .headerContainer .subHeader {
    display: flex;
    gap: 10px;
    align-items: flex-start;
}

.salarySlip .headerContainer .subHeaderLabel .subLabel {
    font-size: 9pt;
}

.salarySlip table {
    border-collapse: collapse;
    width: 100%;
}

.salarySlip table thead th {
    text-align: center;
}

.salarySlip table thead .describe {
    font-size: 8pt;
}

.salarySlip table thead tr:first-child {
    border-top: 1px solid;
}

.salarySlip table thead tr:last-child {
    border-bottom: 1px solid;
}

.salarySlip table thead tr th:first-child {
    border-left: 1px solid;
}

.salarySlip table thead tr:first-child th {
    padding-top: 5px;
}

.salarySlip table thead tr:last-child th {
    padding-bottom: 5px;
}


.salarySlip table thead tr th {
    border-right: 1px solid;
}

.salarySlip table tbody tr td:first-child {
    border-left: 1px solid;
}

.salarySlip table tbody tr td:last-child {
    border-right: 1px solid;
}

.salarySlip table tbody tr:last-child {
    border-bottom: 1px solid;
}

.salarySlip table tbody tr td {
    padding: 5px 5px 0 5px;
}

.salarySlip table tbody tr.describe td {
    padding: 0 5px 5px 5px;
    font-size: 8pt;
}

.salarySlip table tbody tr td:nth-child(even) {
    border-right: 1px solid;
}


.salarySlipHeader table {
    border-collapse: collapse;
    width: 100%;
}


.salarySlipHeader table thead th {
    text-align: center;
}

.salarySlipHeader table thead .describe {
    font-size: 8pt;
}

.salarySlipHeader table thead tr:first-child th {
    padding-top: 5px;
}

.salarySlipHeader table thead tr:last-child th {
    padding-bottom: 5px;
}


.salarySlipHeader table tbody tr td {
    padding: 5px 5px 0 5px;
}

.salarySlipHeader table tbody tr.describe td {
    padding: 0 5px 5px 5px;
    font-size: 8pt;
}