:root {
    --arabic_font: 'Noto Sans Arabic', sans-serif;
    --openSans: 'Open Sans', sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    direction: ltr !important;
}

body,
table,
div,
th,
td {
    direction: ltr !important;
}

body {
    -webkit-print-color-adjust: exact !important;
}

.topHeader {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 0.5fr 1fr;
    gap: 0 1rem;
}

.topHeader .left_logo_with_content {
}

.topHeader .left_logo_with_content img {
    width: 50px;
    height: 50px;
}

.topHeader .left_logo_with_content .left_logo_with_only_content {
    margin: 1rem 0 0 1rem;
    display: flex;
    flex-direction: column;
    gap: 1rem 0;
}

.topHeader .left_logo_with_content .left_logo_with_only_content h1 {
    font-size: 1.5rem;
    margin: 0;
    padding: 0;
    font-weight: bolder;
}

.topHeader .left_logo_with_content .left_logo_with_only_content h2 {
    font-size: 1.3rem;
    margin: 0;
    padding: 0;
    font-weight: 900;
}

.topHeader .left_logo_with_content .left_logo_with_only_content p {
    font-size: 1.1rem;
    margin: 0;
    padding: 0;
}

.topHeader .right_invoice_date_vate {
    align-items: center;
    display: flex;
}

.topHeader .right_invoice_date_vate table {
    width: 100%;
}

.topHeader .right_invoice_date_vate table tbody tr {
    border: 2px solid black;
    /* width: 434px; */
    /* width: 100%; */
    display: grid;
    grid-template-columns: 1fr 1fr;
}

.topHeader .right_invoice_date_vate table tbody tr:not(:nth-child(1)) {
    border-top-width: 0;
}

.topHeader .right_invoice_date_vate table tbody tr th {
    vertical-align: middle;
    text-align: right;
    border-right: 2px solid black;
    padding: 0.3rem;
    /* min-width: 228px; */
    font-size: 1.2rem;
}

.topHeader .right_invoice_date_vate table tbody tr td {
    vertical-align: middle;
    text-align: center;
    padding: 0.3rem 1rem;
}

.headerContainer {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: space-between;
    gap: 0rem 0.7rem;
    align-items: flex-start;
    /* padding: 0 1.7rem 1rem 1.7rem !important; */
    /* margin-bottom: 1rem; */
    /* border-bottom: 2px solid #218B21; */
    grid-column: 1/-1;
}

.headerContainer.isLogo {
    grid-template-columns: 1fr 120px 1fr;
}

.headerContainer .engStr {
    text-align: left;
    display: flex;
    flex-direction: column;
    margin: 0;
    gap: 0.2rem 0;
}

.headerContainer .engStr h1 {
    font-size: 1.6rem;
    /* margin: 0; */
    font-family: var(--openSans);
    font-weight: bolder;
}

.headerContainer .engStr h2 {
    font-size: 1.4rem;
    margin: 0 0;
    font-family: var(--openSans);
}

.headerContainer .arabicStr {
    text-align: right;
    display: flex;
    flex-direction: column;
    margin: 0;
    gap: 0.2rem 0;
}

.headerContainer .arabicStr h1 {
    font-size: 1.6rem;
    font-family: 'Noto Sans Arabic', sans-serif;
    font-weight: 900;
}

.headerContainer .arabicStr h2 {
    font-size: 1.6rem;
    margin: 0 0;
    font-family: 'Noto Sans Arabic', sans-serif;
}

.headerContainer .logo {
}

.headerContainer .logo img {
    width: 120px;
    height: 120px;
}

.middle_section_container {
    /* border: 2px solid black; */
    margin-top: 1rem;
}

.top_product table tbody tr td:not(:nth-child(2)) {
    text-align: center;
}

.middle_section_container .top_middle {
    display: grid;
    grid-template-columns: 1fr 0.5fr;
    border: 2px solid black;
    border-bottom-width: 0;
}

.middle_section_container .top_middle_left {
    /* border-right: 2px solid black; */
}

.middle_section_container .top_middle_left table {
    width: 100%;
}

.middle_section_container .top_middle_left table thead tr {
    margin-bottom: 0.5rem;
    margin-bottom: 0.5rem;
    /* display: flex; */
    justify-content: space-between;
    background: #c5c2c2 !important;
    border-bottom: 2px solid black;
}

table thead tr th {
    direction: ltr !important;
}

.middle_section_container .top_middle_left table thead tr th {
    /* background: #c5c2c2!important; */
    padding: 0.3rem;
    /* border-bottom: 2px solid black; */
    font-weight: bolder;
    color: black;
    white-space: nowrap;
    direction: ltr !important;
    text-align: left;
}

.middle_section_container .top_middle_left table tbody tr {
    margin-bottom: 0.5rem;
}

.middle_section_container .top_middle_left table tbody tr td {
    font-size: 1.4rem;
    color: black;
    /* font-weight: 600; */

    padding: 0 0.5rem;
}

.middle_section_container .top_middle_left table thead tr th:last-child {
    text-align: right;
}

.middle_section_container .top_middle_left table tbody tr td:first-child {
    font-family: var(--openSans);
}

.middle_section_container .top_middle_left table tbody tr td:last-child {
    font-family: var(--arabic_font);
    text-align: right;
}

.middle_section_container .top_middle_right {
    border-left: 2px solid black;
}

.middle_section_container .top_middle_right table {
    width: 100%;
}

.middle_section_container .top_middle_right table thead tr {
    margin-bottom: 0.5rem;
    margin-bottom: 0.5rem;
    display: flex;
    justify-content: space-between;
    background: #c5c2c2 !important;
    border-bottom: 2px solid black;
}

.middle_section_container .top_middle_right table thead tr th {
    /* background: #c5c2c2!important; */
    padding: 0.3rem;
    /* border-bottom: 2px solid black; */
    font-weight: bolder;
    color: black;
    white-space: nowrap;
}

.middle_section_container .top_middle_right table tbody tr {
    margin-bottom: 0.5rem;
}

.middle_section_container .top_middle_right table tbody tr td {
    font-size: 1.3rem;
    color: black;
    /* font-weight: 600; */
    padding: 0 0.5rem;
}

.middle_section_container .top_middle_right table thead tr th:last-child {
    text-align: right;
}

.middle_section_container .top_middle_right table tbody tr td {
    /* text-align: right; */
}

/* top bottom */

.middle_section_container .top_bottom {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    min-height: 60px;
    border: 2px solid black;
    border-top-width: 0;
    border-bottom-width: 0;
}

.middle_section_container .top_bottom_left {
    border-top: 2px solid black;
    border-right: 2px solid black;
}

.middle_section_container .top_bottom_left table {
    width: 100%;
}

.middle_section_container .top_bottom_left table thead tr {
    margin-bottom: 0.5rem;
    display: flex;
    justify-content: space-between;
    background: #c5c2c2 !important;
    border-bottom: 2px solid black;
}

.middle_section_container .top_bottom_left table thead tr th {
    /* background: #c5c2c2!important; */
    padding: 0.3rem;
    /* border-bottom: 2px solid black; */
    font-weight: bolder;
    color: black;
    white-space: nowrap;
}

.middle_section_container .top_bottom_left table tbody tr {
    margin-bottom: 0.5rem;
}

.middle_section_container .top_bottom_left table tbody tr td {
    font-size: 1.3rem;
    color: black;
    /* font-weight: 600; */
    padding: 0 0.5rem;
}

.middle_section_container .top_bottom_left table thead tr th:last-child {
    text-align: right;
}

.middle_section_container .top_bottom_left table tbody tr:first-child {
    font-weight: bolder;
}

.middle_section_container .top_bottom_left table tbody tr td:first-child {
}

.middle_section_container .top_bottom_right {
    border-top: 2px solid black;
}

.middle_section_container .top_bottom_right table {
    width: 100%;
}

.middle_section_container .top_bottom_right table thead tr {
    margin-bottom: 0.5rem;
    margin-bottom: 0.5rem;
    display: flex;
    justify-content: space-between;
    background: #c5c2c2 !important;
    border-bottom: 2px solid black;
}

.middle_section_container .top_bottom_right table thead tr th {
    /* background: #c5c2c2!important; */
    padding: 0.3rem;
    /* border-bottom: 2px solid black; */
    font-weight: bolder;
    color: black;
    white-space: nowrap;
}

.middle_section_container .top_bottom_right table tbody tr {
    margin-bottom: 0.5rem;
}

.middle_section_container .top_bottom_right table tbody tr td {
    font-size: 1.3rem;
    color: black;
    /* font-weight: 600; */
    padding: 0 0.5rem;
}

.middle_section_container .top_bottom_right table thead tr th:last-child {
    text-align: right;
}

.middle_section_container .top_bottom_right table tbody tr:first-child {
    font-weight: bold;
}

.middle_section_container .top_bottom_right table tbody tr td:last-child {
    /* text-align: right; */
}

/* product table start */
/* product table start */
.top_product {
    /* border: 2px solid black; */
    border-top-width: 0;
    border-bottom: 2px solid black;
}

.top_product table {
    width: 100%;
}

.top_product table thead {
}

.top_product table thead tr {
    border: 2px solid black;
}

.top_product table thead tr th {
    border-top: 2px solid black;
    border-bottom: 2px solid black;
    background: #c5c2c2 !important;
    border-right: 2px solid black;
    font-size: 1.4rem;
    font-weight: bolder;
    color: black;
    text-align: center;
}

.top_product table thead tr th:last-child {
    border-right-width: 0;
}

.top_product table thead tr th:nth-child(1) {
    width: 80px;
}

.top_product table thead tr th:nth-child(2) {
    width: 80px;
}

.top_product table thead tr th:nth-child(3) {
}

.top_product table thead tr th:nth-child(4) {
}

.top_product table thead tr th:nth-child(5) {
}

.top_product table thead tr th:nth-child(5) {
}

.top_product table tbody {
}

.top_product table tbody tr {
    border: 2px solid black;
}

.top_product table tbody tr:last-child {
    border-bottom-width: 0;
}

.top_product table tbody tr td {
    vertical-align: middle;
    border-right: 2px solid black;
    padding: 0 0.5rem 0.5rem 0.5rem;
}

.top_product table tbody tr td:last-child {
    border-right-width: 0;
}

.top_product table tbody tr td:nth-child(1) {
    text-align: center;
}

.top_product table tbody tr td:nth-child(3) {
    text-align: left !important;
}

.top_product table tfoot {
    width: 100%;
    border-top: 2px solid black;
}

.top_product table tfoot tr {
    width: 100%;
}

.top_product table tfoot tr th {
    text-align: center;
}

.top_product table tfoot tr td {
    text-align: center;
}

.top_product table tfoot tr td tr {
}

.top_product table tfoot tr td tr th {
}

.top_product table tfoot tr td tr td {
}

/* product table end */

/* product costs calculation start */
.product_calc {
    display: grid;
    grid-template-columns: 288px 1fr;
    /* border: 2px solid black; */
    border-top-width: 0;
    page-break-inside: avoid;
}

.product_calc .product_calc_left {
    border-top: 2px solid black;
    position: relative;
    padding: 0.5rem;
    border: 2px solid black;
    border-right-width: 0;
    border-bottom-width: 0;
}

.product_calc .product_calc_left .single_product_cal_left {
    text-align: center;
    padding: 0.3rem 0;
    font-weight: 900;
    font-size: 1.3rem;
    color: black;
    height: 31.5px;
    display: flex;
    padding: 0.5rem;
    justify-content: flex-start;
}

.product_calc .product_calc_left .single_product_cal_left:last-child {
    /* border-top: 2px solid black; */
    /* background: #c5c2c2!important;f */
    /* position: absolute; */
    width: 100%;
    bottom: 0;
    height: 18%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product_calc .product_calc_right .single_product_cal_right:last-child {
    border-bottom: 2px solid black !important;
}

.product_calc .product_calc_right {
    border-left: 2px solid black;
    border-top: 2px solid black;
    border-right: 2px solid black;
}

.product_calc .product_calc_right .single_product_cal_right {
    /* border-bottom: 2px solid black; */
    display: grid;
    grid-template-columns: 1fr 125px;
}

.product_calc .product_calc_right.isMultiCurrency .single_product_cal_right {
    /* border-bottom: 2px solid black; */
    display: grid;
    grid-template-columns: 1fr 0.5fr 0.5fr;
}

.product_calc .product_calc_right.isMultiCurrency .single_product_cal_right_middle {
    border-right: 2px solid black;
    border-bottom: 2px solid black;
    text-align: center;
}

.product_calc .product_calc_right .single_product_cal_right_middle {
    border-bottom: 2px solid black;
    text-align: center;
}

.product_calc
    .product_calc_right
    .single_product_cal_right:last-child
    .single_product_cal_right_left {
    border-bottom: none;
}

.product_calc
    .product_calc_right
    .single_product_cal_right:last-child
    .single_product_cal_right_middle {
    border-bottom: none;
}

.product_calc
    .product_calc_right
    .single_product_cal_right:last-child
    .single_product_cal_right_right {
    border-bottom: none;
}

.product_calc
    .product_calc_right
    .single_product_cal_right:last-child
    .single_product_cal_right_left {
    padding: 0.5rem;
}

.product_calc
    .product_calc_right
    .single_product_cal_right:last-child
    .single_product_cal_right_right {
}

.product_calc .product_calc_right .single_product_cal_right_left {
    border-right: 2px solid black;
    text-align: left;
    padding: 0.3rem 0.5rem;
    font-weight: 900;
    font-size: 1.3rem;
    color: black;
    border-bottom: 2px solid black;
}

.product_calc .product_calc_right .single_product_cal_right_right {
    text-align: right;
    color: black;
    font-weight: bolder;
    padding: 0 0.5rem;
    border-bottom: 2px solid black;
}

/* product costs calculation end */

/* footer section container start */

.footer_section_container_top {
    display: grid;
    grid-template-columns: 1fr 113px 1fr;
    justify-content: space-between;
    margin-top: 0.5rem;
    page-break-inside: avoid;
}

.footer_section_container_top .footer_section_container_top_middle {
    justify-self: center;
    align-self: center;
}

.footer_section_container_top .footer_section_container_top_left {
    justify-self: flex-start;
}

.footer_section_container_top .footer_section_container_top_left ul {
    list-style: none;
    list-style-position: inside;
}

.footer_section_container_top .footer_section_container_top_left ul li {
}

.footer_section_container_top .footer_section_container_top_right {
    justify-self: flex-end;
    padding: 1rem 0;
}

.footer_section_container_top .footer_section_container_top_right ul {
    list-style: none;
    list-style-position: inside;
}

.footer_section_container_top .footer_section_container_top_right ul li {
    margin-bottom: 2rem;
    display: grid;
    grid-template-columns: 97px 1fr;
}

.footer_section_container_top .footer_section_container_top_right ul li label {
    font-size: 1.3rem;
    font-weight: 750;
    color: black;
    text-align: right;
    padding-right: 0.5rem;
}

.footer_section_container_top .footer_section_container_top_right ul li input {
    border: none;
    border-bottom: 2px solid black;
}

.footer_section_container_bottom {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    margin: 0;
    padding: 0;
    margin-top: 5px;
    /* border-bottom: 2px solid black;*/
}

.footer_section_container_bottom div {
}

.footer_section_container_bottom div:nth-child(1) {
}

.footer_section_container_bottom div:nth-child(2) {
}

.footer_section_container_bottom div:nth-child(3) {
}

/* footer section container end */

/* footer exact bottom section start */
.footer_exact_bottom_container {
    display: grid;
    justify-content: center;
    page-break-inside: avoid;
}

.footer_exact_bottom_container div {
    text-align: center;
}

.footer_exact_bottom_container table tbody tr td {
    padding: 0 1.5rem;
}

.footer_exact_bottom_container_top {
    text-align: center;
    font-weight: 700;
}

.footer_exact_bottom_container_bottom {
    text-align: center;
    font-weight: 700;
    /* footer exact bottom section end */
}

/* table bottom */

.table_bottom {
    grid-column: 1/-1;
    /* border-top: 2px solid black; */
    display: grid;
    grid-template-columns: 290px 1fr;
    background: #c5c2c2 !important;
    page-break-inside: avoid;
}

.table_bottom .table_bottom_left {
    border: 2px solid black;
    font-weight: bold;
    color: black;
    display: flex;
    justify-content: center;
    align-items: center;
}

.table_bottom .table_bottom_right {
    color: black;
    font-weight: 600;
    font-size: 1.3rem;
    text-align: right;
    border: 2px solid black;
    border-left: 0;
}

.header_text_image {
    margin-bottom: 1rem;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-height: 250px;
    grid-column: 1/-1;
    overflow: hidden;
}

.header_text_image img {
    width: 100%;
    /* height: 100%; */
    page-break-after: avoid;
    page-break-before: avoid;
    page-break-inside: avoid;
    object-fit: cover;
}

.footer_text_image {
    margin-bottom: 1rem;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-height: 250px;
    grid-column: 1/-1;
    overflow: hidden;
    margin-top: 2rem !important;
}

.footer_text_image img {
    width: 100%;
    /* height: 100%; */
    page-break-after: avoid;
    page-break-before: avoid;
    page-break-inside: avoid;
    object-fit: cover;
}

.border-none {
    border: none !important;
}

.logoArea {
    display: flex !important;
    position: fixed;

    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.logoArea .img {
    opacity: 0.5;
}

.logoArea .img img {
    width: 250px;
    height: 250px;
}
